[Mapbender-commits] r2952 - branches/tree_dev/http/x_test

[svn_mapbender at osgeo.org]

Author: christoph
Date: 2008-09-17 06:31:27 -0400 (Wed, 17 Sep 2008)
New Revision: 2952

Modified:
   branches/tree_dev/http/x_test/customTree.js
   branches/tree_dev/http/x_test/customTreeModel.js
   branches/tree_dev/http/x_test/tree.html
Log:
refactoring

Modified: branches/tree_dev/http/x_test/customTree.js
===================================================================
--- branches/tree_dev/http/x_test/customTree.js	2008-09-17 10:10:20 UTC (rev 2951)
+++ branches/tree_dev/http/x_test/customTree.js	2008-09-17 10:31:27 UTC (rev 2952)
@@ -6,11 +6,96 @@
 	this.$root = $("<ul></ul>");
 
 	var that = this;
+	var currentlyDraggedNode;
 	
-	var setProperties = function () {
-		
+	var addContextMenuToLeaf = function ($domNode, treeNode) {
+		$domNode.contextMenu('leafMenu', {
+			onContextMenu: function(e) {
+				return true;
+			},
+			onShowMenu: function(e, menu) {
+				return menu;
+			},
+			bindings: {
+				'deleteService': function () {
+					treeNode.remove();
+				}
+			}
+		});
+	}
+	
+	var addContextMenuToFolder = function ($domNode, treeNode) {
+		$domNode.contextMenu('folderMenu', {
+			onContextMenu: function(e){
+				return true;
+			},
+			onShowMenu: function(e, menu){
+				return menu;
+			},
+			bindings: {
+				'addFolder': function(item){
+					var newChild = treeNode.addChild();
+				},
+				'deleteFolder': function(){
+					treeNode.remove();
+				},
+				'editFolder': function(){
+				
+				}
+			}
+		});
 	};
 	
+	var addContextMenuToRoot = function ($domNode, treeNode) {
+		$domNode.contextMenu('rootMenu', {
+			onContextMenu: function(e){
+				return true;
+			},
+			onShowMenu: function(e, menu){
+				return menu;
+			},
+			bindings: {
+				'addFolder': function(item){
+					var newChild = treeNode.addChild();
+				}
+			}
+		});
+	};
+	
+	var addOpenCloseBehaviour = function ($domNode) {
+		$domNode.toggle(function () {
+			$(this).siblings().hide("fast");
+		}, function () {
+			$(this).siblings().show("fast");
+		});		
+	};
+	
+	var makeNodeDroppable = function ($domNode, treeNode) {
+		$domNode.droppable({
+			"accept": function ($draggable) {
+				var $invalidDroppables = $(".currently-dragging .treeNodeDrop");
+				var $invalidDroppablesMinusThis = $invalidDroppables.not($domNode);
+
+				if ($invalidDroppables.size() > $invalidDroppablesMinusThis.size()) {
+					return false;
+				}
+				return true;
+			},
+			"tolerance": "pointer", 
+			"drop": function (e, ui) {
+				$toDomNode = $(this);
+				$fromDomNode = $(ui.draggable);
+				
+				currentlyDraggedNode.afterMove = function () {
+					$toDomNode.next().append($(ui.draggable));
+					$(".treeLeaf").removeAttr("style");
+					$("*").removeClass("currently-dragging");
+				};
+				currentlyDraggedNode.move(treeNode);
+			}
+		});		
+	};
+	
 	/**
 	 *  A recursive function to draw the nodes of a tree and attach 
 	 *  draggables and droppables
@@ -28,20 +113,7 @@
 			$currentLabel = $("<span>" + treeNode.name + "</span>");
 			$currentItem = $("<li class='treeLeaf'></li>");
 			$currentItem.append($currentLabel);
-
-			$currentLabel.contextMenu('leafMenu', {
-				onContextMenu: function(e) {
-					return true;
-				},
-				onShowMenu: function(e, menu) {
-					return menu;
-				},
-				bindings: {
-					'deleteService': function () {
-						treeNode.remove();
-					}
-				}
-			});
+			addContextMenuToLeaf($currentLabel, treeNode);
 		}
 		else {
 			// this treeNode is an inner node
@@ -57,67 +129,24 @@
 			// (not for root node)
 			//
 			if (treeNode != that.myTree.root) {
-				$currentLabel.toggle(function () {
-					$(this).siblings().hide("fast");
-				}, function () {
-					$(this).siblings().show("fast");
-				});
+				addOpenCloseBehaviour($currentLabel);
 			}
 
 			//
-			// enable folder closing and opening
-			// (not for root node)
+			// enable context menu
 			//
 			if (treeNode != that.myTree.root) {
-				$currentLabel.contextMenu('folderMenu', {
-					onContextMenu: function(e){
-						return true;
-					},
-					onShowMenu: function(e, menu){
-						return menu;
-					},
-					bindings: {
-						'addFolder': function(item){
-							var newChild = treeNode.addChild();
-						},
-						'deleteFolder': function(){
-							treeNode.remove();
-						},
-						'editFolder': function(){
-						
-						}
-					}
-				});
+				addContextMenuToFolder($currentLabel, treeNode);
 			}
-		
+			else {
+				addContextMenuToRoot($currentLabel, treeNode);
+			}		
 
 			//
 			// make inner nodes droppable
 			//
-			$currentLabel.droppable({
-				"accept": function ($draggable) {
-					var $invalidDroppables = $(".currently-dragging .treeNodeDrop");
-					var $invalidDroppablesMinusThis = $invalidDroppables.not($currentLabel);
+			makeNodeDroppable($currentLabel, treeNode);
 
-					if ($invalidDroppables.size() > $invalidDroppablesMinusThis.size()) {
-						return false;
-					}
-					return true;
-				},
-				"tolerance": "pointer", 
-				"drop": function (e, ui) {
-					$toDomNode = $(this);
-					$fromDomNode = $(ui.draggable);
-					
-					that.myTree.currentlyDraggedNode.afterMove = function () {
-						$toDomNode.next().append($(ui.draggable));
-						$(".treeLeaf").removeAttr("style");
-						$("*").removeClass("currently-dragging");
-					};
-					that.myTree.currentlyDraggedNode.move(treeNode);
-				}
-			});
-
 			//
 			// visit the child nodes (depth first)
 			//
@@ -134,7 +163,7 @@
 				"helper": "clone",
 				"start": function(){
 					$(this).addClass("currently-dragging");
-					that.myTree.currentlyDraggedNode = treeNode;
+					currentlyDraggedNode = treeNode;
 				}
 			});
 		}

Modified: branches/tree_dev/http/x_test/customTreeModel.js
===================================================================
--- branches/tree_dev/http/x_test/customTreeModel.js	2008-09-17 10:10:20 UTC (rev 2951)
+++ branches/tree_dev/http/x_test/customTreeModel.js	2008-09-17 10:31:27 UTC (rev 2952)
@@ -119,8 +119,6 @@
 var CustomTree = function () {
 	this.root = new CustomTreeNode (null);
 	
-	this.currentlyDraggedNode = null;
-	
 	var that = this;
 	
 	/**

Modified: branches/tree_dev/http/x_test/tree.html
===================================================================
--- branches/tree_dev/http/x_test/tree.html	2008-09-17 10:10:20 UTC (rev 2951)
+++ branches/tree_dev/http/x_test/tree.html	2008-09-17 10:31:27 UTC (rev 2952)
@@ -51,6 +51,11 @@
 				<li id="editFolder"><img src="images/folder_edit.png" /> Edit</li>
 			</ul>
 		</div>
+		<div class="contextMenu" id="rootMenu">
+			<ul>
+				<li id="addFolder"><img src="images/folder_add.png" /> Add </li>
+			</ul>
+		</div>
 		<div class="contextMenu" id="leafMenu">
 			<ul>
 				<li id="deleteService"><img src="images/folder_delete.png" /> Delete</li>