Get full size facebook Event photo - facebook

what I am trying to do is to get event photo by event ID. Code I have :
function getFBphoto(event) {
FB.api(
"/"+ event +"/picture?width=500&height=500",
function (response) {
if (response && !response.error) {
console.log(response);
}
}
);}
Facebook still provides me with 200px sized image, I've tried to follow some advices and tried luck with such version of my code:
function getFBphoto(event) {
FB.api(
"/"+ event +"/picture",
{
"redirect": false,
"height": "500",
"type": "normal",
"width": "500"
},
function (response) {
if (response && !response.error) {
console.log(response);
}
}
);}
No luck, still max 200x200px photo, while adding parameters large still doesn't affect to get bigger photo.
Example response from fb in both cases:
Object {data: Object}
data: Object
height: 50
is_silhouette: false
url: "https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/t1/c114.0.200.200/p200x200/1656179_10201352079056227_1689058768_n.jpg"
width: 50
__proto__: Object
__proto__: Object
The question is:
How to get actual size photo of event (for eg: https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-prn2/t1/1507953_584284274994290_910086685_n.jpg) with API call.

Try the cover field – for your event, /471101519656645?fields=cover -> delivers this image.

Related

Loading using ajax request - onEachFeature leaflet - multiple requests

Hi I am trying to find out how to add a loading in a ajax call, but there is one issue, in the example below the loader hide on the first request, but I need to hide it only when the last request is made.
onEachFeature/geoJson runs multiple markers on my map, each marker has a unique data, so ajax runs one time for each marker.
function onEachFeature(feature, layer) {
if (feature.properties && feature.properties.name) {
function getImage(value) {
function applyImage(result, resultB) {
//do something...
}
$.ajax({
url: "libs/php/getImage.php",
type: 'POST',
dataType: 'json',
data: {
id: value,
},
success: function (result) {
$("#iframeloading").show();
let valueA = result.A;
let valueB = result.B
applyImage(valueA, valueB)
},
error: function () {
console.log('error');
},
complete: function() {
hide goes here but there's no effect...
}
})
};
getImage(feature.properties.wikidata)
It works in my code, just put it before ajax calls, it will apply to every ajax call:
$(document).ajaxStart(function(){
$("#iframeloading").show();
});
$(document).ajaxStop(function(){
$("#iframeloading").hide();
});

Titanium: Facebook API: Photo not showing

Starting to pull by hair here, running out of things to try.
I'm taking a photo, and it's not showing. If i use a URL, then it works.
I'm using the API example, so not sure what i'm doing wrong?
The only thing i see on the Facebook page is the message, not the photo.
photoButton.addEventListener('click',function(e){
var image = e.media;
var f = Titanium.Filesystem.getFile(Titanium.Filesystem.applicationDataDirectory,'camera_photo.png');
f.write(image);
var blob = f.read();
Titanium.Media.showCamera({
success:function(event) {
Ti.API.debug('Our type was: '+event.mediaType);
if(event.mediaType == Ti.Media.MEDIA_TYPE_PHOTO) {
// send XHR req to post image on Facebook
fb.permissions = ['publish_actions', 'status_update', 'publish_stream', 'read_stream','manage_pages']; // Permissions your app needs
fb.authorize();
var data = {
name : "This is my name",
message : 'This is my message',
caption : "This is the caption",
picture : blob
};
fb.requestWithGraphPath('1234567890/feed', data, 'POST', function(e) {
if (e.success) {
alert(e.result);
} else if (e.error) {
alert(e.error);
} else {
alert('Unknown response');
}
});
} else {
alert("got the wrong type back ="+event.mediaType);
}
},
cancel:function() {
// called when user cancels taking a picture
},
error:function(error) {
// called when there's an error
var a = Titanium.UI.createAlertDialog({title:'Camera'});
if (error.code == Titanium.Media.NO_CAMERA) {
a.setMessage('Овој уред нема камера');
} else {
a.setMessage('Unexpected error: ' + error.code);
}
a.show();
},
saveToPhotoGallery:true,
// allowEditing and mediaTypes are iOS-only settings
allowEditing:true,
mediaTypes:[Ti.Media.MEDIA_TYPE_VIDEO,Ti.Media.MEDIA_TYPE_PHOTO]
});
Ok, this post hold the key: Appcelerator Titanium: Facebook Image Upload fail
The issue is for some reason feeds dont work with the FB module, so you have to use an XHR request:
var endPoint = 'https://graph.facebook.com/v2.1/' + pid + '/photos?access_token='+ acc;
xhr.open('POST',endPoint);
xhr.send({
message: data,
picture: image
});

Select2 with AJAX and Initial Local Data

So I'm trying to get the select2 plugin to work with a Backbone.js / CakePHP app. The idea is that this select2 holds email addresses for contacting people as tasks become completed, but the form is editable. What I want to do is (1) load / display all the already saved email addresses for the task being edited, and (2) I want to still have the select2 perform AJAX searches to list recognized emails.
I keep having this issue where I can either show initial data, OR have the AJAX search feature.
My current code for my select2 box is a Backbone.View, and it looks like:
define([
'backbone',
'jquery',
'jquery.select2'
],
function(Backbone, $, select2) {
var notificationSelector = Backbone.View.extend({
notifications: undefined,
events: {
'change' : 'select2ContactsChanged'
},
initialize: function(attrs) {
this.collection.on('add remove reset', this.render(), this);
this.select2ContactsChanged();
},
render: function() {
var contacts = ["abc#def.com", "joe#banana.com"];
$('.notification-selector').attr('value', contacts);
if(this.select2Control == undefined)
{
// Do Search() + query here
this.select2Control = this.$el.select2({
width: '200px',
placeholder: '#email',
tags: [],
minimumInputLength: 3,
// initSelection: function(element, callback) {
// return $.ajax({
// type: "GET",
// url: "/notifications/fetch/",
// dataType: 'json',
// data: { id: (element.val()) },
// success: function(data) {
// }
// }).done(function(data) {
// console.log(data);
// });
// },
});
}
else
{
// Do Search() + query here
this.select2Control = this.$el.select2({
width: '200px',
placeholder: '#email',
tags: [],
minimumInputLength: 3,
ajax: {
url: '/notifications/search/',
dataType: 'json',
data: function(term, page) {
return {
SearchTerm: term
};
},
results: function(data, page) {
return {
results: data
};
}
}
});
}
},
select2ContactsChanged: function() {
var contacts = this.select2Control.val().split(',');
this.collection.reset(contacts);
}
});
return notificationSelector;
});
I read a response by the creator of Select2 to someone else (https://github.com/ivaynberg/select2/issues/392) in which he says to use a 'custom query' to achieve what seems to be what I want. I'm having trouble finding relevant examples or making enough sense of the docs to figure out what he means.
Can anyone spot what I'm doing wrong / missing?
Thanks for your time!
EDIT
I forgot to mention -- the DOM element this is attached to is <input type="hidden" multiple="true" class="notification-selector select2-result-selectable"></input>
Ok, I finally figured out the solution.
I was misunderstanding $.ajax() -- I did not really think about it actually being an asynchronous call. My code to check for the data being returned from the call was running before the AJAX actually finished, so I was always getting undefined.
I assigned a variable to the AJAX call, and set "async: false", and it worked perfectly.
fetchSetNotifications: function() {
var addresses = $.ajax({
method: 'GET',
dataType: 'json',
context: $('#notifications'),
url: '/Notifications/fetch/',
async: false,
alert(addresses);
}
The jqXHR object I get in 'addresses' then contains the response data I want in the "responseText" attribute.

Filepicker.io rendered images don't thumbnail in Twitter

We're just starting to use Filepicker.io in a project and had a question about rendering thumbnails. Our first test image does not appear to be recognized by Twitter as an image. This means that all the user will see is a link instead of the thumbnail.
Is there any way around this behaviour, perhaps with some sort of custom URL or optional parameter?
UPDATE
Here's the code I'm using:
<div class="upload-image">Drop files here</div>
// init filepicker plugin
filepicker.makeDropPane($('.upload-image'), {
multiple: true,
dragEnter: function() {
$(".upload-image").html("Drop to upload").css({
'backgroundColor': "#E0E0E0",
'border': "1px solid #000"
});
console.log('enter');
},
dragLeave: function() {
$(".upload-image").html("Drop files here").css({
'backgroundColor': "#F6F6F6",
'border': "1px dashed #666"
});
},
onSuccess: function(fpfiles) {
$(".upload-image").text("Done, see result below");
$.sticky('Your file was uploaded successfully.');
console.log(JSON.stringify(fpfiles));
},
onError: function(type, message) {
// $("#localDropResult").text('('+type+') '+ message);
$.sticky('Your file was uploaded successfully.');
},
onProgress: function(percentage) {
$(".upload-image").text("Uploading ("+percentage+"%)");
}
});
One thing you can do is append a +filename.jpg to the end of the image if twitter (or really any other service) is doing a simple regex, url-based determination of whether the file is an image. For instance:
https://www.filepicker.io/api/file/JhJKMtnRDW9uLYcnkRKW and
https://www.filepicker.io/api/file/JhJKMtnRDW9uLYcnkRKW+fry.png
both point to the same content, but twitter may be happier with the second.

Maintaing page number of MVC 2 pagination on refresh

I'm using MVC 2 Pagination (not the jquery one) and my partial page gets refreshed in every 5 second.
I want to maintain my page number on refresh. Can you please suggest me how that can be done.
Here is the code for the page refresh in every 5 sec
setInterval(function () {
$.ajax(
{
type: "GET",
url: '<%=Url.Action("divtobeupdated", "DefaultController") %>',
data: {},
dataType: "text",
success: function (result) { $("#FileListContainer").html(result); }
}
)
}, 5000);
you can try 2 solution:
1) you pass the number of the page to the server and you pass it back to the view(no so good because you hace to change many code)
2) set a javascript global variable and you set it in the setInterval, like this:
var numOfPage;
setInterval(function () {
numOfPage = getNumofPage();
$.ajax(
{
type: "GET",
url: '<%=Url.Action("divtobeupdated", "DefaultController") %>',
data: {},
dataType: "text",
success: function (result) {
//heare you can use numOfPage
$("#FileListContainer").html(result);
}
}
)
}, 5000);
I hope understund good your question.
Marco