Wednesday, June 25th, 2008
Badging Flickr with Dojo
Dylan Schiemann has a really nice case study post on implementing a Flickr badge with Dojo.
What is particularly interesting is how he starts with a simple version:
- <head>
- ...
- <link rel="stylesheet" href="/dojo/dojox/image/resources/image.css" />
- <style type="text/css">
- img.thing { width:50px; height:50px; }
- </style>
- ...
- </head>
- <body>
- ...
- <div dojoType="dojox.image.FlickrBadge" rows="8" cols="3" username="dylans"
- tags="dojotoolkit,italy"></div>
- ...
- <script type="text/javascript" src="/dojo/dojo/dojo.js"
- djConfig="parseOnLoad: true"></script>
- <script type="text/javascript">
- dojo.require("dojox.image.FlickrBadge");
- </script>
- </body>
And then shows how he tweaks it for performance, explaining what he is doing along the way:
- <head>
- ...
- <link rel="stylesheet" href="/dojo/dojox/image/resources/image.css" />
- <style type="text/css">
- img.thing { width:50px; height:50px; }
- </style>
- ...
- </head>
- <body>
- ...
- <div id="flickrSidebox"></div>
- ...
- <script type="text/javascript" src="/dojo/dojo/dojo.js"></script>
- <script type="text/javascript">
- function initBadge(){
- new dojox.image.FlickrBadge({rows: 8, cols: 3,
- username: "dylans", tags:"italy,dojotoolkit"},
- "flickrSidebox").startup();
- }
- dojo.addOnLoad(function(){ dojo.require("dojo.badge");
- dojo.addOnLoad(initBadge)});
- </script>
It is nice to see his thought process, and how you can start with functionality, and then go back and tweak away.
Leave a comment