| New file |
|---|
| 0,0 → 1,199 |
|---|
| <!-- |
| This file is a demo of the FlickrStore, a simple wrapper to the public feed service |
| of Flickr. This just does very basic queries against Flickr and loads the results |
| into a list viewing widget. |
| --> |
| <html> |
| <head> |
| <title>Demo of FlickrStore</title> |
| <style type="text/css"> |
| |
| @import "../../../dijit/themes/tundra/tundra.css"; |
| @import "../../../dojo/resources/dojo.css"; |
| @import "../../../dijit/tests/css/dijitTests.css"; |
| @import "./flickrDemo.css"; |
| </style> |
| |
| <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true, parseOnLoad: true"></script> |
| <script type="text/javascript"> |
| dojo.require("dojo.parser"); |
| dojo.require("dijit.form.TextBox"); |
| dojo.require("dijit.form.Button"); |
| dojo.require("dijit.form.ComboBox"); |
| dojo.require("dijit.form.NumberSpinner"); |
| dojo.require("dijit.Tree"); |
| dojo.require("dojox.data.FlickrStore"); |
| dojo.require("dojox.data.demos.widgets.FlickrViewList"); |
| dojo.require("dojox.data.demos.widgets.FlickrView"); |
| |
| function init(){ |
| var fViewWidgets = []; |
| |
| //Set up an onComplete handler for flickrData |
| function onComplete(items, request){ |
| flickrViewsWidget.clearList(); |
| if(items.length > 0){ |
| for(var i = 0; i < items.length; i++){ |
| var flickrData = { |
| title: flickrStore.getValue(items[i],"title"), |
| author: flickrStore.getValue(items[i],"author"), |
| iconUrl: flickrStore.getValue(items[i],"imageUrlSmall"), |
| imageUrl: flickrStore.getValue(items[i],"imageUrl") |
| } |
| flickrViewsWidget.addView(flickrData); |
| } |
| } |
| statusWidget.setValue("PROCESSING COMPLETE."); |
| |
| } |
| //What to do if a search fails... |
| function onError(error, request){ |
| flickrViewsWidget.clearList(); |
| statusWidget.setValue("PROCESSING ERROR."); |
| } |
| |
| //Function to invoke the search of the FlickrStore |
| function invokeSearch(){ |
| var request = { |
| query: {}, |
| onComplete: onComplete, |
| onError: onError |
| }; |
| |
| if(idWidget){ |
| var userid = idWidget.getValue(); |
| if(userid && userid !== ""){ |
| request.query.userid = userid; |
| } |
| } |
| if(tagsWidget){ |
| var tags = tagsWidget.getValue(); |
| if(tags && tags !== ""){ |
| var tagsArray = tags.split(" "); |
| tags = ""; |
| for(var i = 0; i < tagsArray.length; i++){ |
| tags = tags + tagsArray[i]; |
| if(i < (tagsArray.length - 1)){ |
| tags += "," |
| } |
| } |
| request.query.tags = tags; |
| } |
| } |
| if(tagmodeWidget){ |
| var tagmode = tagmodeWidget.getValue(); |
| if(tagmode !== ""){ |
| request.query.tagmode = tagmode; |
| } |
| } |
| |
| if(countWidget){ |
| request.count = countWidget.getValue(); |
| } |
| |
| if(statusWidget){ |
| statusWidget.setValue("PROCESSING REQUEST"); |
| } |
| |
| flickrStore.fetch(request); |
| } |
| |
| //Lastly, link up the search event. |
| var button = dijit.byId("searchButton"); |
| dojo.connect(button, "onClick", invokeSearch); |
| } |
| dojo.addOnLoad(init); |
| </script> |
| </head> |
| |
| <body class="tundra"> |
| <h1> |
| DEMO: FlickrStore Search |
| </h1> |
| <hr> |
| <h3> |
| Description: |
| </h3> |
| <p> |
| This simple demo shows how services, such as Flickr, can be wrapped by the datastore API. In this demo, you can search public Flickr images through a simple FlickrStore by specifying a series of tags (separated by spaces) to search on. The results will be displayed below the search box. |
| </p> |
| <p> |
| For fun, search on the 3dny tag! |
| </p> |
| |
| <blockquote> |
| |
| <!-- |
| The store instance used by this demo. |
| --> |
| <table> |
| <tbody> |
| <tr> |
| <td> |
| <b>Status:</b> |
| </td> |
| <td> |
| <div dojoType="dijit.form.TextBox" size="50" id="status" jsId="statusWidget" disabled="true"></div> |
| </td> |
| </tr> |
| <tr> |
| <td> |
| <b>ID:</b> |
| </td> |
| <td> |
| <div dojoType="dijit.form.TextBox" size="50" id="userid" jsId="idWidget"></div> |
| </td> |
| </tr> |
| <tr> |
| <td> |
| <b>Tags:</b> |
| </td> |
| <td> |
| <div dojoType="dijit.form.TextBox" size="50" id="tags" jsId="tagsWidget" value="3dny"></div> |
| </td> |
| </tr> |
| <tr> |
| <td> |
| <b>Tagmode:</b> |
| </td> |
| <td> |
| <select id="tagmode" |
| jsId="tagmodeWidget" |
| dojoType="dijit.form.ComboBox" |
| autocomplete="false" |
| value="any" |
| > |
| <option>any</option> |
| <option>all</option> |
| </select> |
| </td> |
| </tr> |
| <tr> |
| <td> |
| <b>Number of Pictures:</b> |
| </td> |
| <td> |
| <div |
| id="count" |
| jsId="countWidget" |
| dojoType="dijit.form.NumberSpinner" |
| value="20" |
| constraints="{min:1,max:20,places:0}" |
| ></div> |
| </td> |
| </tr> |
| <tr> |
| <td> |
| </td> |
| <td> |
| <div dojoType="dijit.form.Button" label="Search" id="searchButton" jsId="searchButtonWidget"></div> |
| </td> |
| </tr> |
| </tbody> |
| </table> |
| <hr/> |
| <div dojoType="dojox.data.FlickrStore" jsId="flickrStore" label="title"></div> |
| <div dojoType="dojox.data.demos.widgets.FlickrViewList" id="flickrViews" jsId="flickrViewsWidget"></div> |
| |
| </body> |
| </html> |