~ubuntu-branches/ubuntu/raring/maas/raring-updates

« back to all changes in this revision

Viewing changes to src/maasserver/static/jslibs/yui/3.4.1/docs/datasource/datasource-io.html

  • Committer: Package Import Robot
  • Author(s): Andres Rodriguez
  • Date: 2012-07-03 17:42:37 UTC
  • mfrom: (1.1.13)
  • Revision ID: package-import@ubuntu.com-20120703174237-p8l0keuuznfg721k
Tags: 0.1+bzr709+dfsg-0ubuntu1
* New Upstream release
* debian/control:
  - Depends on python-celery, python-tempita, libjs-yui3-{full,min},
    libjs-raphael
* debian/maas.install:
  - Install apiclient, celeryconfig.py, maas-import-pxe-files, preseeds_v2.
  - Update to install various files from chroot, rather tha manually copy
    them from the source.
* debian/maas.links: symlink celeryconfig.py
* debian/maas.maas-celery.upstart: Add job.
* debian/rules:
  - Install celery upstart job.
  - Do not install jslibs as packages are now used.
  - Drop copying of maas_local_settings_sample.py as source now ships
    a maas_local_settings.py
* debian/patches:
  - 04-maas-http-fix.patch: Drop. Merged upstream.
  - 01-fix-database-settings.patch: Refreshed.
  - 99_enums_js.patch: Added until creation of enum.js / build process
    is fixed.
* debian/maas.postinst: Update bzr version to correctly handle upgrades.

Show diffs side-by-side

added added

removed removed

Lines of Context:
1
 
<!DOCTYPE html>
2
 
<html lang="en">
3
 
<head>
4
 
    <meta charset="utf-8">
5
 
    <title>Example: DataSource.IO</title>
6
 
    <link rel="stylesheet" href="http://yui.yahooapis.com/3.4.0pr3/build/cssgrids/grids-min.css">
7
 
    <link rel="stylesheet" href="../assets/css/main.css">
8
 
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
9
 
    <script src="../../build/yui/yui-min.js"></script>
10
 
</head>
11
 
<body>
12
 
 
13
 
<div id="doc">
14
 
    <h1>Example: DataSource.IO</h1>
15
 
 
16
 
    
17
 
 
18
 
    <div class="yui3-g">
19
 
        <div id="main" class="yui3-u">
20
 
            <div class="content"><div class="intro">
21
 
    <p>Accessing data from a server is easy with DataSource.IO, which uses the IO Utility to retrieve data over HTTP. A <a href="../dataschema/">DataSchema</a> plugin is used to normalize incoming data into a known format for consistency of usage by other components.</p>
22
 
</div>
23
 
 
24
 
<div class="example yui3-skin-sam">
25
 
<style scoped>
26
 
/* custom styles for this example */
27
 
#demo .output {margin-bottom:1em; padding:10px; border:1px solid #D9D9D9;}
28
 
</style>
29
 
 
30
 
<form id="demo">
31
 
    <h4>JSON</h4>
32
 
    <h6>Data</h6>
33
 
    <pre>
34
 
{
35
 
    "ResultSet": {
36
 
        "type":"web",
37
 
        "totalResultsAvailable":391000000,
38
 
        "totalResultsReturned":10,
39
 
        "firstResultPosition":1,
40
 
        ...
41
 
        "Result":[
42
 
            {"Title":"Madonna","Summary":"Official site of pop diva
43
 
                Madonna, with news, music, media, and fan club.",
44
 
                "Url":"http:\/\/www.madonna.com\/", ...,
45
 
                "Size":"145030"}},
46
 
            {"Title":"Madonna - MySpace","Summary":"Madonna MySpace
47
 
                page features news, blog, music downloads, desktops,
48
 
                wallpapers, and more.",
49
 
                "Url":"http:\/\/www.myspace.com\/madonna",
50
 
                ..., "Size":"110365"}},
51
 
            {"Title":"YouTube - madonna's Channel",
52
 
                "Summary":"The Official Madonna YouTube Channel.
53
 
                Want to Subscribe? ... http:\/\/www.youtube.com\/Madonna.
54
 
                Sharing Options There are 3 ways to share this channel.",
55
 
                "Url":"http:\/\/youtube.com\/madonna", ...,
56
 
                "Size":"49955"}},
57
 
            ...
58
 
        ]
59
 
    }
60
 
}
61
 
    </pre>
62
 
 
63
 
    <h6>Schema</h6>
64
 
    <pre>
65
 
{
66
 
    resultListLocator: "ResultSet.Result",
67
 
    resultFields: ["Title"]
68
 
}
69
 
    </pre>
70
 
 
71
 
    <h6>Normalized data</h6>
72
 
    <input type="button" id="demo_json" value="Retrieve data">
73
 
    <div id="demo_output_json" class="output"></div>
74
 
 
75
 
    <h4>XML</h4>
76
 
    <h6>Data</h6>
77
 
    <pre>
78
 
&lt;query xmlns:yahoo="http://www.yahooapis.com/v1/base.rng"
79
 
    yahoo:count="10" ...&gt;
80
 
    &lt;diagnostics&gt;
81
 
        ...
82
 
    &lt;/diagnostics&gt;
83
 
    &lt;results&gt;
84
 
        &lt;result xmlns="http://www.inktomi.com/"&gt;
85
 
            ...
86
 
            &lt;dispurl&gt
87
 
                &lt;![CDATA[www.&lt;b&gt;madonna.com&lt;/b&gt;]]&gt;
88
 
            &lt;/dispurl&gt;
89
 
            &lt;size&gt;144947&lt;/size&gt;
90
 
            &lt;title&gt;
91
 
                &lt;![CDATA[&lt;b&gt;madonna&lt;/b&gt;.com home]]&gt;
92
 
            &lt;/title&gt;
93
 
            &lt;url&gt;http://www.madonna.com/&lt;/url&gt;
94
 
        &lt;/result&gt;
95
 
        &lt;result xmlns="http://www.inktomi.com/"&gt;
96
 
            ...
97
 
            &lt;dispurl&gt;
98
 
                &lt;![CDATA[&lt;b&gt;en.wikipedia.org&lt;/b&gt;/wiki/&lt;wbr&gt;
99
 
                &lt;b&gt;Madonna&lt;/b&gt;_(entertainer)]]&gt;
100
 
            &lt;/dispurl&gt;
101
 
            &lt;size&gt;450316&lt;/size&gt;
102
 
            &lt;title&gt;
103
 
                &lt;![CDATA[&lt;b&gt;Madonna&lt;/b&gt; (Entertainer) - Wikipedia]]&gt;
104
 
            &lt;/title&gt;
105
 
            &lt;url&gt;http://en.wikipedia.org/wiki/Madonna_(entertainer)&lt;/url&gt;
106
 
        &lt;/result&gt;
107
 
        &lt;result xmlns="http://www.inktomi.com/"&gt;
108
 
            ...
109
 
            &lt;dispurl&gt;
110
 
                &lt;![CDATA[www.&lt;b&gt;myspace.com&lt;/b&gt;/&lt;b&gt;madonna&lt;/b&gt;]]&gt;
111
 
            &lt;/dispurl&gt;
112
 
            &lt;size&gt;110851&lt;/size&gt;
113
 
            &lt;title&gt;
114
 
                &lt;![CDATA[&lt;b&gt;Madonna&lt;/b&gt; - MySpace]]&gt;
115
 
            &lt;/title&gt;
116
 
            &lt;url&gt;http://www.myspace.com/madonna&lt;/url&gt;
117
 
        &lt;/result&gt;
118
 
        ...
119
 
    &lt;/results&gt;
120
 
&lt;/query&gt;
121
 
</pre>
122
 
 
123
 
    <h6>Schema</h6>
124
 
    <pre>
125
 
{
126
 
    resultListLocator: "result",
127
 
    resultFields: [{key:"title", locator:"*[local-name() ='title']"}]
128
 
}
129
 
    </pre>
130
 
 
131
 
    <h6>Normalized data</h6>
132
 
    <input type="button" id="demo_xml" value="Retrieve data">
133
 
    <div id="demo_output_xml" class="output"></div>
134
 
</form>
135
 
 
136
 
<script type="text/javascript">
137
 
YUI().use("dump", "node", "datasource-io", "datasource-jsonschema", "datasource-xmlschema", function (Y) {
138
 
    var myDataSourceJSON = new Y.DataSource.IO({source:"../assets/datasource/ysearch.json"}),
139
 
        myCallbackJSON = {
140
 
            success: function(e){
141
 
                Y.one("#demo_output_json").setContent(Y.dump(e.response));
142
 
            },
143
 
            failure: function(e){
144
 
                Y.one("#demo_output_json").setContent("Could not retrieve data: " + e.error.message);
145
 
            }
146
 
        };
147
 
 
148
 
    myDataSourceJSON.plug(Y.Plugin.DataSourceJSONSchema, {
149
 
        schema: {
150
 
            resultListLocator: "ResultSet.Result",
151
 
            resultFields: ["Title"]
152
 
        }
153
 
    });
154
 
 
155
 
    Y.on("click", function(e){
156
 
        myDataSourceJSON.sendRequest({
157
 
            request:"?output=json",
158
 
            callback:myCallbackJSON
159
 
        });
160
 
    }, "#demo_json");
161
 
 
162
 
    var myDataSourceXML = new Y.DataSource.IO({source:"../assets/datasource/ysearch.xml"}),
163
 
        myCallbackXML = {
164
 
            success: function(e){
165
 
                Y.one("#demo_output_xml").setContent(Y.dump(e.response).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;"));
166
 
            },
167
 
            failure: function(e){
168
 
                Y.one("#demo_output_xml").setContent("Could not retrieve data: " + e.error.message);
169
 
            }
170
 
        };
171
 
 
172
 
    myDataSourceXML.plug(Y.Plugin.DataSourceXMLSchema, {
173
 
        schema: {
174
 
            resultListLocator: "result",
175
 
            resultFields: [{key:"title", locator:"*[local-name() ='title']"}]
176
 
        }
177
 
    });
178
 
 
179
 
    Y.on("click", function(e){
180
 
        myDataSourceXML.sendRequest({
181
 
            request:"?output=xml",
182
 
            callback:myCallbackXML
183
 
        });
184
 
    }, "#demo_xml");
185
 
});
186
 
</script>
187
 
 
188
 
</div>
189
 
 
190
 
<p>If your server returns JSON data, use a DataSourceJSONSchema plugin to parse the data against a schema that you provide:</p>
191
 
 
192
 
<pre class="code prettyprint">YUI().use(&quot;datasource-io&quot;, &quot;datasource-jsonschema&quot;, function(Y) {
193
 
    var myDataSource = new Y.DataSource.IO({source:&quot;ysearch_json_madonna.php&quot;}),
194
 
        myCallback = {
195
 
            success: function(e){
196
 
                alert(e.response);
197
 
            },
198
 
            failure: function(e){
199
 
                alert(&quot;Could not retrieve data: &quot; + e.error.message);
200
 
            }
201
 
        };
202
 
 
203
 
    myDataSource.plug(Y.Plugin.DataSourceJSONSchema, {
204
 
        schema: {
205
 
            resultListLocator: &quot;ResultSet.Result&quot;,
206
 
            resultFields: [&quot;Title&quot;]
207
 
        }
208
 
    });
209
 
    
210
 
    &#x2F;&#x2F; This request string will get appended to the URI
211
 
    myDataSource.sendRequest({
212
 
        request:&quot;?output=json&quot;,
213
 
        callback:myCallback
214
 
    });
215
 
});</pre>
216
 
 
217
 
 
218
 
<p>On the other hand, a DataSourceXMLSchema plugin can be used to parse XML data coming from your server:</p>
219
 
 
220
 
<pre class="code prettyprint">YUI().use(&quot;datasource-io&quot;, &quot;datasource-xmlschema&quot;, function(Y) {
221
 
    var myDataSource = new Y.DataSource.IO({source:&quot;ysearch_xml_madonna.php&quot;}),
222
 
        myCallback = {
223
 
            success: function(e){
224
 
                alert(e.response);
225
 
            },
226
 
            failure: function(e){
227
 
                alert(&quot;Could not retrieve data: &quot; + e.error.message);
228
 
            }
229
 
        };
230
 
 
231
 
    myDataSource.plug(Y.Plugin.DataSourceXMLSchema, {
232
 
        schema: {
233
 
            resultListLocator: &quot;result&quot;,
234
 
            resultFields: [{key:&quot;title&quot;, locator:&quot;*[local-name() =&#x27;title&#x27;]&quot;}]
235
 
        }
236
 
    });
237
 
 
238
 
    myDataSource.sendRequest({
239
 
        request:&quot;?output=xml&quot;,
240
 
        callback:myCallback
241
 
    });
242
 
});</pre>
243
 
 
244
 
</div>
245
 
        </div>
246
 
 
247
 
        <div id="sidebar" class="yui3-u">
248
 
            
249
 
 
250
 
            
251
 
                <div class="sidebox">
252
 
                    <div class="hd">
253
 
                        <h2 class="no-toc">Examples</h2>
254
 
                    </div>
255
 
 
256
 
                    <div class="bd">
257
 
                        <ul class="examples">
258
 
                            
259
 
                                
260
 
                                    <li data-description="The Local DataSource manages retrieval of in-page data, from JavaScript arrays and objects to DOM elements.">
261
 
                                        <a href="datasource-local.html">DataSource.Local</a>
262
 
                                    </li>
263
 
                                
264
 
                            
265
 
                                
266
 
                                    <li data-description="The Get DataSource, which manages retrieval of data from remote sources via the Get Utility, can be useful for accessing data from cross-domain servers without the need for a proxy.">
267
 
                                        <a href="datasource-get.html">DataSource.Get</a>
268
 
                                    </li>
269
 
                                
270
 
                            
271
 
                                
272
 
                                    <li data-description="The IO DataSource manages retrieval of data from remote sources, via the IO Utility.">
273
 
                                        <a href="datasource-io.html">DataSource.IO</a>
274
 
                                    </li>
275
 
                                
276
 
                            
277
 
                                
278
 
                                    <li data-description="The Function DataSource, which manages retrieval of data from a JavaScript function, provides a highly customizeable mechanism for implementer-defined data retrieval algorithms">
279
 
                                        <a href="datasource-function.html">DataSource.Function</a>
280
 
                                    </li>
281
 
                                
282
 
                            
283
 
                                
284
 
                                    <li data-description="Use the DataSourceCache plugin to enable caching and reduce server calls to remote sources.">
285
 
                                        <a href="datasource-caching.html">DataSource with Caching</a>
286
 
                                    </li>
287
 
                                
288
 
                            
289
 
                                
290
 
                                    <li data-description="The DataSourceCache plugin supports offline caching so that cached data persists across browser sessions.">
291
 
                                        <a href="datasource-offlinecache.html">DataSource with Offline Cache</a>
292
 
                                    </li>
293
 
                                
294
 
                            
295
 
                                
296
 
                                    <li data-description="Use the Pollable extension to enable polling in your DataSource.">
297
 
                                        <a href="datasource-polling.html">DataSource with Polling</a>
298
 
                                    </li>
299
 
                                
300
 
                            
301
 
                                
302
 
                            
303
 
                        </ul>
304
 
                    </div>
305
 
                </div>
306
 
            
307
 
 
308
 
            
309
 
                <div class="sidebox">
310
 
                    <div class="hd">
311
 
                        <h2 class="no-toc">Examples That Use This Component</h2>
312
 
                    </div>
313
 
 
314
 
                    <div class="bd">
315
 
                        <ul class="examples">
316
 
                            
317
 
                                
318
 
                            
319
 
                                
320
 
                            
321
 
                                
322
 
                            
323
 
                                
324
 
                            
325
 
                                
326
 
                            
327
 
                                
328
 
                            
329
 
                                
330
 
                            
331
 
                                
332
 
                                    <li data-description="How to provide autocomplete suggestions using a DataSource instance.">
333
 
                                        <a href="../autocomplete/ac-datasource.html">Remote Data via DataSource</a>
334
 
                                    </li>
335
 
                                
336
 
                            
337
 
                        </ul>
338
 
                    </div>
339
 
                </div>
340
 
            
341
 
        </div>
342
 
    </div>
343
 
</div>
344
 
 
345
 
<script src="../assets/vendor/prettify/prettify-min.js"></script>
346
 
<script>prettyPrint();</script>
347
 
 
348
 
</body>
349
 
</html>