search notebook for list [ok]

app/views/Note/note-dev.html

@@ -82,9 +82,7 @@ function log(o) {
 								<i class="fa fa-angle-down"></i>
 							</a>
 							<div class="dropdown-menu dropdown-list" style="left: -200px;" >
-								<!--
+								<input type="text" placeholder="search notebook" class="form-control" id="searchNotebookForAdd"/>
-								<input type="text" placeholder="search notebook"/>
-								-->
 								<ul class="clearfix" role="menu" aria-labelledby="dropdownMenu2" id="notebookNavForNewNote">
 								</ul>
 							</div>
@@ -239,8 +237,12 @@ function log(o) {
 									<i class="fa  fa-plus" title="{{msg . "addNotebook"}}"></i>
 								</div>
 							</div>
-							<ul class="folderBody ztree" id="notebookList">
+							
-							</ul>
+							<div class="folderBody">
+								<input type="text" class="form-control" id="searchNotebookForList" placeholder="search notebook"/>							
+								<ul class="ztree" id="notebookList"></ul>
+								<ul class="ztree" id="notebookListForSearch"></ul>
+							</div>
 						</div>
 						
 						<div class="folderNote closed" id="myTag">

public/css/theme/basic.less

@@ -178,4 +178,27 @@
 .new-note-right {
 	padding: 0 5px;
 	padding-left: 3px
+}
+#leanoteMsg {
+	line-height: 40px; margin-top: 10px; margin-left: 10px;
+}
+#newNoteWrap {
+	line-height: 40px; margin-top: 10px;
+}
+
+#searchNotebookForAdd {
+	line-height: normal;
+	width: 200px;
+	margin: 0 10px;
+	margin-bottom: 10px;
+	height: 30px;
+	border-color: #ebeff2;
+	box-shadow: none;
+}
+#searchNotebookForList {
+	height: 30px;
+	width: 90%;
+	margin: 3px auto;
+	border-color: #ebeff2;
+	box-shadow: none;
 }

public/css/theme/default.less

@@ -464,7 +464,7 @@ a.raw:hover {
 }
 
 // 重命名, 添加notebook
-#notebookList input {
+#notebookList input, #notebookListForSearch input {
 	border: 1px solid @borderColor;
 	width: 90%;
     box-shadow: none;
@@ -1144,12 +1144,7 @@ background-position:-1px -670px
 		padding: 5px 0;
 	}
 }
-#leanoteMsg {
+
-	line-height: 40px; margin-top: 10px; margin-left: 10px;
-}
-#newNoteWrap {
-	line-height: 40px; margin-top: 10px;
-}
 #loading {
 	display: inline-block;
 	width: 20px;

public/css/theme/simple.less

@@ -443,7 +443,7 @@ a.raw:hover {
 }
 
 // 重命名, 添加notebook
-#notebookList input {
+#notebookList input, #notebookListForSearch input {
 	border: 1px solid @borderColor;
 	width: 90%;
     box-shadow: none;
@@ -1105,12 +1105,6 @@ background-position:-1px -670px
 	}
 }
 
-#leanoteMsg {
-	line-height: 40px; margin-top: 10px; margin-left: 10px;
-}
-#newNoteWrap {
-	line-height: 40px; margin-top: 10px;
-}
 #loading {
 	display: inline-block;
 	width: 20px;

public/js/app/note.js

@@ -1294,6 +1294,17 @@ $(function() {
 			Note.newNote(notebookId);
 		}
 	});
+	$("#searchNotebookForAdd").click(function(e) {
+		e.stopPropagation();
+	});
+	$("#searchNotebookForAdd").keyup(function() {
+		var key = $(this).val();
+		Notebook.searchNotebookForAddNote(key);
+	});
+	$("#searchNotebookForList").keyup(function() {
+		var key = $(this).val();
+		Notebook.searchNotebookForList(key);
+	});
 	
 	//---------------------------
 	// 搜索, 按enter才搜索

public/js/app/notebook.js

@@ -43,24 +43,24 @@ Notebook.getNotebookTitle = function(notebookId) {
 	<li><a class="active">Hadoop</a></li>
 	<li><a>August 13, 2013</a></li>
 </ul>
- */
+ */
-// TODO 层级
+ 
-Notebook.allNotebookId = "0";
+Notebook.getTreeSetting = function(isSearch){ 
-Notebook.trashNotebookId = "-1";
+	var noSearch = !isSearch;
-Notebook.curNotebookIsTrashOrAll = function() {
+	
-	return Notebook.curNotebookId == Notebook.trashNotebookId || Notebook.curNotebookId == Notebook.allNotebookId ;
-}
-Notebook.renderNotebooks = function(notebooks) {
 	var self = this;
-
+	// 添加自定义dom
-	if(!notebooks || typeof notebooks != "object" || notebooks.length < 0) {
+	function addDiyDom(treeId, treeNode) {
-		notebooks = [];
+		var spaceWidth = 5;
+		var switchObj = $("#" + treeId + " #" + treeNode.tId + "_switch"),
+		icoObj = $("#" + treeId + " #" + treeNode.tId + "_ico");
+		switchObj.remove();
+		icoObj.before(switchObj);
+		if (treeNode.level > 1) {
+			var spaceStr = "<span style='display: inline-block;width:" + (spaceWidth * treeNode.level)+ "px'></span>";
+			switchObj.before(spaceStr);
+		}
 	}
-	
-	notebooks = [{NotebookId: Notebook.allNotebookId, Title: getMsg("all"), drop:false, drag: false}].concat(notebooks);
-	notebooks.push({NotebookId: Notebook.trashNotebookId, Title: getMsg("trash"), drop:false, drag: false});
-	Notebook.notebooks = notebooks; // 缓存之
-	
 	// 拖拽
 	function beforeDrag(treeId, treeNodes) {
 		for (var i=0,l=treeNodes.length; i<l; i++) {
@@ -75,6 +75,10 @@ Notebook.renderNotebooks = function(notebooks) {
 	}
 	function onDrop(e, treeId, treeNodes, targetNode, moveType) {
 		var treeNode = treeNodes[0];
+		// 搜索不能drag
+		if(!targetNode) {
+			return;
+		}
 		var parentNode;
 		var treeObj = self.tree;
 		var ajaxData = {curNotebookId: treeNode.NotebookId};
@@ -108,20 +112,7 @@ Notebook.renderNotebooks = function(notebooks) {
 		}
 		ajaxPost("/notebook/dragNotebooks", {data: JSON.stringify(ajaxData)});
 	}
-	// 添加自定义dom
-	function addDiyDom(treeId, treeNode) {
-		var spaceWidth = 5;
-		var switchObj = $("#" + treeNode.tId + "_switch"),
-		icoObj = $("#" + treeNode.tId + "_ico");
-		switchObj.remove();
-		icoObj.before(switchObj);
-		if (treeNode.level > 1) {
-			var spaceStr = "<span style='display: inline-block;width:" + (spaceWidth * treeNode.level)+ "px'></span>";
-			switchObj.before(spaceStr);
-		}
-	}
 	var setting = {
-	
 		view: {
 			showLine: false,
 			showIcon: false,
@@ -140,10 +131,10 @@ Notebook.renderNotebooks = function(notebooks) {
 			showRemoveBtn: false,
 			showRenameBtn: false,
 			drag: {
-				isMove: true,
+				isMove: noSearch,
-				prev: true,
+				prev: noSearch,
-				inner: true,
+				inner: noSearch,
-				next: true
+				next: noSearch
 			}
 		},
 		callback: {
@@ -154,8 +145,6 @@ Notebook.renderNotebooks = function(notebooks) {
 				var notebookId = treeNode.NotebookId;
 				Notebook.changeNotebook(notebookId);
 			},
-			onRightClick: function(event, treeId, treeNode) {
-			},
 			beforeRename: function(treeId, treeNode, newName, isCancel) {
 				if(newName == "") {
 					if(treeNode.IsNew) {
@@ -183,7 +172,29 @@ Notebook.renderNotebooks = function(notebooks) {
 		}
 	};
 	
-	self.tree = $.fn.zTree.init($("#notebookList"), setting, notebooks);
+	// 搜索不能拖拽
+	if(isSearch) {
+	}
+	
+	return setting;
+}
+Notebook.allNotebookId = "0";
+Notebook.trashNotebookId = "-1";
+Notebook.curNotebookIsTrashOrAll = function() {
+	return Notebook.curNotebookId == Notebook.trashNotebookId || Notebook.curNotebookId == Notebook.allNotebookId ;
+}
+Notebook.renderNotebooks = function(notebooks) {
+	var self = this;
+
+	if(!notebooks || typeof notebooks != "object" || notebooks.length < 0) {
+		notebooks = [];
+	}
+	
+	notebooks = [{NotebookId: Notebook.allNotebookId, Title: getMsg("all"), drop:false, drag: false}].concat(notebooks);
+	notebooks.push({NotebookId: Notebook.trashNotebookId, Title: getMsg("trash"), drop:false, drag: false});
+	Notebook.notebooks = notebooks; // 缓存之
+	
+	self.tree = $.fn.zTree.init($("#notebookList"), self.getTreeSetting(), notebooks);
 	
 	// 展开/折叠图标
 	var $notebookList = $("#notebookList");
@@ -227,6 +238,7 @@ Notebook.renderNav = function(nav) {
 	var self = this;
 	self.changeNav();
 	return;
+	
 	var navForListNote = "";
 	var navForNewNote = "";
 	var navForMoveNote = "";
@@ -248,6 +260,47 @@ Notebook.renderNav = function(nav) {
 	$("#notebookNavForMoveNote").html(navForMoveNote);
 }
 
+// 搜索notebook
+Notebook.searchNotebookForAddNote = function(key) {
+	var self = this;
+	if(key) {
+		var notebooks = self.tree.getNodesByParamFuzzy("Title", key);
+		if(isEmpty(notebooks)) {
+			$("#notebookNavForNewNote").html("");
+		} else {
+			$("#notebookNavForNewNote").html(self.getChangedNotebooks(notebooks));
+		}
+	} else {
+		$("#notebookNavForNewNote").html(self.everNavForNewNote);
+	}
+}
+
+// 搜索notebook
+Notebook.searchNotebookForList = function(key) {
+	var self = this;
+	var $search = $("#notebookListForSearch");
+	var $notebookList = $("#notebookList");
+	if(key) {
+		$search.show();
+		$notebookList.hide();
+		
+		var notebooks = self.tree.getNodesByParamFuzzy("Title", key);
+		log(notebooks);
+		if(isEmpty(notebooks)) {
+			$search.html("");
+		} else {
+			var setting = self.getTreeSetting(true);
+			self.tree2 = $.fn.zTree.init($search, setting, notebooks);
+		}
+	} else {
+		self.tree2 = null;
+		$search.hide();
+		$notebookList.show();
+		$("#notebookNavForNewNote").html(self.everNavForNewNote);
+	}
+}
+
+
 // 修改,添加,删除notebook后调用
 // 改变nav
 // 直接从html中取!
@@ -277,14 +330,21 @@ Notebook.getChangedNotebooks = function(notebooks) {
 	}
 	return navForNewNote;
 }
+
+Notebook.everNavForNewNote = "";
+Notebook.everNotebooks = [];
 Notebook.changeNav = function() {
 	var self = Notebook;
-	var navForListNote = "";
+	
 	var navForNewNote = "";
 	
 	var notebooks = Notebook.tree.getNodes();
 	var html = self.getChangedNotebooks(notebooks);
 	
+	self.everNavForNewNote = html;
+	self.everNotebooks = notebooks;
+	
+	/*
 	var i = 0;
 	var $list = $("#notebookList li a");
 	var len = $list.length - 1;
@@ -309,6 +369,7 @@ Notebook.changeNav = function() {
 			i++;
 		}
 	});
+	*/
 	
 	$("#notebookNavForListNote").html(html);
 	$("#notebookNavForNewNote").html(html);
@@ -589,21 +650,27 @@ Notebook.setNotebook2Blog = function(target) {
 Notebook.updateNotebookTitle = function(target) {
 	var self = Notebook;
 	var notebookId = $(target).attr("notebookId");
-	self.tree.editName(self.tree.getNodeByTId(notebookId));
 	
-	return;
+	if(self.tree2) {
-	
+		self.tree2.editName(self.tree2.getNodeByTId(notebookId));
-	var notebookTitle = $(target).text();
+	} else {
-	var id = "editNotebookTitle";
+		self.tree.editName(self.tree.getNodeByTId(notebookId));
-	$(target).html(t('<input type="text" value="?" everValue="?" id="?" notebookId="?"/>', notebookTitle, notebookTitle, id, $(target).attr("notebookId")));
+	}
-	$("#" + id).focus();
 }
 Notebook.doUpdateNotebookTitle = function(notebookId, newTitle) {
+	var self = Notebook;
 	ajaxPost("/notebook/updateNotebookTitle", {notebookId: notebookId, title: newTitle}, function(ret) {
 		// 修改缓存
 		Notebook.cache[notebookId].Title = newTitle;
 		// 改变nav
 		Notebook.changeNav();
+		
+		// 同步
+		if(self.tree2) {
+			var notebook = self.tree.getNodeByTId(notebookId);
+			notebook.Title = newTitle;
+			self.tree.updateNode(notebook);
+		}
 	});
 }
 
@@ -671,6 +738,9 @@ Notebook.deleteNotebook = function(target) {
 			$(target).parent().remove();
 			*/
 			self.tree.removeNode(self.tree.getNodeByTId(notebookId));
+			if(self.tree2) {
+				self.tree2.removeNode(self.tree2.getNodeByTId(notebookId));
+			}
 			delete Notebook.cache[notebookId];
 			
 			// 改变nav
@@ -722,6 +792,23 @@ $(function() {
     	children: "li a"
 	}
 	
+	var notebookListMenu2 = {
+		width: 150, 
+		items: [
+			{ text: "分享给好友", alias: 'shareToFriends', icon: "", faIcon: "fa-share-square-o", action: Notebook.listNotebookShareUserInfo},
+			{ type: "splitLine" },
+			{ text: "公开为博客", alias: 'set2Blog', icon: "", action: Notebook.setNotebook2Blog },
+			{ text: "取消公开为博客", alias: 'unset2Blog', icon: "", action: Notebook.setNotebook2Blog }, // Unset
+			{ type: "splitLine" },
+			{ text: "重命名", icon: "", action: Notebook.updateNotebookTitle },
+			{ text: "删除", icon: "", alias: 'delete', faIcon: "fa-trash-o", action: Notebook.deleteNotebook }
+		],
+		onShow: applyrule,
+    	onContextMenu: beforeContextMenu,
+    	parent: "#notebookListForSearch ",
+    	children: "li a"
+	}
+	
 	function applyrule(menu) {
 		var notebookId = $(this).attr("notebookId");
 		var notebook = Notebook.cache[notebookId];
@@ -753,6 +840,8 @@ $(function() {
 	}
 	$("#notebookList li a").contextmenu(notebookListMenu);
 	
+	$("#notebookListForSearch").contextmenu(notebookListMenu2);
+	
 	//------------------
 	// 添加notebook
 	// 右键菜单