Tag: YQL

Categories
Development

Append DOM to Another Page Using YQL

Apparently there is a data limit to how much we can fit into a content field on our CMS at work. The problem was that there is an incredibly long list of donors names, and when saving the edits to a page in the CMS, it just wouldn’t save past a certain point in the list.

So, I was a bit stumped on how best to workaround. So, I created another page with a good amount of the names in an unordered list. I then used YQL to create a REST query that would output only the HTML on the page that I wanted into and XML feed.

1

select * from html where url="http://www.a_web_page.com" and xpath='//*[@id="main"]/ul/li'

I’m not too sharp on my xpath selectors, but luckily it’s very easy to find an xpath using Chrome. Just right click on an element in the inspector, and the option is there. Huge timesaver!

Ok, now I had a REST query courtesy of YQL of the HTML elements that I wanted to take from that page.

Next was to load and append the data from the REST query onto the unordered list on the other page.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

$(function()
{
    $.ajax(
    {
        type: "GET",
        url: "https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22http%3A%2F%2Fintraweb.stockton.edu%2Feyos%2Fpage.cfm%3FsiteID%3D221%26pageID%3D271%22%20and%0A%20%20%20%20%20%20xpath%3D'%2F%2F*%5B%40id%3D%22main%22%5D%2Ful%2Fli'&diagnostics=true",
        dataType: "text",
        cache: false,
        success: function(xml)
        {
            $(xml).find('li').each(function() { 
    			$("#main ul.append-list").append($(this));
			});
     }});
});

Using the jQuery library I was able to load view the ajax function the REST query. I had to choose the dataType of text not xml in this case. That way I was simply appending the results as they were in the REST query.

I can clean up the javascript a bit, and will work on that. However for now, I am able to add data from another page to work around the data limits of the CMS.

Categories
Development

YQL Query Builder

YQLOne of my favorite web services, YQL is now even easier to use. They’ve recently added a Query Builder to the YQL console, so now it’s so much easier to figure out which keys are available in tables.

Previously I found I had to dig deep into an XML file, and use a lot of trial and error to figure out what keys were available, but he Query Builder now handles the majority of that for me. It also exposes the metadata in a friendly visual format, which is another great thing too.

Sub-queries aren’t supported yet, but hopefully that’s something that they might be able to add in the not too distant future.

All the details are mentioned on their blog with a nice screencast going over how to use it.

All in all a very impressive improvement to an already great service.

Categories
Development

YQL flickr.photos.search nest query

I wanted to use YQL to build a query to grab photos on an account with certain tags that I could then render on a page. The flickr.photos.search just gets you the photo’s id and not all the other goodness that is required to make the image display.

So I built a nested query in YQL to get the job done.

select farm, id, secret, server, title
from flickr.photos.info
where photo_id in (select id from flickr.photos.search where user_id='<your_user_id>' and tags='soccer,men')

So in one call it’s gets the id of the photos that meet your initial query:

select id from flickr.photos.search where user_id='<your_user_id>' and tags='soccer,men'

It then takes the id’s from that query and grabs the photo.info that you need, all in one call! Very cool stuff.

Go to the YQL Console and play around.

Categories
Development

YQL is my new BFF

YQL

YQL, Yahoo’s SQL-like language that provides straightforward ways to mash up different APIs into one data source for use in applications has been around for a few months now. In that time I’ve found it to be extremely useful and easy to work with in numerous projects. However,  the service got 10 ninjas better last week they added the ability to insert, update and delete to the service as well.

In just a few minutes I was able to take an existing news app that I had created in the past and using the YQL service had it sending out tweets to Twitter as well as including a shortened URL courtesy of the bit.ly API.

Just feed the following Twitter status update to the YQL Console and it’ll create the REST query that you can use in your script:

use 'http://www.yqlblog.net/samples/twitter.status.xml';
insert into twitter.status (status,username,password)
values ("Playing with INSERT UPDATE and DELETE in YQL", "twitterusername","twitterpassword")
Categories
Development

Yahoo! Term Extraction Web Service

Just finished up using one of my favorite and what seems to be little well known web service, the Term Extraction from the folks a Yahoo! You feed it some content and it returns a list of significant words from the content. This simple service can be incredibly useful.

For instance I recently used this service to scan an article on a site and using the words that it returns, as tags to pull relevant photos from Flickr to go along with the article. So in this case I used it to pull tags from a body of text, very cool. You can also use YQL to make calls to it as well.

Categories
Development

Pulling Flickr photos using YUI Get Utility with photo_id

Atlantic Cape Community College has been using a Flickr Pro account to store and share our photos (Flickr Pro at $24.95/yr is a steal) and also like to incorporate those photos into our news releases from time to time. 

So I began working an a little script that would call the flickr.photos.getSizes API Method using YQL to return the info to display the photo (dimensions, source, etc.) in an easy to consume JSON object. Oh yeah, and also had to do all this using the YUI Get Utility since our server at the moment doesn’t have cURL installed.

So first I went to the YQL console (it’s awesome to be sure to check it out) to generate the HTTP to call the JSON we’re looking for using the flickr.photos.getSizes API Method. Here is the the YQL I fed it:

select * from flickr.photos.sizes where photo_id = "414195174"

and it gave me this wonderful REST Query (again YQL is awesome):

http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20flickr.photos.sizes%20where%20photo_id%20%3D%20%223591600467%22&format=json&callback=cbfunc

this returns the following JSON info:

cbfunc({
 "query": {
  "count": "6",
  "created": "2009-06-08T06:37:37Z",
  "lang": "en-US",
  "updated": "2009-06-08T06:37:37Z",
  "uri": "http://query.yahooapis.com/v1/yql?q=select+*+from+flickr.photos.sizes+where+photo_id+%3D+%223591600467%22",
  "diagnostics": {
   "publiclyCallable": "true",
   "url": {
    "execution-time": "149",
    "content": "http://api.flickr.com/services/rest/?method=flickr.photos.getSizes&photo_id=3591600467&page=1&per_page=10"
   },
   "user-time": "154",
   "service-time": "149",
   "build-version": "1678"
  },
  "results": {
   "size": [
    {
     "height": "75",
     "label": "Square",
     "media": "photo",
     "source": "http://farm3.static.flickr.com/2447/3591600467_1f25e40ce1_s.jpg",
     "url": "http://www.flickr.com/photos/accc_cr/3591600467/sizes/sq/",
     "width": "75"
    },
    {
     "height": "100",
     "label": "Thumbnail",
     "media": "photo",
     "source": "http://farm3.static.flickr.com/2447/3591600467_1f25e40ce1_t.jpg",
     "url": "http://www.flickr.com/photos/accc_cr/3591600467/sizes/t/",
     "width": "84"
    },
    {
     "height": "240",
     "label": "Small",
     "media": "photo",
     "source": "http://farm3.static.flickr.com/2447/3591600467_1f25e40ce1_m.jpg",
     "url": "http://www.flickr.com/photos/accc_cr/3591600467/sizes/s/",
     "width": "202"
    },
    {
     "height": "500",
     "label": "Medium",
     "media": "photo",
     "source": "http://farm3.static.flickr.com/2447/3591600467_1f25e40ce1.jpg",
     "url": "http://www.flickr.com/photos/accc_cr/3591600467/sizes/m/",
     "width": "420"
    },
    {
     "height": "1024",
     "label": "Large",
     "media": "photo",
     "source": "http://farm3.static.flickr.com/2447/3591600467_1f25e40ce1_b.jpg",
     "url": "http://www.flickr.com/photos/accc_cr/3591600467/sizes/l/",
     "width": "861"
    },
    {
     "height": "2400",
     "label": "Original",
     "media": "photo",
     "source": "http://farm3.static.flickr.com/2447/3591600467_1fe814e144_o.jpg",
     "url": "http://www.flickr.com/photos/accc_cr/3591600467/sizes/o/",
     "width": "2017"
    }
   ]
  }
 }
});

So now we have an easy to use REST Query to use with all the info that we just so happen to need from Flickr.

Now I needed to create a little Javascript using the YUI Get Utility to consume the REST Query that we just built.

Here’s a basic version of the script I wrote:

function jsonFlickrApi(rsp){
 
		if (rsp.query.count == 0){
			return;
		} else {
 
			var container = document.getElementById('article-photo');
 
			// create elements
 
			var photoAnchor = document.createElement('a');
			var photoImg = document.createElement('img');
 
			// set attributes
			photoAnchor.setAttribute('href', rsp.query.results.size[3].source);
			photoAnchor.setAttribute('rel', 'lightbox');
 
			photoImg.setAttribute('src', rsp.query.results.size[2].source);
			photoImg.setAttribute('width', rsp.query.results.size[2].width);
			photoImg.setAttribute('height', rsp.query.results.size[2].height);
 
			// append to DOM
			photoAnchor.appendChild(photoImg);
 
			container.appendChild(photoAnchor); 
 
		}
    }
 
    var objTransaction = YAHOO.util.Get.script("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20flickr.photos.sizes%20where%20photo_id%20%3D%20%223591600467%22&format=json&callback=jsonFlickrApi");

The function jsonFlickrAPI gets called when the JSON has loaded since it’s sent along with the Get request as the callback function. Then we just check if anything has been returned from the REST call before proceeding by checking the count returned.

Then create some DOM nodes and attach them to a div in our HTML. That’s really about it.

Next, I’m going to improve this to pull all relevant photos with a certain tag(s) from our Flickr account to dynamically create relevant galleries.