library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added diffs to static and visual markup side-by-side tests

Browse Source
This commit is contained in:
Richard Worth 2009-02-21 11:34:08 +00:00
parent 1141b61c0e
commit bf43ab6d30
35 changed files with 381 additions and 154 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

159
external/jsdiff/jsdiff.js vendored Normal file
View File

@ -0,0 +1,159 @@
/*
* Javascript Diff Algorithm
* By John Resig (http://ejohn.org/)
* Modified by Chu Alan "sprite"
*
* More Info:
* http://ejohn.org/projects/javascript-diff-algorithm/
*/
function escape(s) {
var n = s;
n = n.replace(/&/g, "&");
n = n.replace(/</g, "&lt;");
n = n.replace(/>/g, "&gt;");
n = n.replace(/"/g, "&quot;");
return n;
}
function diffString( o, n ) {
o = o.replace(/\s+$/, '');
n = n.replace(/\s+$/, '');
var out = diff(o == "" ? [] : o.split(/\s+/), n == "" ? [] : n.split(/\s+/) );
var str = "";
var oSpace = o.match(/\s+/g);
if (oSpace == null) {
oSpace = ["\n"];
} else {
oSpace.push("\n");
}
var nSpace = n.match(/\s+/g);
if (nSpace == null) {
nSpace = ["\n"];
} else {
nSpace.push("\n");
}
if (out.n.length == 0) {
for (var i = 0; i < out.o.length; i++) {
str += '<del>' + escape(out.o[i]) + oSpace[i] + "</del>";
}
} else {
if (out.n[0].text == null) {
for (n = 0; n < out.o.length && out.o[n].text == null; n++) {
str += '<del>' + escape(out.o[n]) + oSpace[n] + "</del>";
}
}
for ( var i = 0; i < out.n.length; i++ ) {
if (out.n[i].text == null) {
str += '<ins>' + escape(out.n[i]) + nSpace[i] + "</ins>";
} else {
var pre = "";
for (n = out.n[i].row + 1; n < out.o.length && out.o[n].text == null; n++ ) {
pre += '<del>' + escape(out.o[n]) + oSpace[n] + "</del>";
}
str += " " + out.n[i].text + nSpace[i] + pre;
}
}
}
return str;
}
function randomColor() {
return "rgb(" + (Math.random() * 100) + "%, " +
(Math.random() * 100) + "%, " +
(Math.random() * 100) + "%)";
}
function diffString2( o, n ) {
o = o.replace(/\s+$/, '');
n = n.replace(/\s+$/, '');
var out = diff(o == "" ? [] : o.split(/\s+/), n == "" ? [] : n.split(/\s+/) );
var oSpace = o.match(/\s+/g);
if (oSpace == null) {
oSpace = ["\n"];
} else {
oSpace.push("\n");
}
var nSpace = n.match(/\s+/g);
if (nSpace == null) {
nSpace = ["\n"];
} else {
nSpace.push("\n");
}
var os = "";
var colors = new Array();
for (var i = 0; i < out.o.length; i++) {
colors[i] = randomColor();
if (out.o[i].text != null) {
os += '<span style="background-color: ' +colors[i]+ '">' +
escape(out.o[i].text) + oSpace[i] + "</span>";
} else {
os += "<del>" + escape(out.o[i]) + oSpace[i] + "</del>";
}
}
var ns = "";
for (var i = 0; i < out.n.length; i++) {
if (out.n[i].text != null) {
ns += '<span style="background-color: ' +colors[out.n[i].row]+ '">' +
escape(out.n[i].text) + nSpace[i] + "</span>";
} else {
ns += "<ins>" + escape(out.n[i]) + nSpace[i] + "</ins>";
}
}
return { o : os , n : ns };
}
function diff( o, n ) {
var ns = new Object();
var os = new Object();
for ( var i = 0; i < n.length; i++ ) {
if ( ns[ n[i] ] == null )
ns[ n[i] ] = { rows: new Array(), o: null };
ns[ n[i] ].rows.push( i );
}
for ( var i = 0; i < o.length; i++ ) {
if ( os[ o[i] ] == null )
os[ o[i] ] = { rows: new Array(), n: null };
os[ o[i] ].rows.push( i );
}
for ( var i in ns ) {
if ( ns[i].rows.length == 1 && typeof(os[i]) != "undefined" && os[i].rows.length == 1 ) {
n[ ns[i].rows[0] ] = { text: n[ ns[i].rows[0] ], row: os[i].rows[0] };
o[ os[i].rows[0] ] = { text: o[ os[i].rows[0] ], row: ns[i].rows[0] };
}
}
for ( var i = 0; i < n.length - 1; i++ ) {
if ( n[i].text != null && n[i+1].text == null && n[i].row + 1 < o.length && o[ n[i].row + 1 ].text == null &&
n[i+1] == o[ n[i].row + 1 ] ) {
n[i+1] = { text: n[i+1], row: n[i].row + 1 };
o[n[i].row+1] = { text: o[n[i].row+1], row: i + 1 };
}
}
for ( var i = n.length - 1; i > 0; i-- ) {
if ( n[i].text != null && n[i-1].text == null && n[i].row > 0 && o[ n[i].row - 1 ].text == null &&
n[i-1] == o[ n[i].row - 1 ] ) {
n[i-1] = { text: n[i-1], row: n[i].row - 1 };
o[n[i].row-1] = { text: o[n[i].row-1], row: i - 1 };
}
}
return { o: o, n: n };
}

84
tests/index.html
View File

@ -4,16 +4,10 @@
<title>jQuery UI Tests</title>
<link rel="stylesheet" href="../themes/base/ui.all.css" type="text/css" />
<script type="text/javascript" src="../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../ui/ui.core.js"></script>
<script type="text/javascript" src="../ui/ui.draggable.js"></script>
<style type="text/css">
body { font-size: 62.5%; }
dd.plugin { margin-top: 0.3em; margin-bottom: 1em; }
iframe { border: 0; width: 200px; 150px; }
td { border: 1px solid silver; padding: 10px; }
</style>
<script type="text/javascript" src="../external/jsdiff/jsdiff.js"></script>
<link rel="stylesheet" href="tests.css" type="text/css" />
<script type="text/javascript" src="tests.js"></script>
</head>
<body>
<table id="matrix">
@ -22,75 +16,37 @@
<th>Interaction</th>
<th style="width:220px;">Static</th>
<th style="width:220px;">Visual</th>
<th>Static</th>
<th>Visual</th>
<th>Diff</th>
</tr>
</thead>
<tbody>
<tr class="test-draggable-default"><th>Draggable</th><td></td><td></td></tr>
<tr class="test-droppable-default"><th>Droppable</th><td></td><td></td></tr>
<tr class="test-resizable-default"><th>Resizable</th><td></td><td></td></tr>
<tr class="test-selectabe-default"><th>Selectable</th><td></td><td></td></tr>
<tr class="test-sortable-default"><th>Sortable</th><td></td><td></td></tr>
<tr class="test-draggable-default"><th>Draggable</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-droppable-default"><th>Droppable</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-resizable-default"><th>Resizable</th><td></td><td></td><td></td><td></td><td></td></tr>
<!--tr class="test-selectable-default"><th>Selectable</th><td></td><td></td><td></td><td></td><td></td></tr-->
<tr class="test-sortable-default"><th>Sortable</th><td></td><td></td><td></td><td></td><td></td></tr>
</tbody>
<thead>
<tr>
<th>Widget</th>
<th style="width:220px;">Static</th>
<th style="width:220px;">Visual</th>
<th>Static</th>
<th>Visual</th>
<th>Diff</th>
</tr>
</thead>
<tbody>
<tr class="test-accordion-default"><th>Accordion</th><td></td><td></td></tr>
<tr class="test-datepicker-default"><th>Datepicker</th><td></td><td></td></tr>
<tr class="test-dialog-default"><th>Dialog</th><td></td><td></td></tr>
<tr class="test-progressbar-default"><th>Progressbar</th><td></td><td></td></tr>
<tr class="test-slider-default"><th>slider</th><td></td><td></td></tr>
<tr class="test-tabs-default"><th>Tabs</th><td></td><td></td></tr>
<tr class="test-accordion-default"><th>Accordion</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-datepicker-default"><th>Datepicker</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-dialog-default"><th>Dialog</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-progressbar-default"><th>Progressbar</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-default"><th>slider</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-tabs-default"><th>Tabs</th><td></td><td></td><td></td><td></td><td></td></tr>
</tbody>
</table>
<dl id="plugins">
</dl>
<script type="text/javascript">
var matrix = $("#matrix");
matrix.children("tbody").children("tr").each(function() {
var tr = $(this), th = tr.find("th"), pluginName = th.text().toLowerCase(), staticTd = th.next(), visualTd = staticTd.next();
var staticUrl = 'static/' + pluginName + '/default.html';
var visualUrl = 'visual/' + pluginName + '/default.html';
$.get(staticUrl, function(data) {
data = data.replace(/<script.*>.*<\/script>/ig,""); // Remove script tags
data = data.replace(/<\/?link.*>/ig,""); //Remove link tags
data = data.replace(/<\/?html.*>/ig,""); //Remove html tag
data = data.replace(/<\/?body.*>/ig,""); //Remove body tag
data = data.replace(/<\/?head.*>/ig,""); //Remove head tag
data = data.replace(/<title.*>.*<\/title>/ig,""); // Remove title tags
data = data.replace(/\s*<\/?!doctype.*>\s*/ig,""); //Remove doctype
var staticHtml = $("<div></div>").html(data).html();
staticTd.html(staticHtml);
});
visualTd.append('<iframe src="' + visualUrl + '"></iframe>');
var iframe = visualTd.find("iframe");
iframe.load(function() {
//alert($("body", this.contentDocument).html());
$(this).after($("body", this.contentDocument).html()).remove();
(pluginName == 'dialog') && $("#dialog").parents(".ui-dialog").css({
position: "relative",
top: null, left: null
});
});
});
</script>
</body>
</html>

63
tests/slider.html Normal file
View File

@ -0,0 +1,63 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Tests</title>
<link rel="stylesheet" href="../themes/base/ui.all.css" type="text/css" />
<script type="text/javascript" src="../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../external/jsdiff/jsdiff.js"></script>
<link rel="stylesheet" href="tests.css" type="text/css" />
<script type="text/javascript" src="tests.js"></script>
</head>
<body>
<table id="matrix">
<thead>
<tr>
<th>Default Slider Tests</th>
<th style="width:220px;">Static</th>
<th style="width:220px;">Visual</th>
<th>Static</th>
<th>Visual</th>
<th>Diff</th>
</tr>
</thead>
<tbody>
<tr class="test-slider-default"><th>Default</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-default-vertical"><th>Vertical</th><td></td><td></td><td></td><td></td><td></td></tr>
</tbody>
<thead>
<tr>
<th>Horizontal Slider Tests</th>
<th style="width:220px;">Static</th>
<th style="width:220px;">Visual</th>
<th>Static</th>
<th>Visual</th>
<th>Diff</th>
</tr>
</thead>
<tbody>
<tr class="test-slider-slider-horizontal"><th>Horizontal</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-slider-horizontal-range"><th>Horizontal range</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-slider-horizontal-range-max"><th>Horizontal range max</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-slider-horizontal-range-min"><th>Horizontal range min</th><td></td><td></td><td></td><td></td><td></td></tr>
</tbody>
<thead>
<tr>
<th>Vertical Slider Tests</th>
<th style="width:220px;">Static</th>
<th style="width:220px;">Visual</th>
<th>Static</th>
<th>Visual</th>
<th>Diff</th>
</tr>
</thead>
<tbody>
<tr class="test-slider-slider-vertical"><th>Vertical</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-slider-vertical-range"><th>Vertical range</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-slider-vertical-range-max"><th>Vertical range max</th><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="test-slider-slider-vertical-range-min"><th>Vertical range min</th><td></td><td></td><td></td><td></td><td></td></tr>
</tbody>
</table>
</body>
</html>

6
tests/static/draggable/default.html
View File

@ -10,11 +10,7 @@
</head>
<body>
<div class="ui-draggable">
<p>
Draggable
</p>
</div>
<div class="ui-draggable"><p>Draggable</p></div>
</body>
</html>

4
tests/static/droppable/default.html
View File

@ -10,9 +10,7 @@
</head>
<body>
<div class="ui-droppable">
Droppable
</div>
<div class="ui-droppable"><p>Droppable</p></div>
</body>
</html>

4
tests/static/slider/default.html
View File

@ -10,9 +10,7 @@
</head>
<body>
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 0%;"></a>
</div>
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a style="left: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

4
tests/static/slider/default_vertical.html
View File

@ -10,9 +10,7 @@
</head>
<body>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 0%;"></a>
</div>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><a style="bottom: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

4
tests/static/slider/slider_horizontal.html
View File

@ -10,9 +10,7 @@
</head>
<body>
<div id="slider-horizontal" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 50%;"></a>
</div>
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a style="left: 50%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

6
tests/static/slider/slider_horizontal_range.html
View File

@ -10,11 +10,7 @@
</head>
<body>
<div id="slider-horizontal-range" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-widget-header" style="width:50%; left: 25%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 25%;"></a>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 75%;"></a>
</div>
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="left: 25%; width: 50%;" class="ui-slider-range ui-widget-header"></div><a style="left: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a><a style="left: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

5
tests/static/slider/slider_horizontal_range_max.html
View File

@ -10,10 +10,7 @@
</head>
<body>
<div id="slider-horizontal-range-max" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-max ui-widget-header" style="width:25%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 75%;"></a>
</div>
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="width:25%;" class="ui-slider-range ui-slider-range-max ui-widget-header"></div><a style="left: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

5
tests/static/slider/slider_horizontal_range_min.html
View File

@ -10,10 +10,7 @@
</head>
<body>
<div id="slider-horizontal-range-min" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-min ui-widget-header" style="width:25%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 25%;"></a>
</div>
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="width: 25%;" class="ui-slider-range ui-slider-range-min ui-widget-header"></div><a style="left: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

4
tests/static/slider/slider_vertical.html
View File

@ -10,9 +10,7 @@
</head>
<body>
<div id="slider-vertical" class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 50%;"></a>
</div>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><a style="bottom: 50%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

6
tests/static/slider/slider_vertical_range.html
View File

@ -10,11 +10,7 @@
</head>
<body>
<div id="slider-vertical-range" class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-widget-header" style="bottom: 25%; height:50%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 25%;"></a>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 75%;"></a>
</div>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="bottom: 25%; height: 50%;" class="ui-slider-range ui-widget-header"></div><a style="bottom: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a><a style="bottom: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

5
tests/static/slider/slider_vertical_range_max.html
View File

@ -10,10 +10,7 @@
</head>
<body>
<div id="slider-vertical-range-max" class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-max ui-widget-header" style="height: 75%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 25%;"></a>
</div>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="height: 25%;" class="ui-slider-range ui-slider-range-max ui-widget-header"></div><a style="bottom: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

5
tests/static/slider/slider_vertical_range_min.html
View File

@ -10,10 +10,7 @@
</head>
<body>
<div id="slider-vertical-range-min" class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-min ui-widget-header" style="height:25%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 25%;"></a>
</div>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="height:25%;" class="ui-slider-range ui-slider-range-min ui-widget-header"></div><a style="bottom: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
</body>
</html>

6
tests/static/sortable/default.html
View File

@ -10,11 +10,7 @@
</head>
<body>
<div class="ui-sortable">
<div>Sortable 1</div>
<div>Sortable 2</div>
<div>Sortable 3</div>
</div>
<div class="ui-sortable"><div>Sortable 1</div><div>Sortable 2</div><div>Sortable 3</div></div>
</body>
</html>

6
tests/static/tabs/default.html
View File

@ -1,15 +1,15 @@
<!doctype html>
<html>
<head>
<title>jQuery UI Tabs Static Markup Test Page</title>
<title>Tabs Static Test : Default</title>
<link rel="stylesheet" href="../static.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../static.js"></script>
</head>
<body style="font-size: 62.5%;">
<body>
<!-- Tabs -->
<div class="ui-tabs ui-widget ui-widget-content ui-corner-all">
<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
<li class="ui-state-default ui-state-active ui-tabs-selected ui-corner-top"><a href="#fragment-1">First</a></li>

8
tests/tests.css Normal file
View File

@ -0,0 +1,8 @@
/* tests.css */
body { font-size: 62.5%; }
iframe { border: 0; width: 200px; 150px; }
td { border: 1px solid silver; padding: 10px; }
td textarea { font-size: 10px; }
del { background: #FFE6E6; }
ins { background: #E6FFE6; }

56
tests/tests.js Normal file
View File

@ -0,0 +1,56 @@
/* tests.js */
$(function() {
var matrix = $("#matrix");
matrix.children("tbody").children("tr").each(function() {
var tr = $(this), th = tr.find("th"), pluginName = th.text().toLowerCase(),
staticTd = th.next(), visualTd = staticTd.next(),
staticHtmlTd = visualTd.next(), visualHtmlTd = staticHtmlTd.next(),
diffTd = visualHtmlTd.next();
var className = tr.attr("className");
var classNames = className.split('-');
classNames.shift(); // remove 'test'
var folder = classNames.shift();
var filename = classNames.join('_') + '.html';
var staticUrl = 'static/' + folder + '/' + filename;
var visualUrl = 'visual/' + folder + '/' + filename;
$.get(staticUrl, function(data) {
data = data.replace(/<script.*>.*<\/script>/ig,""); // Remove script tags
data = data.replace(/<\/?link.*>/ig,""); //Remove link tags
data = data.replace(/<\/?html.*>/ig,""); //Remove html tag
data = data.replace(/<\/?body.*>/ig,""); //Remove body tag
data = data.replace(/<\/?head.*>/ig,""); //Remove head tag
data = data.replace(/<title.*>.*<\/title>/ig,""); // Remove title tags
data = data.replace(/\s*<\/?!doctype.*>\s*/ig,""); //Remove doctype
var staticHtml = $("<div></div>").html(data).html();
staticTd.html(staticHtml);
staticHtmlTd.append("<textarea>" + staticHtml + "</textarea>");
});
visualTd.append('<iframe src="' + visualUrl + '"></iframe>');
var iframe = visualTd.find("iframe");
iframe.load(function() {
var visualHtml = $("body", this.contentDocument).html()
$(this).after(visualHtml).remove();
(pluginName == 'dialog') && $("#dialog").parents(".ui-dialog").css({
position: "relative",
top: null, left: null
});
visualHtmlTd.append("<textarea>" + $.trim(visualHtml) + "</textarea>");
var diffHtml = diffString(escape(staticHtmlTd.find("textarea").val()), escape(visualHtmlTd.find("textarea").val()));
console.log(diffHtml);
diffTd.html(diffHtml);
});
});
});

4
tests/visual/dialog/default.html
View File

@ -18,7 +18,9 @@
<body>
<div id="dialog" title="Dialog Title">
<p> Dialog Content </p>
<p>
Dialog Content
</p>
</div>
</body>

8
tests/visual/draggable/default.html
View File

@ -9,13 +9,13 @@
<script type="text/javascript" src="../../../ui/ui.draggable.js"></script>
<script type="text/javascript">
$(function() {
$("#draggable").draggable();
$("body").children(":first").draggable();
});
</script>
</head>
<body>
<div id="draggable">
<p> Draggable </p>
</div>
<div><p>Draggable</p></div>
</body>
</html>

8
tests/visual/droppable/default.html
View File

@ -10,13 +10,13 @@
<script type="text/javascript" src="../../../ui/ui.droppable.js"></script>
<script type="text/javascript">
$(function() {
$("#droppable").droppable();
$("body").children(":first").droppable();
});
</script>
</head>
<body>
<div id="droppable">
<p> Droppable </p>
</div>
<div><p>Droppable</p></div>
</body>
</html>

6
tests/visual/resizable/default.html
View File

@ -15,7 +15,11 @@
</head>
<body>
<div id="resizable">Resizable</div>
<div id="resizable">
<p>
Resizable
</p>
</div>
</body>
</html>

1
tests/visual/selectable/default.html
View File

@ -13,7 +13,6 @@
});
</script>
</head>
<body>
<div id="selectable">

4
tests/visual/slider/default.html
View File

@ -9,13 +9,13 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider").slider();
$("body").children(":first").slider();
});
</script>
</head>
<body>
<div id="slider"></div>
<div></div>
</body>
</html>

23
tests/visual/slider/default_vertical.html Normal file
View File

@ -0,0 +1,23 @@
<!doctype html>
<html lang="en">
<head>
<title>Slider Visual Test : Default vertical</title>
<link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("body").children(":first").slider({
orientation: 'vertical'
});
});
</script>
</head>
<body>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_horizontal.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-horizontal").slider({
$("body").children(":first").slider({
orientation: 'horizontal',
value: 50
});
@ -18,7 +18,7 @@
</head>
<body>
<div id="slider-horizontal"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_horizontal_range.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-horizontal-range").slider({
$("body").children(":first").slider({
orientation: 'horizontal',
range: true,
values: [25, 75]
@ -19,7 +19,7 @@
</head>
<body>
<div id="slider-horizontal-range"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_horizontal_range_max.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-horizontal-range-max").slider({
$("body").children(":first").slider({
orientation: 'horizontal',
range: 'max',
value: 75
@ -19,7 +19,7 @@
</head>
<body>
<div id="slider-horizontal-range-max"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_horizontal_range_min.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-horizontal-range-min").slider({
$("body").children(":first").slider({
orientation: 'horizontal',
range: 'min',
value: 25
@ -19,7 +19,7 @@
</head>
<body>
<div id="slider-horizontal-range-min"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_vertical.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-vertical").slider({
$("body").children(":first").slider({
orientation: 'vertical',
value: 50
});
@ -18,7 +18,7 @@
</head>
<body>
<div id="slider-vertical"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_vertical_range.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-vertical-range").slider({
$("body").children(":first").slider({
orientation: 'vertical',
range: true,
values: [25, 75]
@ -19,7 +19,7 @@
</head>
<body>
<div id="slider-vertical-range"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_vertical_range_max.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-vertical-range-max").slider({
$("body").children(":first").slider({
orientation: 'vertical',
range: 'max',
value: 75
@ -19,7 +19,7 @@
</head>
<body>
<div id="slider-vertical-range-max"></div>
<div></div>
</body>
</html>

4
tests/visual/slider/slider_vertical_range_min.html
View File

@ -9,7 +9,7 @@
<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider-vertical-range-min").slider({
$("body").children(":first").slider({
orientation: 'vertical',
range: 'min',
value: 25
@ -19,7 +19,7 @@
</head>
<body>
<div id="slider-vertical-range-min"></div>
<div></div>
</body>
</html>

9
tests/visual/sortable/default.html
View File

@ -9,18 +9,13 @@
<script type="text/javascript" src="../../../ui/ui.sortable.js"></script>
<script type="text/javascript">
$(function() {
$("#sortable").sortable();
$("body").children(":first").sortable();
});
</script>
</head>
<body>
<div id="sortable">
<div>Sortable 1</div>
<div>Sortable 2</div>
<div>Sortable 3</div>
</div>
<div><div>Sortable 1</div><div>Sortable 2</div><div>Sortable 3</div></div>
</body>
</html>