Skip to content

Commit d61e065

Browse files
gnarfgnarf
committed
Merge branch 'master' into effects-unit
2 parents c5c65db + f5ee22c commit d61e065

28 files changed

+593
-236
lines changed

‎demos/tooltip/custom-animation.html

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,14 @@
1111
<link type="text/css" href="../demos.css" rel="stylesheet" />
1212
<script type="text/javascript">
1313
$(function() {
14-
// TODO overhaul this with custom animation API
1514
$(".demo").tooltip({
16-
open: function() {
17-
$(".ui-tooltip").stop(false, true).hide().slideDown();
15+
show: {
16+
effect: "slideDown",
17+
delay: 250
1818
},
19-
close: function() {
20-
$(".ui-tooltip").stop(false, false).show().slideUp(function() {
21-
$(this).remove();
22-
});
19+
hide: {
20+
effect: "hide",
21+
delay: 250
2322
}
2423
});
2524
});
@@ -48,7 +47,9 @@
4847

4948
<div class="demo-description">
5049

51-
<p>Here the tooltips are positioned relative to the mouse, and follow the mouse while it moves above the element.</p>
50+
<p>This demo shows how to customize animations. The tooltip is shown, after a
51+
delay of 250ms, using a slide down animation, and hidden, after another delay,
52+
without an animation.</p>
5253

5354
</div><!-- End demo-description -->
5455

‎demos/tooltip/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ <h4>Examples</h4>
1414
<li><a href="tracking.html">Track the mouse</a></li>
1515
<li><a href="custom-animation.html">Custom animation</a></li>
1616
<li><a href="delegation-mixbag.html">Delegation Mixbag</a></li>
17-
<li><a href="lots.html">Lots</a></li>
17+
<li><a href="video-player.html">Video Player</a></li>
1818
</ul>
1919
</div>
2020

‎demos/tooltip/video-player.html

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<title>jQuery UI Tooltip - Video Player demo</title>
5+
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
6+
<script type="text/javascript" src="../../jquery-1.5.1.js"></script>
7+
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
8+
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
9+
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
10+
<script type="text/javascript" src="../../ui/jquery.ui.tooltip.js"></script>
11+
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
12+
<script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script>
13+
<script type="text/javascript" src="../../tests/visual/menu/popup.js"></script>
14+
<link type="text/css" href="../demos.css" rel="stylesheet" />
15+
<script type="text/javascript">
16+
$(function() {
17+
$("button").each(function() {
18+
$(this).button({
19+
icons: {
20+
primary: $(this).data("icon")
21+
},
22+
text: !!$(this).attr("title")
23+
});
24+
});
25+
$(".set").buttonset();
26+
27+
// TODO hide the tooltip when clicking the button
28+
$("ul").menu().popup({
29+
trigger: $(".menu")
30+
});
31+
32+
$(".demo").tooltip({
33+
position: {
34+
my: "center top",
35+
at: "center bottom+5",
36+
},
37+
show: {
38+
duration: "fast"
39+
},
40+
hide: {
41+
effect: "hide"
42+
}
43+
});
44+
});
45+
</script>
46+
<style>
47+
.player { width: 500px; height: 300px; border: 2px groove gray; background: rgb(200, 200, 200); text-align: center; line-height: 300px; }
48+
/* TODO load from jquery.ui.popup.css */
49+
.ui-popup { position: absolute; z-index: 5000; }
50+
51+
.ui-tooltip {
52+
border: 1px solid white;
53+
background: rgba(20, 20, 20, 1);
54+
color: white;
55+
}
56+
</style>
57+
</head>
58+
<body>
59+
60+
<div class="demo">
61+
62+
<div class="player">Here Be Video (HTML5?)</div>
63+
<div class="tools">
64+
<span class="set">
65+
<button data-icon="ui-icon-circle-arrow-n" title="I like this">Like</button>
66+
<button data-icon="ui-icon-circle-arrow-s">I dislike this</button>
67+
</span>
68+
<span class="set">
69+
<button data-icon="ui-icon-circle-plus" title="Add to Watch Later">Add to</button>
70+
<button class="menu" data-icon="ui-icon-triangle-1-s">Add to favorites or playlist</button>
71+
</span>
72+
<button title="Share this video">Share</button>
73+
<button data-icon="ui-icon-alert">Flag as inappropiate</button>
74+
<ul>
75+
<li>
76+
<a href="#">Favorites</a>
77+
</li>
78+
<li>
79+
<a href="#">Watch Later</a>
80+
</li>
81+
<li>
82+
<a href="#">New Playlist...</a>
83+
</li>
84+
</ul>
85+
</div>
86+
</div>
87+
88+
</div><!-- End demo -->
89+
90+
91+
92+
<div class="demo-description">
93+
94+
<p>A fake video player with like/share/stats button, each with a custom-styled tooltip.</p>
95+
96+
</div><!-- End demo-description -->
97+
98+
99+
100+
</body>
101+
</html>

‎tests/unit/menu/menu_core.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,23 +13,26 @@ test("accessibility", function () {
1313
var item0 = $("li:eq(0) a");
1414

1515
ok( ac.hasClass("ui-menu ui-widget ui-widget-content ui-corner-all"), "menu class");
16-
equals( ac.attr("role"), "listbox", "main role");
16+
equals( ac.attr("role"), "menu", "main role");
1717
ok( !ac.attr("aria-activedescendant"), "aria attribute not yet active");
18+
1819
var item = ac.find( "li:first" ).find( "a" ).attr( "id", "xid" ).end();
1920
ac.menu( "focus", $.Event(), item );
2021
equals( ac.attr("aria-activedescendant"), "xid", "aria attribute, id from dom");
22+
2123
var item = ac.find( "li:last" );
2224
ac.menu( "focus", $.Event(), item );
23-
equals( ac.attr("aria-activedescendant"), "menu1-activedescendant", "aria attribute, generated id");
25+
equals( ac.attr("aria-activedescendant"), "menu1-4", "aria attribute, generated id");
2426
});
2527

2628
test("items class and role", function () {
2729
var ac = $('#menu1').menu();
28-
expect(1 + 4 * $("li",ac).length);
30+
expect(1 + 5 * $("li",ac).length);
2931
ok( ($("li",ac).length > 0 ), "number of menu items");
3032
$("li",ac).each(function(item) {
3133
ok( $(this).hasClass("ui-menu-item"), "menu item ("+ item + ") class for item");
32-
equals( $(this).attr("role"), "menuitem", "menu item ("+ item + ") role");
34+
equals( $(this).attr("role"), "presentation", "menu item ("+ item + ") role");
35+
equals( $("a", this).attr("role"), "menuitem", "menu item ("+ item + ") role");
3336
ok( $("a",this).hasClass("ui-corner-all"), "a element class for menu item ("+ item + ") ");
3437
equals( $("a",this).attr("tabindex"), "-1", "a element tabindex for menu item ("+ item + ") ");
3538
});

‎tests/unit/position/position_core.js

Lines changed: 22 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
(function( $ ) {
22

3+
function scrollTopSupport() {
4+
$( window ).scrollTop( 1 );
5+
return $( window ).scrollTop() === 1;
6+
}
7+
38
module( "position" );
49

510
test( "my, at, of", function() {
@@ -161,11 +166,7 @@ test( "of", function() {
161166
left: $( window ).width() - 10
162167
}, "window as jQuery object" );
163168

164-
var scrollTopSupport = (function() {
165-
$( window ).scrollTop( 1 );
166-
return $( window ).scrollTop() === 1;
167-
}() );
168-
if ( scrollTopSupport ) {
169+
if ( scrollTopSupport() ) {
169170
$( window ).scrollTop( 500 ).scrollLeft( 200 );
170171
$( "#elx" ).position({
171172
my: "right bottom",
@@ -311,6 +312,22 @@ test( "collision: fit, with offset", function() {
311312
}, { top: 0, left: 0 }, "left top, negative offset" );
312313
});
313314

315+
test( "collision: fit, window scrolled", function() {
316+
if ( scrollTopSupport() ) {
317+
var win = $( window );
318+
win.scrollTop( 300 ).scrollLeft( 200 );
319+
collisionTest({
320+
collision: "fit",
321+
at: "left-100 top-100"
322+
}, { top: 300, left: 200 }, "top left" );
323+
collisionTest2({
324+
collision: "fit",
325+
at: "right+100 bottom+100"
326+
}, { top: 300 + win.height() - 10, left: 200 + win.width() - 10 }, "right bottom" );
327+
win.scrollTop( 0 ).scrollLeft( 0 );
328+
}
329+
});
330+
314331
test( "collision: flip, no offset", function() {
315332
collisionTest({
316333
collision: "flip"

0 commit comments

Comments
 (0)