removed extra level ui folder

5 files changed, 233 insertions, 0 deletions

diff --git a/demos/real-world/layout/demo.css b/demos/real-world/layout/demo.css
new file mode 100644
index 000000000..a7b108623
--- /dev/null
+++ b/demos/real-world/layout/demo.css
@@ -0,0 +1,42 @@
+body { background-color:#666; color:#FFF; font:11px/1.5 Arial, sans-serif; margin:0; overflow:hidden; padding:30px 0 0 30px; }
+h1 { font-size:18px; margin:0 0 20px; }
+a { color:#FFF; }
+
+.clear { clear:both; font-size:1px; line-height:1px; }
+
+#overlay { background:#666; height:100%; left:0; position:absolute; top:0; width:100%; z-index:2000; }
+#overlay #preloader { background:url(loader_bg.gif) no-repeat; height:50px; left:50%; line-height:50px; margin:-25px 0 0 -25px; position:absolute; text-align:center; top:50%; width:50px; }
+#overlay #preloader img { margin:11px 0 0 0; vertical-align:middle; }
+
+.ui-sortable { background-color:#FFF; border:1px solid #555; color:#222; margin:0 15px 15px 0; padding:0 10px 10px; width:175px; }
+.ui-sortable h2 { background-color:#555; border-top:3px solid #666; color:#FFF; font-size:11px; margin:0 -10px 10px; line-height:2; padding:0 10px; }
+
+dl.sort { color:#222; margin:10px 0; }
+#uidemo dl.first { margin-top:0; }
+#uidemo dl.last { margin-bottom:0; }
+
+dl.sort dt { background-color:#666; color:#FFF; cursor:move; height:2em; line-height:2; padding:0 6px; position:relative; }
+dl.sort dd { background-color:#FFF; margin:0; padding:3px 6px; }
+
+.ui-sortable-helper { width:175px; }
+.placeholder { border:1px dashed #AAA; }
+
+span.options { cursor:default; font-size:1px; line-height:1px; position:absolute; }
+span.options a { background-color:#FFF; cursor:pointer; display:block; float:left; text-indent:-9000px; }
+
+.ui-sortable h2 span.options { right:10px; top:8px; width:30px; }
+.ui-sortable h2 span.options a { height:12px; width:30px; }
+
+dl.sort dt span.options { right:5px; top:5px; width:27px; }
+dl.sort dt span.options a { height:12px; width:12px; }
+dl.sort dt span.options a.up { margin-right:3px; }
+dl.sort dt span.options a.disabled { background-color:#555; cursor:default; }
+
+#container { float:left; }
+#header { width:638px; }
+#content { float:left; width:400px; }
+#sidebar { float:left; width:200px; }
+#footer { width:638px; }
+#trashcan { float:left; }
+
+#trashcan p { margin:0; }
\ No newline at end of file
diff --git a/demos/real-world/layout/demo.js b/demos/real-world/layout/demo.js
new file mode 100644
index 000000000..695863f25
--- /dev/null
+++ b/demos/real-world/layout/demo.js
@@ -0,0 +1,97 @@
+(function($){
+	var updateUpDown = function(sortable){
+		$('dl:not(.ui-sortable-helper)', sortable)
+			.removeClass('first').removeClass('last')
+			.find('.up, .down').removeClass('disabled').end()
+			.filter(':first').addClass('first').find('.up').addClass('disabled').end().end()
+			.filter(':last').addClass('last').find('.down').addClass('disabled').end().end();
+	};
+	
+	var moveUpDown = function(){
+		var link = $(this),
+			dl = link.parents('dl'),
+			prev = dl.prev('dl'),
+			next = dl.next('dl');
+	
+		if(link.is('.up') && prev.length > 0)
+			dl.insertBefore(prev);
+	
+		if(link.is('.down') && next.length > 0)
+			dl.insertAfter(next);
+	
+		updateUpDown(dl.parent());
+	};
+	
+	var addItem = function(){
+		var sortable = $(this).parents('.ui-sortable');
+		var options = '<span class="options"><a class="up">up</a><a class="down">down</a></span>';
+		var tpl = '<dl class="sort"><dt>{name}' + options + '</dt><dd>{desc}</dd></dl>';
+		var html = tpl.replace(/{name}/g, 'Dynamic name :D').replace(/{desc}/g, 'Description');
+	
+		sortable.append(html).sortable('refresh').find('a.up, a.down').bind('click', moveUpDown);
+		updateUpDown(sortable);
+	};
+	
+	var emptyTrashCan = function(item){
+		item.remove();
+	};
+	
+	var sortableChange = function(e, ui){
+		if(ui.sender){
+			var w = ui.element.width();
+			ui.placeholder.width(w);
+			ui.helper.css("width",ui.element.children().width());
+		}
+	};
+	
+	var sortableUpdate = function(e, ui){
+		if(ui.element[0].id == 'trashcan'){
+			emptyTrashCan(ui.item);
+		} else {
+			updateUpDown(ui.element[0]);
+			if(ui.sender)
+				updateUpDown(ui.sender[0]);
+		}
+	};
+	
+	$(document).ready(function(){
+		var els = ['#header', '#content', '#sidebar', '#footer', '#trashcan'];
+		var $els = $(els.toString());
+		
+		$('h2', $els.slice(0,-1)).append('<span class="options"><a class="add">add</a></span>');
+		$('dt', $els).append('<span class="options"><a class="up">up</a><a class="down">down</a></span>');
+		
+		$('a.add').bind('click', addItem);
+		$('a.up, a.down').bind('click', moveUpDown);
+		
+		$els.each(function(){
+			updateUpDown(this);
+		});
+		
+		$els.sortable({
+			items: '> dl',
+			handle: 'dt',
+			cursor: 'move',
+			//cursorAt: { top: 2, left: 2 },
+			//opacity: 0.8,
+			//helper: 'clone',
+			appendTo: 'body',
+			//placeholder: 'clone',
+			//placeholder: 'placeholder',
+			connectWith: els,
+			start: function(e,ui) {
+				ui.helper.css("width", ui.item.width());
+			},
+			change: sortableChange,
+			update: sortableUpdate
+		});
+	});
+	
+	$(window).bind('load',function(){
+		setTimeout(function(){
+			$('#overlay').fadeOut(function(){
+				$('body').css('overflow', 'auto');
+			});
+		}, 750);
+	});
+})(jQuery);
\ No newline at end of file
diff --git a/demos/real-world/layout/index.html b/demos/real-world/layout/index.html
new file mode 100644
index 000000000..83f9d0378
--- /dev/null
+++ b/demos/real-world/layout/index.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<title>UI Sortable: Layout Demo</title>
+		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+		
+		<meta name="title" content="UI Sortable: Layout Demo" />
+		<meta name="description" content="A sortable layout created with the jQuery UI suite" />
+		
+		<meta name="author" content="Joan Piedra" />
+		<meta name="author-url" content="http://www.joanpiedra.com/" />
+		<meta name="author-url" content="http://www.justaquit.com/" />
+		<meta name="author-url" content="http://jquery.com/" />
+		
+		<link rel="shortcut icon" href="http://jquery.com/favicon.ico" />
+		<link rel="icon" href="http://jquery.com/favicon.ico" type="image/x-icon" />
+		
+		<link rel="stylesheet" href="demo.css" type="text/css" media="screen" />
+		<!-- saved from url=(0013)about:internet -->
+	</head>
+	
+	<body id="uidemo">
+		<h1>UI Sortable: <em>Layout demo</em></h1>
+		
+		<div id="container">
+			<div id="header" class="ui-sortable">
+				<h2>Header</h2>
+				<dl class="sort">
+					<dt>Pages</dt>
+					<dd>Main Navigation</dd>
+				</dl>
+			</div>
+			
+			<div id="content" class="ui-sortable">
+				<h2>Content</h2>
+				<dl class="sort">
+					<dt>Blog</dt>
+					<dd>Main blog post</dd>
+				</dl>
+			</div>
+			
+			<div id="sidebar" class="ui-sortable">
+				<h2>Sidebar</h2>
+				<dl class="sort">
+					<dt>Pages</dt>
+					<dd>Mini About</dd>
+				</dl>
+				<dl class="sort">
+					<dt>Blog</dt>
+					<dd>Monthly Archives</dd>
+				</dl>
+				<dl class="sort">
+					<dt>Links</dt>
+					<dd>Random Links</dd>
+				</dl>
+			</div>
+			
+			<div class="clear"></div>
+			
+			<div id="footer" class="ui-sortable">
+				<h2>Footer</h2>
+				<dl class="sort">
+					<dt>Pages</dt>
+					<dd>Copyright</dd>
+				</dl>
+			</div>
+		</div>
+		
+		<div id="trashcan" class="ui-sortable">
+			<h2>Trash can</h2>
+			<p>Drag modules here to delete them.</p>
+		</div>
+		
+		<div class="clear"></div>
+		<div id="overlay">
+			<div id="preloader"><img src="loader.gif" alt="" /></div>
+		</div>
+		
+		<!-- jQuery Core -->
+		<script type="text/javascript" src="../../../../jquery/jquery-1.2.6.js"></script>
+		
+		<!-- jQuery UI Base -->
+		<script type="text/javascript" src="../../../source/ui.core.js"></script>
+
+		<!-- jQuery UI Plugins -->
+		<script type="text/javascript" src="../../../source/ui.draggable.js"></script>
+		<script type="text/javascript" src="../../../source/ui.droppable.js"></script>
+		<script type="text/javascript" src="../../../source/ui.sortable.js"></script>
+
+		
+		<!-- jQuery UI Demo -->
+		<script type="text/javascript" src="demo.js"></script>
+	</body>
+</html>
\ No newline at end of file
diff --git a/demos/real-world/layout/loader.gif b/demos/real-world/layout/loader.gif
new file mode 100644
index 000000000..7e717cdf9
--- /dev/null
+++ b/demos/real-world/layout/loader.gif
diff --git a/demos/real-world/layout/loader_bg.gif b/demos/real-world/layout/loader_bg.gif
new file mode 100644
index 000000000..9c0488402
--- /dev/null
+++ b/demos/real-world/layout/loader_bg.gif