aboutsummaryrefslogtreecommitdiffstats
path: root/tests/visual
diff options
context:
space:
mode:
Diffstat (limited to 'tests/visual')
-rw-r--r--tests/visual/effects.all.html12
-rw-r--r--tests/visual/effects.all.js20
-rw-r--r--tests/visual/menu/contextmenu.html191
-rw-r--r--tests/visual/menu/menubar.html232
-rw-r--r--tests/visual/menu/menubar.js234
-rw-r--r--tests/visual/menu/popup.html176
-rw-r--r--tests/visual/menu/popup.js124
7 files changed, 27 insertions, 962 deletions
diff --git a/tests/visual/effects.all.html b/tests/visual/effects.all.html
index 1fc35f700..fed35de8a 100644
--- a/tests/visual/effects.all.html
+++ b/tests/visual/effects.all.html
@@ -146,6 +146,18 @@
</li>
<li>
+ <div class="effect" id="size">
+ <p>Size Default Show/Hide</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="sizeToggle">
+ <p>Size Toggle</p>
+ </div>
+ </li>
+
+ <li>
<div class="effect" id="slideDown">
<p>Slide down</p>
</div>
diff --git a/tests/visual/effects.all.js b/tests/visual/effects.all.js
index 9cf7487c9..a28c41a89 100644
--- a/tests/visual/effects.all.js
+++ b/tests/visual/effects.all.js
@@ -30,10 +30,10 @@ $(function() {
var el = $(this);
el.addClass("current").hide(duration, function() {
setTimeout(function() {
- el.show(duration, function() { el.removeClass("current") });
+ el.show(duration, function() { el.removeClass("current"); });
}, wait);
- })
- })
+ });
+ });
effect("#blindLeft", "blind", { direction: "left" });
effect("#blindUp", "blind", { direction: "up" });
@@ -63,6 +63,16 @@ $(function() {
effect("#puff", "puff", { times: 2 });
effect("#scale", "scale", {});
+ effect("#size", "size", {});
+ $("#sizeToggle").bind("click", function() {
+ var opts = { to: { width: 300, height: 300 }};
+ $(this).addClass('current')
+ .toggle("size", opts, duration)
+ .delay(wait)
+ .toggle("size", opts, duration, function() {
+ $(this).removeClass("current");
+ });
+ });
$("#shake").bind("click", function() { $(this).addClass("current").effect("shake", {}, 100, function() { $(this).removeClass("current"); }); });
@@ -84,13 +94,13 @@ $(function() {
$("#removeClass").click(function() {
$(this).addClass("current").removeClass(function() {
window.console && console.log(arguments);
- return "current"
+ return "current";
}, duration);
});
$("#toggleClass").click(function() {
$(this).toggleClass(function() {
window.console && console.log(arguments);
- return "current"
+ return "current";
}, duration);
});
});
diff --git a/tests/visual/menu/contextmenu.html b/tests/visual/menu/contextmenu.html
deleted file mode 100644
index 63d9877a0..000000000
--- a/tests/visual/menu/contextmenu.html
+++ /dev/null
@@ -1,191 +0,0 @@
-<!doctype html>
-<html>
-<head>
- <title>Menu Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.5.1.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
- <!--
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- -->
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- // TODO close other menus when opening a new one
- $("button").each(function() {
- $(this).next().menu({
- /* top-alignment
- position: function(item) {
- return {
- my: "left top",
- at: "right top",
- of: item.parent()
- }
- },
- */
- select: function(event, ui) {
- $(this).hide().prev().focus();
- $("#log").append("<div>Selected " + ui.item.text() + "</div>");
- }
- }).hide();
-
- // equal height
- //menu.find("ul").height(menu.height());
- }).click(function(event) {
- // required to prevent the click handler below from handling this event
- event.stopPropagation();
- var menu = $("#menu" + this.id).menu("blur").show().position({
- my: "left top",
- at: "right top",
- of: event.pageX > 0 ? event : this
- }).focus();
- $(document).one("click", function() {
- menu.menu("closeAll").menu("widget").hide();
- })
- }).next().keydown(function(event) {
- var menu = $(this).data("menu");
- if (menu.widget().is(":hidden"))
- return;
- event.stopPropagation();
- switch (event.keyCode) {
- case $.ui.keyCode.TAB:
- menu.closeAll();
- menu.widget().hide();
- $(this).prev().focus()
- break;
- case $.ui.keyCode.ESCAPE:
- menu.closeAll();
- menu.widget().hide();
- $(this).prev().focus()
- break;
- default:
-
- }
- });
- });
- </script>
- <style>
- body { font-size:62.5%; }
- .ui-menu { width: 200px; position: absolute; }
- #menu3 { height: 200px; overflow: auto; }
- </style>
-</head>
-<body>
-
-<button id="1">Show context menu 1</button>
-<ul id="menu1">
- <li><a href="#">Amsterdam</a></li>
- <li><a href="#">Anaheim</a></li>
- <li><a href="#">Cologne</a></li>
- <li><a href="#">Frankfurt</a></li>
- <li><a href="#">Magdeburg</a></li>
- <li><a href="#">Munich</a></li>
- <li><a href="#">Utrecht</a></li>
- <li><a href="#">Zurich</a></li>
-</ul>
-
-<button id="2">Show context menu 2</button>
-<ul id="menu2">
- <li>
- <a id="a1" href="#">Amsterdam</a>
- <ul>
- <li><a id="b1" href="#">Aberdeen</a></li>
- <li><a id="b2" href="#">Ada</a></li>
- <li>
- <a href="#">Adamsville</a>
- <ul>
- <li><a href="#">Anaheim</a></li>
- <li>
- <a href="#">Cologne</a>
- <ul>
- <li><a href="#">Mberdeen</a></li>
- <li><a href="#">Mda</a></li>
- <li><a href="#">Mdamsville</a></li>
- <li><a href="#">Mddyston</a></li>
- <li><a href="#">Mmesville</a></li>
- </ul>
- </li>
- <li><a href="#">Frankfurt</a></li>
- </ul>
- </li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Amesville</a></li>
- </ul>
- </li>
- <li><a id="a2" href="#">Anaheim</a></li>
- <li><a id="a3" href="#">Cologne</a></li>
- <li><a href="#">Frankfurt</a></li>
- <li>
- <a href="#">Magdeburg</a>
- <ul>
- <li><a href="#">Mberdeen</a></li>
- <li><a href="#">Mda</a></li>
- <li><a href="#">Mdamsville</a></li>
- <li><a href="#">Mddyston</a></li>
- <li><a href="#">Mmesville</a></li>
- </ul>
- </li>
- <li><a href="#">Munich</a></li>
- <li><a href="#">Utrecht</a></li>
- <li><a href="#">Zurich</a></li>
-</ul>
-
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-<button id="3">Show context menu 3</button>
-<ul id="menu3">
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
- <li><a href="#">Adena</a></li>
- <li><a href="#">Adrian</a></li>
- <li><a href="#">Akron</a></li>
- <li><a href="#">Albany</a></li>
- <li><a href="#">Alexandria</a></li>
- <li><a href="#">Alger</a></li>
- <li><a href="#">Alledonia</a></li>
- <li><a href="#">Alliance</a></li>
- <li><a href="#">Alpha</a></li>
- <li><a href="#">Alvada</a></li>
- <li><a href="#">Alvordton</a></li>
- <li><a href="#">Amanda</a></li>
- <li><a href="#">Amelia</a></li>
- <li><a href="#">Amesville</a></li>
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
- <li><a href="#">Adena</a></li>
- <li><a href="#">Adrian</a></li>
- <li><a href="#">Akron</a></li>
- <li><a href="#">Albany</a></li>
- <li><a href="#">Alexandria</a></li>
- <li><a href="#">Alger</a></li>
- <li><a href="#">Alledonia</a></li>
- <li><a href="#">Alliance</a></li>
- <li><a href="#">Alpha</a></li>
- <li><a href="#">Alvada</a></li>
- <li><a href="#">Alvordton</a></li>
- <li><a href="#">Amanda</a></li>
- <li><a href="#">Amelia</a></li>
- <li><a href="#">Amesville</a></li>
-</ul>
-
-</body>
-</html>
diff --git a/tests/visual/menu/menubar.html b/tests/visual/menu/menubar.html
deleted file mode 100644
index d2185e97c..000000000
--- a/tests/visual/menu/menubar.html
+++ /dev/null
@@ -1,232 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
- <title>Menu Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.5.1.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
- <script type="text/javascript" src="menubar.js"></script>
- <!--
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- -->
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- $("td:has(.menubar)").clone().appendTo("tbody tr:not(:first)");
-
- $("#bar1, .menubar").menubar({
- select: function(event, ui) {
- $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
- }
- });
-
- $(".menubar-icons").menubar({
- menuIcon: true,
- buttons: true,
- select: function(event, ui) {
- $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
- }
- });
- });
- </script>
- <style type="text/css">
- body { font-size:62.5%; }
- #bar1, #bar2 { margin: 0 0 4em; } /* style for this page only */
- .ui-menu { width: 200px; position: absolute; outline: none; z-index: 9999; }
- .ui-menu .ui-icon { float: right; }
- .ui-menu li.ui-state-disabled {
- font-weight: bold;
- padding: .0em .4em;
- margin: .4em 0 .2em;
- line-height: 1.5;
- }
-
- /* menubar styles */
- .ui-menubar .ui-button { float: left; font-weight: normal; border-top-width: 0 !important; border-bottom-width: 0 !important; margin: 0; outline: none; }
- .ui-menubar .ui-menubar-link { border-right: 1px dashed transparent; border-left: 1px dashed transparent; }
-
- .ui-menubar {
- list-style: none;
- margin: 0;
- padding-left: 0;
- }
-
- .ui-menubar-item {
- float: left;
- }
-
- table {
- border-collapse: collapse;
- }
- th, td {
- padding: 0.5em;
- border: 1px solid black;
- }
- </style>
-</head>
-<body>
-
-<ul id="bar1" class="menubar">
- <li>
- <a href="#">File</a>
- <ul>
- <li><a href="#">Open...</a></li>
- <li class="ui-state-disabled">Open recent...</li>
- <li><a href="#">Save</a></li>
- <li><a href="#">Save as...</a></li>
- <li><a href="#">Close</a></li>
- <li><a href="#">Quit</a></li>
- </ul>
- </li>
- <li>
- <a href="#">Edit</a>
- <ul>
- <li><a href="#">Copy</a></li>
- <li><a href="#">Cut</a></li>
- <li class="ui-state-disabled">Paste</li>
- </ul>
- </li>
- <li>
- <a href="#">View</a>
- <ul>
- <li><a href="#">Fullscreen</a></li>
- <li><a href="#">Fit into view</a></li>
- <li>
- <a href="#">Encoding</a>
- <ul>
- <li><a href="#">Auto-detect</a></li>
- <li><a href="#">UTF-8</a></li>
- <li>
- <a href="#">UTF-16</a>
- <ul>
- <li><a href="#">Option 1</a></li>
- <li><a href="#">Option 2</a></li>
- <li><a href="#">Option 3</a></li>
- <li><a href="#">Option 4</a></li>
- </ul>
- </li>
- </ul>
- </li>
- <li><a href="#">Customize...</a></li>
- </ul>
- </li>
-</ul>
-
-<ul id="bar2" class="menubar-icons">
- <li>
- <a href="#">File</a>
- <ul>
- <li><a href="#">Open...</a></li>
- <li class="ui-state-disabled">Open recent...</li>
- <li><a href="#">Save</a></li>
- <li><a href="#">Save as...</a></li>
- <li><a href="#">Close</a></li>
- <li><a href="#">Quit</a></li>
- </ul>
- </li>
- <li>
- <a href="#">Edit</a>
- <ul>
- <li><a href="#">Copy</a></li>
- <li><a href="#">Cut</a></li>
- <li class="ui-state-disabled">Paste</li>
- </ul>
- </li>
- <li>
- <a href="#">View</a>
- <ul>
- <li><a href="#">Fullscreen</a></li>
- <li><a href="#">Fit into view</a></li>
- <li>
- <a href="#">Encoding</a>
- <ul>
- <li><a href="#">Auto-detect</a></li>
- <li><a href="#">UTF-8</a></li>
- <li>
- <a href="#">UTF-16</a>
- <ul>
- <li><a href="#">Option 1</a></li>
- <li><a href="#">Option 2</a></li>
- <li><a href="#">Option 3</a></li>
- <li><a href="#">Option 4</a></li>
- </ul>
- </li>
- </ul>
- </li>
- <li><a href="#">Customize...</a></li>
- </ul>
- </li>
-</ul>
-
-<table id="movies" class="ui-widget">
- <thead>
- <tr>
- <th data-field="Name" class="ui-widget-header">Name</th>
- <th data-field="ReleaseYear" class="ui-widget-header">Release Year</th>
- <th data-field="AverageRating" class="ui-widget-header">Average Rating</th>
- <th class="ui-widget-header"></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-widget-content">Red Hot Chili Peppers: Funky Monks</td>
- <td class="ui-widget-content">1993</td>
- <td class="ui-widget-content">3.6</td>
- <td class="ui-widget-content">
- <ul class="menubar">
- <li>
- <a href="#">Options</a>
- <ul>
- <li><a href="#">Order...</a></li>
- <li class="ui-state-disabled">Write a Review...</li>
- <li><a href="#">Find Similar Movies...</a></li>
- <li>
- <a href="#">Rate</a>
- <ul>
- <li><a href="#">5 stars</a></li>
- <li><a href="#">4 stars</a></li>
- <li><a href="#">3 stars</a></li>
- <li><a href="#">2 stars</a></li>
- <li><a href="#">1 stars</a></li>
- </ul>
- </li>
- </ul>
- </li>
- </ul>
- </td>
- </tr>
- <tr>
- <td class="ui-widget-content">Rod Stewart: Storyteller 1984-1991</td>
- <td class="ui-widget-content">1991</td>
- <td class="ui-widget-content">3.1</td>
- </tr>
- <tr>
- <td class="ui-widget-content">Stevie Ray Vaughan and Double Trouble: Live at the El Mocambo 1983</td>
- <td class="ui-widget-content">1991</td>
- <td class="ui-widget-content">3.9</td>
- </tr>
- <tr>
- <td class="ui-widget-content">Spike and Mike's Sick &amp; Twisted Festival of Animation</td>
- <td class="ui-widget-content">1997</td>
- <td class="ui-widget-content">2.6</td>
- </tr>
- </tbody>
-</table>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</body>
-</html>
diff --git a/tests/visual/menu/menubar.js b/tests/visual/menu/menubar.js
deleted file mode 100644
index cc3258d4a..000000000
--- a/tests/visual/menu/menubar.js
+++ /dev/null
@@ -1,234 +0,0 @@
-/*
- * jQuery UI menubar
- *
- * backported from Michael Lang's fork: http://www.nexul.com/prototypes/toolbar/demo.html
- */
-(function($) {
-
-// TODO take non-menubar buttons into account
-$.widget("ui.menubar", {
- options: {
- buttons: false,
- menuIcon: false
- },
- _create: function() {
- var self = this;
- var items = this.items = this.element.children("li")
- .addClass("ui-menubar-item")
- .attr("role", "presentation")
- .children("button, a");
- items.slice(1).attr("tabIndex", -1);
- var o = this.options;
-
- this.element.addClass('ui-menubar ui-widget-header ui-helper-clearfix').attr("role", "menubar");
- this._focusable(items);
- this._hoverable(items);
- items.next("ul").each(function(i, elm) {
- $(elm).menu({
- select: function(event, ui) {
- ui.item.parents("ul.ui-menu:last").hide();
- self._trigger( "select", event, ui );
- self._close();
- $(event.target).prev().focus();
- }
- }).hide()
- .attr("aria-hidden", "true")
- .attr("aria-expanded", "false")
- .keydown(function(event) {
- var menu = $(this);
- if (menu.is(":hidden"))
- return;
- switch (event.keyCode) {
- case $.ui.keyCode.LEFT:
- self._left(event);
- event.preventDefault();
- break;
- case $.ui.keyCode.RIGHT:
- self._right(event);
- event.preventDefault();
- break;
- };
- })
- });
- items.each(function() {
- var input = $(this),
- menu = input.next("ul");
-
- input.bind("click focus mouseenter", function(event) {
- // ignore triggered focus event
- if (event.type == "focus" && !event.originalEvent) {
- return;
- }
- event.preventDefault();
- if (event.type == "click" && menu.is(":visible") && self.active && self.active[0] == menu[0]) {
- self._close();
- return;
- }
- if ((self.open && event.type == "mouseenter") || event.type == "click") {
- self._open(event, menu);
- }
- })
- .bind( "keydown", function( event ) {
- switch ( event.keyCode ) {
- case $.ui.keyCode.SPACE:
- case $.ui.keyCode.UP:
- case $.ui.keyCode.DOWN:
- self._open( event, $( this ).next() );
- event.preventDefault();
- break;
- case $.ui.keyCode.LEFT:
- self._prev( event, $( this ) );
- event.preventDefault();
- break;
- case $.ui.keyCode.RIGHT:
- self._next( event, $( this ) );
- event.preventDefault();
- break;
- }
- })
- .addClass("ui-button ui-widget ui-button-text-only ui-menubar-link")
- .attr("role", "menuitem")
- .attr("aria-haspopup", "true")
- .wrapInner("<span class='ui-button-text'></span>");
-
- if (o.menuIcon) {
- input.addClass("ui-state-default").append("<span class='ui-button-icon-secondary ui-icon ui-icon-triangle-1-s'></span>");
- input.removeClass("ui-button-text-only").addClass("ui-button-text-icon-secondary");
- }
-
- if (!o.buttons) {
- input.addClass('ui-menubar-link').removeClass('ui-state-default');
- };
-
- });
- self._bind({
- keydown: function(event) {
- if (event.keyCode == $.ui.keyCode.ESCAPE) {
- if (self.active && self.active.menu("left", event) !== true) {
- var active = self.active;
- self.active.blur();
- self._close( event );
- active.prev().focus();
- }
- }
- },
- focusout : function( event ) {
- self.closeTimer = setTimeout(function() {
- self._close( event );
- }, 100);
- },
- focusin :function( event ) {
- clearTimeout(self.closeTimer);
- }
- });
- },
-
- _destroy : function() {
- var items = this.element.children("li")
- .removeClass("ui-menubar-item")
- .removeAttr("role", "presentation")
- .children("button, a");
-
- this.element.removeClass('ui-menubar ui-widget-header ui-helper-clearfix').removeAttr("role", "menubar").unbind(".menubar");;
- items.unbind("focusin focusout click focus mouseenter keydown");
-
- items
- .removeClass("ui-button ui-widget ui-button-text-only ui-menubar-link ui-state-default")
- .removeAttr("role", "menuitem")
- .removeAttr("aria-haspopup", "true")
- .children("span.ui-button-text").each(function(i, e) {
- var item = $(this);
- item.parent().html(item.html());
- })
- .end()
- .children(".ui-icon").remove();
-
- $(document).unbind(".menubar");
-
- this.element.find(":ui-menu").menu("destroy")
- .show()
- .removeAttr("aria-hidden", "true")
- .removeAttr("aria-expanded", "false")
- .removeAttr("tabindex")
- .unbind("keydown", "blur")
- ;
- },
-
- _close: function() {
- if (!this.active || !this.active.length)
- return;
- this.active.menu("closeAll").hide().attr("aria-hidden", "true").attr("aria-expanded", "false");
- this.active.prev().removeClass("ui-state-active").removeAttr("tabIndex");
- this.active = null;
- this.open = false;
- },
-
- _open: function(event, menu) {
- // on a single-button menubar, ignore reopening the same menu
- if (this.active && this.active[0] == menu[0]) {
- return;
- }
- // almost the same as _close above, but don't remove tabIndex
- if (this.active) {
- this.active.menu("closeAll").hide().attr("aria-hidden", "true").attr("aria-expanded", "false");
- this.active.prev().removeClass("ui-state-active");
- }
- // set tabIndex -1 to have the button skipped on shift-tab when menu is open (it gets focus)
- var button = menu.prev().addClass("ui-state-active").attr("tabIndex", -1);
- this.active = menu.show().position({
- my: "left top",
- at: "left bottom",
- of: button
- })
- .removeAttr("aria-hidden").attr("aria-expanded", "true")
- .menu("focus", event, menu.children("li").first())
- .focus()
- .focusin()
- ;
- this.open = true;
- },
-
- _prev: function( event, button ) {
- button.attr("tabIndex", -1);
- var prev = button.parent().prevAll("li").children( ".ui-button" ).eq( 0 );
- if (prev.length) {
- prev.removeAttr("tabIndex")[0].focus();
- } else {
- var lastItem = this.element.children("li:last").children(".ui-button:last");
- lastItem.removeAttr("tabIndex")[0].focus();
- }
- },
-
- _next: function( event, button ) {
- button.attr("tabIndex", -1);
- var next = button.parent().nextAll("li").children( ".ui-button" ).eq( 0 );
- if (next.length) {
- next.removeAttr("tabIndex")[0].focus();
- } else {
- var firstItem = this.element.children("li:first").children(".ui-button:first");
- firstItem.removeAttr("tabIndex")[0].focus();
- }
- },
-
- _left: function(event) {
- var prev = this.active.parent().prevAll("li:eq(0)").children( ".ui-menu" ).eq( 0 );
- if (prev.length) {
- this._open(event, prev);
- } else {
- var lastItem = this.element.children("li:last").children(".ui-menu:first");
- this._open(event, lastItem);
- }
- },
-
- _right: function(event) {
- var next = this.active.parent().nextAll("li:eq(0)").children( ".ui-menu" ).eq( 0 );
- if (next.length) {
- this._open(event, next);
- } else {
- var firstItem = this.element.children("li:first").children(".ui-menu:first");
- this._open(event, firstItem);
- }
- }
-});
-
-}(jQuery));
diff --git a/tests/visual/menu/popup.html b/tests/visual/menu/popup.html
deleted file mode 100644
index 271002a20..000000000
--- a/tests/visual/menu/popup.html
+++ /dev/null
@@ -1,176 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
- <title>Visual Test for Popup Utility</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.5.1.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
- <script type="text/javascript" src="popup.js"></script>
- <!--
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- -->
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- var selected = {
- select: function( event, ui ) {
- $( "<div/>" ).text( "Selected: " + ui.item.text() ).appendTo( "#log" );
- $(this).hide();
- }
- };
-
- $("#members-popup").popup();
-
- $("#button1").button();
- $("#menu1").menu(selected).popup();
-
- $( "#rerun" )
- .button()
- .click(function() {
- alert( "Running the last action" );
- })
- .next()
- .button({
- text: false,
- icons: {
- primary: "ui-icon-triangle-1-s"
- }
- })
- .parent()
- .buttonset()
- .next()
- .menu(selected)
- .popup({
- trigger: $("#select")
- });
-
- $("td:has(.menubar)").clone().appendTo("tbody tr:not(:first)");
- $("table .menubar > ul").menu(selected).popup().prev().button();
- });
- </script>
- <style type="text/css">
- body { font-size:62.5%; }
-
- .ui-popup { position: absolute; z-index: 5000; }
- .ui-menu { width: 200px; }
-
- table {
- border-collapse: collapse;
- }
- th, td {
- padding: 0.5em;
- border: 1px solid black;
- }
-
- #members-popup {
- width: 200px; height: 150px; border: 1px solid gray; border-radius: 5px;
- box-shadow: 3px 3px 5px -1px rgba(0, 0, 0, 0.5);
- background: lightgray; background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ddd));
- font-size: 120%; text-align: center; line-height: 150px;
- }
- </style>
-</head>
-<body>
-
-<div>
- <a href="#members-popup">Project members</a>
- <div id="members-popup" tabIndex="0">
- some form controls in here
- </div>
-</div>
-
-<button id="button1">Show context menu 1</button>
-<ul id="menu1">
- <li><a href="#">Amsterdam</a></li>
- <li><a href="#">Anaheim</a></li>
- <li><a href="#">Cologne</a></li>
- <li><a href="#">Frankfurt</a></li>
- <li><a href="#">Magdeburg</a></li>
- <li><a href="#">Munich</a></li>
- <li><a href="#">Utrecht</a></li>
- <li><a href="#">Zurich</a></li>
-</ul>
-
-
-<div>
- <div>
- <button id="rerun">Run last action</button>
- <button id="select">Select an action</button>
- </div>
- <ul>
- <li><a href="#">Open...</a></li>
- <li><a href="#">Save</a></li>
- <li><a href="#">Delete</a></li>
- </ul>
-</div>
-
-<table id="movies" class="ui-widget">
- <thead>
- <tr>
- <th data-field="Name" class="ui-widget-header">Name</th>
- <th data-field="ReleaseYear" class="ui-widget-header">Release Year</th>
- <th data-field="AverageRating" class="ui-widget-header">Average Rating</th>
- <th class="ui-widget-header"></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-widget-content">Red Hot Chili Peppers: Funky Monks</td>
- <td class="ui-widget-content">1993</td>
- <td class="ui-widget-content">3.6</td>
- <td class="ui-widget-content">
- <div class="menubar">
- <a href="#">Options</a>
- <ul>
- <li><a href="#">Order...</a></li>
- <li class="ui-state-disabled">Write a Review...</li>
- <li><a href="#">Find Similar Movies...</a></li>
- <li>
- <a href="#">Rate</a>
- <ul>
- <li><a href="#">5 stars</a></li>
- <li><a href="#">4 stars</a></li>
- <li><a href="#">3 stars</a></li>
- <li><a href="#">2 stars</a></li>
- <li><a href="#">1 stars</a></li>
- </ul>
- </li>
- </ul>
- </div>
- </td>
- </tr>
- <tr>
- <td class="ui-widget-content">Rod Stewart: Storyteller 1984-1991</td>
- <td class="ui-widget-content">1991</td>
- <td class="ui-widget-content">3.1</td>
- </tr>
- <tr>
- <td class="ui-widget-content">Stevie Ray Vaughan and Double Trouble: Live at the El Mocambo 1983</td>
- <td class="ui-widget-content">1991</td>
- <td class="ui-widget-content">3.9</td>
- </tr>
- <tr>
- <td class="ui-widget-content">Spike and Mike's Sick &amp; Twisted Festival of Animation</td>
- <td class="ui-widget-content">1997</td>
- <td class="ui-widget-content">2.6</td>
- </tr>
- </tbody>
-</table>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</body>
-</html>
diff --git a/tests/visual/menu/popup.js b/tests/visual/menu/popup.js
deleted file mode 100644
index f57cba699..000000000
--- a/tests/visual/menu/popup.js
+++ /dev/null
@@ -1,124 +0,0 @@
-/*
- * jQuery UI popup utility
- */
-(function($) {
-
-var idIncrement = 0;
-
-$.widget( "ui.popup", {
- options: {
- position: {
- my: "left top",
- at: "left bottom"
- }
- },
- _create: function() {
- if ( !this.options.trigger ) {
- this.options.trigger = this.element.prev();
- }
-
- if ( !this.element.attr( "id" ) ) {
- this.element.attr( "id", "ui-popup-" + idIncrement++ );
- this.generatedId = true;
- }
-
- if ( !this.element.attr( "role" ) ) {
- // TODO alternatives to tooltip are dialog and menu, all three aren't generic popups
- this.element.attr( "role", "tooltip" );
- this.generatedRole = true;
- }
-
- this.options.trigger
- .attr( "aria-haspopup", true )
- .attr( "aria-owns", this.element.attr( "id" ) );
-
- this.element
- .addClass("ui-popup")
- this._close();
-
- this._bind(this.options.trigger, {
- click: function( event ) {
- event.preventDefault();
- var that = this;
- setTimeout(function() {
- that._open( event );
- }, 1);
- }
- });
-
- this._bind(this.element, {
- blur: "_close"
- });
-
- this._bind({
- keyup: function( event ) {
- if (event.keyCode == $.ui.keyCode.ESCAPE && this.element.is( ":visible" )) {
- this._close( event );
- this.options.trigger.focus();
- }
- }
- });
-
- this._bind(document, {
- click: function( event ) {
- if (this.open && !$(event.target).closest(".ui-popup").length) {
- this._close( event );
- }
- }
- })
- },
-
- _destroy: function() {
- this.element
- .show()
- .removeClass( "ui-popup" )
- .removeAttr( "aria-hidden" )
- .removeAttr( "aria-expanded" );
-
- this.options.trigger
- .removeAttr( "aria-haspopup" )
- .removeAttr( "aria-owns" );
-
- if ( this.generatedId ) {
- this.element.removeAttr( "id" );
- }
- if ( this.generatedRole ) {
- this.element.removeAttr( "role" );
- }
- },
-
- _open: function( event ) {
- var position = $.extend( {}, {
- of: this.options.trigger
- }, this.options.position );
-
- this.element
- .show()
- .attr( "aria-hidden", false )
- .attr( "aria-expanded", true )
- .position( position )
- .focus();
-
- // take trigger out of tab order to allow shift-tab to skip trigger
- this.options.trigger.attr("tabindex", -1);
-
- this.open = true;
- this._trigger( "open", event );
- },
-
- _close: function( event ) {
- this.element
- .hide()
- .attr( "aria-hidden", true )
- .attr( "aria-expanded", false );
-
- this.options.trigger.attr("tabindex", 0);
-
- this.open = false;
- this._trigger( "close", event );
- }
-
-
-});
-
-}(jQuery));