wangdaping
/
wp


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
							<!--
  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 FlickrRestStore</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.FlickrRestStore");
		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: {
					  apikey: "8c6803164dbc395fb7131c9d54843627"  
					},
					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(setIdWidget){
					var setId = setIdWidget.getValue();
					if(setId != ""){
					  request.query.setId = setId;
					}
				}
				
				if(fullTextWidget){
					var fullText = fullTextWidget.getValue();
					if(fullText != ""){
					  request.query.text = fullText;
					}
				}
				
				if(sortTypeWidget && sortDirWidget){
					var sortType = sortTypeWidget.getValue();
					var sortDirection = sortDirWidget.getValue();
					
					if(sortType != "" && sortDirection != ""){
						request.query.sort = [
						  {
							attribute: sortType,
							descending: (sortDirection.toLowerCase() == "descending")
						  }					  
						];
					}
				}
				
				if(countWidget){
					request.count = countWidget.getValue();
				}
				if(pageWidget){
					request.start = request.count * (pageWidget.getValue() -1);
				}

				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:  FlickrRestStore 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 FlickrRestStore 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>
				<td></td>
				<td></td>
			</tr>
			<tr>
				<td>
					<b>User ID:</b>
				</td>
				<td>
					<div dojoType="dijit.form.TextBox" size="50" id="userid" jsId="idWidget" value="44153025@N00"></div>
				</td>
				<td>
					<b>Set ID</b>
				</td>
				<td>
					  <div dojoType="dijit.form.TextBox" size="50" id="setid" jsId="setIdWidget"></div>
				</td>
			</tr>
			<tr>
				<td>
					<b>Tags:</b>
				</td>
				<td>
					<div dojoType="dijit.form.TextBox" size="50" id="tags" jsId="tagsWidget" value="rollingstones,kinsale"></div>
				</td>
				<td>
					<b>Full Text</b>
				</td>
				<td>
					  <div dojoType="dijit.form.TextBox" size="50" id="fulltext" jsId="fullTextWidget"></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>
				<td>
					<b>Sort</b>
				</td>
				<td>
					  <select dojoType="dijit.form.ComboBox" size="15" id="sorttype" jsId="sortTypeWidget">
						<option>date-posted</option>
						<option>date-taken</option>
						<option>interestingness</option>
					  </select>
					   <select dojoType="dijit.form.ComboBox" size="15" id="sortdirection" jsId="sortDirWidget">
						<option>ascending</option>
						<option>descending</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>
				<td>
					<b>Page:</b>
				</td>
				<td>
					<div   
						id="page"
						jsId="pageWidget"
						dojoType="dijit.form.NumberSpinner"
						value="1"
						constraints="{min:1,max:5,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.FlickrRestStore" jsId="flickrStore" label="title"></div>
	<div dojoType="dojox.data.demos.widgets.FlickrViewList" id="flickrViews" jsId="flickrViewsWidget"></div>

</body>
</html>