aboutsummaryrefslogtreecommitdiffstats
path: root/tests
diff options
context:
space:
mode:
authorRichard Worth <rdworth@gmail.com>2008-06-09 05:42:13 +0000
committerRichard Worth <rdworth@gmail.com>2008-06-09 05:42:13 +0000
commitd2397d8d63a4e5325e0d6aff0ea8fc802da7468c (patch)
treea138e786989f50330da1d4eeb98a96aeb3e52a26 /tests
parent665f17ce2c12105697b98655a6c398dd2ad63b2f (diff)
downloadjquery-ui-d2397d8d63a4e5325e0d6aff0ea8fc802da7468c.tar.gz
jquery-ui-d2397d8d63a4e5325e0d6aff0ea8fc802da7468c.zip
added simple visual tests
Diffstat (limited to 'tests')
-rw-r--r--tests/visual/all.css73
-rw-r--r--tests/visual/all.html84
-rw-r--r--tests/visual/datepicker.html28
-rw-r--r--tests/visual/dialog.html30
-rw-r--r--tests/visual/draggable.html25
-rw-r--r--tests/visual/resizable.html26
-rw-r--r--tests/visual/selectable.html36
-rw-r--r--tests/visual/sortable.html36
8 files changed, 338 insertions, 0 deletions
diff --git a/tests/visual/all.css b/tests/visual/all.css
new file mode 100644
index 000000000..f7e5be506
--- /dev/null
+++ b/tests/visual/all.css
@@ -0,0 +1,73 @@
+
+body { margin: 0; padding: 20px; background: black; }
+ul.plugins { margin: 0; padding: 0; }
+ul.plugins li { margin: 0 12px 12px 0;
+ list-style-type: none; width: 210px; height: 220px; float: left;
+ color: white; border: 1px solid gray; text-align: center; font-weight: bold; }
+
+#accordion, #draggable, #droppable,
+#resizable, #selectable, #slider, #sortable, #tabs {
+ margin: 10px;
+ width: 190px; height: 180px;
+ text-align: center;
+ background: #FF9C08; color: white; font-weight: bold;
+}
+#selectable div {
+ width: 45px; height: 45px; float: left; margin: 6px;
+ border: 1px solid white;
+}
+#selectable .ui-selecting {
+ background: gray;
+}
+#selectable .ui-selected {
+ background: black;
+}
+#sortable div {
+ width: 45px; height: 45px; float: left; margin: 6px;
+ border: 1px solid white;
+}
+#sortable .ui-sortable-helper {
+ background: black;
+}
+
+.ui-dialog { background-color: #FF9C08; }
+.ui-dialog .ui-dialog-titlebar { background: black; padding: 0px; height: 28px; _height: 29px; }
+.ui-dialog.ui-draggable .ui-dialog-titlebar { cursor: move; }
+
+.ui-dialog .ui-dialog-titlebar-close {
+ width: 16px; height: 16px; position: absolute; top: 6px; right: 7px;
+ cursor: default; color: white;
+}
+
+.ui-dialog .ui-dialog-titlebar-close-hover { color: #FF9C08; }
+
+.ui-dialog .ui-dialog-title {
+ margin-left: 5px; color: white; font-weight: bold;
+ position: relative; top: 7px; left: 4px;
+}
+
+.ui-dialog .ui-dialog-content {
+ margin: 1.2em;
+}
+
+.ui-dialog .ui-dialog-buttonpane {
+ position: absolute;
+ bottom: 8px;
+ right: 12px;
+ width: 100%;
+ text-align: right;
+}
+
+.ui-dialog .ui-dialog-buttonpane button {
+ margin: 6px;
+}
+
+/* Dialog handle styles */
+.ui-dialog .ui-resizable-n { cursor: n-resize; height: 6px; width: 100%; top: 0px; left: 0px; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-s { cursor: s-resize; height: 8px; width: 100%; bottom: 0px; left: 0px; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-e { cursor: e-resize; width: 7px; right: 0px; top: 0px; height: 100%; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-w { cursor: w-resize; width: 7px; left: 0px; top: 0px; height: 100%; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-se { cursor: se-resize; width: 9px; height: 9px; right: 0px; bottom: 0px; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: 0px; bottom: 0px; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 29px; left: 0px; top: 0px; background: gray !important; border: none !important; }
+.ui-dialog .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 29px; right: 0px; top: 0px; background: gray !important; border: none !important; }
diff --git a/tests/visual/all.html b/tests/visual/all.html
new file mode 100644
index 000000000..fe8cae919
--- /dev/null
+++ b/tests/visual/all.html
@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple All</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <link rel="stylesheet" href="../../themes/ui.datepicker.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.accordion.js"></script>
+ <script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript" src="../../ui/ui.dialog.js"></script>
+ <script type="text/javascript" src="../../ui/ui.draggable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.droppable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.resizable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.selectable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.slider.js"></script>
+ <script type="text/javascript" src="../../ui/ui.sortable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.tabs.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#datepicker").datepicker();
+ $("#dialog").click(function() { $("<div/>").dialog(); });
+ $("#draggable").draggable();
+ $("#resizable").resizable();
+ $("#selectable").selectable();
+ $("#sortable").sortable();
+ });
+ </script>
+</head>
+<body>
+
+<ul class="plugins">
+<li>
+ Datepicker
+ <div style="text-align:left;margin-left:10px;">
+ <input type="text" id="datepicker">
+ </div>
+</li>
+<li>
+ Dialog
+ <div id="dialog">
+ <button>Open</button>
+ </div>
+</li>
+<li>
+ Draggable
+ <div id="draggable"></div>
+</li>
+<li>
+ Resizable
+ <div id="resizable"></div>
+</li>
+<li>
+ Selectable
+ <div id="selectable">
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+ <div>5</div>
+ <div>6</div>
+ <div>7</div>
+ <div>8</div>
+ <div>9</div>
+ </div>
+</li>
+<li>
+ Sortable
+ <div id="sortable">
+ <div>C</div>
+ <div>I</div>
+ <div>G</div>
+ <div>F</div>
+ <div>D</div>
+ <div>H</div>
+ <div>A</div>
+ <div>E</div>
+ <div>B</div>
+ </div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/datepicker.html b/tests/visual/datepicker.html
new file mode 100644
index 000000000..e8d63c61f
--- /dev/null
+++ b/tests/visual/datepicker.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple Datepicker</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <link rel="stylesheet" href="../../themes/ui.datepicker.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#datepicker").datepicker();
+ });
+ </script>
+</head>
+<body>
+
+<ul class="plugins">
+<li>
+ Datepicker
+ <div style="text-align:left;margin-left:10px;">
+ <input type="text" id="datepicker">
+ </div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/dialog.html b/tests/visual/dialog.html
new file mode 100644
index 000000000..12e7c2b43
--- /dev/null
+++ b/tests/visual/dialog.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple Dialog</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.dialog.js"></script>
+ <script type="text/javascript" src="../../ui/ui.draggable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.resizable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ var offset = $("#dialog").offset();
+ $("#dialog").click(function() { $("<div/>").dialog(); });
+ });
+ </script>
+</head>
+<body class="flora">
+
+<ul class="plugins">
+<li>
+ Dialog
+ <div id="dialog">
+ <button>Open</button>
+ </div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/draggable.html b/tests/visual/draggable.html
new file mode 100644
index 000000000..342265c07
--- /dev/null
+++ b/tests/visual/draggable.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple Draggable</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.draggable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#draggable").draggable();
+ });
+ </script>
+</head>
+<body>
+
+<ul class="plugins">
+<li>
+ Draggable
+ <div id="draggable"></div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/resizable.html b/tests/visual/resizable.html
new file mode 100644
index 000000000..ba6e4ee96
--- /dev/null
+++ b/tests/visual/resizable.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple Resizable</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.resizable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#resizable").resizable();
+ });
+ </script>
+</head>
+
+<body>
+
+<ul class="plugins">
+<li>
+ Resizable
+ <div id="resizable"></div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/selectable.html b/tests/visual/selectable.html
new file mode 100644
index 000000000..f96980ecc
--- /dev/null
+++ b/tests/visual/selectable.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple Selectable</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.selectable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#selectable").selectable();
+ });
+ </script>
+</head>
+
+<body>
+
+<ul class="plugins">
+<li>
+ Selectable
+ <div id="selectable">
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+ <div>5</div>
+ <div>6</div>
+ <div>7</div>
+ <div>8</div>
+ <div>9</div>
+ </div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/sortable.html b/tests/visual/sortable.html
new file mode 100644
index 000000000..68cd71511
--- /dev/null
+++ b/tests/visual/sortable.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Simple Sortable</title>
+ <link rel="stylesheet" href="all.css" type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.2.6.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.sortable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#sortable").sortable();
+ });
+ </script>
+</head>
+
+<body>
+
+<ul class="plugins">
+<li>
+ Sortable
+ <div id="sortable">
+ <div>C</div>
+ <div>I</div>
+ <div>G</div>
+ <div>F</div>
+ <div>D</div>
+ <div>H</div>
+ <div>A</div>
+ <div>E</div>
+ <div>B</div>
+ </div>
+</li>
+</ul>
+
+</body>
+</html>
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-26 21:35:40 +0000