|
1 |
|
2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
|
3 <html> |
|
4 <head> |
|
5 <title>YUI Library Examples: Get: Getting a Script Node with JSON Data</title> |
|
6 <meta http-equiv="content-type" content="text/html; charset=utf-8"> |
|
7 <link rel="stylesheet" type="text/css" href="../../assets/yui.css" > |
|
8 |
|
9 <style> |
|
10 /*Supplemental CSS for the YUI distribution*/ |
|
11 #custom-doc { width: 95%; min-width: 950px; } |
|
12 #pagetitle {background-image: url(../../assets/bg_hd.gif);} |
|
13 /* #pagetitle h1 {background-image: url(../../assets/title_h_bg.gif);}*/ |
|
14 </style> |
|
15 |
|
16 <link rel="stylesheet" type="text/css" href="../../assets/dpSyntaxHighlighter.css"> |
|
17 <link type="text/css" rel="stylesheet" href="../../build/cssfonts/fonts-min.css" /> |
|
18 <script type="text/javascript" src="../../build/yui/yui-debug.js"></script> |
|
19 <style type="text/css"> |
|
20 #container ol { |
|
21 /*bringing lists on to the page with breathing room */ |
|
22 margin-left:2em !important; |
|
23 } |
|
24 |
|
25 #container ol li { |
|
26 /*giving OL's LIs generated numbers*/ |
|
27 list-style: decimal outside !important; |
|
28 } |
|
29 |
|
30 #container h3 { |
|
31 margin-top: 1em; |
|
32 } |
|
33 </style> |
|
34 </head> |
|
35 <body id="yahoo-com" class=" yui-skin-sam"> |
|
36 <div id="custom-doc" class="yui-t2"> |
|
37 <div id="hd"> |
|
38 <div id="ygunav"> |
|
39 <p> |
|
40 <em> |
|
41 <a href="http://developer.yahoo.com/yui/3/">YUI 3.x Home</a> <i> - </i> |
|
42 </em> |
|
43 </p> |
|
44 <form action="http://search.yahoo.com/search" id="sitesearchform"> |
|
45 <input name="vs" type="hidden" value="developer.yahoo.com"> |
|
46 <input name="vs" type="hidden" value="yuiblog.com"> |
|
47 <div id="sitesearch"> |
|
48 <label for="searchinput">Site Search (YDN & YUIBlog): </label> |
|
49 <input type="text" id="searchinput" name="p"> |
|
50 <input type="submit" value="Search" id="searchsubmit" class="ygbt"> |
|
51 </div> |
|
52 </form> |
|
53 </div> |
|
54 <div id="ygma"><a href="../../"><img src="../../assets/logo.gif" border="0" width="200" height="93"></a></div> |
|
55 <div id="pagetitle"><h1>YUI Library Examples: Get: Getting a Script Node with JSON Data</h1></div> |
|
56 </div> |
|
57 <div id="bd"> |
|
58 |
|
59 |
|
60 <div id="yui-main"> |
|
61 <div class="yui-b"> |
|
62 <div class="yui-ge"> |
|
63 <div class="yui-u first example" id="main"> |
|
64 |
|
65 <h2>Get: Getting a Script Node with JSON Data</h2> |
|
66 |
|
67 <div id="example" class="promo"> |
|
68 <div class="example-intro"> |
|
69 <p>This example employs the <a href="http://developer.yahoo.com/yui/3/get/">YUI |
|
70 Get Utility</a> in a simple use case: retrieving JSON data from a cross-domain |
|
71 web service. While this is a relatively common usage, it's important to |
|
72 understand the security ramifications of this technique. Scripts loaded via the |
|
73 Get Utility (or any other "script node" solution) execute immediately |
|
74 once they are loaded. If you do not fully control (or fully trust) the script's |
|
75 source, this is not a safe technique and it can put the security of your users' |
|
76 data at risk. (For more information on the dangers of cross-site scripting |
|
77 [XSS] exploits, <a |
|
78 href="http://en.wikipedia.org/wiki/Cross-site_scripting">check out the |
|
79 Wikipedia entry on this subject</a>.)</p> <p>Here, we will use a trusted Yahoo! |
|
80 Search web service called <a |
|
81 href="http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html">Site |
|
82 Explorer</a> to return a list of inbound links for a given URL. The principal |
|
83 difference between this example and similar examples using <a |
|
84 href="http://developer.yahoo.com/yui/3/io/">YUI IO Utility</a> is |
|
85 that this technique does not require a server-side proxy. The browser connects |
|
86 directly to the third-party web service without bouncing through a proxy page |
|
87 as is required when using the XMLHttpRequest object (on which IO Utility |
|
88 relies).</p> |
|
89 </div> |
|
90 |
|
91 <div class="module example-container "> |
|
92 <div class="hd exampleHd"> |
|
93 <p class="newWindowButton yui-skin-sam"> |
|
94 <a href="get-script-basic_clean.html" target="_blank">View example in new window.</a> |
|
95 </p> |
|
96 </div> <div id="example-canvas" class="bd"> |
|
97 |
|
98 |
|
99 <!--BEGIN SOURCE CODE FOR EXAMPLE =============================== --> |
|
100 |
|
101 <div id="container"> |
|
102 |
|
103 <!--Use a real form that works without JavaScript:--> |
|
104 <form method="GET" action="http://siteexplorer.search.yahoo.com/advsearch" id="siteExplorer"> |
|
105 |
|
106 <label for="searchString">Site URL:</label> <input type="text" name="p" id="searchString" value="http://developer.yahoo.com/yui" size="40"> |
|
107 |
|
108 <input type="hidden" name="bwm" value="i"> |
|
109 <input type="hidden" name="bwms" value="p"> |
|
110 |
|
111 <input type="submit" id="siteExplorerData" value="Click here to get JSON data."> |
|
112 |
|
113 </form> |
|
114 |
|
115 <div id="results"> |
|
116 <!--JSON output will be written to the DOM here--> |
|
117 |
|
118 </div> |
|
119 </div> |
|
120 |
|
121 <script type="text/javascript"> |
|
122 |
|
123 YUI({base:"../../build/", timeout: 10000, filter:"debug", logInclude: {get:true, event:true, example:true}}).use("node", "dump", |
|
124 |
|
125 function(Y) { |
|
126 |
|
127 // We are going to create a global variable to get the |
|
128 // data back from the web service |
|
129 MyNamespace = YUI.namespace('example.SiteExplorer'); |
|
130 |
|
131 var elResults = Y.one("#results"), |
|
132 tIds = {}, |
|
133 loading = false, |
|
134 current = null; |
|
135 |
|
136 // We use the Get Utility's success handler in conjunction with |
|
137 // the web service callback in order to detect bad responses |
|
138 // from the web service. |
|
139 var onSiteExplorerSuccess = function(o) { |
|
140 |
|
141 // stop blocking requests |
|
142 loading = false; |
|
143 |
|
144 // A success response means the script node is inserted. However, the |
|
145 // utility is unable to detect whether or not the content of the script |
|
146 // node is correct, or even if there was a bad response (like a 404 |
|
147 // error). To get around this, we use the web service callback to |
|
148 // verify that the script contents was correct. |
|
149 if (o.tId in tIds) { |
|
150 Y.log("The Get Utility has fired the success handler indicating that the " + |
|
151 "requested script has loaded and is ready for use.", "info", "example"); |
|
152 } else { |
|
153 Y.log("The Get utility has fired onSuccess but the webservice callback did not " + |
|
154 "fire. We could retry the transaction here, or notify the user of the " + |
|
155 "failure.", "info", "example"); |
|
156 } |
|
157 |
|
158 }; |
|
159 |
|
160 var onSiteExplorerFailure = function(o) { |
|
161 Y.log("The Get Utility failed.", "info", "example"); |
|
162 }; |
|
163 |
|
164 var onSiteExplorerTimeout = function(o) { |
|
165 Y.log("The Get Utility timed out.", "info", "example"); |
|
166 }; |
|
167 |
|
168 //function to retrieve data from Yahoo! Site Explorer web service -- |
|
169 // http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html |
|
170 var getSiteExplorerData = function() { |
|
171 Y.log("Button clicked; getSiteExplorerData firing.", "info", "example"); |
|
172 |
|
173 // block multiple requests |
|
174 if (loading) { |
|
175 return; |
|
176 } |
|
177 loading = true; |
|
178 |
|
179 //Load the transitional state of the results section: |
|
180 elResults.set("innerHTML", "<h3>Retrieving incoming links for " + |
|
181 Y.one("#searchString").get('value') + ":</h3>" + |
|
182 "<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' " + |
|
183 "alt='Please wait...'>"); |
|
184 |
|
185 //prepare the URL for the Yahoo Site Explorer API: |
|
186 var sURL = "http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?" + |
|
187 "appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom" + |
|
188 "&results=20&output=json&omit_inlinks=domain" + |
|
189 "&callback=MyNamespace.callback" + |
|
190 "&query=" + encodeURIComponent(Y.one("#searchString").get('value')); |
|
191 |
|
192 //This simple line is the call to the Get Utility; we pass |
|
193 //in the URL and the configuration object, which in this case |
|
194 //consists merely of our success and failure callbacks: |
|
195 var transactionObj = Y.Get.script(sURL, { |
|
196 onSuccess: onSiteExplorerSuccess, |
|
197 onFailure: onSiteExplorerFailure, |
|
198 onTimeout: onSiteExplorerTimeout, |
|
199 timeout: 20000, |
|
200 context: Y |
|
201 }); |
|
202 |
|
203 //The script method returns a single-field object containing the |
|
204 //tranaction id: |
|
205 Y.log("Get Utility transaction started; transaction object: " + Y.dump(transactionObj), "info", "example"); |
|
206 |
|
207 // keep track of the current transaction id. The transaction will be |
|
208 // considered complete only if the web service callback is executed. |
|
209 current = transactionObj.tId; |
|
210 }; |
|
211 |
|
212 MyNamespace.callback = function(results) { |
|
213 Y.log("Web service returned data to Y.example.SiteExplorer.callback; beginning to process.", "info", "example"); |
|
214 |
|
215 // Mark the transaction as complete. This will be checked by the onSuccess |
|
216 // handler to determine if the transaction really succeeded. |
|
217 tIds[current] = true; |
|
218 |
|
219 //work with the returned data to extract meaningful fields: |
|
220 var aResults = results.ResultSet.Result; |
|
221 var totalLinks = results.ResultSet.totalResultsAvailable; |
|
222 var returnedLinkCount = results.ResultSet.totalResultsReturned; |
|
223 |
|
224 if(aResults) {//there are inbound links; process and display them: |
|
225 |
|
226 //write header and open list of inbound links: |
|
227 var html = "<h3>There are " + |
|
228 totalLinks + |
|
229 " inbound links for this page; here are the first " + |
|
230 returnedLinkCount + |
|
231 ":</h3><ol>"; |
|
232 |
|
233 //process list of inbound links: |
|
234 for (var i=0; i < aResults.length; i++) { |
|
235 html += "<li><strong>" + |
|
236 aResults[i].Title + |
|
237 ":</strong> <a href='" + |
|
238 aResults[i].Url + |
|
239 "'>" + aResults[i].Url + |
|
240 "</a></li>"; |
|
241 } |
|
242 |
|
243 //close list of inbound links |
|
244 html += "</ol>"; |
|
245 |
|
246 } else {//no inbound links exist for this page: |
|
247 |
|
248 var html = "<h3>There are no inbound links for the page specified.</h3>"; |
|
249 |
|
250 } |
|
251 |
|
252 //insert string into DOM: |
|
253 elResults.set('innerHTML', html); |
|
254 }; |
|
255 |
|
256 //suppress default form behavior |
|
257 Y.on("submit", function(e) { |
|
258 e.preventDefault(); |
|
259 getSiteExplorerData(); |
|
260 }, "#siteExplorer"); |
|
261 |
|
262 }); |
|
263 |
|
264 </script> |
|
265 |
|
266 <!--END SOURCE CODE FOR EXAMPLE =============================== --> |
|
267 |
|
268 |
|
269 </div> |
|
270 </div> |
|
271 </div> |
|
272 |
|
273 <h2 class="first">Using the Get Utility to Get a Script File with JSON-formatted Contents</h2> |
|
274 |
|
275 <p>Here, we'll use <a href="http://developer.yahoo.com/yui/3/get/">the YUI Get Utility</a> to retrieve data via the <a href="http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html">Yahoo! Search Site-Explorer web service</a>, one of many Yahoo! APIs that support JSON.</p> |
|
276 |
|
277 <p>First, we create a plain HTML form that will work for users who do not have JavaScript enabled:</p> |
|
278 |
|
279 <div id="syntax1" class="yui-syntax-highlight"><div class="numbers"><pre class="html4strict" style="font-family:monospace;"><ol><li class="li1"><div class="de1"><span class="sc2"><<span class="kw2">div</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"container"</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc-1"><!-- Use a real form that works without JavaScript: --></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="kw2">form</span> <span class="kw3">method</span><span class="sy0">=</span><span class="st0">"GET"</span> <span class="kw3">action</span><span class="sy0">=</span><span class="st0">"http://siteexplorer.search.yahoo.com/advsearch"</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"siteExplorer"</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="kw2">label</span> <span class="kw3">for</span><span class="sy0">=</span><span class="st0">"searchString"</span>></span>Site URL:<span class="sc2"><<span class="sy0">/</span><span class="kw2">label</span>></span></div></li><li class="li2"><div class="de2"> <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"text"</span> <span class="kw3">name</span><span class="sy0">=</span><span class="st0">"searchString"</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"p"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"http://developer.yahoo.com/yui"</span> <span class="kw3">size</span><span class="sy0">=</span><span class="st0">"40"</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"hidden"</span> <span class="kw3">name</span><span class="sy0">=</span><span class="st0">"bwm"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"i"</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"hidden"</span> <span class="kw3">name</span><span class="sy0">=</span><span class="st0">"bwms"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"p"</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"submit"</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"siteExplorerButton"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"Click here to get JSON data."</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="sy0">/</span><span class="kw2">form</span>></span></div></li><li class="li2"><div class="de2"> <span class="sc2"><<span class="kw2">div</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"results"</span>></span></div></li><li class="li1"><div class="de1"> <span class="sc-1"><!--JSON output will be written to the DOM here--></span></div></li><li class="li1"><div class="de1"> <span class="sc2"><<span class="sy0">/</span><span class="kw2">div</span>></span></div></li><li class="li1"><div class="de1"><span class="sc2"><<span class="sy0">/</span><span class="kw2">div</span>></span></div></li></ol></pre></div><div class="nonumbers"><pre class="html4strict" style="font-family:monospace;"><span class="sc2"><<span class="kw2">div</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"container"</span>></span> |
|
280 <span class="sc-1"><!-- Use a real form that works without JavaScript: --></span> |
|
281 <span class="sc2"><<span class="kw2">form</span> <span class="kw3">method</span><span class="sy0">=</span><span class="st0">"GET"</span> <span class="kw3">action</span><span class="sy0">=</span><span class="st0">"http://siteexplorer.search.yahoo.com/advsearch"</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"siteExplorer"</span>></span> |
|
282 <span class="sc2"><<span class="kw2">label</span> <span class="kw3">for</span><span class="sy0">=</span><span class="st0">"searchString"</span>></span>Site URL:<span class="sc2"><<span class="sy0">/</span><span class="kw2">label</span>></span> |
|
283 <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"text"</span> <span class="kw3">name</span><span class="sy0">=</span><span class="st0">"searchString"</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"p"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"http://developer.yahoo.com/yui"</span> <span class="kw3">size</span><span class="sy0">=</span><span class="st0">"40"</span>></span> |
|
284 <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"hidden"</span> <span class="kw3">name</span><span class="sy0">=</span><span class="st0">"bwm"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"i"</span>></span> |
|
285 <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"hidden"</span> <span class="kw3">name</span><span class="sy0">=</span><span class="st0">"bwms"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"p"</span>></span> |
|
286 <span class="sc2"><<span class="kw2">input</span> <span class="kw3">type</span><span class="sy0">=</span><span class="st0">"submit"</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"siteExplorerButton"</span> <span class="kw3">value</span><span class="sy0">=</span><span class="st0">"Click here to get JSON data."</span>></span> |
|
287 <span class="sc2"><<span class="sy0">/</span><span class="kw2">form</span>></span> |
|
288 <span class="sc2"><<span class="kw2">div</span> <span class="kw3">id</span><span class="sy0">=</span><span class="st0">"results"</span>></span> |
|
289 <span class="sc-1"><!--JSON output will be written to the DOM here--></span> |
|
290 <span class="sc2"><<span class="sy0">/</span><span class="kw2">div</span>></span> |
|
291 <span class="sc2"><<span class="sy0">/</span><span class="kw2">div</span>></span></pre></div><textarea id="syntax1-plain"><div id="container"> |
|
292 <!-- Use a real form that works without JavaScript: --> |
|
293 <form method="GET" action="http://siteexplorer.search.yahoo.com/advsearch" id="siteExplorer"> |
|
294 <label for="searchString">Site URL:</label> |
|
295 <input type="text" name="searchString" id="p" value="http://developer.yahoo.com/yui" size="40"> |
|
296 <input type="hidden" name="bwm" value="i"> |
|
297 <input type="hidden" name="bwms" value="p"> |
|
298 <input type="submit" id="siteExplorerButton" value="Click here to get JSON data."> |
|
299 </form> |
|
300 <div id="results"> |
|
301 <!--JSON output will be written to the DOM here--> |
|
302 </div> |
|
303 </div></textarea></div> |
|
304 <p>With this in place, we can progressively enhance the form to create an in-page interaction for users with JavaScript turned on.</p> |
|
305 |
|
306 <p>The most important JavaScript piece here is the method that we fire on form submission. This method triggers our call to the Get Utility. This method, called <code>getSiteExplorerData</code>, accomplishes four things:</p> |
|
307 <ol> |
|
308 <li>It loads a transitional state for the display, alerting the user to the fact that data is being retrieved as a result of her action;</li> |
|
309 <li>It prepares the URL that will be passed to the Get Utility;</li> |
|
310 <li>It calls the Get Utility, passing in the URL of the script resource to load (in this case, the URL of our web service with the relevant paramaters assembled in the querystring);</li> |
|
311 <li>It specifies the callback and the context in which the callback should |
|
312 run. Note that in this example the web service itself provides callback |
|
313 functionality, allowing us to pass a globally accessible callback function |
|
314 name as one of the parameters of the REST API; you can see this reference |
|
315 below. As a result, we're making direct use of the intrinsic web service |
|
316 callback in this example and just stubbing out the built-in Get Utility |
|
317 callback for the sake of illustration.</li> </ol> <p> |
|
318 |
|
319 <div id="syntax2" class="yui-syntax-highlight"><div class="numbers"><pre class="javascript" style="font-family:monospace;"><ol><li class="li1"><div class="de1"><span class="co1">//function to retrieve data from Yahoo! Site Explorer web service --</span></div></li><li class="li1"><div class="de1"><span class="co1">// http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="kw2">var</span> getSiteExplorerData <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span> <span class="br0">{</span></div></li><li class="li2"><div class="de2"> Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Button clicked; getSiteExplorerData firing."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">// block multiple requests</span></div></li><li class="li1"><div class="de1"> <span class="kw1">if</span> <span class="br0">(</span>loading<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1"> <span class="kw1">return</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> <span class="br0">}</span></div></li><li class="li1"><div class="de1"> loading <span class="sy0">=</span> <span class="kw2">true</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//Load the transitional state of the results section:</span></div></li><li class="li1"><div class="de1"> elResults.<span class="me1">set</span><span class="br0">(</span><span class="st0">"innerHTML"</span><span class="sy0">,</span> <span class="st0">"<h3>Retrieving incoming links for "</span> <span class="sy0">+</span></div></li><li class="li2"><div class="de2"> Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span> <span class="sy0">+</span> <span class="st0">":</h3>"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' "</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"alt='Please wait...'>"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//prepare the URL for the Yahoo Site Explorer API:</span></div></li><li class="li2"><div class="de2"> <span class="kw2">var</span> sURL <span class="sy0">=</span> <span class="st0">"http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"&results=20&output=json&omit_inlinks=domain"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"&callback=MyNamespace.callback"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"&query="</span> <span class="sy0">+</span> encodeURIComponent<span class="br0">(</span>Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> </div></li><li class="li1"><div class="de1"> <span class="co1">//This simple line is the call to the Get Utility; we pass</span></div></li><li class="li1"><div class="de1"> <span class="co1">//in the URL and the configuration object, which in this case</span></div></li><li class="li1"><div class="de1"> <span class="co1">//consists merely of our success and failure callbacks:</span></div></li><li class="li1"><div class="de1"> <span class="kw2">var</span> transactionObj <span class="sy0">=</span> Y.<span class="me1">Get</span>.<span class="me1">script</span><span class="br0">(</span>sURL<span class="sy0">,</span> <span class="br0">{</span></div></li><li class="li2"><div class="de2"> onSuccess<span class="sy0">:</span> onSiteExplorerSuccess<span class="sy0">,</span></div></li><li class="li1"><div class="de1"> onFailure<span class="sy0">:</span> onSiteExplorerFailure<span class="sy0">,</span></div></li><li class="li1"><div class="de1"> onTimeout<span class="sy0">:</span> onSiteExplorerTimeout<span class="sy0">,</span></div></li><li class="li1"><div class="de1"> timeout<span class="sy0">:</span> <span class="nu0">20000</span><span class="sy0">,</span></div></li><li class="li1"><div class="de1"> context<span class="sy0">:</span> Y</div></li><li class="li2"><div class="de2"> <span class="br0">}</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//The script method returns a single-field object containing the</span></div></li><li class="li1"><div class="de1"> <span class="co1">//tranaction id:</span></div></li><li class="li1"><div class="de1"> Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Get Utility transaction started; transaction object: "</span> <span class="sy0">+</span> Y.<span class="me1">dump</span><span class="br0">(</span>transactionObj<span class="br0">)</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> </div></li><li class="li1"><div class="de1"> <span class="co1">// keep track of the current transaction id. The transaction will be</span></div></li><li class="li1"><div class="de1"> <span class="co1">// considered complete only if the web service callback is executed.</span></div></li><li class="li1"><div class="de1"> current <span class="sy0">=</span> transactionObj.<span class="me1">tId</span><span class="sy0">;</span> </div></li><li class="li1"><div class="de1"><span class="br0">}</span><span class="sy0">;</span></div></li></ol></pre></div><div class="nonumbers"><pre class="javascript" style="font-family:monospace;"><span class="co1">//function to retrieve data from Yahoo! Site Explorer web service --</span> |
|
320 <span class="co1">// http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html</span> |
|
321 |
|
322 <span class="kw2">var</span> getSiteExplorerData <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span> <span class="br0">{</span> |
|
323 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Button clicked; getSiteExplorerData firing."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
324 |
|
325 <span class="co1">// block multiple requests</span> |
|
326 <span class="kw1">if</span> <span class="br0">(</span>loading<span class="br0">)</span> <span class="br0">{</span> |
|
327 <span class="kw1">return</span><span class="sy0">;</span> |
|
328 <span class="br0">}</span> |
|
329 loading <span class="sy0">=</span> <span class="kw2">true</span><span class="sy0">;</span> |
|
330 |
|
331 <span class="co1">//Load the transitional state of the results section:</span> |
|
332 elResults.<span class="me1">set</span><span class="br0">(</span><span class="st0">"innerHTML"</span><span class="sy0">,</span> <span class="st0">"<h3>Retrieving incoming links for "</span> <span class="sy0">+</span> |
|
333 Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span> <span class="sy0">+</span> <span class="st0">":</h3>"</span> <span class="sy0">+</span> |
|
334 <span class="st0">"<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' "</span> <span class="sy0">+</span> |
|
335 <span class="st0">"alt='Please wait...'>"</span><span class="br0">)</span><span class="sy0">;</span> |
|
336 |
|
337 <span class="co1">//prepare the URL for the Yahoo Site Explorer API:</span> |
|
338 <span class="kw2">var</span> sURL <span class="sy0">=</span> <span class="st0">"http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?"</span> <span class="sy0">+</span> |
|
339 <span class="st0">"appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom"</span> <span class="sy0">+</span> |
|
340 <span class="st0">"&results=20&output=json&omit_inlinks=domain"</span> <span class="sy0">+</span> |
|
341 <span class="st0">"&callback=MyNamespace.callback"</span> <span class="sy0">+</span> |
|
342 <span class="st0">"&query="</span> <span class="sy0">+</span> encodeURIComponent<span class="br0">(</span>Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span><span class="br0">)</span><span class="sy0">;</span> |
|
343 |
|
344 <span class="co1">//This simple line is the call to the Get Utility; we pass</span> |
|
345 <span class="co1">//in the URL and the configuration object, which in this case</span> |
|
346 <span class="co1">//consists merely of our success and failure callbacks:</span> |
|
347 <span class="kw2">var</span> transactionObj <span class="sy0">=</span> Y.<span class="me1">Get</span>.<span class="me1">script</span><span class="br0">(</span>sURL<span class="sy0">,</span> <span class="br0">{</span> |
|
348 onSuccess<span class="sy0">:</span> onSiteExplorerSuccess<span class="sy0">,</span> |
|
349 onFailure<span class="sy0">:</span> onSiteExplorerFailure<span class="sy0">,</span> |
|
350 onTimeout<span class="sy0">:</span> onSiteExplorerTimeout<span class="sy0">,</span> |
|
351 timeout<span class="sy0">:</span> <span class="nu0">20000</span><span class="sy0">,</span> |
|
352 context<span class="sy0">:</span> Y |
|
353 <span class="br0">}</span><span class="br0">)</span><span class="sy0">;</span> |
|
354 |
|
355 <span class="co1">//The script method returns a single-field object containing the</span> |
|
356 <span class="co1">//tranaction id:</span> |
|
357 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Get Utility transaction started; transaction object: "</span> <span class="sy0">+</span> Y.<span class="me1">dump</span><span class="br0">(</span>transactionObj<span class="br0">)</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
358 |
|
359 <span class="co1">// keep track of the current transaction id. The transaction will be</span> |
|
360 <span class="co1">// considered complete only if the web service callback is executed.</span> |
|
361 current <span class="sy0">=</span> transactionObj.<span class="me1">tId</span><span class="sy0">;</span> |
|
362 <span class="br0">}</span><span class="sy0">;</span></pre></div><textarea id="syntax2-plain">//function to retrieve data from Yahoo! Site Explorer web service -- |
|
363 // http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html |
|
364 |
|
365 var getSiteExplorerData = function() { |
|
366 Y.log("Button clicked; getSiteExplorerData firing.", "info", "example"); |
|
367 |
|
368 // block multiple requests |
|
369 if (loading) { |
|
370 return; |
|
371 } |
|
372 loading = true; |
|
373 |
|
374 //Load the transitional state of the results section: |
|
375 elResults.set("innerHTML", "<h3>Retrieving incoming links for " + |
|
376 Y.one("#searchString").get('value') + ":</h3>" + |
|
377 "<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' " + |
|
378 "alt='Please wait...'>"); |
|
379 |
|
380 //prepare the URL for the Yahoo Site Explorer API: |
|
381 var sURL = "http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?" + |
|
382 "appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom" + |
|
383 "&results=20&output=json&omit_inlinks=domain" + |
|
384 "&callback=MyNamespace.callback" + |
|
385 "&query=" + encodeURIComponent(Y.one("#searchString").get('value')); |
|
386 |
|
387 //This simple line is the call to the Get Utility; we pass |
|
388 //in the URL and the configuration object, which in this case |
|
389 //consists merely of our success and failure callbacks: |
|
390 var transactionObj = Y.Get.script(sURL, { |
|
391 onSuccess: onSiteExplorerSuccess, |
|
392 onFailure: onSiteExplorerFailure, |
|
393 onTimeout: onSiteExplorerTimeout, |
|
394 timeout: 20000, |
|
395 context: Y |
|
396 }); |
|
397 |
|
398 //The script method returns a single-field object containing the |
|
399 //tranaction id: |
|
400 Y.log("Get Utility transaction started; transaction object: " + Y.dump(transactionObj), "info", "example"); |
|
401 |
|
402 // keep track of the current transaction id. The transaction will be |
|
403 // considered complete only if the web service callback is executed. |
|
404 current = transactionObj.tId; |
|
405 };</textarea></div></p> |
|
406 <p>The full JavaScript codeblock for this example reads as follows:</p> |
|
407 |
|
408 <div id="syntax3" class="yui-syntax-highlight"><div class="numbers"><pre class="javascript" style="font-family:monospace;"><ol><li class="li1"><div class="de1"><span class="co1">// We are going to create a global variable to get the </span></div></li><li class="li1"><div class="de1"><span class="co1">// data back from the web service</span></div></li><li class="li1"><div class="de1">MyNamespace <span class="sy0">=</span> YUI.<span class="kw2">namespace</span><span class="br0">(</span><span class="st0">'example.SiteExplorer'</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li2"><div class="de2"><span class="kw2">var</span> elResults <span class="sy0">=</span> Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#results"</span><span class="br0">)</span><span class="sy0">,</span></div></li><li class="li1"><div class="de1"> tIds <span class="sy0">=</span> <span class="br0">{</span><span class="br0">}</span><span class="sy0">,</span></div></li><li class="li1"><div class="de1"> loading <span class="sy0">=</span> <span class="kw2">false</span><span class="sy0">,</span></div></li><li class="li1"><div class="de1"> current <span class="sy0">=</span> <span class="kw2">null</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li2"><div class="de2"><span class="co1">// We use the Get Utility's success handler in conjunction with</span></div></li><li class="li1"><div class="de1"><span class="co1">// the web service callback in order to detect bad responses </span></div></li><li class="li1"><div class="de1"><span class="co1">// from the web service.</span></div></li><li class="li1"><div class="de1"><span class="kw2">var</span> onSiteExplorerSuccess <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>o<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li2"><div class="de2"> <span class="co1">// stop blocking requests</span></div></li><li class="li1"><div class="de1"> loading <span class="sy0">=</span> <span class="kw2">false</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">// A success response means the script node is inserted. However, the</span></div></li><li class="li1"><div class="de1"> <span class="co1">// utility is unable to detect whether or not the content of the script</span></div></li><li class="li2"><div class="de2"> <span class="co1">// node is correct, or even if there was a bad response (like a 404</span></div></li><li class="li1"><div class="de1"> <span class="co1">// error). To get around this, we use the web service callback to</span></div></li><li class="li1"><div class="de1"> <span class="co1">// verify that the script contents was correct.</span></div></li><li class="li1"><div class="de1"> <span class="kw1">if</span> <span class="br0">(</span>o.<span class="me1">tId</span> <span class="kw1">in</span> tIds<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1">Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get Utility has fired the success handler indicating that the "</span> <span class="sy0">+</span></div></li><li class="li2"><div class="de2"> <span class="st0">"requested script has loaded and is ready for use."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> <span class="br0">}</span> <span class="kw1">else</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1">Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get utility has fired onSuccess but the webservice callback did not "</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"fire. We could retry the transaction here, or notify the user of the "</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"failure."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> <span class="br0">}</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="br0">}</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="kw2">var</span> onSiteExplorerFailure <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>o<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li2"><div class="de2">Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get Utility failed."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"><span class="br0">}</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="kw2">var</span> onSiteExplorerTimeout <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>o<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1">Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get Utility timed out."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"><span class="br0">}</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="co1">//function to retrieve data from Yahoo! Site Explorer web service --</span></div></li><li class="li1"><div class="de1"><span class="co1">// http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html</span></div></li><li class="li1"><div class="de1"><span class="kw2">var</span> getSiteExplorerData <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span> <span class="br0">{</span></div></li><li class="li2"><div class="de2"> Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Button clicked; getSiteExplorerData firing."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">// block multiple requests</span></div></li><li class="li1"><div class="de1"> <span class="kw1">if</span> <span class="br0">(</span>loading<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1"> <span class="kw1">return</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> <span class="br0">}</span></div></li><li class="li1"><div class="de1"> loading <span class="sy0">=</span> <span class="kw2">true</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//Load the transitional state of the results section:</span></div></li><li class="li1"><div class="de1"> elResults.<span class="me1">set</span><span class="br0">(</span><span class="st0">"innerHTML"</span><span class="sy0">,</span> <span class="st0">"<h3>Retrieving incoming links for "</span> <span class="sy0">+</span></div></li><li class="li2"><div class="de2"> Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span> <span class="sy0">+</span> <span class="st0">":</h3>"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' "</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"alt='Please wait...'>"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//prepare the URL for the Yahoo Site Explorer API:</span></div></li><li class="li2"><div class="de2"> <span class="kw2">var</span> sURL <span class="sy0">=</span> <span class="st0">"http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"&results=20&output=json&omit_inlinks=domain"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"&callback=MyNamespace.callback"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"&query="</span> <span class="sy0">+</span> encodeURIComponent<span class="br0">(</span>Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> </div></li><li class="li1"><div class="de1"> <span class="co1">//This simple line is the call to the Get Utility; we pass</span></div></li><li class="li1"><div class="de1"> <span class="co1">//in the URL and the configuration object, which in this case</span></div></li><li class="li1"><div class="de1"> <span class="co1">//consists merely of our success and failure callbacks:</span></div></li><li class="li1"><div class="de1"> <span class="kw2">var</span> transactionObj <span class="sy0">=</span> Y.<span class="me1">Get</span>.<span class="me1">script</span><span class="br0">(</span>sURL<span class="sy0">,</span> <span class="br0">{</span></div></li><li class="li2"><div class="de2"> onSuccess<span class="sy0">:</span> onSiteExplorerSuccess<span class="sy0">,</span></div></li><li class="li1"><div class="de1"> onFailure<span class="sy0">:</span> onSiteExplorerFailure<span class="sy0">,</span></div></li><li class="li1"><div class="de1"> onTimeout<span class="sy0">:</span> onSiteExplorerTimeout<span class="sy0">,</span></div></li><li class="li1"><div class="de1"> timeout<span class="sy0">:</span> <span class="nu0">20000</span><span class="sy0">,</span></div></li><li class="li1"><div class="de1"> context<span class="sy0">:</span> Y</div></li><li class="li2"><div class="de2"> <span class="br0">}</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//The script method returns a single-field object containing the</span></div></li><li class="li1"><div class="de1"> <span class="co1">//tranaction id:</span></div></li><li class="li1"><div class="de1"> Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Get Utility transaction started; transaction object: "</span> <span class="sy0">+</span> Y.<span class="me1">dump</span><span class="br0">(</span>transactionObj<span class="br0">)</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> </div></li><li class="li1"><div class="de1"> <span class="co1">// keep track of the current transaction id. The transaction will be</span></div></li><li class="li1"><div class="de1"> <span class="co1">// considered complete only if the web service callback is executed.</span></div></li><li class="li1"><div class="de1"> current <span class="sy0">=</span> transactionObj.<span class="me1">tId</span><span class="sy0">;</span> </div></li><li class="li1"><div class="de1"><span class="br0">}</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> </div></li><li class="li1"><div class="de1">MyNamespace.<span class="me1">callback</span> <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>results<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1"> Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Web service returned data to Y.example.SiteExplorer.callback; beginning to process."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">// Mark the transaction as complete. This will be checked by the onSuccess</span></div></li><li class="li2"><div class="de2"> <span class="co1">// handler to determine if the transaction really succeeded.</span></div></li><li class="li1"><div class="de1"> tIds<span class="br0">[</span>current<span class="br0">]</span> <span class="sy0">=</span> <span class="kw2">true</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//work with the returned data to extract meaningful fields:</span></div></li><li class="li1"><div class="de1"> <span class="kw2">var</span> aResults <span class="sy0">=</span> results.<span class="me1">ResultSet</span>.<span class="me1">Result</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> <span class="kw2">var</span> totalLinks <span class="sy0">=</span> results.<span class="me1">ResultSet</span>.<span class="me1">totalResultsAvailable</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> <span class="kw2">var</span> returnedLinkCount <span class="sy0">=</span> results.<span class="me1">ResultSet</span>.<span class="me1">totalResultsReturned</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="kw1">if</span><span class="br0">(</span>aResults<span class="br0">)</span> <span class="br0">{</span><span class="co1">//there are inbound links; process and display them:</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li2"><div class="de2"> <span class="co1">//write header and open list of inbound links: </span></div></li><li class="li1"><div class="de1"> <span class="kw2">var</span> html <span class="sy0">=</span> <span class="st0">"<h3>There are "</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> totalLinks <span class="sy0">+</span> </div></li><li class="li1"><div class="de1"> <span class="st0">" inbound links for this page; here are the first "</span> <span class="sy0">+</span> </div></li><li class="li1"><div class="de1"> returnedLinkCount <span class="sy0">+</span></div></li><li class="li2"><div class="de2"> <span class="st0">":</h3><ol>"</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//process list of inbound links:</span></div></li><li class="li1"><div class="de1"> <span class="kw1">for</span> <span class="br0">(</span><span class="kw2">var</span> i<span class="sy0">=</span><span class="nu0">0</span><span class="sy0">;</span> i <span class="sy0"><</span> aResults.<span class="me1">length</span><span class="sy0">;</span> i<span class="sy0">++</span><span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1"> html <span class="sy0">+=</span> <span class="st0">"<li><strong>"</span> <span class="sy0">+</span></div></li><li class="li2"><div class="de2"> aResults<span class="br0">[</span>i<span class="br0">]</span>.<span class="me1">Title</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">":</strong> <a href='"</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> aResults<span class="br0">[</span>i<span class="br0">]</span>.<span class="me1">Url</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"'>"</span> <span class="sy0">+</span> aResults<span class="br0">[</span>i<span class="br0">]</span>.<span class="me1">Url</span> <span class="sy0">+</span></div></li><li class="li1"><div class="de1"> <span class="st0">"</a></li>"</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> <span class="br0">}</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="co1">//close list of inbound links</span></div></li><li class="li1"><div class="de1"> html <span class="sy0">+=</span> <span class="st0">"</ol>"</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li2"><div class="de2"> <span class="br0">}</span> <span class="kw1">else</span> <span class="br0">{</span><span class="co1">//no inbound links exist for this page:</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="kw2">var</span> html <span class="sy0">=</span> <span class="st0">"<h3>There are no inbound links for the page specified.</h3>"</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"> <span class="br0">}</span></div></li><li class="li2"><div class="de2"> </div></li><li class="li1"><div class="de1"> <span class="co1">//insert string into DOM:</span></div></li><li class="li1"><div class="de1"> elResults.<span class="me1">set</span><span class="br0">(</span><span class="st0">'innerHTML'</span><span class="sy0">,</span> html<span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"><span class="br0">}</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li2"><div class="de2"><span class="co1">//suppress default form behavior</span></div></li><li class="li1"><div class="de1">Y.<span class="me1">on</span><span class="br0">(</span><span class="st0">"submit"</span><span class="sy0">,</span> <span class="kw2">function</span><span class="br0">(</span>e<span class="br0">)</span> <span class="br0">{</span></div></li><li class="li1"><div class="de1"> e.<span class="me1">preventDefault</span><span class="br0">(</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"> getSiteExplorerData<span class="br0">(</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li1"><div class="de1"><span class="br0">}</span><span class="sy0">,</span> <span class="st0">"#siteExplorer"</span><span class="br0">)</span><span class="sy0">;</span></div></li><li class="li2"><div class="de2"> </div></li></ol></pre></div><div class="nonumbers"><pre class="javascript" style="font-family:monospace;"><span class="co1">// We are going to create a global variable to get the </span> |
|
409 <span class="co1">// data back from the web service</span> |
|
410 MyNamespace <span class="sy0">=</span> YUI.<span class="kw2">namespace</span><span class="br0">(</span><span class="st0">'example.SiteExplorer'</span><span class="br0">)</span><span class="sy0">;</span> |
|
411 |
|
412 <span class="kw2">var</span> elResults <span class="sy0">=</span> Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#results"</span><span class="br0">)</span><span class="sy0">,</span> |
|
413 tIds <span class="sy0">=</span> <span class="br0">{</span><span class="br0">}</span><span class="sy0">,</span> |
|
414 loading <span class="sy0">=</span> <span class="kw2">false</span><span class="sy0">,</span> |
|
415 current <span class="sy0">=</span> <span class="kw2">null</span><span class="sy0">;</span> |
|
416 |
|
417 <span class="co1">// We use the Get Utility's success handler in conjunction with</span> |
|
418 <span class="co1">// the web service callback in order to detect bad responses </span> |
|
419 <span class="co1">// from the web service.</span> |
|
420 <span class="kw2">var</span> onSiteExplorerSuccess <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>o<span class="br0">)</span> <span class="br0">{</span> |
|
421 |
|
422 <span class="co1">// stop blocking requests</span> |
|
423 loading <span class="sy0">=</span> <span class="kw2">false</span><span class="sy0">;</span> |
|
424 |
|
425 <span class="co1">// A success response means the script node is inserted. However, the</span> |
|
426 <span class="co1">// utility is unable to detect whether or not the content of the script</span> |
|
427 <span class="co1">// node is correct, or even if there was a bad response (like a 404</span> |
|
428 <span class="co1">// error). To get around this, we use the web service callback to</span> |
|
429 <span class="co1">// verify that the script contents was correct.</span> |
|
430 <span class="kw1">if</span> <span class="br0">(</span>o.<span class="me1">tId</span> <span class="kw1">in</span> tIds<span class="br0">)</span> <span class="br0">{</span> |
|
431 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get Utility has fired the success handler indicating that the "</span> <span class="sy0">+</span> |
|
432 <span class="st0">"requested script has loaded and is ready for use."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
433 <span class="br0">}</span> <span class="kw1">else</span> <span class="br0">{</span> |
|
434 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get utility has fired onSuccess but the webservice callback did not "</span> <span class="sy0">+</span> |
|
435 <span class="st0">"fire. We could retry the transaction here, or notify the user of the "</span> <span class="sy0">+</span> |
|
436 <span class="st0">"failure."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
437 <span class="br0">}</span> |
|
438 |
|
439 <span class="br0">}</span><span class="sy0">;</span> |
|
440 |
|
441 <span class="kw2">var</span> onSiteExplorerFailure <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>o<span class="br0">)</span> <span class="br0">{</span> |
|
442 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get Utility failed."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
443 <span class="br0">}</span><span class="sy0">;</span> |
|
444 |
|
445 <span class="kw2">var</span> onSiteExplorerTimeout <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>o<span class="br0">)</span> <span class="br0">{</span> |
|
446 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"The Get Utility timed out."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
447 <span class="br0">}</span><span class="sy0">;</span> |
|
448 |
|
449 <span class="co1">//function to retrieve data from Yahoo! Site Explorer web service --</span> |
|
450 <span class="co1">// http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html</span> |
|
451 <span class="kw2">var</span> getSiteExplorerData <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span> <span class="br0">{</span> |
|
452 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Button clicked; getSiteExplorerData firing."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
453 |
|
454 <span class="co1">// block multiple requests</span> |
|
455 <span class="kw1">if</span> <span class="br0">(</span>loading<span class="br0">)</span> <span class="br0">{</span> |
|
456 <span class="kw1">return</span><span class="sy0">;</span> |
|
457 <span class="br0">}</span> |
|
458 loading <span class="sy0">=</span> <span class="kw2">true</span><span class="sy0">;</span> |
|
459 |
|
460 <span class="co1">//Load the transitional state of the results section:</span> |
|
461 elResults.<span class="me1">set</span><span class="br0">(</span><span class="st0">"innerHTML"</span><span class="sy0">,</span> <span class="st0">"<h3>Retrieving incoming links for "</span> <span class="sy0">+</span> |
|
462 Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span> <span class="sy0">+</span> <span class="st0">":</h3>"</span> <span class="sy0">+</span> |
|
463 <span class="st0">"<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' "</span> <span class="sy0">+</span> |
|
464 <span class="st0">"alt='Please wait...'>"</span><span class="br0">)</span><span class="sy0">;</span> |
|
465 |
|
466 <span class="co1">//prepare the URL for the Yahoo Site Explorer API:</span> |
|
467 <span class="kw2">var</span> sURL <span class="sy0">=</span> <span class="st0">"http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?"</span> <span class="sy0">+</span> |
|
468 <span class="st0">"appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom"</span> <span class="sy0">+</span> |
|
469 <span class="st0">"&results=20&output=json&omit_inlinks=domain"</span> <span class="sy0">+</span> |
|
470 <span class="st0">"&callback=MyNamespace.callback"</span> <span class="sy0">+</span> |
|
471 <span class="st0">"&query="</span> <span class="sy0">+</span> encodeURIComponent<span class="br0">(</span>Y.<span class="me1">one</span><span class="br0">(</span><span class="st0">"#searchString"</span><span class="br0">)</span>.<span class="me1">get</span><span class="br0">(</span><span class="st0">'value'</span><span class="br0">)</span><span class="br0">)</span><span class="sy0">;</span> |
|
472 |
|
473 <span class="co1">//This simple line is the call to the Get Utility; we pass</span> |
|
474 <span class="co1">//in the URL and the configuration object, which in this case</span> |
|
475 <span class="co1">//consists merely of our success and failure callbacks:</span> |
|
476 <span class="kw2">var</span> transactionObj <span class="sy0">=</span> Y.<span class="me1">Get</span>.<span class="me1">script</span><span class="br0">(</span>sURL<span class="sy0">,</span> <span class="br0">{</span> |
|
477 onSuccess<span class="sy0">:</span> onSiteExplorerSuccess<span class="sy0">,</span> |
|
478 onFailure<span class="sy0">:</span> onSiteExplorerFailure<span class="sy0">,</span> |
|
479 onTimeout<span class="sy0">:</span> onSiteExplorerTimeout<span class="sy0">,</span> |
|
480 timeout<span class="sy0">:</span> <span class="nu0">20000</span><span class="sy0">,</span> |
|
481 context<span class="sy0">:</span> Y |
|
482 <span class="br0">}</span><span class="br0">)</span><span class="sy0">;</span> |
|
483 |
|
484 <span class="co1">//The script method returns a single-field object containing the</span> |
|
485 <span class="co1">//tranaction id:</span> |
|
486 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Get Utility transaction started; transaction object: "</span> <span class="sy0">+</span> Y.<span class="me1">dump</span><span class="br0">(</span>transactionObj<span class="br0">)</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
487 |
|
488 <span class="co1">// keep track of the current transaction id. The transaction will be</span> |
|
489 <span class="co1">// considered complete only if the web service callback is executed.</span> |
|
490 current <span class="sy0">=</span> transactionObj.<span class="me1">tId</span><span class="sy0">;</span> |
|
491 <span class="br0">}</span><span class="sy0">;</span> |
|
492 |
|
493 MyNamespace.<span class="me1">callback</span> <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">(</span>results<span class="br0">)</span> <span class="br0">{</span> |
|
494 Y.<span class="me1">log</span><span class="br0">(</span><span class="st0">"Web service returned data to Y.example.SiteExplorer.callback; beginning to process."</span><span class="sy0">,</span> <span class="st0">"info"</span><span class="sy0">,</span> <span class="st0">"example"</span><span class="br0">)</span><span class="sy0">;</span> |
|
495 |
|
496 <span class="co1">// Mark the transaction as complete. This will be checked by the onSuccess</span> |
|
497 <span class="co1">// handler to determine if the transaction really succeeded.</span> |
|
498 tIds<span class="br0">[</span>current<span class="br0">]</span> <span class="sy0">=</span> <span class="kw2">true</span><span class="sy0">;</span> |
|
499 |
|
500 <span class="co1">//work with the returned data to extract meaningful fields:</span> |
|
501 <span class="kw2">var</span> aResults <span class="sy0">=</span> results.<span class="me1">ResultSet</span>.<span class="me1">Result</span><span class="sy0">;</span> |
|
502 <span class="kw2">var</span> totalLinks <span class="sy0">=</span> results.<span class="me1">ResultSet</span>.<span class="me1">totalResultsAvailable</span><span class="sy0">;</span> |
|
503 <span class="kw2">var</span> returnedLinkCount <span class="sy0">=</span> results.<span class="me1">ResultSet</span>.<span class="me1">totalResultsReturned</span><span class="sy0">;</span> |
|
504 |
|
505 <span class="kw1">if</span><span class="br0">(</span>aResults<span class="br0">)</span> <span class="br0">{</span><span class="co1">//there are inbound links; process and display them:</span> |
|
506 |
|
507 <span class="co1">//write header and open list of inbound links: </span> |
|
508 <span class="kw2">var</span> html <span class="sy0">=</span> <span class="st0">"<h3>There are "</span> <span class="sy0">+</span> |
|
509 totalLinks <span class="sy0">+</span> |
|
510 <span class="st0">" inbound links for this page; here are the first "</span> <span class="sy0">+</span> |
|
511 returnedLinkCount <span class="sy0">+</span> |
|
512 <span class="st0">":</h3><ol>"</span><span class="sy0">;</span> |
|
513 |
|
514 <span class="co1">//process list of inbound links:</span> |
|
515 <span class="kw1">for</span> <span class="br0">(</span><span class="kw2">var</span> i<span class="sy0">=</span><span class="nu0">0</span><span class="sy0">;</span> i <span class="sy0"><</span> aResults.<span class="me1">length</span><span class="sy0">;</span> i<span class="sy0">++</span><span class="br0">)</span> <span class="br0">{</span> |
|
516 html <span class="sy0">+=</span> <span class="st0">"<li><strong>"</span> <span class="sy0">+</span> |
|
517 aResults<span class="br0">[</span>i<span class="br0">]</span>.<span class="me1">Title</span> <span class="sy0">+</span> |
|
518 <span class="st0">":</strong> <a href='"</span> <span class="sy0">+</span> |
|
519 aResults<span class="br0">[</span>i<span class="br0">]</span>.<span class="me1">Url</span> <span class="sy0">+</span> |
|
520 <span class="st0">"'>"</span> <span class="sy0">+</span> aResults<span class="br0">[</span>i<span class="br0">]</span>.<span class="me1">Url</span> <span class="sy0">+</span> |
|
521 <span class="st0">"</a></li>"</span><span class="sy0">;</span> |
|
522 <span class="br0">}</span> |
|
523 |
|
524 <span class="co1">//close list of inbound links</span> |
|
525 html <span class="sy0">+=</span> <span class="st0">"</ol>"</span><span class="sy0">;</span> |
|
526 |
|
527 <span class="br0">}</span> <span class="kw1">else</span> <span class="br0">{</span><span class="co1">//no inbound links exist for this page:</span> |
|
528 |
|
529 <span class="kw2">var</span> html <span class="sy0">=</span> <span class="st0">"<h3>There are no inbound links for the page specified.</h3>"</span><span class="sy0">;</span> |
|
530 |
|
531 <span class="br0">}</span> |
|
532 |
|
533 <span class="co1">//insert string into DOM:</span> |
|
534 elResults.<span class="me1">set</span><span class="br0">(</span><span class="st0">'innerHTML'</span><span class="sy0">,</span> html<span class="br0">)</span><span class="sy0">;</span> |
|
535 <span class="br0">}</span><span class="sy0">;</span> |
|
536 |
|
537 <span class="co1">//suppress default form behavior</span> |
|
538 Y.<span class="me1">on</span><span class="br0">(</span><span class="st0">"submit"</span><span class="sy0">,</span> <span class="kw2">function</span><span class="br0">(</span>e<span class="br0">)</span> <span class="br0">{</span> |
|
539 e.<span class="me1">preventDefault</span><span class="br0">(</span><span class="br0">)</span><span class="sy0">;</span> |
|
540 getSiteExplorerData<span class="br0">(</span><span class="br0">)</span><span class="sy0">;</span> |
|
541 <span class="br0">}</span><span class="sy0">,</span> <span class="st0">"#siteExplorer"</span><span class="br0">)</span><span class="sy0">;</span> |
|
542 </pre></div><textarea id="syntax3-plain">// We are going to create a global variable to get the |
|
543 // data back from the web service |
|
544 MyNamespace = YUI.namespace('example.SiteExplorer'); |
|
545 |
|
546 var elResults = Y.one("#results"), |
|
547 tIds = {}, |
|
548 loading = false, |
|
549 current = null; |
|
550 |
|
551 // We use the Get Utility's success handler in conjunction with |
|
552 // the web service callback in order to detect bad responses |
|
553 // from the web service. |
|
554 var onSiteExplorerSuccess = function(o) { |
|
555 |
|
556 // stop blocking requests |
|
557 loading = false; |
|
558 |
|
559 // A success response means the script node is inserted. However, the |
|
560 // utility is unable to detect whether or not the content of the script |
|
561 // node is correct, or even if there was a bad response (like a 404 |
|
562 // error). To get around this, we use the web service callback to |
|
563 // verify that the script contents was correct. |
|
564 if (o.tId in tIds) { |
|
565 Y.log("The Get Utility has fired the success handler indicating that the " + |
|
566 "requested script has loaded and is ready for use.", "info", "example"); |
|
567 } else { |
|
568 Y.log("The Get utility has fired onSuccess but the webservice callback did not " + |
|
569 "fire. We could retry the transaction here, or notify the user of the " + |
|
570 "failure.", "info", "example"); |
|
571 } |
|
572 |
|
573 }; |
|
574 |
|
575 var onSiteExplorerFailure = function(o) { |
|
576 Y.log("The Get Utility failed.", "info", "example"); |
|
577 }; |
|
578 |
|
579 var onSiteExplorerTimeout = function(o) { |
|
580 Y.log("The Get Utility timed out.", "info", "example"); |
|
581 }; |
|
582 |
|
583 //function to retrieve data from Yahoo! Site Explorer web service -- |
|
584 // http://developer.yahoo.com/search/siteexplorer/V1/inlinkData.html |
|
585 var getSiteExplorerData = function() { |
|
586 Y.log("Button clicked; getSiteExplorerData firing.", "info", "example"); |
|
587 |
|
588 // block multiple requests |
|
589 if (loading) { |
|
590 return; |
|
591 } |
|
592 loading = true; |
|
593 |
|
594 //Load the transitional state of the results section: |
|
595 elResults.set("innerHTML", "<h3>Retrieving incoming links for " + |
|
596 Y.one("#searchString").get('value') + ":</h3>" + |
|
597 "<img src='http://l.yimg.com/a/i/nt/ic/ut/bsc/busybar_1.gif' " + |
|
598 "alt='Please wait...'>"); |
|
599 |
|
600 //prepare the URL for the Yahoo Site Explorer API: |
|
601 var sURL = "http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?" + |
|
602 "appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom" + |
|
603 "&results=20&output=json&omit_inlinks=domain" + |
|
604 "&callback=MyNamespace.callback" + |
|
605 "&query=" + encodeURIComponent(Y.one("#searchString").get('value')); |
|
606 |
|
607 //This simple line is the call to the Get Utility; we pass |
|
608 //in the URL and the configuration object, which in this case |
|
609 //consists merely of our success and failure callbacks: |
|
610 var transactionObj = Y.Get.script(sURL, { |
|
611 onSuccess: onSiteExplorerSuccess, |
|
612 onFailure: onSiteExplorerFailure, |
|
613 onTimeout: onSiteExplorerTimeout, |
|
614 timeout: 20000, |
|
615 context: Y |
|
616 }); |
|
617 |
|
618 //The script method returns a single-field object containing the |
|
619 //tranaction id: |
|
620 Y.log("Get Utility transaction started; transaction object: " + Y.dump(transactionObj), "info", "example"); |
|
621 |
|
622 // keep track of the current transaction id. The transaction will be |
|
623 // considered complete only if the web service callback is executed. |
|
624 current = transactionObj.tId; |
|
625 }; |
|
626 |
|
627 MyNamespace.callback = function(results) { |
|
628 Y.log("Web service returned data to Y.example.SiteExplorer.callback; beginning to process.", "info", "example"); |
|
629 |
|
630 // Mark the transaction as complete. This will be checked by the onSuccess |
|
631 // handler to determine if the transaction really succeeded. |
|
632 tIds[current] = true; |
|
633 |
|
634 //work with the returned data to extract meaningful fields: |
|
635 var aResults = results.ResultSet.Result; |
|
636 var totalLinks = results.ResultSet.totalResultsAvailable; |
|
637 var returnedLinkCount = results.ResultSet.totalResultsReturned; |
|
638 |
|
639 if(aResults) {//there are inbound links; process and display them: |
|
640 |
|
641 //write header and open list of inbound links: |
|
642 var html = "<h3>There are " + |
|
643 totalLinks + |
|
644 " inbound links for this page; here are the first " + |
|
645 returnedLinkCount + |
|
646 ":</h3><ol>"; |
|
647 |
|
648 //process list of inbound links: |
|
649 for (var i=0; i < aResults.length; i++) { |
|
650 html += "<li><strong>" + |
|
651 aResults[i].Title + |
|
652 ":</strong> <a href='" + |
|
653 aResults[i].Url + |
|
654 "'>" + aResults[i].Url + |
|
655 "</a></li>"; |
|
656 } |
|
657 |
|
658 //close list of inbound links |
|
659 html += "</ol>"; |
|
660 |
|
661 } else {//no inbound links exist for this page: |
|
662 |
|
663 var html = "<h3>There are no inbound links for the page specified.</h3>"; |
|
664 |
|
665 } |
|
666 |
|
667 //insert string into DOM: |
|
668 elResults.set('innerHTML', html); |
|
669 }; |
|
670 |
|
671 //suppress default form behavior |
|
672 Y.on("submit", function(e) { |
|
673 e.preventDefault(); |
|
674 getSiteExplorerData(); |
|
675 }, "#siteExplorer"); |
|
676 </textarea></div> </div> |
|
677 <div class="yui-u sidebar"> |
|
678 |
|
679 |
|
680 <div id="examples" class="mod box4"> |
|
681 <div class="hd"> |
|
682 <h4> |
|
683 Get Examples:</h4> |
|
684 </div> |
|
685 <div class="bd"> |
|
686 <ul> |
|
687 <li class='selected'><a href='../get/get-script-basic.html'>Getting a Script Node with JSON Data</a></li> </ul> |
|
688 </div> |
|
689 </div> |
|
690 |
|
691 <div class="mod box4"> |
|
692 <div class="hd"> |
|
693 <h4>More Get Resources:</h4> |
|
694 </div> |
|
695 <div class="bd"> |
|
696 <ul> |
|
697 <!-- <li><a href="http://developer.yahoo.com/yui/get/">User's Guide</a> (external)</li> --> |
|
698 <li><a href="../../api/Get.html">API Documentation</a></li></ul> |
|
699 </div> |
|
700 </div> |
|
701 </div> |
|
702 </div> |
|
703 |
|
704 </div> |
|
705 </div> |
|
706 |
|
707 |
|
708 <div class="yui-b toc3" id="tocWrapper"> |
|
709 <!-- TABLE OF CONTENTS --> |
|
710 <div id="toc"> |
|
711 |
|
712 <ul> |
|
713 <li class="sect first">YUI 3 Resources</li><li class="item"><a title="YUI 3 -- Yahoo! User Interface (YUI) Library" href="http://developer.yahoo.com/yui/3/">YUI 3 Web Site</a></li><li class="item"><a title="Examples of every YUI utility and control in action" href="../../examples/">YUI 3 Examples</a></li><li class="item"><a title="Instantly searchable API documentation for the entire YUI library." href="../../api/">YUI 3 API Docs</a></li><li class="item"><a title="YUI 3 Dependency Configurator -- configure your custom YUI implementation" href="http://developer.yahoo.com/yui/3/configurator">YUI 3 Dependency Configurator</a></li><li class="item"><a title="The YUI 3 Forum on YUILibrary.com" href="http://yuilibrary.com/forum/viewforum.php?f=15">YUI 3 Forums (external)</a></li><li class="item"><a title="Found a bug or a missing feature? Let us know on YUILibrary.com." href="http://developer.yahoo.com/yui/articles/reportingbugs/">Bug Reports/Feature Requests</a></li><li class="item"><a title="YUI is free and open, offered under a BSD license." href="http://developer.yahoo.com/yui/license.html">YUI License</a></li><li class="item"><a title="Download and fork the YUI project on GitHub" href="http://github.com/yui">YUI on Github</a></li><li class="item"><a title="The Yahoo! User Interface Blog" href="http://yuiblog.com">YUI Blog (external)</a></li><li class="sect">YUI 3 Core - Examples</li><li class="item"><a title="YUI Global Object - Functional Examples" href="../../examples/yui/index.html">YUI Global Object</a></li><li class="item"><a title="Event - Functional Examples" href="../../examples/event/index.html">Event</a></li><li class="item"><a title="Node - Functional Examples" href="../../examples/node/index.html">Node</a></li><li class="sect">YUI 3 Component Infrastructure - Examples</li><li class="item"><a title="Attribute - Functional Examples" href="../../examples/attribute/index.html">Attribute</a></li><li class="item"><a title="Plugin - Functional Examples" href="../../examples/plugin/index.html">Plugin <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="Widget - Functional Examples" href="../../examples/widget/index.html">Widget <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="sect">YUI 3 Utilities - Examples</li><li class="item"><a title="Animation - Functional Examples" href="../../examples/anim/index.html">Animation</a></li><li class="item"><a title="AsyncQueue - Functional Examples" href="../../examples/async-queue/index.html">AsyncQueue</a></li><li class="item"><a title="Browser History - Functional Examples" href="../../examples/history/index.html">Browser History</a></li><li class="item"><a title="Cache - Functional Examples" href="../../examples/cache/index.html">Cache</a></li><li class="item"><a title="Cookie - Functional Examples" href="../../examples/cookie/index.html">Cookie</a></li><li class="item"><a title="DataSchema - Functional Examples" href="../../examples/dataschema/index.html">DataSchema <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="DataSource - Functional Examples" href="../../examples/datasource/index.html">DataSource <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="DataType - Functional Examples" href="../../examples/datatype/index.html">DataType <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="Drag & Drop - Functional Examples" href="../../examples/dd/index.html">Drag & Drop</a></li><li class="selected "><a title="Get - Functional Examples" href="../../examples/get/index.html">Get</a></li><li class="item"><a title="ImageLoader - Functional Examples" href="../../examples/imageloader/index.html">ImageLoader</a></li><li class="item"><a title="IO - Functional Examples" href="../../examples/io/index.html">IO</a></li><li class="item"><a title="JSON (JavaScript Object Notation) - Functional Examples" href="../../examples/json/index.html">JSON</a></li><li class="item"><a title="Stylesheet - Functional Examples" href="../../examples/stylesheet/index.html">Stylesheet</a></li><li class="sect">YUI 3 Widgets - Examples</li><li class="item"><a title="Overlay - Functional Examples" href="../../examples/overlay/index.html">Overlay <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="Slider - Functional Examples" href="../../examples/slider/index.html">Slider <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="sect">YUI 3 Node Plugins - Examples</li><li class="item"><a title="FocusManager Node Plugin - Functional Examples" href="../../examples/node-focusmanager/index.html">FocusManager Node Plugin <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="MenuNav Node Plugin - Functional Examples" href="../../examples/node-menunav/index.html">MenuNav Node Plugin <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="sect">YUI 3 CSS - Examples</li><li class="item"><a title="YUI CSS Reset - Functional Examples" href="../../examples/cssreset/index.html">CSS Reset</a></li><li class="item"><a title="YUI Fonts - Functional Examples" href="../../examples/cssfonts/index.html">CSS Fonts</a></li><li class="item"><a title="YUI Base - Functional Examples" href="../../examples/cssbase/index.html">CSS Base</a></li><li class="sect">YUI 3 Developer Tools - Examples</li><li class="item"><a title="Console - Functional Examples" href="../../examples/console/index.html">Console <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="Console Filters Plugin- Functional Examples" href="../../examples/console-filters/index.html">Plugin.ConsoleFilters <img src='http://l.yimg.com/a/i/not/beta_1.gif'></a></li><li class="item"><a title="Profiler - Functional Examples" href="../../examples/profiler/index.html">Profiler</a></li><li class="item"><a title="Test - Functional Examples" href="../../examples/test/index.html">Test</a></li><li class="sect">Other Useful YUI 3 Resources</li><li class="item"><a title="Answers to Frequently Asked Questions about the YUI Library" href="http://developer.yahoo.com/yui/articles/faq/">YUI FAQ (external)</a></li><li class="item"><a title="Yahoo!'s philosophy of Graded Browser Support" href="http://developer.yahoo.com/yui/articles/gbs/">Graded Browser Support (external)</a></li><li class="item"><a title="Videos and podcasts from the YUI Team and from the Yahoo! frontend engineering community." href="http://developer.yahoo.com/yui/theater/">YUI Theater (external)</a></li></ul> |
|
714 </div> |
|
715 </div> |
|
716 </div><!--closes bd--> |
|
717 |
|
718 <div id="ft"> |
|
719 <p class="first">Copyright © 2009 Yahoo! Inc. All rights reserved.</p> |
|
720 <p><a href="http://privacy.yahoo.com/privacy/us/devel/index.html">Privacy Policy</a> - |
|
721 <a href="http://docs.yahoo.com/info/terms/">Terms of Service</a> - |
|
722 <a href="http://docs.yahoo.com/info/copyright/copyright.html">Copyright Policy</a> - |
|
723 <a href="http://careers.yahoo.com/">Job Openings</a></p> |
|
724 </div> |
|
725 </div> |
|
726 <script language="javascript"> |
|
727 var yuiConfig = {base:"../../build/", timeout: 10000, filter:"debug", logInclude: {get:true, event:true, example:true}}; |
|
728 </script> |
|
729 <script src="../../assets/syntax.js"></script> |
|
730 <script src="../../assets/dpSyntaxHighlighter.js"></script> |
|
731 <script language="javascript"> |
|
732 dp.SyntaxHighlighter.HighlightAll('code'); |
|
733 </script> |
|
734 </body> |
|
735 </html> |