Updated
This commit is contained in:
161
master/examples/demo_FlickrStore.html
Normal file
161
master/examples/demo_FlickrStore.html
Normal file
@@ -0,0 +1,161 @@
|
||||
<html>
|
||||
<head>
|
||||
<!--
|
||||
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.
|
||||
-->
|
||||
<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";
|
||||
</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("dojox.data.FlickrStore");
|
||||
dojo.require("dojox.data.demos.widgets.FlickrViewList");
|
||||
|
||||
function init(){
|
||||
//Function to invoke the search of the FlickrStore
|
||||
var invokeSearch = function(){
|
||||
var request = { query: {} };
|
||||
|
||||
if(idWidget){
|
||||
var id = idWidget.getValue() || "";
|
||||
if(id && id.length){
|
||||
request.query.userid = id;
|
||||
}
|
||||
}
|
||||
|
||||
if(tagsWidget){
|
||||
request.query.tags = (tagsWidget.getValue()||"").split(" ").join(",");
|
||||
}
|
||||
|
||||
|
||||
if(tagmodeWidget){
|
||||
request.query.tagmode = tagmodeWidget.getValue()||"";
|
||||
}
|
||||
|
||||
if(countWidget){
|
||||
request.count = countWidget.getValue();
|
||||
}
|
||||
flickrViewsWidget.fetch(request);
|
||||
}
|
||||
|
||||
dojo.connect(flickrViewsWidget, "fetch", function() {
|
||||
statusWidget.setValue("PROCESSING REQUEST");
|
||||
});
|
||||
|
||||
dojo.connect(flickrViewsWidget, "onComplete", function() {
|
||||
statusWidget.setValue("PROCESSING COMPLETE.");
|
||||
});
|
||||
|
||||
dojo.connect(flickrViewsWidget, "onError", function() {
|
||||
statusWidget.setValue("ERROR!");
|
||||
});
|
||||
|
||||
//Lastly, link up the search event.
|
||||
var button = dijit.byId("searchButton");
|
||||
dojo.connect(button, "onClick", invokeSearch);
|
||||
}
|
||||
dojo.addOnLoad(init);
|
||||
dojo.addOnLoad(function(){ dijit.byId("searchButton").onClick(); });
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body class="tundra">
|
||||
<h1>
|
||||
DEMO: FlickrStore Search
|
||||
</h1>
|
||||
<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>
|
||||
<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="nature"></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>
|
||||
<!--
|
||||
The store instance used by this demo.
|
||||
-->
|
||||
<div dojoType="dojox.data.FlickrStore" jsId="flickrStore" label="title"></div>
|
||||
<div dojoType="dojox.data.demos.widgets.FlickrViewList"
|
||||
store="flickrStore"
|
||||
id="flickrViews"
|
||||
jsId="flickrViewsWidget"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user