← 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/node-menunav/node-menunav-5-example.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/node-menunav/node-menunav-5-example.html
1
 
<!DOCTYPE html>
2
 
<html lang="en" class="yui3-loading">
3
 
<head>
4
 
    <meta charset="utf-8">
5
 
    <title>MenuNav: Left Nav with Submenus with Shadows Example</title>
6
 
    <link rel="stylesheet" href="http://yui.yahooapis.com/combo?3.4.1/build/cssreset/reset-min.css&amp;3.4.1/build/cssfonts/fonts-min.css&amp;3.4.1/build/cssgrids/grids-min.css&amp;3.4.1/build/cssbase/base-min.css">
7
 
    <link rel="stylesheet" href="../assets/node-menunav/node-menunav-examples-base.css">
8
 
    <script src="../../build/yui/yui-min.js"></script>
9
 
</head>
10
 
<body class="yui3-skin-sam">
11
 
 
12
 
<style>
13
 
.yui3-menu-shadow {
14
 
 
15
 
    position: absolute;
16
 
    z-index: -1;
17
 
    top: 2px;
18
 
    left: -3px;
19
 
    background-color: #000;
20
 
    opacity: .12;
21
 
    filter: alpha(opacity=12);  /*  For IE since it doesn't implement the CSS3
22
 
                                    "opacity" property. */
23
 
    padding: 1px 3px 0 3px;
24
 
    width: 100%;
25
 
    height: 100%;
26
 
 
27
 
}
28
 
 
29
 
#productsandservices .yui3-menu .yui3-shim {
30
 
 
31
 
    z-index: -2;    /* Place the iframe shim behind the shadow element */
32
 
 
33
 
    /*
34
 
        Adjust the dimensions of the <iframe> shim to match the shadow,
35
 
        otherwise <select> elements will poke through the shadow.
36
 
    */
37
 
 
38
 
    left: -3px;
39
 
    padding: 3px 3px 0 3px;
40
 
 
41
 
}
42
 
</style>
43
 
 
44
 
<h1>Header</h1>
45
 
 
46
 
<div class="yui3-g" id="bd">
47
 
    <div class="yui3-u" id="side">
48
 
        <div class="content">
49
 
           <div id="productsandservices" class="yui3-menu">
50
 
                <div class="yui3-menu-content">
51
 
                    <ul class="first-of-type">
52
 
                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://www.yahoo.com/">Home</a></li>
53
 
                        <li>
54
 
                            <a class="yui3-menu-label" href="#connect">Connect</a>
55
 
                            <div id="connect" class="yui3-menu">
56
 
                                <div class="yui3-menu-content">
57
 
                                    <ul>
58
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://developer.yahoo.com/">Developer Network</a></li>
59
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://www.flickr.com">Flickr</a></li>
60
 
                                        <li>
61
 
                                            <a class="yui3-menu-label" href="#pim">PIM</a>
62
 
                                            <div id="pim" class="yui3-menu">
63
 
                                                <div class="yui3-menu-content">
64
 
 
65
 
                                                    <ul>
66
 
                                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://mail.yahoo.com">Mail</a></li>
67
 
                                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://www.zimbra.com">Zimbra</a></li>
68
 
                                                    </ul>
69
 
 
70
 
                                                    <ul>
71
 
                                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://addressbook.yahoo.com">Address Book</a></li>
72
 
                                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://calendar.yahoo.com">Calendar</a></li>
73
 
                                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://notepad.yahoo.com">Notepad</a></li>
74
 
                                                    </ul>
75
 
 
76
 
                                                    <ul>
77
 
                                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://messenger.yahoo.com">Messenger</a></li>
78
 
                                                    </ul>
79
 
 
80
 
                                                </div>
81
 
                                            </div>
82
 
                                        </li>
83
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://profiles.yahoo.com">Profiles</a> </li>
84
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://mobile.yahoo.com">Mobile</a></li>
85
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://mybloglog.yahoo.com/">MyBlogLog</a></li>
86
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://pride.yahoo.com/">Pride</a></li>
87
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://upcoming.yahoo.com/">Upcoming</a></li>
88
 
                                    </ul>
89
 
                                </div>
90
 
                            </div>
91
 
                        </li>
92
 
 
93
 
                        <li>
94
 
                            <a class="yui3-menu-label" href="#find-info">Find Info</a>
95
 
                            <div id="find-info" class="yui3-menu">
96
 
                                <div class="yui3-menu-content">
97
 
                                    <ul>
98
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://answers.yahoo.com">Answers</a></li>
99
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://babelfish.yahoo.com/">Babel Fish Translations</a></li>
100
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://info.yahoo.com/">Company Info</a></li>
101
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://search.yahoo.com/cc">Creative Commons Search</a></li>
102
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://dir.yahoo.com/">Directory</a></li>
103
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://hotjobs.yahoo.com/">Jobs</a></li>
104
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://local.yahoo.com">Local</a></li>
105
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://maps.yahoo.com/">Maps</a></li>
106
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://realestate.yahoo.com">Real Estate</a></li>
107
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://education.yahoo.com/reference/">Reference</a></li>
108
 
                                    </ul>
109
 
                                </div>
110
 
                            </div>
111
 
                        </li>
112
 
 
113
 
                        <li>
114
 
                            <a class="yui3-menu-label" href="#lifestyles">Lifestyles</a>
115
 
                            <div id="lifestyles" class="yui3-menu">
116
 
                                <div class="yui3-menu-content">
117
 
                                    <ul>
118
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://autos.yahoo.com">Autos</a></li>
119
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://food.yahoo.com">Food</a></li>
120
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://green.yahoo.com">Green</a></li>
121
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://health.yahoo.com">Health</a></li>
122
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://pride.yahoo.com">Pride</a></li>
123
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://shine.yahoo.com">Shine</a></li>
124
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://tech.yahoo.com">Tech</a></li>
125
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://travel.yahoo.com/">Travel</a></li>
126
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://forgood.yahoo.com/index.html">Yahoo! for Good</a></li>
127
 
                                    </ul>
128
 
                                </div>
129
 
                            </div>
130
 
                        </li>
131
 
 
132
 
                        <li>
133
 
                            <a class="yui3-menu-label" href="#new-finance">News &#38; Finance</a>
134
 
                            <div id="new-finance" class="yui3-menu">
135
 
                                <div class="yui3-menu-content">
136
 
                                    <ul>
137
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://buzz.yahoo.com/">Buzz</a></li>
138
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://finance.yahoo.com">Finance</a></li>
139
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://news.yahoo.com">News</a></li>
140
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://publisher.yahoo.com">Publisher Network</a></li>
141
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://sports.yahoo.com/">Sports</a></li>
142
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://weather.yahoo.com/">Weather</a></li>
143
 
                                    </ul>
144
 
                                </div>
145
 
                            </div>
146
 
                        </li>
147
 
 
148
 
                        <li>
149
 
                            <a class="yui3-menu-label" href="#your-yahoo">Your Yahoo!</a>
150
 
                            <div id="your-yahoo" class="yui3-menu">
151
 
                                <div class="yui3-menu-content">
152
 
                                    <ul>
153
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://edit.yahoo.com/config/eval_profile?.done">Account Information</a></li>
154
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://alerts.yahoo.com/">Alerts</a></li>
155
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://smallbusiness.yahoo.com/domains">Domains</a></li>
156
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://www.flickr.com">Flickr</a></li>
157
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://my.yahoo.com/">My Yahoo!</a></li>
158
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://pipes.yahoo.com/">Pipes</a></li>
159
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://toolbar.yahoo.com/">Toolbar</a></li>
160
 
                                    </ul>
161
 
                                    <ul>
162
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://bookmarks.yahoo.com/">Bookmarks</a></li>
163
 
                                        <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="http://delicious.com/">delicious</a></li>
164
 
                                    </ul>
165
 
                                </div>
166
 
                            </div>
167
 
                        </li>
168
 
 
169
 
                    </ul>
170
 
                </div>
171
 
            </div>
172
 
        </div>
173
 
    </div>
174
 
    <div class="yui3-u" id="main">
175
 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
176
 
 
177
 
        <form>
178
 
 
179
 
            <div>
180
 
                <label for="field-1">Field One</label>
181
 
                <input type="text" id="field-1" name="field-1">
182
 
            </div>
183
 
 
184
 
            <div>
185
 
                <label for="field-2">Field Two</label>
186
 
                <input type="text" id="field-2" name="field-2">
187
 
            </div>
188
 
 
189
 
            <div>
190
 
                <label for="field-3">Field Three</label>
191
 
                <select id="field-3" name="field-3">
192
 
                    <option value="1">Field Three - Option One</option>
193
 
                    <option value="2">Field Three - Option Two</option>
194
 
                    <option value="3">Field Three - Option Two</option>
195
 
                </select>
196
 
            </div>
197
 
 
198
 
        </form>
199
 
 
200
 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
201
 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
202
 
    </div>
203
 
</div>
204
 
 
205
 
<div id="footer">
206
 
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in, rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit amet dignissim cursus, quam lacus feugiat.</p>
207
 
</div>
208
 
 
209
 
<script>
210
 
    //  Call the "use" method, passing in "node-menunav".  This will load the
211
 
    //  script and CSS for the MenuNav Node Plugin and all of the required
212
 
    //  dependencies.
213
 
 
214
 
    YUI().use('node-menunav', function(Y) {
215
 
 
216
 
        //  Retrieve the Node instance representing the root menu
217
 
        //  (<div id="productsandservices">)
218
 
 
219
 
        var menu = Y.one("#productsandservices");
220
 
 
221
 
 
222
 
        //  Use the "all" method to retrieve the
223
 
        //  Node instances representing each submenu.
224
 
 
225
 
        menu.all(".yui3-menu").each(function (node) {
226
 
 
227
 
            // Append a shadow element to the bounding box of each submenu
228
 
 
229
 
            node.append('<div class="yui3-menu-shadow"></div>');
230
 
 
231
 
        });
232
 
 
233
 
 
234
 
        //  Call the "plug" method of the Node instance, passing in a reference to the
235
 
        //  MenuNav Node Plugin.
236
 
 
237
 
        menu.plug(Y.Plugin.NodeMenuNav);
238
 
 
239
 
        //  Show the menu now that it is ready
240
 
 
241
 
        menu.get("ownerDocument").get("documentElement").removeClass("yui3-loading");
242
 
 
243
 
    });
244
 
 
245
 
</script>
246
 
 
247
 
 
248
 
</body>
249
 
</html>