Skip to content

Commit 25baf88

Browse files
committed
Merge branch 'menubar' into datepicker
Conflicts: ui/jquery.ui.menu.js
2 parents 6ded35c + f83c963 commit 25baf88

17 files changed

+1386
-23
lines changed

demos/index.html

Lines changed: 23 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@
2020
<script src="../ui/jquery.ui.draggable.js"></script>
2121
<script src="../ui/jquery.ui.droppable.js"></script>
2222
<script src="../ui/jquery.ui.menu.js"></script>
23+
<script src="../ui/jquery.ui.menubar.js"></script>
24+
<script src="../ui/jquery.ui.popup.js"></script>
2325
<script src="../ui/jquery.ui.position.js"></script>
2426
<script src="../ui/jquery.ui.progressbar.js"></script>
2527
<script src="../ui/jquery.ui.resizable.js"></script>
@@ -111,28 +113,28 @@
111113
<script src="../ui/i18n/jquery.ui.datepicker-zh-TW.js"></script>
112114
<script>
113115
$(function() {
114-
116+
115117
$('.left-nav a').click(function(ev) {
116118
window.location.hash = this.href.replace(/.+\/([^\/]+)\/index\.html/,'$1') + '|default';
117119
loadPage(this.href);
118120
$('.left-nav a.selected').removeClass('selected');
119121
$(this).addClass('selected');
120122
ev.preventDefault();
121123
});
122-
124+
123125
if (window.location.hash) {
124126
if (window.location.hash.indexOf('|') === -1) {
125-
window.location.hash += '|default';
126-
}
127+
window.location.hash += '|default';
128+
}
127129
var path = window.location.href.replace(/(index\.html)?#/,'');
128130
path = path.replace('\|','/') + '.html';
129131
loadPage(path);
130-
}
132+
}
131133

132-
function loadPage(path) {
134+
function loadPage(path) {
133135
var section = path.replace(/\/[^\/]+\.html/,'');
134136
var header = section.replace(/.+\/([^\/]+)/,'$1').replace(/_/, ' ');
135-
137+
136138
$('td.normal div.normal')
137139
.empty()
138140
.append('<h4 class="demo-subheader">Functional demo:</h4>')
@@ -148,7 +150,7 @@
148150
$(this).click(function() {
149151

150152
resetDemos();
151-
153+
152154
$(this).parents('ul').find('li').removeClass('demo-config-on');
153155
$(this).parent().addClass('demo-config-on');
154156
$('#demo-notes').fadeOut();
@@ -167,8 +169,8 @@
167169
$('#demo-config-menu a').each(function(){
168170
if (this.href.indexOf(demo + '.html') !== -1) {
169171
$(this).parents('ul').find('li').removeClass('demo-config-on');
170-
$(this).parent().addClass('demo-config-on');
171-
loadDemo(this.href);
172+
$(this).parent().addClass('demo-config-on');
173+
loadDemo(this.href);
172174
}
173175
});
174176
}
@@ -184,10 +186,10 @@
184186
.end()
185187
.end()
186188
;
187-
189+
188190
resetDemos();
189191
}
190-
192+
191193
function loadDemo(path) {
192194
var directory = path.match(/([^\/]+)\/[^\/\.]+\.html$/)[1];
193195
$.get(path, function(data) {
@@ -207,7 +209,7 @@
207209
$('#demo-link a').attr('href', path);
208210
updateDemoNotes();
209211
updateDemoSource(source);
210-
212+
211213
if (/default.html$/.test(path)) {
212214
$.get("documentation/docs-" + path.match(/demos\/(.+)\//)[1] + ".html", function(html) {
213215
$("#demo-source").after(html);
@@ -241,7 +243,7 @@
241243
$('#demo-notes').show();
242244
notes.hide();
243245
}
244-
246+
245247
function updateDemoSource(source) {
246248
if ($('#demo-source').length == 0) {
247249
$('<div id="demo-source"><a href="#" class="source-closed">View Source</a><div><pre><code></code></pre></div></div>').insertAfter('#demo-notes');
@@ -257,12 +259,12 @@
257259

258260
$('#demo-source code').empty().text(cleanedSource);
259261
}
260-
262+
261263
function resetDemos() {
262264
$.datepicker.setDefaults($.extend({showMonthAfterYear: false}, $.datepicker.regional['']));
263-
$(".ui-dialog-content").remove();
265+
$(".ui-dialog-content").remove();
264266
}
265-
267+
266268
});
267269
</script>
268270
</head>
@@ -285,6 +287,8 @@
285287
<dd><a href="datepicker/index.html">Datepicker</a></dd>
286288
<dd><a href="dialog/index.html">Dialog</a></dd>
287289
<dd><a href="menu/index.html">Menu</a></dd>
290+
<dd><a href="menubar/index.html">Menubar</a></dd>
291+
<dd><a href="popup/index.html">Popup</a></dd>
288292
<dd><a href="progressbar/index.html">Progressbar</a></dd>
289293
<dd><a href="slider/index.html">Slider</a></dd>
290294
<dd><a href="spinner/index.html">Spinner</a></dd>
@@ -305,7 +309,7 @@
305309
<dd><a href="widget/index.html">Widget</a></dd>
306310
<dt>About jQuery UI</dt>
307311
<dd><a href="http://jqueryui.com/docs/Getting_Started">Getting Started</a></dd>
308-
<dd><a href="http://jqueryui.com/docs/Upgrade_Guide">Upgrade Guide</a></dd>
312+
<dd><a href="http://jqueryui.com/docs/Upgrade_Guide">Upgrade Guide</a></dd>
309313
<dd><a href="http://jqueryui.com/docs/Changelog">Changelog</a></dd>
310314
<dd><a href="http://jqueryui.com/docs/Roadmap">Roadmap</a></dd>
311315
<dd><a href="http://jqueryui.com/docs/Subversion">Subversion Access</a></dd>
@@ -326,7 +330,7 @@ <h3>Instructions</h3>
326330
<p>
327331
These demos showcase some common uses of each jQuery UI plugin. Simply copy and paste code from the demos to get started. Have fun playing with them.
328332
</p>
329-
333+
330334
</div>
331335

332336
</td>

demos/menu/contextmenu.html

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>jQuery UI Menu - Contextmenu demo</title>
6+
<link href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
7+
<script src="../../jquery-1.7.1.js"></script>
8+
<script src="../../ui/jquery.ui.core.js"></script>
9+
<script src="../../ui/jquery.ui.position.js"></script>
10+
<script src="../../ui/jquery.ui.widget.js"></script>
11+
<script src="../../ui/jquery.ui.menu.js"></script>
12+
<script src="../../ui/jquery.ui.button.js"></script>
13+
<script src="../../ui/jquery.ui.popup.js"></script>
14+
<link href="../demos.css" rel="stylesheet" />
15+
<script>
16+
$(function() {
17+
var btn = $(".demo button").button({
18+
icons: {
19+
primary: "ui-icon-home",
20+
secondary: "ui-icon-triangle-1-s"
21+
}
22+
});
23+
$("#cities").menu({
24+
select: function(event, ui) {
25+
$("#log").append("<div>Selected " + ui.item.text() + "</div>");
26+
},
27+
trigger : btn});
28+
});
29+
</script>
30+
<style>
31+
.ui-menu { width: 200px; position: absolute; }
32+
</style>
33+
</head>
34+
<body>
35+
36+
<div class="demo">
37+
38+
<button>Select a city</button>
39+
<ul id="cities">
40+
<li><a href="#Amsterdam">Amsterdam</a></li>
41+
<li><a href="#Anaheim">Anaheim</a></li>
42+
<li><a href="#Cologne">Cologne</a></li>
43+
<li><a href="#Frankfurt">Frankfurt</a></li>
44+
<li><a href="#Magdeburg">Magdeburg</a></li>
45+
<li><a href="#Munich">Munich</a></li>
46+
<li><a href="#Utrecht">Utrecht</a></li>
47+
<li><a href="#Zurich">Zurich</a></li>
48+
</ul>
49+
50+
<div id="log"></div>
51+
52+
</div><!-- End demo -->
53+
54+
<div class="demo-description">
55+
56+
<p>A simple contextmenu: Click the button, or tab to it and hit space to open the menu. Use the mouse or cursor keys to select an item, click it or hit enter to select it.</p>
57+
58+
<p>The keyboard handling is part of the menu. Using the input option to menu is configured to add the key event handlers to the button, as that button gets focused when clicked.</p>
59+
60+
</div><!-- End demo-description -->
61+
62+
63+
64+
</body>
65+
</html>

0 commit comments

Comments
 (0)