~ci-train-bot/ubuntu-html5-theme/ubuntu-html5-theme-ubuntu-yakkety-landing-067

« back to all changes in this revision

Viewing changes to 0.1/ambiance/js/docsbuild/classes/UbuntuUI.Toolbar.html

  • Committer: CI Train Bot
  • Author(s): Michael Hall, Alexandre Abreu
  • Date: 2015-04-09 14:26:31 UTC
  • mfrom: (200.2.3 ubuntu-html5-theme)
  • Revision ID: ci-train-bot@canonical.com-20150409142631-5axmx6p7x08ej1im
Add -doc package, whose contents have to be generated locally (use the ./update-docs command) because not all of its node dependencies are in the archive. This is done, so we can more easily update developer.ubuntu.com/api
Approved by: David Barth

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>UbuntuUI.Toolbar - Ubuntu HTML5 API</title>
 
6
    <link rel="stylesheet" href="http://yui.yahooapis.com/3.8.0pr2/build/cssgrids/cssgrids-min.css">
 
7
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
 
8
    <link rel="stylesheet" href="../assets/css/main.css" id="site_styles">
 
9
    <script src="http://yui.yahooapis.com/combo?3.8.0pr2/build/yui/yui-min.js"></script>
 
10
</head>
 
11
<body class="yui3-skin-sam">
 
12
 
 
13
<div id="doc">
 
14
    <div id="hd" class="yui3-g header">
 
15
        <div class="yui3-u-3-4">
 
16
            <h1><a href="../index.html"><img src="../assets/css/logo.png">Ubuntu HTML5 API: UbuntuUI.Toolbar</a></h1>
 
17
        </div>
 
18
        <div class="yui3-u-1-4 version">
 
19
            <em>API Docs for: HTML-14.04-dev~bzr202</em>
 
20
        </div>
 
21
    </div>
 
22
    <div class="yui3-g">
 
23
 
 
24
        <div id="sidebar" class="yui3-u">
 
25
            <div id="modules" class="sidebox">
 
26
                <div class="hd">
 
27
                    <h2 class="no-toc">Modules</h2>
 
28
                </div>
 
29
                <div class="bd">
 
30
                    <ul>
 
31
                            <li><a href="../modules/UbuntuUI.html">UbuntuUI</a>
 
32
                            </li>
 
33
                    </ul>
 
34
                </div>
 
35
            </div>
 
36
            
 
37
            <div id="classes" class="sidebox">
 
38
                <div class="hd">
 
39
                    <h2 class="no-toc">Classes</h2>
 
40
                </div>
 
41
                <div class="bd">
 
42
                    <ul>
 
43
                            <li><a href="../classes/UbuntuUI.html">UbuntuUI</a></li>
 
44
                            <li><a href="../classes/UbuntuUI.Button.html">UbuntuUI.Button</a></li>
 
45
                            <li><a href="../classes/UbuntuUI.Dialog.html">UbuntuUI.Dialog</a></li>
 
46
                            <li><a href="../classes/UbuntuUI.Header.html">UbuntuUI.Header</a></li>
 
47
                            <li><a href="../classes/UbuntuUI.List.html">UbuntuUI.List</a></li>
 
48
                            <li><a href="../classes/UbuntuUI.OptionSelector.html">UbuntuUI.OptionSelector</a></li>
 
49
                            <li><a href="../classes/UbuntuUI.Page.html">UbuntuUI.Page</a></li>
 
50
                            <li><a href="../classes/UbuntuUI.Pagestack.html">UbuntuUI.Pagestack</a></li>
 
51
                            <li><a href="../classes/UbuntuUI.Popover.html">UbuntuUI.Popover</a></li>
 
52
                            <li><a href="../classes/UbuntuUI.Progress.html">UbuntuUI.Progress</a></li>
 
53
                            <li><a href="../classes/UbuntuUI.Shape.html">UbuntuUI.Shape</a></li>
 
54
                            <li><a href="../classes/UbuntuUI.Tab.html">UbuntuUI.Tab</a></li>
 
55
                            <li><a href="../classes/UbuntuUI.Tabs.html">UbuntuUI.Tabs</a></li>
 
56
                            <li><a href="../classes/UbuntuUI.Toolbar.html">UbuntuUI.Toolbar</a></li>
 
57
                    </ul>
 
58
                </div>
 
59
            </div>
 
60
            
 
61
            <div id="methods-on-page" class="sidebox on-page">
 
62
                <div class="hd">
 
63
                    <h2 class="no-toc">Methods On Page</h2>
 
64
                </div>
 
65
                <div class="bd">
 
66
                    <ul>
 
67
                            <li><a href="#methods_element">element</a></li>
 
68
                            <li><a href="#methods_hide">hide</a></li>
 
69
                            <li><a href="#methods_show">show</a></li>
 
70
                            <li><a href="#methods_toggle">toggle</a></li>
 
71
                    </ul>
 
72
                </div>
 
73
            </div>
 
74
            
 
75
            
 
76
            
 
77
            
 
78
            <div id="fileTree" class="sidebox">
 
79
                <div class="hd">
 
80
                    <h2 class="no-toc">Files</h2>
 
81
                </div>
 
82
                <div class="bd">
 
83
                    <ul><li>buttons.js/<ul></ul></li><li>core.js/<ul></ul></li><li>dialogs.js/<ul></ul></li><li>fast-buttons.js/<ul></ul></li><li>header.js/<ul></ul></li><li>list.js/<ul></ul></li><li>option-selector.js/<ul></ul></li><li>page.js/<ul></ul></li><li>pagestacks.js/<ul></ul></li><li>popovers.js/<ul></ul></li><li>progress.js/<ul></ul></li><li>shape.js/<ul></ul></li><li>tab.js/<ul></ul></li><li>tabs.js/<ul></ul></li><li>toolbars.js/<ul></ul></li></ul>
 
84
                </div>
 
85
            </div>
 
86
            
 
87
        </div>
 
88
 
 
89
        <div id="main" class="yui3-u">
 
90
            <div class="content"><h4>Class UbuntuUI.Toolbar</h4>
 
91
<span class="foundat">Class defined in: <a href="../../files/toolbars.js.html#l23"><code>toolbars.js:23</code></a></span>
 
92
<div class="intro"><p>A Toolbar is the JavaScript representation of an Ubuntu HTML5 app &lt;em&gt;footer&lt;/em&gt;.</p>
 
93
<p>######Contained List provides buttons
 
94
The Toolbar contains a List, where each list item is treated as a Button (see below). List items (Buttons) are pushed to the right. The default Back button always exists to the left and does not need to be declared.</p>
 
95
<p>#####Default and custom footers
 
96
See the Pagestack class documentation for information about the default application-wide Footer, customizing it, and adding Page-specific Footers.</p>
 
97
</div>
 
98
 
 
99
    <a name="methods_UbuntuUI.Toolbar"></a>
 
100
    <div class="method item">
 
101
         <strong class="name"><code>UbuntuUI.Toolbar</code></strong>( <code>  </code> ) 
 
102
        <br>
 
103
        <span class="foundat">
 
104
            
 
105
            <a href="../../files/toolbars.js.html#l23"><code>toolbars.js:23</code></a>
 
106
        </span><br>
 
107
        
 
108
            <h5>Example</h5>
 
109
            <pre class="code prettyprint"><code> &lt;footer data-role=&quot;footer&quot; class=&quot;revealed&quot; id=&quot;footerID&quot;&gt;
 
110
       &lt;nav&gt;
 
111
         &lt;ul&gt;
 
112
           &lt;li&gt;
 
113
             &lt;a href=&quot;#&quot; id=&quot;home&quot;&gt;Home&lt;/a&gt;
 
114
           &lt;/li&gt;
 
115
         &lt;/ul&gt;
 
116
       &lt;/nav&gt;
 
117
     &lt;/footer&gt;
 
118
    
 
119
     JavaScript access:
 
120
     var toolbar = UI.toolbar(&quot;toolbarID&quot;);
 
121
     UI.button('home').click(function () {
 
122
       UI.pagestack.push(&quot;main&quot;);
 
123
     });
 
124
    </code></pre>
 
125
    
 
126
    </div>
 
127
 
 
128
<div id="classdocs">
 
129
    <ul>
 
130
        <li><a href="#methods">Methods</a></li>
 
131
    </ul>
 
132
    <div>
 
133
            <div id="methods">
 
134
                <a name="methods_element"></a>
 
135
                <div class="method item">
 
136
                     <strong class="name"><code>element</code></strong>( <code>  </code> ) 
 
137
                    <br>
 
138
                    <span class="foundat">
 
139
                        
 
140
                        <a href="../../files/toolbars.js.html#l184"><code>toolbars.js:184</code></a>
 
141
                    </span><br>
 
142
                    <p>Returns the DOM element associated with the id this widget is bind to.</p>
 
143
                
 
144
                        <h5>Example</h5>
 
145
                        <pre class="code prettyprint"><code>       var mytoolbar = UI.toolbar(&quot;toolbarid&quot;).element();</code></pre>
 
146
                
 
147
                </div>
 
148
                <a name="methods_hide"></a>
 
149
                <div class="method item">
 
150
                     <strong class="name"><code>hide</code></strong>( <code>  </code> ) 
 
151
                    <br>
 
152
                    <span class="foundat">
 
153
                        
 
154
                        <a href="../../files/toolbars.js.html#l168"><code>toolbars.js:168</code></a>
 
155
                    </span><br>
 
156
                    <p>Hide a Toolbar</p>
 
157
                
 
158
                </div>
 
159
                <a name="methods_show"></a>
 
160
                <div class="method item">
 
161
                     <strong class="name"><code>show</code></strong>( <code>  </code> ) 
 
162
                    <br>
 
163
                    <span class="foundat">
 
164
                        
 
165
                        <a href="../../files/toolbars.js.html#l160"><code>toolbars.js:160</code></a>
 
166
                    </span><br>
 
167
                    <p>Display a Toolbar</p>
 
168
                
 
169
                </div>
 
170
                <a name="methods_toggle"></a>
 
171
                <div class="method item">
 
172
                     <strong class="name"><code>toggle</code></strong>( <code>  </code> ) 
 
173
                    <br>
 
174
                    <span class="foundat">
 
175
                        
 
176
                        <a href="../../files/toolbars.js.html#l176"><code>toolbars.js:176</code></a>
 
177
                    </span><br>
 
178
                    <p>Toggle show/hide status of a Toolbar</p>
 
179
                
 
180
                </div>
 
181
            </div>
 
182
    </div>
 
183
</div>
 
184
</div>
 
185
        </div>
 
186
    </div>
 
187
</div>
 
188
<script src="../assets/vendor/prettify/prettify-min.js"></script>
 
189
<script>prettyPrint();</script>
 
190
<script src="../assets/js/yui-prettify.js"></script>
 
191
<script src="../assets/js/tabs.js"></script>
 
192
</body>
 
193
</html>