7843a492f45d8867c1a395b4a2c2b8b7ff5b042e.svn-base 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188
  1. <!--
  2. This file is a demo of the PicasaStore, a simple wrapper to the public feed service
  3. of Picasa. This just does very basic queries against Picasa and loads the results
  4. into a list viewing widget.
  5. -->
  6. <html>
  7. <head>
  8. <title>Demo of PicasaStore</title>
  9. <style type="text/css">
  10. @import "../../../dijit/themes/tundra/tundra.css";
  11. @import "../../../dojo/resources/dojo.css";
  12. @import "../../../dijit/tests/css/dijitTests.css";
  13. @import "./picasaDemo.css";
  14. </style>
  15. <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true, parseOnLoad: true"></script>
  16. <script type="text/javascript">
  17. dojo.require("dojo.parser");
  18. dojo.require("dijit.form.TextBox");
  19. dojo.require("dijit.form.Button");
  20. dojo.require("dijit.form.ComboBox");
  21. dojo.require("dijit.form.NumberSpinner");
  22. dojo.require("dijit.Tree");
  23. dojo.require("dojox.data.PicasaStore");
  24. dojo.require("dojox.data.demos.widgets.PicasaViewList");
  25. dojo.require("dojox.data.demos.widgets.PicasaView");
  26. function init(){
  27. var fViewWidgets = [];
  28. //Set up an onComplete handler for flickrData
  29. function onComplete(items, request){
  30. flickrViewsWidget.clearList();
  31. if(items.length > 0){
  32. for(var i = 0; i < items.length; i++){
  33. var flickrData = {
  34. title: flickrStore.getValue(items[i],"title"),
  35. author: flickrStore.getValue(items[i],"author"),
  36. description: flickrStore.getValue(items[i],"description"),
  37. iconUrl: flickrStore.getValue(items[i],"imageUrlSmall"),
  38. imageUrl: flickrStore.getValue(items[i],"imageUrl")
  39. }
  40. flickrViewsWidget.addView(flickrData);
  41. }
  42. }
  43. statusWidget.setValue("PROCESSING COMPLETE.");
  44. }
  45. //What to do if a search fails...
  46. function onError(error, request){
  47. flickrViewsWidget.clearList();
  48. statusWidget.setValue("PROCESSING ERROR.");
  49. }
  50. //Function to invoke the search of the FlickrStore
  51. function invokeSearch(){
  52. var request = {
  53. query: {},
  54. onComplete: onComplete,
  55. onError: onError
  56. };
  57. if(idWidget){
  58. var userid = idWidget.getValue();
  59. if(userid && userid !== ""){
  60. request.query.userid = userid;
  61. }
  62. }
  63. if(tagsWidget){
  64. var tags = tagsWidget.getValue();
  65. if(tags && tags !== ""){
  66. var tagsArray = tags.split(" ");
  67. tags = "";
  68. for(var i = 0; i < tagsArray.length; i++){
  69. tags = tags + tagsArray[i];
  70. if(i < (tagsArray.length - 1)){
  71. tags += ","
  72. }
  73. }
  74. request.query.tags = tags;
  75. }
  76. }
  77. if(countWidget){
  78. request.count = countWidget.getValue();
  79. }
  80. if(startWidget){
  81. request.query.start = startWidget.getValue();
  82. }
  83. if(statusWidget){
  84. statusWidget.setValue("PROCESSING REQUEST");
  85. }
  86. flickrStore.fetch(request);
  87. }
  88. //Lastly, link up the search event.
  89. var button = dijit.byId("searchButton");
  90. dojo.connect(button, "onClick", invokeSearch);
  91. }
  92. dojo.addOnLoad(init);
  93. </script>
  94. </head>
  95. <body class="tundra">
  96. <h1>
  97. DEMO: PicasaStore Search
  98. </h1>
  99. <hr>
  100. <h3>
  101. Description:
  102. </h3>
  103. <p>
  104. 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.
  105. </p>
  106. <p>
  107. For fun, search on the 3dny tag!
  108. </p>
  109. <blockquote>
  110. <!--
  111. The store instance used by this demo.
  112. -->
  113. <table>
  114. <tbody>
  115. <tr>
  116. <td>
  117. <b>Status:</b>
  118. </td>
  119. <td>
  120. <div dojoType="dijit.form.TextBox" size="50" id="status" jsId="statusWidget" disabled="true"></div>
  121. </td>
  122. </tr>
  123. <tr>
  124. <td>
  125. <b>ID:</b>
  126. </td>
  127. <td>
  128. <div dojoType="dijit.form.TextBox" size="50" id="userid" jsId="idWidget"></div>
  129. </td>
  130. </tr>
  131. <tr>
  132. <td>
  133. <b>Query:</b>
  134. </td>
  135. <td>
  136. <div dojoType="dijit.form.TextBox" size="50" id="tags" jsId="tagsWidget" value="flower"></div>
  137. </td>
  138. </tr>
  139. <tr>
  140. <td>
  141. <b>Number of Pictures:</b>
  142. </td>
  143. <td>
  144. <div
  145. id="start"
  146. jsId="startWidget"
  147. dojoType="dijit.form.NumberSpinner"
  148. value="1"
  149. constraints="{min:1,places:0}"
  150. ></div>
  151. <div
  152. id="count"
  153. jsId="countWidget"
  154. dojoType="dijit.form.NumberSpinner"
  155. value="20"
  156. constraints="{min:1,max:100,places:0}"
  157. ></div>
  158. </td>
  159. </tr>
  160. <tr>
  161. <td>
  162. </td>
  163. <td>
  164. <div dojoType="dijit.form.Button" label="Search" id="searchButton" jsId="searchButtonWidget"></div>
  165. </td>
  166. </tr>
  167. </tbody>
  168. </table>
  169. <hr/>
  170. <div dojoType="dojox.data.PicasaStore" jsId="flickrStore" label="title"></div>
  171. <div dojoType="dojox.data.demos.widgets.PicasaViewList" id="flickrViews" jsId="flickrViewsWidget"></div>
  172. </body>
  173. </html>