SOS

Shane O'Sullivan's technical blog… really ties the room together

Archive for the ‘Feeds’ Category

Google and Dojo, F.E.E.D.I.N.G

Posted by Shane O'Sullivan on May 6, 2008

This is the second in series of posts on the work I’m doing to bring the Google Ajax APIs and Dojo Ajax Toolkit together. The first post was Google And Dojo, Sitting in a Tree, which you can read for some background.

I have submitted a new data store to the DojoX project, dojox.data.GoogleFeedStore, which makes it possible to access any RSS or Atom feed, anywhere, directly from your own web page. Simply pass the URL of the feed to the GoogleFeedStore, and it will return it to you using the dojo.data.Read API.

Example

var store = new dojox.data.GoogleFeedStore();
store.fetch({
  query:{url:"http://shaneosullivan.wordpress.com/feed/"},
  onComplete: function(items) {
    dojo.forEach(items, "alert('Got feed entry with title ' + this.getValue(item, 'title'))", store);
  },
  count: 10
});

This will retrieve the first 10 entries in my blogs feed, and alert the title of each.

The huge advantage of this is that you no longer need any server side redirects to access RSS and Atom feeds from your own website. This Google service is the basis for Google Reader and iGoogle.

If you want to access an Atom feed from your own web server, you can also use the dojox.data.AtomReadStore that I wrote earlier. However, this is only useful if you have direct access to the Atom XML document using Ajax, and due to browser security issues, you can only load these documents from the web server hosting the web page. This new GoogleFeedStore removes that restriction, and has the added advantage that it also works with RSS.

Check out the demo page to get a feel for it (available in the May 6th nightlies), and there should be an example up on the Dojo Feature Explorer quite soon too.

As before, a big thanks to Google for providing such a cool service.

Posted in Ajax, Dojo, dojo.data, dojox, dojox.data, Feeds, Google, Javascript, json, open source, Technical | Tagged: | 6 Comments »

Writing a Django Template Widget With Dojo Data Stores

Posted by Shane O'Sullivan on March 3, 2008

One of the very cool recent additions to the Dojo toolkit is support for the Django Template engine. It is essentially a very advanced browser based templating engine, that enables you to use things like FOR loops, IF statements and much more directly in a HTML template. Or, as the author puts it:

The Django Template Language is one part of Django, a “high-level Python Web framework that encourages rapid development and clean, pragmatic design.

This blog post is an in depth tutorial on working with DTL, Atom XML and Dojo data stores. To see the final working version, have a look here, or get the code from here. Extract the code at the same level as Dojo, and open the demoAtomDTL.html file. Note that you need either the nightly Dojo code, or v1.1 or later for this to work.

Simple Example

As a very simple example, you could write a single template, such as

<ul>
    <!--{% for item in items %}-->
        <li value="{{item.value}}">{{item.text}}</li>
    <!--{% endfor %}-->
</ul>

Then, you populate the template with some JSON data, e.g.

{
    items:[
        {value:1,text:"Choice 1"},
        {value:2,text:"Choice 2"},
        {value:3,text:"Choice 3"}
    ]
}

and it generates the following HTML.

<ul>
    <li value="1">Choice 1</li>
    <li value="2">Choice 2</li>
    <li value="3">Choice 13</li>
</ul>

Writing A Widget And Template To Work With Atom XML

The example above is simplistic, though still very useful of course. However it is possible to do much more interesting things with DTL. A recent enhancement to the code base means that a template can now be built using data from a dojo.data repository, rather than a simple JSON object. This means that you can have a single template that can be used with data from many different data sources (see here for an ItemFileReadStore and here for a Flickr data store example).

This post shows how to write a templated widget that uses a Dojo data store I have written for reading Atom XML data (which has been committed to the Dojox project), and transforming it using DTL into a nice fancy HTML widget, complete with visual effects. See http://www.skynet.ie/~sos/blog.php to see the final result. Do a “View Source” on that page to see how simple it is to include it on a page.

A Django templated widget built from an Atom XML file

Writing the Template

Firstly, the structure of the HTML to be produced must be decided. For this example, I’ll just create a series of DIV elements that contain a header for the title, and a body for the text. The body will also contain another DIV to list all the tags (or categories in Atom-speak). So, a single entry will end up looking like:

<div class="entry">
    <div class="entryTitle">This is an entry title</div>
    <div class="entrySummary">
        This is some summary text
        <div>
            Tags: <a href="http://shaneosullivan.wordpress.com/category/ajax">Ajax</a>
        </div>
    </div>
</div>

A template for this looks as follows:

<!--{% load dojox.dtl.contrib.html %}-->
<div id="{{rootId}}" >
    <!--{% for item in items %}-->
        <div class="entry">
            <div class="title"><!--{{item.title.text}}--></div>
            <div class="summary">
                <!--{% if item.summary.type == "html" %}-->
                    <!--{% html item.summary.text %}-->
                <!--{% else %}-->
                    <!--{{ item.summary.text }}-->
                <!--{% endif %}-->
            <div>
                <!--{% if item.category %}-->
                    Tags:
                    <!--{% for cat in item.categorys %}-->
                        <a href="{{cat.scheme}}/category/{{cat.term}}"> <!--{{cat.term}}-->  </a>
                    <!--{% endfor %}-->
                <!--{% endif %}-->
            </div>
        </div>
    </div>
<!--{% endfor %}-->

Break it down!

Ok, so let’s have a look at this.

Read the rest of this entry »

Posted in Ajax, dijit, Dojo, dojox, dojox.data, Feeds, Flickr, Javascript, json, open source, Technical | 10 Comments »

New Atom data store for Dojo

Posted by Shane O'Sullivan on February 20, 2008

I’ve just submitted a patch to the DojoX project for a dojo.data data store that can read Atom XML documents. It’s relatively simple for the moment, but is capable of taking an XML document that conforms to the Atom spec, and returning the entries using the dojo.data.Read API.

Update: this has now been committed to the DojoX project.

This arose out a desire to rewrite the page on my personal website that mirrors this blog. At time of writing, that has a strong dependency on PHP to query my blog for the Atom feed, parse the feed, and output it using a server side HTML template.

This is of course be easily achievable on the browser also, except for the fetching of the XML document from the remote website which the server would still have to do. Of course, if the Atom URL is on the same server as the page, even this dependency could be removed, and all the work, from the fetching, parsing and templating, could be done on the browser.

However, implementing this as a Dojo data store has many advantages, the primary one being that I get to play with integrating a Dojo data store with the very very cool Django templating language package in DojoX, dojox.dtl. Alex recently checked in a patch to dojox.dtl that enables the use of dojo.data stores directly in templates, so I can’t wait to get this checked in (once any issues Jared has with it are satisfied) and get going on my site!
Share this post:digg it|kick it|Email it|bookmark it|reddit|liveIt

Posted in Ajax, Alex Russell, Atom, Blogs, Dojo, dojo.data, dojox.data, Feeds, Javascript, json, open source, Technical | 2 Comments »

Threading extensions to the Atom Publishing Protocol

Posted by Shane O'Sullivan on June 23, 2006

James Snell's bid to conquer the webiverse through the power of the Atom continues apace. His threading extension for Atom has been approved as a proposed standard for linking multiple entries/feeds in a threaded manner. See this post for his announcement, and, more interesting, his post on how to use the threading with Abdera, the Apache Atom parser.

Posted in Abdera, Apache, Atom, Feeds, Technical, Threading | Leave a Comment »

 
Follow

Get every new post delivered to your Inbox.

Join 535 other followers

%d bloggers like this: