Getting Open Graph object ID from page URL - javascript

how can I get the Facebook Object ID paired to a page from the page itself?
For example, I asked directly for the Object ID 325186347604922 and i got:
<pre>
{
"url": ".../ricetta-bigne_salati.htm",
"type": "ricettepercucinare:recipe",
"title": "Bignè salati",
"image": [
{
"url": ".../magazine/wp-content/uploads/2013/03/101-150x150.jpg",
"width": 150,
"height": 150
}
],
"description": "Gli ingredienti e la procedura per preparare la ricetta Bignè salati.",
"data": {
"course": "Antipasto",
"foreign_id": 130400
},
"updated_time": "2013-03-28T10:12:17+0000",
"id": "325186347604922",
"application": {
"id": "118665634826424",
"name": "Ricettepercucinare.com",
"url": "https://www.facebook.com/apps/application.php?id=118665634826424"
}
}</pre>
But how, for example, this page http://www.ricettepercucinare.com/ricetta-bigne_salati.htm could know its own ID?
Thank you.

Its not currently possible to look up an object ID from the URL - although it should be.
It should be possible using:
http://graph.facebook.com/?id=http://www.ricettepercucinare.com/ricetta-bigne_salati.htm
but this isn't working.
Please raise a bug at developers.facebook.com/bugs

What about this guy's solution: http://blog.odbol.com/?p=9
function facebookGetIdForUrl(url, callback) {
//see http://developers.facebook.com/docs/reference/fql/object_url/
FB.api({
method: 'fql.query',
query: "SELECT id FROM object_url WHERE url = '" + url + "'"
}, function(response) {
callback(response[0].id);
});
}
facebookGetIdForUrl("http://facebook.com", function (id) {
alert("Facebook ID = " + id);
});

It's possible with FQL:
select id, url from object_url where url in ('http://www.watchth.is/movies/9166-baraka')
See it in the Graph API Explorer, or simply use this ajax call: https://graph.facebook.com/fql?q=select%20id%2C%20url%20from%20object_url%20where%20url%20in%20('http%3A%2F%2Fwww.watchth.is%2Fmovies%2F9166-baraka')&format=json&suppress_http_code=1
Thanks to Rees' response to a similar question

Related

Adaptive card(user input form) in BotFramework V4 nodejs gets reprompted after user submit

async feed_first(stepContext)
{
let company_card = MessageFactory.attachment(
CardFactory.adaptiveCard(testfeedback)
);
return await stepContext.prompt("textPrompt", {
prompt: company_card
});
}
async feed_second(stepContext) {
console.log("enter feedback second");
console.log(stepContext.context.activity.value);
}
{
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Container",
"items": [
{
"type": "Input.ChoiceSet",
"placeholder": "Placeholder text",
"choices": [
{
"title": " 1",
"value": " 1"
},
{
"title": " 2",
"value": " 2"
}
],
"style": "expanded",
"id": "cho"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Submit"
}
]
}
]
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
so for this code what happens is, the card gets displayed, but on the bot emulator when the submit button is clicked, nothing happens. the console displays " Running dialog with message activity" and the same card is prompted again. the bot doesn't flow to the second step(feed_second) of waterfall dialog. what i would like for the code to do is to display "enter feedback second" on the console and then show the selected choice with the id "cho" for stepContext.context.activity.value agiain on the console. side note- i have added "feed_first" and "feed_second" while declaring the WaterfallDialog, so that's not the the issue
If you want to use an Adaptive Card's inputs with a text prompt, you will need to access the activity's value and serialize it into the activity's text somehow, as seen in this example. This information is in the dialogs section of my Adaptive Cards blog post, which you should read.
In JavaScript you can serialize the value into text like this:
/**
*
* #param {TurnContext} turnContext
*/
async sendValueToDialogAsync(turnContext)
{
// Serialize value
var json = JSON.stringify(turnContext.activity.value);
// Assign the serialized value to the turn context's activity
turnContext.activity.text = json;
// Create a dialog context
var dc = await this.dialogs.createContext(turnContext);
// Continue the dialog with the modified activity
await dc.continueDialog();
}
In your case, if you only need the result of one input then you can just use that property instead of serializing anything:
turnContext.activity.text = turnContext.activity.value.cho;

One JSON file with multiple getJSON requests

I currently have the following javascript file:
$(function () {
'use strict';
getAlbums();
});
function getAlbums() {
'use strict';
var name = '',
photos = '',
id = '',
displayAlbum = '',
albumThumb = '',
albumImage = '',
albumCaption = '';
$.getJSON('/assets/js/images.json', function (data) {
var album = data.albums;
$.each(album, function (i, item) {
name = item.name;
id = item.id;
photos = item.photos;
displayAlbums(name, id, photos);
});
});
}
function displayAlbums(name, id, photos) {
var displayAlbum = $('.templates .albums .thumb').clone(true),
thumbnail = displayAlbum.find('.thumbnail'),
image = displayAlbum.find('.thumbnail .image'),
caption = displayAlbum.find('.thumbnail .caption h4');
caption.html(name);
thumbnail.attr('id', id);
image.attr('src', photos[0].href);
image.attr('alt', photos[0].href);
$('.img-container .row').append(displayAlbum);
}
function displayGallery(request) {
'use strict';
var test = $(request).attr('id'),
gallery = '',
displayImages = '';
$('.img-container').hide();
}
The JSON files has a list of albums, each with a name, ID, and an array of image links to my assets folder. What I currently am doing is I'm loading the first image on each album as a thumbnail that will link to the gallery of remaining images. So if I click on one album thumbnail, that specific gallery will load.
What I'm having trouble with is the album thumbnails load with the page. What I need to do next is make it so that when I click on one of the albums, it will make a call to load that specific gallery.
So my question is, do I need to make a separate 'getJSON' function to load the gallery? Or can I use the same 'getAlbums' function I've already defined?
Here is a sample of my json file as well:
{
"albums": [
{
"name": "Ancillary & Specialty Rooms",
"id": 1,
"photos": [
{
"href": "/assets/images/specialty rooms/1.jpg",
"title": "image 1"
},
{
"href": "/assets/images/specialty rooms/2.jpg",
"title": "image 2"
},
{
"href": "/assets/images/specialty rooms/3.jpg",
"title": "image 3"
},
{
"href": "/assets/images/specialty rooms/4.jpg",
"title": "image 4"
},
{
"href": "/assets/images/specialty rooms/5.jpg",
"title": "image 5"
},
{
"href": "/assets/images/specialty rooms/6.jpg",
"title": "image 6"
}
]
},
{
"name": "Bathrooms",
"id": 2,
"photos": [
{
"href": "/assets/images/bathrooms/1.jpg",
"title": "image 1"
},
{
"href": "/assets/images/bathrooms/2.jpg",
"title": "image 2"
},
{
"href": "/assets/images/bathrooms/3.jpg",
"title": "image 3"
},
{
"href": "/assets/images/bathrooms/4.jpg",
"title": "image 4"
},
{
"href": "/assets/images/bathrooms/5.jpg",
"title": "image 5"
}
]
}
]
}
I appreciate any help I can get,
Thanks
UPDATE:
To specify more about what I want it to do. When a user clicks on the album for the gallery they want to view, the current div containing the album links will be hidden (or cleared, no sure yet) and the gallery will load on the same page.
$(displayAlbum).click(function() {displayGallery(this)})
What I'm thinking is that in your displayAlbums function just after you create displayAlbum by cloning from an existing element you can attach an onClick handler. When this is called - by the user clicking in the thumbnail it will call displayGallery. 'this' passed to displayGallery will be the clicked thumbnail - so you can examine this to get which thumbnail was clicked maybe off the id attribute you have.
I don't know what you want to do in displayGallery? Open in a new div?
This should work - or something like it.
Update:
I tried to figure out how you could do
$(displayAlbum).click(function() {displayGallery(this, photos)})
where photos is the JSON you have from your getJSON request which you've passed to displayAlbums()
Basically you should be able to pass the gallery part of the JSON to the click handler. So that when the thumbnail is clicked you can access that JSON. I ran into a problem with scope and eventually got a proof of concert to work on: JSFiddle: https://jsfiddle.net/justinwyllie/cj3h17hd/
Of course since you are not using a loop; you may not have this problem. You may be able to pass photos directly to your click handler without a problem.
Also - I'd add I'm not sure why you are creating a new element (the thumbnail) by cloning from something already on the page. As I'm sure you know you can just create new elements on the fly with jQuery e.g. $('#el').append('<span />'). I don't know the pros and cons of your cloning approach.

Simple get API call in jQuery

I have a url to which I need to make a get call. The url returns the following JSON response when run in POSTMAN.
{
"status": true,
"data": [
{
"id": 1,
"suggestion": "shirt"
},
{
"id": 2,
"suggestion": "jeans"
},
{
"id": 3,
"suggestion": "puma"
},
{
"id": 4,
"suggestion": "spykar"
}
],
"lastPageNumber": 0
}
I need to get the "suggestion" key's value and append to my list.
Following is my code to get the data and append its values to a list as shown.
jQuery.getJSON( url, function( response ) {
$.each(response.data ,function() {
$.each(this, function (key, value) {
if(key=="suggestion") {
$('#suggestions').append('<li class="suggestItem">'
+ '<a>' + value + '</a>' + '</li>'});
}
);
});
});
And this is the ul to which I have to append these list items.
<ul id="suggestions" style="position: absolute; list-style-type: none;">
However, I do not seem to get any data in response or maybe I am not traversing through the JSON array correctly. So, I need help in whether I have written the right code or not.
Also additional information:
I am running this project on localhost and the url is something http://example.anotherExample.net so does this also affect (I read something about cross domain in ajax).
You can try something like following
$.each(obj.data, function(){
$('#suggestions').append('<li class="suggestItem">' + '<a>' + this.suggestion + '</a>' + '</li>');
});

Node.js: Extract data from JSON response

I'm fetching product details using an API which gives the response as a JSON object.
{
"productBaseInfo": {
"productIdentifier": {
"productId": "EKTDDD23232zYHR94E4",
},
"productAttributes": {
"title": "Nova KT 72BC 1 Electric Kettle",
"imageUrls": {
"400x400": "http://img5a.flixcart.com/image/electric-kettle/4/e/4/nova-kt-722-c-kt-722c-400x400-imadddh2fdvuzpxz.jpeg",
"75x75": "http://img6a.flixcart.com/image/electric-kettle/4/e/4/nova-kt-722-c-kt-722c-75x75-imadddh2fdvuzpxz.jpeg",
},
"sellingPrice": {
"amount": 599.0,
"currency": "INR"
},
"productUrl": "http://dl.mykart.com/dl/nova-kt-722c-1-electric-kettle/p/itmdddf398rhhhz2?pid=EKTDDDEGXYHR94E4&affid=userid"
}
}
}
Now I want to get the productId, title in ProductAttributes, and all the image urls and productURL.
I tried
var productURL = JSON["productAttributes"].productUrl
But it returns an error productUrl not found error. Looking for suggestion on how to extract the data. Thanks in advance.
productAttributes is inside productBaseInfo. So you need to access it like this
console.log(JSON.productBaseInfo.productAttributes.productUrl);
// http://dl.mykart.com/dl/nova-kt-722c-1-electric-kettle/p/itmdddf398rhhhz2?pid=EKTDDDEGXYHR94E4&affid=nikhilgeo

Failing to enumerate over sections in object with JSONP and Mustache JavaScript templating

I am trying to enumerate and build the following fiddle with Mustache.js:
$(function () {
var choices = { "users": [
{ "first_name": "Ryan",
"last_name": "Pays",
"pic_square": "/Global/profile/thumb/placeholder.jpg",
"product_name": "Merlin - the complete box set",
"product_picture": "/Global/products/full/box-set.jpg"
},
{ "first_name": "Eric",
"last_name": "Li Koo",
"pic_square": "/Global/profile/thumb/placeholder.jpg",
"product_name": "Merlin - Series 4 volume 1",
"product_picture": "/Global/products/full/box-set.jpg"
},
{ "first_name": "Abdul",
"last_name": "Raouf",
"pic_square": "/Global/profile/thumb/placeholder.jpg",
"product_name": "Merlin - the complete box set",
"product_picture": "/Global/products/full/box-set.jpg"
}]
};
$.getJSON("http://jsfiddle.net/echo/jsonp/?callback=?", choices, function (data) {
console.log(data);
var template = "<ul>{{#users}}" +
"<li>" +
"<p><strong>{{first_name}} {{last_name}}</strong> likes {{product_name}}</p>" +
"</li>" +
"{{/users}}</ul>",
html = Mustache.to_html(template, data);
$('.wrapper').html(html);
});
});
Example here -> http://jsfiddle.net/mhMJA/3/
It correctly logs the JSON response to the console but then seems to be failing to build the template. If i just pass a single user to the JSONP callback it works fine.
Thanks in advance.
It's not your fault. It's jsfiddle helps you convert your JSON object to the following format.
{"users[0][first_name]":"Ryan","users[1][first_name]":"Eric","users[2][first_name]":"Abdul","users[2][product_picture]":"/Global/products/full/box-set.jpg","users[1][product_picture]":"/Global/products/full/box-set.jpg","users[1][pic_square]":"/Global/profile/thumb/placeholder.jpg","users[1][product_name]":"Merlin - Series 4 volume 1","users[0][last_name]":"Pays","users[0][product_picture]":"/Global/products/full/box-set.jpg","users[1][last_name]":"Li Koo","users[0][product_name]":"Merlin - the complete box set","users[0][pic_square]":"/Global/profile/thumb/placeholder.jpg","users[2][last_name]":"Raouf","users[2][pic_square]":"/Global/profile/thumb/placeholder.jpg","users[2][product_name]":"Merlin - the complete box set","_":"1326530878282"}
I suggest you write your own JSONP app to avoid this issue. Here is I used JSON2 to get the JSON object out.

Categories