← Back to branch summary

~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/yui/yui-merge.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:
src/maasserver/static/jslibs/yui/3.4.1/docs/yui/yui-merge.html
1
 
<!DOCTYPE html>
2
 
<html lang="en">
3
 
<head>
4
 
    <meta charset="utf-8">
5
 
    <title>Example: Combine Data Sets with &#x60;merge&#x60;</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: Combine Data Sets with &#x60;merge&#x60;</h1>
15
 
 
16
 
    
17
 
        <a href="#toc" class="jump">Jump to Table of Contents</a>
18
 
    
19
 
 
20
 
    <div class="yui3-g">
21
 
        <div id="main" class="yui3-u">
22
 
            <div class="content"><div class="intro">
23
 
<p>Combine data sets and create shallow copies of objects with <code>merge</code></p>
24
 
</div>
25
 
 
26
 
<div class="example">
27
 
    <style type="text/css">
28
 
    #demo pre {
29
 
        font-size: .9em;
30
 
        padding: 1em;
31
 
        background-color: #fff;
32
 
        margin: 1ex;
33
 
    }
34
 
    #demo #demo_result {
35
 
        padding: 1em;
36
 
    }
37
 
 
38
 
    #demo h3 {
39
 
        margin: 1em 0 0 1ex;
40
 
    }
41
 
</style>
42
 
 
43
 
<div id="demo">
44
 
<pre>set1 = { foo : "foo" };</pre>
45
 
<pre>set2 = { foo : "BAR", bar : "bar"  };</pre>
46
 
<pre>set3 = { foo : "FOO", baz : "BAZ" };</pre>
47
 
 
48
 
<input type="button" name="demo_btn1" id="demo_btn1" value="Merge"/>
49
 
<input type="button" name="demo_btn2" id="demo_btn2" value="Copy"/>
50
 
<h3 id="result">Result</h3>
51
 
<div id="demo_result" class="intro">click Merge or Copy</div>
52
 
<script type="text/javascript">
53
 
 
54
 
YUI().use('node', 'dump', function(Y) {
55
 
 
56
 
        var set1 = { foo : "foo" };
57
 
    var set2 = { foo : "BAR", bar : "bar" };
58
 
    var set3 = { foo : "FOO", baz : "BAZ" };
59
 
    var result = Y.one('#demo_result');
60
 
 
61
 
    var doMerge = function () {
62
 
 
63
 
        Y.log('set1 = ' + Y.dump(set1));
64
 
        Y.log('set2 = ' + Y.dump(set2));
65
 
        Y.log('set3 = ' + Y.dump(set3));
66
 
 
67
 
        Y.log('Merging set1, set2, and set3');
68
 
        var merged = Y.merge(set1, set2, set3);
69
 
        Y.log('merged = ' + Y.dump(merged));
70
 
 
71
 
        result.setContent(Y.dump(merged));
72
 
    };
73
 
 
74
 
    Y.on('click', doMerge, '#demo_btn1');
75
 
 
76
 
 
77
 
        var doCopy = function () {
78
 
 
79
 
        // Create set4 with an object property 'obj'
80
 
        var set4 = {
81
 
            obj: {}
82
 
        };
83
 
 
84
 
        // Create a shallow copy of set4
85
 
        var copy = Y.merge(set4);
86
 
 
87
 
        // Add a property to the copy inside of the 'obj' property
88
 
        copy.obj.addedToCopy = true;
89
 
 
90
 
        Y.log('After modifying the copy: ');
91
 
 
92
 
        // The result object is not the same as the original, but
93
 
        var msg = ('"copy" should NOT be equal to the "original" (false expected): ' + (copy === set4));
94
 
 
95
 
        // objects in the result object will reference the same object in
96
 
        // the input object.
97
 
        msg += '<br><br>copy.obj.addedToCopy should be equal to original.obj.addedToCopy (true expected): ' + 
98
 
                (copy.obj.addedToCopy === set4.obj.addedToCopy);
99
 
 
100
 
        Y.log(msg);
101
 
        result.setContent(msg);
102
 
    };
103
 
 
104
 
    Y.on('click', doCopy, '#demo_btn2');
105
 
 
106
 
 
107
 
 
108
 
});
109
 
 
110
 
 
111
 
</script>
112
 
</div>
113
 
 
114
 
 
115
 
</div>
116
 
 
117
 
 
118
 
<h3 id="using-merge">Using <code>merge</code></h3>
119
 
 
120
 
<pre class="code prettyprint">YUI().use(&#x27;node&#x27;, &#x27;dump&#x27;, function(Y) {
121
 
    &#x2F;&#x2F; This method is in the core of the library, so we don&#x27;t have to use() any
122
 
    &#x2F;&#x2F; additional modules to access it.  However, this example requires &#x27;node&#x27; and &#x27;dump&#x27;.</pre>
123
 
 
124
 
 
125
 
<h3 id="merging-hash-tables">Merging hash tables</h3>
126
 
<p>When the "Merge" button is clicked, we merge three object literals in the form
127
 
of hash tables.  Note the key values in later parameters override those in
128
 
previous parameters.</p>
129
 
 
130
 
<pre class="code prettyprint">var set1 = { foo : &quot;foo&quot; };
131
 
var set2 = { foo : &quot;BAR&quot;, bar : &quot;bar&quot; };
132
 
var set3 = { foo : &quot;FOO&quot;, baz : &quot;BAZ&quot; };
133
 
var result = Y.one(&#x27;#demo_result&#x27;);
134
 
 
135
 
var doMerge = function () {
136
 
 
137
 
    Y.log(&#x27;set1 = &#x27; + Y.dump(set1));
138
 
    Y.log(&#x27;set2 = &#x27; + Y.dump(set2));
139
 
    Y.log(&#x27;set3 = &#x27; + Y.dump(set3));
140
 
 
141
 
    Y.log(&#x27;Merging set1, set2, and set3&#x27;);
142
 
    var merged = Y.merge(set1, set2, set3);
143
 
    Y.log(&#x27;merged = &#x27; + Y.dump(merged));
144
 
 
145
 
    result.setContent(Y.dump(merged));
146
 
};
147
 
 
148
 
Y.on(&#x27;click&#x27;, doMerge, &#x27;#demo_btn1&#x27;);</pre>
149
 
 
150
 
 
151
 
<h3 id="creating-shallow-copies">Creating Shallow Copies</h3>
152
 
<p>When the "Copy" button is clicked, we create use merge on a single
153
 
object in order to create a shallow clone.  The code illustrates the
154
 
fact that object properties of the result object are shared with
155
 
the input object.</p>
156
 
 
157
 
<pre class="code prettyprint">var doCopy = function () {
158
 
 
159
 
    &#x2F;&#x2F; Create set4 with an object property &#x27;obj&#x27;
160
 
    var set4 = {
161
 
        obj: {}
162
 
    };
163
 
 
164
 
    &#x2F;&#x2F; Create a shallow copy of set4
165
 
    var copy = Y.merge(set4);
166
 
 
167
 
    &#x2F;&#x2F; Add a property to the copy inside of the &#x27;obj&#x27; property
168
 
    copy.obj.addedToCopy = true;
169
 
 
170
 
    Y.log(&#x27;After modifying the copy: &#x27;);
171
 
 
172
 
    &#x2F;&#x2F; The result object is not the same as the original, but
173
 
    var msg = (&#x27;&quot;copy&quot; should NOT be equal to the &quot;original&quot; (false expected): &#x27; + (copy === set4));
174
 
 
175
 
    &#x2F;&#x2F; objects in the result object will reference the same object in
176
 
    &#x2F;&#x2F; the input object.
177
 
    msg += &#x27;&lt;br&gt;&lt;br&gt;copy.obj.addedToCopy should be equal to original.obj.addedToCopy (true expected): &#x27; + 
178
 
            (copy.obj.addedToCopy === set4.obj.addedToCopy);
179
 
 
180
 
    Y.log(msg);
181
 
    result.setContent(msg);
182
 
};
183
 
 
184
 
Y.on(&#x27;click&#x27;, doCopy, &#x27;#demo_btn2&#x27;);</pre>
185
 
 
186
 
 
187
 
<p>See the <code>clone</code> method to create deep copies of objects.</p>
188
 
 
189
 
<h3 id="full-javascript-source">Full Javascript Source</h3>
190
 
 
191
 
<pre class="code prettyprint">YUI().use(&#x27;node&#x27;, &#x27;dump&#x27;, function(Y) {
192
 
 
193
 
        var set1 = { foo : &quot;foo&quot; };
194
 
    var set2 = { foo : &quot;BAR&quot;, bar : &quot;bar&quot; };
195
 
    var set3 = { foo : &quot;FOO&quot;, baz : &quot;BAZ&quot; };
196
 
    var result = Y.one(&#x27;#demo_result&#x27;);
197
 
 
198
 
    var doMerge = function () {
199
 
 
200
 
        Y.log(&#x27;set1 = &#x27; + Y.dump(set1));
201
 
        Y.log(&#x27;set2 = &#x27; + Y.dump(set2));
202
 
        Y.log(&#x27;set3 = &#x27; + Y.dump(set3));
203
 
 
204
 
        Y.log(&#x27;Merging set1, set2, and set3&#x27;);
205
 
        var merged = Y.merge(set1, set2, set3);
206
 
        Y.log(&#x27;merged = &#x27; + Y.dump(merged));
207
 
 
208
 
        result.setContent(Y.dump(merged));
209
 
    };
210
 
 
211
 
    Y.on(&#x27;click&#x27;, doMerge, &#x27;#demo_btn1&#x27;);
212
 
 
213
 
 
214
 
        var doCopy = function () {
215
 
 
216
 
        &#x2F;&#x2F; Create set4 with an object property &#x27;obj&#x27;
217
 
        var set4 = {
218
 
            obj: {}
219
 
        };
220
 
 
221
 
        &#x2F;&#x2F; Create a shallow copy of set4
222
 
        var copy = Y.merge(set4);
223
 
 
224
 
        &#x2F;&#x2F; Add a property to the copy inside of the &#x27;obj&#x27; property
225
 
        copy.obj.addedToCopy = true;
226
 
 
227
 
        Y.log(&#x27;After modifying the copy: &#x27;);
228
 
 
229
 
        &#x2F;&#x2F; The result object is not the same as the original, but
230
 
        var msg = (&#x27;&quot;copy&quot; should NOT be equal to the &quot;original&quot; (false expected): &#x27; + (copy === set4));
231
 
 
232
 
        &#x2F;&#x2F; objects in the result object will reference the same object in
233
 
        &#x2F;&#x2F; the input object.
234
 
        msg += &#x27;&lt;br&gt;&lt;br&gt;copy.obj.addedToCopy should be equal to original.obj.addedToCopy (true expected): &#x27; + 
235
 
                (copy.obj.addedToCopy === set4.obj.addedToCopy);
236
 
 
237
 
        Y.log(msg);
238
 
        result.setContent(msg);
239
 
    };
240
 
 
241
 
    Y.on(&#x27;click&#x27;, doCopy, &#x27;#demo_btn2&#x27;);
242
 
 
243
 
 
244
 
 
245
 
});</pre>
246
 
 
247
 
</div>
248
 
        </div>
249
 
 
250
 
        <div id="sidebar" class="yui3-u">
251
 
            
252
 
                <div id="toc" class="sidebox">
253
 
                    <div class="hd">
254
 
                        <h2 class="no-toc">Table of Contents</h2>
255
 
                    </div>
256
 
 
257
 
                    <div class="bd">
258
 
                        <ul class="toc">
259
 
<li>
260
 
<a href="#result">Result</a>
261
 
</li>
262
 
<li>
263
 
<a href="#using-merge">Using <code>merge</code></a>
264
 
</li>
265
 
<li>
266
 
<a href="#merging-hash-tables">Merging hash tables</a>
267
 
</li>
268
 
<li>
269
 
<a href="#creating-shallow-copies">Creating Shallow Copies</a>
270
 
</li>
271
 
<li>
272
 
<a href="#full-javascript-source">Full Javascript Source</a>
273
 
</li>
274
 
</ul>
275
 
                    </div>
276
 
                </div>
277
 
            
278
 
 
279
 
            
280
 
                <div class="sidebox">
281
 
                    <div class="hd">
282
 
                        <h2 class="no-toc">Examples</h2>
283
 
                    </div>
284
 
 
285
 
                    <div class="bd">
286
 
                        <ul class="examples">
287
 
                            
288
 
                                
289
 
                                    <li data-description="Setting up a YUI Instance">
290
 
                                        <a href="yui-core.html">YUI Core</a>
291
 
                                    </li>
292
 
                                
293
 
                            
294
 
                                
295
 
                                    <li data-description="Working with multiple YUI instances.">
296
 
                                        <a href="yui-multi.html">Multiple Instances</a>
297
 
                                    </li>
298
 
                                
299
 
                            
300
 
                                
301
 
                                    <li data-description="On-demand loading of YUI and non-YUI assets">
302
 
                                        <a href="yui-loader-ext.html">YUI Loader - Dynamically Adding YUI and External Modules</a>
303
 
                                    </li>
304
 
                                
305
 
                            
306
 
                                
307
 
                                    <li data-description="Create Class Hierarchies with &#x60;extend&#x60;">
308
 
                                        <a href="yui-extend.html">Create Class Hierarchies with &#x60;extend&#x60;</a>
309
 
                                    </li>
310
 
                                
311
 
                            
312
 
                                
313
 
                                    <li data-description="Creating a composition-based class structure using &#x60;augment&#x60;">
314
 
                                        <a href="yui-augment.html">Compose Classes of Objects with &#x60;augment&#x60;</a>
315
 
                                    </li>
316
 
                                
317
 
                            
318
 
                                
319
 
                                    <li data-description="Add behaviors to objects or static classes with &#x60;mix&#x60;">
320
 
                                        <a href="yui-mix.html">Add Behaviors to Objects with &#x60;mix&#x60;</a>
321
 
                                    </li>
322
 
                                
323
 
                            
324
 
                                
325
 
                                    <li data-description="Combine data sets and create shallow copies of objects with &#x60;merge&#x60;">
326
 
                                        <a href="yui-merge.html">Combine Data Sets with &#x60;merge&#x60;</a>
327
 
                                    </li>
328
 
                                
329
 
                            
330
 
                                
331
 
                                    <li data-description="Check data types with the &#x60;Lang Utilities&#x60;">
332
 
                                        <a href="yui-isa.html">Check Data Types with &#x60;Lang&#x60;</a>
333
 
                                    </li>
334
 
                                
335
 
                            
336
 
                                
337
 
                                    <li data-description="Get information about the current user agent with &#x60;UA&#x60;">
338
 
                                        <a href="yui-ua.html">Browser Detection with &#x60;UA&#x60;</a>
339
 
                                    </li>
340
 
                                
341
 
                            
342
 
                                
343
 
                                    <li data-description="Working with YUI 2 in 3">
344
 
                                        <a href="yui-yui2.html">Working with YUI 2 in 3</a>
345
 
                                    </li>
346
 
                                
347
 
                            
348
 
                                
349
 
                                    <li data-description="Natively use YUI Gallery Modules">
350
 
                                        <a href="yui-gallery.html">Natively use YUI Gallery Modules</a>
351
 
                                    </li>
352
 
                                
353
 
                            
354
 
                        </ul>
355
 
                    </div>
356
 
                </div>
357
 
            
358
 
 
359
 
            
360
 
        </div>
361
 
    </div>
362
 
</div>
363
 
 
364
 
<script src="../assets/vendor/prettify/prettify-min.js"></script>
365
 
<script>prettyPrint();</script>
366
 
 
367
 
</body>
368
 
</html>