Skip to content

Commit d2397d8

Browse files
rdworthrdworth
committed
added simple visual tests
1 parent 665f17c commit d2397d8

8 files changed

Lines changed: 338 additions & 0 deletions

File tree

‎tests/visual/all.css‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
2+
body { margin: 0; padding: 20px; background: black; }
3+
ul.plugins { margin: 0; padding: 0; }
4+
ul.plugins li { margin: 0 12px 12px 0;
5+
list-style-type: none; width: 210px; height: 220px; float: left;
6+
color: white; border: 1px solid gray; text-align: center; font-weight: bold; }
7+
8+
#accordion, #draggable, #droppable,
9+
#resizable, #selectable, #slider, #sortable, #tabs {
10+
margin: 10px;
11+
width: 190px; height: 180px;
12+
text-align: center;
13+
background: #FF9C08; color: white; font-weight: bold;
14+
}
15+
#selectable div {
16+
width: 45px; height: 45px; float: left; margin: 6px;
17+
border: 1px solid white;
18+
}
19+
#selectable .ui-selecting {
20+
background: gray;
21+
}
22+
#selectable .ui-selected {
23+
background: black;
24+
}
25+
#sortable div {
26+
width: 45px; height: 45px; float: left; margin: 6px;
27+
border: 1px solid white;
28+
}
29+
#sortable .ui-sortable-helper {
30+
background: black;
31+
}
32+
33+
.ui-dialog { background-color: #FF9C08; }
34+
.ui-dialog .ui-dialog-titlebar { background: black; padding: 0px; height: 28px; _height: 29px; }
35+
.ui-dialog.ui-draggable .ui-dialog-titlebar { cursor: move; }
36+
37+
.ui-dialog .ui-dialog-titlebar-close {
38+
width: 16px; height: 16px; position: absolute; top: 6px; right: 7px;
39+
cursor: default; color: white;
40+
}
41+
42+
.ui-dialog .ui-dialog-titlebar-close-hover { color: #FF9C08; }
43+
44+
.ui-dialog .ui-dialog-title {
45+
margin-left: 5px; color: white; font-weight: bold;
46+
position: relative; top: 7px; left: 4px;
47+
}
48+
49+
.ui-dialog .ui-dialog-content {
50+
margin: 1.2em;
51+
}
52+
53+
.ui-dialog .ui-dialog-buttonpane {
54+
position: absolute;
55+
bottom: 8px;
56+
right: 12px;
57+
width: 100%;
58+
text-align: right;
59+
}
60+
61+
.ui-dialog .ui-dialog-buttonpane button {
62+
margin: 6px;
63+
}
64+
65+
/* Dialog handle styles */
66+
.ui-dialog .ui-resizable-n { cursor: n-resize; height: 6px; width: 100%; top: 0px; left: 0px; background: gray !important; border: none !important; }
67+
.ui-dialog .ui-resizable-s { cursor: s-resize; height: 8px; width: 100%; bottom: 0px; left: 0px; background: gray !important; border: none !important; }
68+
.ui-dialog .ui-resizable-e { cursor: e-resize; width: 7px; right: 0px; top: 0px; height: 100%; background: gray !important; border: none !important; }
69+
.ui-dialog .ui-resizable-w { cursor: w-resize; width: 7px; left: 0px; top: 0px; height: 100%; background: gray !important; border: none !important; }
70+
.ui-dialog .ui-resizable-se { cursor: se-resize; width: 9px; height: 9px; right: 0px; bottom: 0px; background: gray !important; border: none !important; }
71+
.ui-dialog .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: 0px; bottom: 0px; background: gray !important; border: none !important; }
72+
.ui-dialog .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 29px; left: 0px; top: 0px; background: gray !important; border: none !important; }
73+
.ui-dialog .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 29px; right: 0px; top: 0px; background: gray !important; border: none !important; }

‎tests/visual/all.html‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple All</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<link rel="stylesheet" href="../../themes/ui.datepicker.css" type="text/css" media="screen">
7+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
9+
<script type="text/javascript" src="../../ui/ui.accordion.js"></script>
10+
<script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
11+
<script type="text/javascript" src="../../ui/ui.dialog.js"></script>
12+
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
13+
<script type="text/javascript" src="../../ui/ui.droppable.js"></script>
14+
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
15+
<script type="text/javascript" src="../../ui/ui.selectable.js"></script>
16+
<script type="text/javascript" src="../../ui/ui.slider.js"></script>
17+
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
18+
<script type="text/javascript" src="../../ui/ui.tabs.js"></script>
19+
<script type="text/javascript">
20+
$(function() {
21+
$("#datepicker").datepicker();
22+
$("#dialog").click(function() { $("<div/>").dialog(); });
23+
$("#draggable").draggable();
24+
$("#resizable").resizable();
25+
$("#selectable").selectable();
26+
$("#sortable").sortable();
27+
});
28+
</script>
29+
</head>
30+
<body>
31+
32+
<ul class="plugins">
33+
<li>
34+
Datepicker
35+
<div style="text-align:left;margin-left:10px;">
36+
<input type="text" id="datepicker">
37+
</div>
38+
</li>
39+
<li>
40+
Dialog
41+
<div id="dialog">
42+
<button>Open</button>
43+
</div>
44+
</li>
45+
<li>
46+
Draggable
47+
<div id="draggable"></div>
48+
</li>
49+
<li>
50+
Resizable
51+
<div id="resizable"></div>
52+
</li>
53+
<li>
54+
Selectable
55+
<div id="selectable">
56+
<div>1</div>
57+
<div>2</div>
58+
<div>3</div>
59+
<div>4</div>
60+
<div>5</div>
61+
<div>6</div>
62+
<div>7</div>
63+
<div>8</div>
64+
<div>9</div>
65+
</div>
66+
</li>
67+
<li>
68+
Sortable
69+
<div id="sortable">
70+
<div>C</div>
71+
<div>I</div>
72+
<div>G</div>
73+
<div>F</div>
74+
<div>D</div>
75+
<div>H</div>
76+
<div>A</div>
77+
<div>E</div>
78+
<div>B</div>
79+
</div>
80+
</li>
81+
</ul>
82+
83+
</body>
84+
</html>

‎tests/visual/datepicker.html‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple Datepicker</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<link rel="stylesheet" href="../../themes/ui.datepicker.css" type="text/css" media="screen">
7+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
9+
<script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
10+
<script type="text/javascript">
11+
$(function() {
12+
$("#datepicker").datepicker();
13+
});
14+
</script>
15+
</head>
16+
<body>
17+
18+
<ul class="plugins">
19+
<li>
20+
Datepicker
21+
<div style="text-align:left;margin-left:10px;">
22+
<input type="text" id="datepicker">
23+
</div>
24+
</li>
25+
</ul>
26+
27+
</body>
28+
</html>

‎tests/visual/dialog.html‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple Dialog</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
7+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.dialog.js"></script>
9+
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
10+
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
11+
<script type="text/javascript">
12+
$(function() {
13+
var offset = $("#dialog").offset();
14+
$("#dialog").click(function() { $("<div/>").dialog(); });
15+
});
16+
</script>
17+
</head>
18+
<body class="flora">
19+
20+
<ul class="plugins">
21+
<li>
22+
Dialog
23+
<div id="dialog">
24+
<button>Open</button>
25+
</div>
26+
</li>
27+
</ul>
28+
29+
</body>
30+
</html>

‎tests/visual/draggable.html‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple Draggable</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
7+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
9+
<script type="text/javascript">
10+
$(function() {
11+
$("#draggable").draggable();
12+
});
13+
</script>
14+
</head>
15+
<body>
16+
17+
<ul class="plugins">
18+
<li>
19+
Draggable
20+
<div id="draggable"></div>
21+
</li>
22+
</ul>
23+
24+
</body>
25+
</html>

‎tests/visual/resizable.html‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple Resizable</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
7+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
9+
<script type="text/javascript">
10+
$(function() {
11+
$("#resizable").resizable();
12+
});
13+
</script>
14+
</head>
15+
16+
<body>
17+
18+
<ul class="plugins">
19+
<li>
20+
Resizable
21+
<div id="resizable"></div>
22+
</li>
23+
</ul>
24+
25+
</body>
26+
</html>

‎tests/visual/selectable.html‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple Selectable</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
7+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.selectable.js"></script>
9+
<script type="text/javascript">
10+
$(function() {
11+
$("#selectable").selectable();
12+
});
13+
</script>
14+
</head>
15+
16+
<body>
17+
18+
<ul class="plugins">
19+
<li>
20+
Selectable
21+
<div id="selectable">
22+
<div>1</div>
23+
<div>2</div>
24+
<div>3</div>
25+
<div>4</div>
26+
<div>5</div>
27+
<div>6</div>
28+
<div>7</div>
29+
<div>8</div>
30+
<div>9</div>
31+
</div>
32+
</li>
33+
</ul>
34+
35+
</body>
36+
</html>

‎tests/visual/sortable.html‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Simple Sortable</title>
5+
<link rel="stylesheet" href="all.css" type="text/css" media="screen">
6+
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
7+
<script type="text/javascript" src="../../ui/ui.core.js"></script>
8+
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
9+
<script type="text/javascript">
10+
$(function() {
11+
$("#sortable").sortable();
12+
});
13+
</script>
14+
</head>
15+
16+
<body>
17+
18+
<ul class="plugins">
19+
<li>
20+
Sortable
21+
<div id="sortable">
22+
<div>C</div>
23+
<div>I</div>
24+
<div>G</div>
25+
<div>F</div>
26+
<div>D</div>
27+
<div>H</div>
28+
<div>A</div>
29+
<div>E</div>
30+
<div>B</div>
31+
</div>
32+
</li>
33+
</ul>
34+
35+
</body>
36+
</html>

0 commit comments

Comments
 (0)