RubyGems - old_sql - Versions diffs - 1.12.0 → 1.13.0 - Mend

old_sql 1.12.0 → 1.13.0

Files changed (263) hide show

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/ajax_tables/index.html ADDED Viewed

@@ -0,0 +1,96 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<!--
+Using a made-up xmlns..
+-->
+<html xmlns:mochi="http://mochikit.com/examples/ajax_tables">
+    <head>
+        <title>Sortable Tables from Scratch with MochiKit</title>
+        <link href="ajax_tables.css" rel="stylesheet" type="text/css" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="ajax_tables.js"></script>
+    </head>
+    <body>
+        <h1>
+            Sortable Ajax Tables in JSON and XML with MochiKit
+        </h1>
+        <div>
+            <div>
+                <p>
+                    This is an example of how one might use <a href="http://mochikit.com/">MochiKit</a> to do
+                    sortable tables from data given by the server in either JSON
+                    or XML format.  It uses
+                    <a href="../../doc/html/lib/MochiKit/Async.html">MochiKit.Async</a>
+                    to fetch the data, and
+                    <a href="../../doc/html/lib/MochiKit/DOM.html">MochiKit.DOM</a>
+                    to display it.
+                </p>
+                <p>
+                    Includes a micro implementation of something
+                    <a href="http://www.zope.org/Wikis/DevSite/Projects/ZPT/FrontPage">TAL</a>-esque
+                    (called "MochiTAL" in the source, using a mochi: namespace).
+                    For a more detailed description of what happens under the
+                    covers, view the <a href="ajax_tables.js" class="view-source">ajax_tables.js</a>
+                    source and look at the comments.
+                </p>
+            </div>
+        </div>
+        <div>
+            View Source: [
+            <a href="index.html" class="view-source">index.html</a> |
+            <a href="ajax_tables.js" class="view-source">ajax_tables.js</a> |
+            <a href="domains.json" class="view-source">domains.json</a> |
+            <a href="domains.xml" class="view-source">domains.xml</a>
+            ]
+        </div>
+        <div>
+            Load data: [
+            <a href="domains.json" mochi:dataformat="json">domains.json</a>
+            | <a href="domains.xml" mochi:dataformat="xml">domains.xml</a>
+            ]
+            (current format: <span class="mochi-template" mochi:content="format">loading</span>)
+        </div>
+        <table id="sortable_table" class="datagrid">
+            <thead>
+                <tr>
+                    <th mochi:sortcolumn="domain_name str">Domain Name</th>
+                    <th mochi:sortcolumn="create_date isoDate">Creation Date</th>
+                    <th mochi:sortcolumn="expiry_date isoDate">Expiry Date</th>
+                    <th mochi:sortcolumn="organization_name istr">Organization Name</th>
+                </tr>
+            </thead>
+            <tfoot class="invisible">
+                <tr>
+                    <td colspan="0"></td>
+                </tr>
+            </tfoot>
+            <tbody class="mochi-template">
+                <tr mochi:repeat="item domains">
+                    <td mochi:content="item.domain_name">mochibot.com</td>
+                    <td mochi:content="item.create_date">2005-02-10</td>
+                    <td mochi:content="item.expiry_date">2007-02-10</td>
+                    <td mochi:content="item.organization_name">Jameson Hsu</td>
+                </tr>
+                <tr class="mochi-example">
+                    <td>pythonmac.org</td>
+                    <td>2003-09-24</td>
+                    <td>2006-09-24</td>
+                    <td>Bob Ippolito</td>
+                </tr>
+                <tr class="mochi-example">
+                    <td>undefined.org</td>
+                    <td>2000-01-10</td>
+                    <td>2006-01-10</td>
+                    <td>Robert J Ippolito</td>
+                </tr>
+                <tr class="mochi-example">
+                    <td>python.org</td>
+                    <td>1995-03-27</td>
+                    <td>2007-03-28</td>
+                    <td>Python Software Foundation</td>
+                </tr>
+            </tbody>
+        </table>
+    </body>
+</html>

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/color_wheel/color_wheel.css ADDED Viewed

@@ -0,0 +1,4 @@
+h1 { text-align: center; }
+#docs { text-align: center; }
+#source { text-align: center; }
+#color_wheel_container { position:absolute; left: 50%; top: 50% }

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/color_wheel/color_wheel.js ADDED Viewed

@@ -0,0 +1,95 @@
+var radius = 225;
+var twoPI = Math.PI * 2;
+var amplification = 10;
+var calcAlpha = function (target, lightness) {
+    return Math.max(1.0 - (Math.abs(lightness - target) * amplification), 0);
+};
+var makeColorDiv = function (name) {
+    var c = Color.fromName(name);
+    var hsl = c.asHSL();
+    var r = hsl.s * radius;
+    var e = DIV({"style": {
+            "color": Color.fromHSL(hsl).toString(),
+            "width": "100px",
+            "height": "30px",
+            "position": "absolute",
+            "verticalAlign": "middle",
+            "textAlign": "center",
+            "left": Math.floor((Math.cos(hsl.h * twoPI) * r) - 50) + "px",
+            "top": Math.floor((Math.sin(hsl.h * twoPI) * r)) + "px"
+        }},
+        name
+    );
+    // hsl.a = 0;
+    return [c, e];
+};
+var colorWheelOnLoad = function () {
+    var seenColors = {};
+    var colors = Color.namedColors();
+    var colorDivs = [];
+    for (var k in colors) {
+        var val = colors[k];
+        if (val in seenColors) {
+            continue;
+        }
+        colorDivs.push(makeColorDiv(k));
+    }
+    swapDOM(
+        "color_wheel",
+        DIV(null, map(itemgetter(1), colorDivs))
+    );
+    var colorCanary = DIV({"style":{"color": "blue"}}, "");
+    try {
+        colorCanary.style.color = "rgba(100,100,100,0.5)";
+    } catch (e) {
+        // IE passtastic
+    }
+    var colorFunc;
+    // Check for CSS3 HSL support
+    if (colorCanary.style.color == "blue") {
+        var bgColor = Color.fromBackground();
+        colorFunc  = function (color, alpha) {
+            return bgColor.blendedColor(color, alpha).toHexString();
+        };
+    } else {
+        colorFunc = function (color, alpha) {
+            return color.colorWithAlpha(alpha).toRGBString();
+        }
+    }
+    // Per-frame animation
+    var intervalFunc = function (cycle, timeout) {
+        var target = 0.5 + (0.5 * Math.sin(Math.PI * (cycle / 180)));
+        for (var i = 0; i < colorDivs.length; i++) {
+            var cd = colorDivs[i];
+            var color = cd[0];
+            var alpha = calcAlpha(target, color.asHSL().l);
+            var style = cd[1].style;
+            if (alpha == 0) {
+                style.display = "none";
+            } else {
+                style.display ="";
+                style.color = colorFunc(color, alpha);
+            }
+        }
+        callLater(timeout, arguments.callee, cycle + 2, timeout);
+    };
+    // < 5 fps
+    intervalFunc(0, 1/5);
+};
+addLoadEvent(colorWheelOnLoad);
+// rewrite the view-source links
+addLoadEvent(function () {
+    var elems = getElementsByTagAndClassName("A", "view-source");
+    var page = "color_wheel/";
+    for (var i = 0; i < elems.length; i++) {
+        var elem = elems[i];
+        var href = elem.href.split(/\//).pop();
+        elem.target = "_blank";
+        elem.href = "../view-source/view-source.html#" + page + href;
+    }
+});

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/color_wheel/index.html ADDED Viewed

@@ -0,0 +1,31 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+    <head>
+        <title>Demo of MochiKit.Color</title>
+        <link href="color_wheel.css" rel="stylesheet" type="text/css" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="color_wheel.js"></script>
+    </head>
+    <body>
+        <h1>Color Wheel</h1>
+        <div id="docs">
+            Animated visualization of all the CSS3 colors by:
+            hue (angle), saturation (distance), luminance (time/alpha).
+            <br />
+            Uses <a href="http://mochikit.com/">MochiKit</a>'s
+            <a href="../../doc/html/lib/MochiKit/Color.html">MochiKit.Color</a>,
+            <a href="../../doc/html/lib/MochiKit/DOM.html">MochiKit.DOM</a>,
+            and <a href="../../doc/html/lib/MochiKit/Async.html">MochiKit.Async</a>.
+        </div>
+        <div id="source">
+            View Source: [
+                <a href="index.html" class="view-source">index.html</a> |
+                <a href="color_wheel.js" class="view-source">color_wheel.js</a>
+            ]
+        </div>
+        <div id="color_wheel_container">
+            <div id="color_wheel" />
+        </div>
+    </body>
+</html>

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/dnd_sortable.css ADDED Viewed

@@ -0,0 +1,23 @@
+h1 {
+    font-size: 2em;
+    color: #4B4545;
+    text-align: center;
+}
+#dnd_sortable {
+  margin: 0;
+  margin-top: 10px;
+  padding: 0;
+  list-style-type: none;
+  width: 250px;
+}
+#dnd_sortable li {
+    margin: 0;
+    margin-bottom: 4px;
+    padding: 5px;
+    border: 1px solid #888;
+    cursor: move;
+    text-align: center;
+}

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/dropmarker.png ADDED Viewed

Binary file

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/icon.png ADDED Viewed

Binary file

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/index.html ADDED Viewed

@@ -0,0 +1,54 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html>
+    <head>
+        <title>Drag and Drop Sortable Tables with MochiKit</title>
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+        <link href="dnd_sortable.css" rel="stylesheet" type="text/css" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Position.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Visual.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/DragAndDrop.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Sortable.js"></script>
+    </head>
+    <body>
+        <h1>
+            Drag and Drop Sortable Tables with MochiKit
+        </h1>
+        <p>
+            View Source: [
+                <a href="index.html" class="view-source">index.html</a>
+            ]
+        </p>
+        <ul id="dnd_sortable">
+            <li>mochibot.com</li>
+            <li>pythonmac.org</li>
+            <li>undefined.org</li>
+            <li>python.org</li>
+        </ul>
+        <p>
+            <a onclick="validate()">Validate order choice</a>
+        </p>
+<script type="text/javascript">
+MochiKit.Sortable.Sortable.create('dnd_sortable');
+validate = function () {
+    var children = MochiKit.DOM.getElement("dnd_sortable").childNodes;
+    var res = '';
+    for (var i = 0; i < children.length; i++) {
+        res += children[i].firstChild.nodeValue + ' ';
+    }
+    alert(res);
+}
+</script>
+<p>
+    <ul>
+        <li><a href="sortable_test.html">Test 1</a></li>
+        <li><a href="sortable2_test.html">Test 2</a></li>
+        <li><a href="sortable3_test.html">Test 3</a></li>
+        <li><a href="sortable4_test.html">Test 4</a></li>
+        <li><a href="sortable5_test.html">Test 5</a></li>
+        <li><a href="sortable_tree_test.html">Test tree</a></li>
+    </ul>
+</p>
+    </body>
+</html>

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/sortable2_test.html ADDED Viewed

@@ -0,0 +1,150 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Sortable ghosting functional test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Position.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Visual.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Signal.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/DragAndDrop.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Sortable.js"></script>
+  <style>
+    ul.testlist {
+      list-style-type:none;
+      margin:0;
+      padding:0;
+    }
+    ul.testlist li {
+      width:200px;
+      font:12px Verdana;
+      padding:4px;
+      cursor:move;
+    }
+    ul.testlist li.over {
+      background-color:#fcb;
+    }
+    ul.testlist li img {
+      float:left;
+      margin-right:8px;
+    }
+    div.dropmarker {
+      height:6px;
+      width:200px;
+      background: url(dropmarker.png) left top;
+      margin-top:-3px;
+      margin-left:-5px;
+      z-index:1000;
+      overflow: hidden;
+    }
+    #testlist4 li {
+      float:left;
+    }
+  </style>
+</head>
+<body>
+<h1>script.aculo.us Sortable ghosting functional test file</h1>
+<h2>Ghosting</h2>
+<ul id="testlist" class="testlist">
+<li id="item_1"><img src="icon.png" alt=""/> Lorem ipsum dolor</li>
+<li id="item_2"><img src="icon.png" alt=""/> sit amet</li>
+<li id="item_3"><img src="icon.png" alt=""/> consectetur adipisicing</li>
+<li id="item_4"><img src="icon.png" alt=""/> elit</li>
+<li id="item_5"><img src="icon.png" alt=""/> sed do eiusmod</li>
+<li id="item_6"><img src="icon.png" alt=""/> tempor incididunt</li>
+<li id="item_7"><img src="icon.png" alt=""/> ut labore et dolore</li>
+<li id="item_8"><img src="icon.png" alt=""/> magna aliqua</li>
+</ul>
+<p id="testlist_serialize">(waiting for onChange)</p>
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  MochiKit.Sortable.Sortable.create('testlist',{ghosting:true,constraint:false,hoverclass:'over',
+    onUpdate:function(sortable){alert(MochiKit.Sortable.Sortable.serialize(sortable))},
+    onChange:function(element){$('testlist_serialize').innerHTML = MochiKit.Sortable.Sortable.serialize(element.parentNode)}
+  });
+// ]]>
+</script>
+<h2>No ghosting</h2>
+<ul id="testlist2" class="testlist">
+<li id="item_9"><img src="icon.png" alt=""/> Lorem ipsum dolor</li>
+<li id="item_10"><img src="icon.png" alt=""/> sit amet</li>
+<li id="item_11"><img src="icon.png" alt=""/> consectetur adipisicing</li>
+<li id="item_12"><img src="icon.png" alt=""/> elit</li>
+<li id="item_13"><img src="icon.png" alt=""/> sed do eiusmod</li>
+<li id="item_14"><img src="icon.png" alt=""/> tempor incididunt</li>
+<li id="item_15"><img src="icon.png" alt=""/> ut labore et dolore</li>
+<li id="item_16"><img src="icon.png" alt=""/> magna aliqua</li>
+</ul>
+<p id="testlist2_serialize">(waiting for onChange)</p>
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  MochiKit.Sortable.Sortable.create('testlist2',{ghosting:false,constraint:false,hoverclass:'over',
+    onUpdate:function(sortable){alert(MochiKit.Sortable.Sortable.serialize(sortable))},
+    onChange:function(element){$('testlist2_serialize').innerHTML = MochiKit.Sortable.Sortable.serialize(element.parentNode)}
+  });
+// ]]>
+</script>
+<h2>Ghosting (inside position:relative container)</h2>
+<div style="position:relative;left:100px;top:-5px;">
+<ul id="testlist3" class="testlist">
+<li id="item_17"><img src="icon.png" alt=""/> Lorem ipsum dolor</li>
+<li id="item_18"><img src="icon.png" alt=""/> sit amet</li>
+<li id="item_19"><img src="icon.png" alt=""/> consectetur adipisicing</li>
+<li id="item_20"><img src="icon.png" alt=""/> elit</li>
+<li id="item_21"><img src="icon.png" alt=""/> sed do eiusmod</li>
+<li id="item_22"><img src="icon.png" alt=""/> tempor incididunt</li>
+<li id="item_23"><img src="icon.png" alt=""/> ut labore et dolore</li>
+<li id="item_24"><img src="icon.png" alt=""/> magna aliqua</li>
+</ul>
+</div>
+<p id="testlist3_serialize">(waiting for onChange)</p>
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  MochiKit.Sortable.Sortable.create('testlist3',{ghosting:true,constraint:false,
+    onUpdate:function(sortable){alert(MochiKit.Sortable.Sortable.serialize(sortable))},
+    onChange:function(element){$('testlist3_serialize').innerHTML = MochiKit.Sortable.Sortable.serialize(element.parentNode)}
+  });
+// ]]>
+</script>
+<h2>Ghosting (inside position:relative container)</h2>
+<div style="position:relative;left:100px;top:-5px;">
+<ul id="testlist4" class="testlist">
+<li id="item_417"><img src="icon.png" alt=""/> Lorem ipsum dolor</li>
+<li id="item_418"><img src="icon.png" alt=""/> sit amet</li>
+<li id="item_419"><img src="icon.png" alt=""/> consectetur adipisicing</li>
+<li id="item_420"><img src="icon.png" alt=""/> elit</li>
+<li id="item_421"><img src="icon.png" alt=""/> sed do eiusmod</li>
+<li id="item_422"><img src="icon.png" alt=""/> tempor incididunt</li>
+<li id="item_423"><img src="icon.png" alt=""/> ut labore et dolore</li>
+<li id="item_424"><img src="icon.png" alt=""/> magna aliqua</li>
+</ul>
+</div>
+<p id="testlist4_serialize">(waiting for onChange)</p>
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  MochiKit.Sortable.Sortable.create('testlist4',{overlap:'horizontal',ghosting:true,constraint:false,
+    onUpdate:function(sortable){alert(MochiKit.Sortable.Sortable.serialize(sortable))},
+    onChange:function(element){$('testlist4_serialize').innerHTML = MochiKit.Sortable.Sortable.serialize(element.parentNode)}
+  });
+// ]]>
+</script>
+<div id="debug"></div>
+</body>
+</html>

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/sortable3_test.html ADDED Viewed

@@ -0,0 +1,42 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us sortable functional test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Position.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Visual.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Signal.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/DragAndDrop.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Sortable.js"></script>
+  <style type="text/css" media="screen">
+    ul { height: 100px; border:1px dotted #888; }
+  </style>
+</head>
+<body>
+<h1>script.aculo.us Sortable two-lists w/ dropOnEmpty functional test file</h1>
+<ul id="thelist1">
+<li id="thelist1_1">Hey there! I'm item#1/1</li>
+<li id="thelist1_2">Hey there! I'm item#1/2</li>
+<li id="thelist1_3">Hey there! I'm item#1/3</li>
+</ul>
+<ul id="thelist2">
+</ul>
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  MochiKit.Sortable.Sortable.create('thelist1',{containment:['thelist1','thelist2'], dropOnEmpty:true});
+  MochiKit.Sortable.Sortable.create('thelist2',{containment:['thelist1','thelist2'], dropOnEmpty:true});
+// ]]>
+</script>
+<a href="#" onclick="alert(MochiKit.Sortable.Sortable.serialize('thelist1'));return false;">Serialize sortable1</a>
+<a href="#" onclick="alert(MochiKit.Sortable.Sortable.serialize('thelist2'));return false;">Serialize sortable2</a>
+<div id="debug"></div>
+</body>
+</html>

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/sortable4_test.html ADDED Viewed

@@ -0,0 +1,90 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us sortable functional test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Position.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Visual.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Signal.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/DragAndDrop.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Sortable.js"></script>
+  <style type="text/css" media="screen">
+  ul.sortablelist {
+    list-style-image:none;
+    list-style-type:none;
+    margin-top:5px;
+    margin:0px;
+    padding:0px;
+  }
+  ul.sortabledemo li {
+    padding:0px;
+    margin:0px;
+  }
+  span.handle {
+    background-color: #E8A400;
+    color:white;
+    cursor: move;
+  }
+  li.green {
+    background-color: #ECF3E1;
+    border:1px solid #C5DEA1;
+    cursor: move;
+  }
+  li.orange {
+    border:1px solid #E8A400;
+    background-color: #FFF4D8;
+  }
+  </style>
+</head>
+<body>
+<h1>script.aculo.us: Two floating sortables with containment and dropOnEmpty</h1>
+<div style="height:200px;">
+<div style="float:left;">
+<h3>This is the first list</h3>
+ <ul class="sortabledemo" id="firstlist" style="height:150px;width:200px;">
+   <li class="green" id="firstlist_firstlist1">Item 1 from first list.</li>
+   <li class="green" id="firstlist_firstlist2">Item 2 from first list.</li>
+   <li class="green" id="firstlist_firstlist3">Item 3 from first list.</li>
+ </ul>
+</div>
+ <div style="float:left;">
+ <h3>And now the second list</h3>
+ <ul class="sortabledemo" id="secondlist" style="height:150px;width:200px;">
+   <li class="orange" id="secondlist_secondlist1">
+     <span class="handle">DRAG HERE</span> Item 1 from second list.
+   </li>
+   <li class="orange" id="secondlist_secondlist2">
+     <span class="handle">DRAG HERE</span> Item 2 from second list.
+   </li>
+   <li class="orange" id="secondlist_secondlist3">
+     <span class="handle">DRAG HERE</span> Item 3 from second list.
+   </li>
+ </ul>
+</div>
+</div>
+<hr style="clear:both" />
+<pre id="firstlist_debug"></pre>
+<pre id="secondlist_debug"></pre>
+ <script type="text/javascript">
+ // <![CDATA[
+   MochiKit.Sortable.Sortable.create("firstlist",
+     {dropOnEmpty:true,containment:["firstlist","secondlist"],constraint:false,
+      onChange:function(){$('firstlist_debug').innerHTML = MochiKit.Sortable.Sortable.serialize('firstlist') }});
+   MochiKit.Sortable.Sortable.create("secondlist",
+     {dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist"],constraint:false,
+     onChange:function(){$('secondlist_debug').innerHTML = MochiKit.Sortable.Sortable.serialize('secondlist') }});
+ // ]]>
+ </script>
+ </body>
+ </html>

data/public/javascripts/old_sql/MochiKit-1.4.2/examples/dnd_sortable/sortable5_test.html ADDED Viewed

@@ -0,0 +1,29 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>MochiKit sortable functional test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+        <script type="text/javascript" src="../../lib/MochiKit/MochiKit.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/DragAndDrop.js"></script>
+        <script type="text/javascript" src="../../lib/MochiKit/Sortable.js"></script>
+</head>
+<body>
+  <div id="container_div">
+  </div>
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  var ul = UL(null,
+              LI(null, "blah1"),
+              LI(null, "blah2"));
+  appendChildNodes('container_div', ul);
+  MochiKit.Sortable.Sortable.create(ul, { onUpdate: function() { alert(MochiKit.Sortable.Sortable.serialize(ul)); } });
+// ]]>
+</script>
+</body>
+</html>