← Back to branch summary

~ubuntu-branches/ubuntu/precise/maas/precise-updates

« back to all changes in this revision

Viewing changes to src/maasserver/static/jslibs/yui/3.4.1/docs/console-filters/console-filters-intro.html

Tags: 1.2+bzr1373+dfsg-0ubuntu1~12.04.4
https://launchpad.net/bugs/1039513
https://launchpad.net/bugs/1158425
* SECURITY UPDATE: failure to authenticate downloaded content (LP: #1039513)
  - debian/patches/CVE-2013-1058.patch: Authenticate downloaded files with
    GnuPG and MD5SUM files. Thanks to Julian Edwards.
  - CVE-2013-1058
* SECURITY UPDATE: configuration options may be loaded from current working
  directory (LP: #1158425)
  - debian/patches/CVE-2013-1057-1-2.patch: Do not load configuration
    options from the current working directory. Thanks to Julian Edwards.
  - CVE-2013-1057

Show diffs side-by-side

added added

removed removed

Lines of Context:
src/maasserver/static/jslibs/yui/3.4.1/docs/console-filters/console-filters-intro.html
1
 
<!DOCTYPE html>
2
 
<html lang="en">
3
 
<head>
4
 
    <meta charset="utf-8">
5
 
    <title>Example: Using the ConsoleFilters Plugin</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: Using the ConsoleFilters Plugin</h1>
15
 
 
16
 
    
17
 
 
18
 
    <div class="yui3-g">
19
 
        <div id="main" class="yui3-u">
20
 
            <div class="content"><style scoped>
21
 
#yconsole {
22
 
    margin: 0 auto 1em;
23
 
}
24
 
 
25
 
#demo .yui3-console .yui3-console-title {
26
 
    border: 0 none;
27
 
    color: #000;
28
 
    font-size: 13px;
29
 
    font-weight: bold;
30
 
    margin: 0;
31
 
    text-transform: none;
32
 
}
33
 
#demo .yui3-console .yui3-console-entry-meta {
34
 
    margin: 0;
35
 
}
36
 
</style>
37
 
 
38
 
 
39
 
<div class="intro">
40
 
    <p>This example illustrates how to use and configure the ConsoleFilters plugin for Console.  The debug versions of YUI module files are used, so standard YUI debugging messages are broadcast to the Console.</p>
41
 
 
42
 
    <p>Use the checkboxes in the Console footer to control which messages are displayed or hidden.  Click the &quot;Log a message&quot; button to call <code>Y.log</code> using a custom category and source.</p>
43
 
 
44
 
    <p>Note how new filter checkboxes are added when a new category or source are received by the Console, for example when clicking on the &quot;Log a message&quot; button.</p>
45
 
</div>
46
 
 
47
 
<div class="example yui3-skin-sam">
48
 
    <div id="demo" class="yui3-skin-sam">
49
 
    <div id="yconsole"></div>
50
 
    <button id="log" type="button">Log a message</button>
51
 
    <button id="toggle_info" type="button">Hide info messages</button>
52
 
</div>
53
 
 
54
 
    <script type="text/javascript">
55
 
// Create a YUI instance and request the console module and its dependencies
56
 
YUI({ filter: 'debug' }).use("console-filters", function (Y) {
57
 
 
58
 
// create the console instance
59
 
var yconsole = new Y.Console({
60
 
    boundingBox: '#yconsole',
61
 
    height: '400px',
62
 
    width: '450px',
63
 
    newestOnTop: false,
64
 
    style: 'block',
65
 
    plugins: [ Y.Plugin.ConsoleFilters ]
66
 
}).render();
67
 
 
68
 
// unknown categories and sources are allowed.
69
 
yconsole.filter.hideCategory('error');
70
 
 
71
 
// hide and show methods support N arguments.
72
 
yconsole.filter.hideSource('attribute','widget');
73
 
 
74
 
/* Alternately
75
 
var yconsole = new Y.Console({
76
 
    boundingBox: '#console',
77
 
    height: '400px',
78
 
    width: '450px',
79
 
    style: 'block',
80
 
    newestOnTop: false
81
 
}).plug(Y.Plugin.ConsoleFilters, {
82
 
    category: {
83
 
        error: false
84
 
    },
85
 
    source: {
86
 
        attribute: false,
87
 
        widget: false
88
 
    }
89
 
}).render();
90
 
*/
91
 
 
92
 
// Broadcast a log message from a button that uses a custom category and source
93
 
Y.on('click', function () {
94
 
    Y.log('Logging a message to the Console','my_stuff','MyApp');
95
 
},'#log');
96
 
 
97
 
// It is also possible to set the filter's subattributes directly
98
 
Y.on('click', function () {
99
 
    var current = yconsole.filter.get('category.info');
100
 
 
101
 
    yconsole.filter.set('category.info', !current);
102
 
 
103
 
    this.set('text', (current ? 'Show' : 'Hide') + ' info messages');
104
 
},'#toggle_info');
105
 
 
106
 
});
107
 
</script>
108
 
 
109
 
</div>
110
 
 
111
 
<h3 class="first">Configure the YUI instance for debug mode</h3>
112
 
<p>Only the <code>&lt;em&gt;module&lt;&#x2F;em&gt;-debug.js</code> versions of module files include log statements, so we'll set up our YUI instance's <code>filter</code> property to &quot;debug&quot;.  We'll also reduce the noise somewhat by specifying a <code>logInclude</code> list.</p>
113
 
 
114
 
<pre class="code prettyprint">YUI({filter: &#x27;debug&#x27;,
115
 
    logInclude: {
116
 
        event: true,
117
 
        attribute: true,
118
 
        base: true,
119
 
        widget: true,
120
 
        node: true,
121
 
        MyApp: true  &#x2F;&#x2F; This must be included for the custom source message
122
 
    },
123
 
    timeout: 10000
124
 
}).use(&quot;console-filters&quot;, function (Y) { ... });</pre>
125
 
 
126
 
 
127
 
<h3>Create the Console and plug in ConsoleFilters</h3>
128
 
<p>All that's left to do now is plugin in the ConsoleFilters plugin.  This can be done in one of a few ways.</p>
129
 
<pre class="code prettyprint">&#x2F;&#x2F; create the console instance
130
 
var yconsole = new Y.Console({
131
 
    boundingBox: &#x27;#console&#x27;,
132
 
    height: &#x27;400px&#x27;,
133
 
    width: &#x27;450px&#x27;,
134
 
    newestOnTop: false,
135
 
    plugins: [ Y.Plugin.ConsoleFilters ]
136
 
}).render();
137
 
 
138
 
&#x2F;&#x2F; unknown categories and sources are allowed.
139
 
yconsole.filter.hideCategory(&#x27;error&#x27;);
140
 
 
141
 
&#x2F;&#x2F; hide and show methods support N arguments.
142
 
yconsole.filter.hideSource(&#x27;attribute&#x27;,&#x27;widget&#x27;);</pre>
143
 
 
144
 
 
145
 
<p>Alternatively, you can attach the ConsoleFilters plugin after instantiation.  This version also shows how to apply initial category and source filter states.</p>
146
 
<pre class="code prettyprint">var yconsole = new Y.Console({
147
 
    boundingBox: &#x27;#console&#x27;,
148
 
    height: &#x27;400px&#x27;,
149
 
    width: &#x27;450px&#x27;,
150
 
    newestOnTop: false
151
 
}).plug(Y.Plugin.ConsoleFilters, {
152
 
    category: {
153
 
        error: false
154
 
    },
155
 
    source: {
156
 
        attribute: false,
157
 
        widget: false
158
 
    }
159
 
}).render();
160
 
&lt;&#x2F;script&gt;</pre>
161
 
 
162
 
 
163
 
<h3>Full Code Listing</h3>
164
 
 
165
 
<h4>Markup</h4>
166
 
<pre class="code prettyprint">&lt;div id=&quot;demo&quot; class=&quot;yui3-skin-sam&quot;&gt;
167
 
    &lt;div id=&quot;yconsole&quot;&gt;&lt;&#x2F;div&gt;
168
 
    &lt;button id=&quot;log&quot; type=&quot;button&quot;&gt;Log a message&lt;&#x2F;button&gt;
169
 
    &lt;button id=&quot;toggle_info&quot; type=&quot;button&quot;&gt;Hide info messages&lt;&#x2F;button&gt;
170
 
&lt;&#x2F;div&gt;</pre>
171
 
 
172
 
 
173
 
<h4>JavaScript</h4>
174
 
<pre class="code prettyprint">&lt;script type=&quot;text&#x2F;javascript&quot;&gt;
175
 
&#x2F;&#x2F; Create a YUI instance and request the console module and its dependencies
176
 
YUI({ filter: &#x27;debug&#x27; }).use(&quot;console-filters&quot;, function (Y) {
177
 
 
178
 
&#x2F;&#x2F; create the console instance
179
 
var yconsole = new Y.Console({
180
 
    boundingBox: &#x27;#yconsole&#x27;,
181
 
    height: &#x27;400px&#x27;,
182
 
    width: &#x27;450px&#x27;,
183
 
    newestOnTop: false,
184
 
    style: &#x27;block&#x27;,
185
 
    plugins: [ Y.Plugin.ConsoleFilters ]
186
 
}).render();
187
 
 
188
 
&#x2F;&#x2F; unknown categories and sources are allowed.
189
 
yconsole.filter.hideCategory(&#x27;error&#x27;);
190
 
 
191
 
&#x2F;&#x2F; hide and show methods support N arguments.
192
 
yconsole.filter.hideSource(&#x27;attribute&#x27;,&#x27;widget&#x27;);
193
 
 
194
 
&#x2F;* Alternately
195
 
var yconsole = new Y.Console({
196
 
    boundingBox: &#x27;#console&#x27;,
197
 
    height: &#x27;400px&#x27;,
198
 
    width: &#x27;450px&#x27;,
199
 
    style: &#x27;block&#x27;,
200
 
    newestOnTop: false
201
 
}).plug(Y.Plugin.ConsoleFilters, {
202
 
    category: {
203
 
        error: false
204
 
    },
205
 
    source: {
206
 
        attribute: false,
207
 
        widget: false
208
 
    }
209
 
}).render();
210
 
*&#x2F;
211
 
 
212
 
&#x2F;&#x2F; Broadcast a log message from a button that uses a custom category and source
213
 
Y.on(&#x27;click&#x27;, function () {
214
 
    Y.log(&#x27;Logging a message to the Console&#x27;,&#x27;my_stuff&#x27;,&#x27;MyApp&#x27;);
215
 
},&#x27;#log&#x27;);
216
 
 
217
 
&#x2F;&#x2F; It is also possible to set the filter&#x27;s subattributes directly
218
 
Y.on(&#x27;click&#x27;, function () {
219
 
    var current = yconsole.filter.get(&#x27;category.info&#x27;);
220
 
 
221
 
    yconsole.filter.set(&#x27;category.info&#x27;, !current);
222
 
 
223
 
    this.set(&#x27;text&#x27;, (current ? &#x27;Show&#x27; : &#x27;Hide&#x27;) + &#x27; info messages&#x27;);
224
 
},&#x27;#toggle_info&#x27;);
225
 
 
226
 
});
227
 
&lt;&#x2F;script&gt;</pre>
228
 
 
229
 
 
230
 
<h4>CSS</h4>
231
 
<pre class="code prettyprint">&lt;style scoped&gt;
232
 
#yconsole {
233
 
    margin: 0 auto 1em;
234
 
}
235
 
 
236
 
#demo .yui3-console .yui3-console-title {
237
 
    border: 0 none;
238
 
    color: #000;
239
 
    font-size: 13px;
240
 
    font-weight: bold;
241
 
    margin: 0;
242
 
    text-transform: none;
243
 
}
244
 
#demo .yui3-console .yui3-console-entry-meta {
245
 
    margin: 0;
246
 
}
247
 
&lt;&#x2F;style&gt;</pre>
248
 
 
249
 
 
250
 
</div>
251
 
        </div>
252
 
 
253
 
        <div id="sidebar" class="yui3-u">
254
 
            
255
 
 
256
 
            
257
 
                <div class="sidebox">
258
 
                    <div class="hd">
259
 
                        <h2 class="no-toc">Examples</h2>
260
 
                    </div>
261
 
 
262
 
                    <div class="bd">
263
 
                        <ul class="examples">
264
 
                            
265
 
                                
266
 
                                    <li data-description="Adding the ConsoleFilters plugin to a Console instance for more granular run time log message filtering">
267
 
                                        <a href="console-filters-intro.html">Using the ConsoleFilters Plugin</a>
268
 
                                    </li>
269
 
                                
270
 
                            
271
 
                                
272
 
                            
273
 
                        </ul>
274
 
                    </div>
275
 
                </div>
276
 
            
277
 
 
278
 
            
279
 
                <div class="sidebox">
280
 
                    <div class="hd">
281
 
                        <h2 class="no-toc">Examples That Use This Component</h2>
282
 
                    </div>
283
 
 
284
 
                    <div class="bd">
285
 
                        <ul class="examples">
286
 
                            
287
 
                                
288
 
                            
289
 
                                
290
 
                                    <li data-description="The basics of setting up a Console">
291
 
                                        <a href="../console/console-basic.html">Creating a Console for Debugging</a>
292
 
                                    </li>
293
 
                                
294
 
                            
295
 
                        </ul>
296
 
                    </div>
297
 
                </div>
298
 
            
299
 
        </div>
300
 
    </div>
301
 
</div>
302
 
 
303
 
<script src="../assets/vendor/prettify/prettify-min.js"></script>
304
 
<script>prettyPrint();</script>
305
 
 
306
 
</body>
307
 
</html>