r2043 - trunk/tests/visual/droppable
Author: rdworth
Date: Sat Feb 7 11:02:08 2009
New Revision: 2043
Added:
trunk/tests/visual/droppable/droppable.css (contents, props changed)
trunk/tests/visual/droppable/droppable_option_accept_default.html
(contents, props changed)
trunk/tests/visual/droppable/droppable_option_accept_function.html
(contents, props changed)
trunk/tests/visual/droppable/droppable_option_accept_selector.html
(contents, props changed)
Modified:
trunk/tests/visual/droppable/droppable.html
Log:
droppable visual tests: added option accept tests
Added: trunk/tests/visual/droppable/droppable.css
==============================================================================
--- (empty file)
+++ trunk/tests/visual/droppable/droppable.css Sat Feb 7 11:02:08 2009
@@ -0,0 +1,3 @@
+#draggables * { width: 100px; height: 20px; display: block; margin-bottom:
1em; background: #abc; }
+#droppable { width: 200px; }
+#droppable * { margin: 0.8em; padding: 0.4em; }
Modified: trunk/tests/visual/droppable/droppable.html
==============================================================================
--- trunk/tests/visual/droppable/droppable.html (original)
+++ trunk/tests/visual/droppable/droppable.html Sat Feb 7 11:02:08 2009
@@ -1,8 +1,8 @@
<!doctype html>
<html lang="en">
<head>
- <title>Simple Droppable</title>
- <link rel="stylesheet" href="../all.css" type="text/css">
+ <title>Droppable Visual Test : Default</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.1.js"></script>
<script type="text/javascript" src="../../../ui/ui.core.js"></script>
@@ -10,31 +10,13 @@
<script type="text/javascript" src="../../../ui/ui.droppable.js"></script>
<script type="text/javascript">
$(function() {
- $(".draggable").draggable();
- $("#droppable").droppable({
- accept: '.draggable',
- drop: function(ev, ui) {
- ui.draggable.css({ position: 'relative', top: 0, left: 0
}).clone().appendTo(this);
- }
- });
+ $("#droppable").droppable();
});
</script>
</head>
<body>
-
-<ul class="plugins">
-<li class="plugin">
- Droppable
- <div class="draggable">D</div>
- <div class="draggable">R</div>
- <div class="draggable">A</div>
- <div class="draggable">G</div>
- <div id="droppable">
- DROP
- <hr>
- </div>
-</li>
-</ul>
-
+<div id="droppable">
+ Droppable
+</div>
</body>
</html>
Added: trunk/tests/visual/droppable/droppable_option_accept_default.html
==============================================================================
--- (empty file)
+++ trunk/tests/visual/droppable/droppable_option_accept_default.html Sat
Feb 7 11:02:08 2009
@@ -0,0 +1,37 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Droppable Visual Test : Draggable option accept default</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="droppable.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.1.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" src="../../../ui/ui.droppable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#draggables *").draggable({
+ revert: true
+ });
+ $("#droppable").droppable({
+ drop: function(event, ui) {
+ $(this).append('<div>' + ui.draggable.text() + '</div>');
+ }
+ });
+ });
+ </script>
+</head>
+<body>
+
+<div id="draggables">
+ <div>Draggable div</div>
+ Draggable p
+ <span>Draggable span</div>
+</div>
+
+<div id="droppable" class="ui-widget-content ui-corner-all">
+ <p class="ui-widget-header ui-corner-all"> Droppable
+</div>
+</body>
+</html>
Added: trunk/tests/visual/droppable/droppable_option_accept_function.html
==============================================================================
--- (empty file)
+++ trunk/tests/visual/droppable/droppable_option_accept_function.html Sat
Feb 7 11:02:08 2009
@@ -0,0 +1,40 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Droppable Visual Test : Draggable option accept function</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="droppable.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.1.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" src="../../../ui/ui.droppable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#draggables *").draggable({
+ revert: true
+ });
+ $("#droppable").droppable({
+ accept: function(draggable) {
+ return (draggable.text() === 'Draggable p');
+ },
+ drop: function(event, ui) {
+ $(this).append('<div>' + ui.draggable.text() + '</div>');
+ }
+ });
+ });
+ </script>
+</head>
+<body>
+
+<div id="draggables">
+ <div>Draggable div</div>
+ Draggable p
+ <span>Draggable span</div>
+</div>
+
+<div id="droppable" class="ui-widget-content ui-corner-all">
+ <p class="ui-widget-header ui-corner-all"> Droppable
+</div>
+</body>
+</html>
Added: trunk/tests/visual/droppable/droppable_option_accept_selector.html
==============================================================================
--- (empty file)
+++ trunk/tests/visual/droppable/droppable_option_accept_selector.html Sat
Feb 7 11:02:08 2009
@@ -0,0 +1,38 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Droppable Visual Test : Draggable option accept selector</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="droppable.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.1.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" src="../../../ui/ui.droppable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#draggables *").draggable({
+ revert: true
+ });
+ $("#droppable").droppable({
+ accept: 'p',
+ drop: function(event, ui) {
+ $(this).append('<div>' + ui.draggable.text() + '</div>');
+ }
+ });
+ });
+ </script>
+</head>
+<body>
+
+<div id="draggables">
+ <div>Draggable div</div>
+ Draggable p
+ <span>Draggable span</div>
+</div>
+
+<div id="droppable" class="ui-widget-content ui-corner-all">
+ <p class="ui-widget-header ui-corner-all"> Droppable
+</div>
+</body>
+</html>