diff options
Diffstat (limited to 'tests/visual')
| -rw-r--r-- | tests/visual/menu/contextmenu.html | 191 | ||||
| -rw-r--r-- | tests/visual/menu/menubar.html | 232 | ||||
| -rw-r--r-- | tests/visual/menu/popup.html | 176 |
3 files changed, 0 insertions, 599 deletions
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 3d7a3e59c..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="../../../ui/jquery.ui.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 & 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.html b/tests/visual/menu/popup.html deleted file mode 100644 index de27208b4..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="../../../ui/jquery.ui.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).popup("close"); - } - }; - - $("#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; outline: none; - } - </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 & 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> |