Add itemTpl for list view.

public/js/app/note.js

@@ -11,21 +11,6 @@ Note.curNoteId = "";
 
 Note.interval = ""; // 定时器
 
-// 这里, settings, blog, star
-Note.itemIsBlog = '<div class="item-blog"><i class="fa fa-bold" title="' + getMsg('Blog') + '"></i></div><div class="item-conflict-info"><i class="fa fa-bug" title="' + getMsg('Conflict') + '!!"></i></div><div class="item-star"><i class="fa fa-star-o" title="' + getMsg('Star') + '"></i></div><div class="item-setting"><i class="fa fa-cog" title="' +  getMsg('Setting') + '"></i></div>';
-
-// for render
-Note.itemTplNoImg = '<li href="#" class="item ?" data-seq="?" noteId="?">'
-Note.itemTplNoImg += Note.itemIsBlog +'<div class="item-desc"><p class="item-title">?</p><p class="item-info"><i class="fa fa-book"></i> <span class="note-notebook">?</span> <i class="fa fa-clock-o"></i> <span class="updated-time">?</span></p><p class="desc">?</p></div></li>';
-
-// 有image
-Note.itemTpl = '<li href="#" class="item ? item-image" data-seq="?" noteId="?"><div class="item-thumb" style=""><img src="?"/></div>'
-Note.itemTpl +=Note.itemIsBlog + '<div class="item-desc" style=""><p class="item-title">?</p><p class="item-info"><i class="fa fa-book"></i> <span class="note-notebook">?</span> <i class="fa fa-clock-o"></i> <span class="updated-time">?</span></p><p class="desc">?</p></div></li>';
-
-// for new
-Note.newItemTpl = '<li href="#" class="item item-active ?" data-seq="?" fromUserId="?" noteId="?">'
-Note.newItemTpl += Note.itemIsBlog + '<div class="item-desc" style="right: 0px;"><p class="item-title">?</p><p class="item-info"><i class="fa fa-book"></i> <span class="note-notebook">?</span> <i class="fa fa-clock-o"></i> <span class="updated-time">?</span></p><p class="desc">?</p></div></li>';
-
 Note.noteItemListO = $("#noteItemList");
 Note.$itemList = $('#noteItemList');
 
@@ -34,6 +19,31 @@ Note.$itemList = $('#noteItemList');
 Note.cacheByNotebookId = {all: {}};
 Note.notebookIds = {}; // notebookId => true
 
+
+// 切换笔记视图
+Note.setViewMode = function(mode) {
+  // blog, star, settings
+  Note.itemIsBlog = '<div class="item-blog"><i class="fa fa-bold" title="' + getMsg('Blog') + '"></i></div><div class="item-conflict-info"><i class="fa fa-bug" title="' + getMsg('Conflict') + '!!"></i></div><div class="item-star"><i class="fa fa-star-o" title="' + getMsg('Star') + '"></i></div><div class="item-setting"><i class="fa fa-cog" title="' +  getMsg('Setting') + '"></i></div>';
+  if(mode === "list") { //list view
+    Note.itemTplNoImg = '<li href="#" class="item list-item ?" data-seq="?" noteId="?">';
+    Note.itemTplNoImg += Note.itemIsBlog + '<div class="item-desc"><p class="item-title">?</p><p class="hidden">?</p><p class="hidden">?</p><p class="hidden">?</p></div></li>';
+
+    Note.itemTpl = '<li href="#" class="item list-item ?" data-seq="?" noteId="?"><p class="hidden">?</p>';
+    Note.itemTpl += Note.itemIsBlog + '<div class="item-desc"><p class="item-title">?</p><p class="hidden">?</p><p class="hidden">?</p><p class="hidden">?</p></div></li>';
+  }
+  else {  // summary view
+    // 无image
+    Note.itemTplNoImg = '<li href="#" class="item summary-item ?" data-seq="?" noteId="?">';
+    Note.itemTplNoImg += Note.itemIsBlog + '<div class="item-desc"><p class="item-title">?</p><p class="item-info"><i class="fa fa-book"></i> <span class="note-notebook">?</span> <i class="fa fa-clock-o"></i> <span class="updated-time">?</span></p><p class="desc">?</p></div></li>';
+
+    // 有image
+    Note.itemTpl = '<li href="#" class="item summary-item ? item-image" data-seq="?" noteId="?"><div class="item-thumb" style=""><img src="?"/></div>';
+    Note.itemTpl += Note.itemIsBlog + '<div class="item-desc" style=""><p class="item-title">?</p><p class="item-info"><i class="fa fa-book"></i> <span class="note-notebook">?</span> <i class="fa fa-clock-o"></i> <span class="updated-time">?</span></p><p class="desc">?</p></div></li>';
+  }
+}
+
+Note.setViewMode(Config.view || "summary");
+
 // 定时保存信息
 Note.intervalTime = 10 * 1000; // 10秒
 Note.startInterval = function() {
@@ -771,8 +781,6 @@ Note.reRenderNote = function(noteId) {
 	});
 };
 
-// 渲染
-
 // 更改信息到左侧
 // 定时更改 当前正在编辑的信息到左侧导航
 // 或change select. 之前的note, 已经改变了
@@ -788,6 +796,9 @@ Note.renderChangedNote = function(changedNote) {
 		// 如果标题改了, 如果也在star列表中, 那也要改star的标题啊
 		Note.changeStarNoteTitle(changedNote.NoteId, trimTitle(changedNote.Title));
 	}
+  if($leftNoteNav.hasClass("list-item")) {
+    return; //list view只需要更新title
+  }
 	if(changedNote.Desc) {
 		$leftNoteNav.find(".desc").html(trimTitle(changedNote.Desc));
 	}
@@ -869,7 +880,7 @@ Note.renderNoteContent = function(content, dontNeedSetReadonly, seq2) {
 		}
 	});
 
-	// 只有在renderNoteContent时才设置curNoteId
+  // 只有在renderNoteContent时才设置curNoteId
 	// Note.setCurNoteId(content.NoteId);
 
 	// 重新渲染到左侧 desc, 因为笔记传过来是没有desc的
@@ -887,25 +898,6 @@ Note.renderNoteDesc = function(note) {
 	Note.renderChangedNote(note);
 };
 
-// 初始化时渲染最初的notes
-/**
-    <div id="noteItemList">
-	  <!--
-      <div href="#" class="item">
-        <div class="item-thumb" style="">
-          <img src="images/a.gif"/>
-        </div>
-
-        <div class="item-desc" style="">
-            <p class="item-title">?</p>
-            <p class="item-text">
-            	?
-            </p>
-        </div>
-      </div>
-      -->
-*/
-
 Note.showEditorMask = function() {
 	$("#editorMask").css("z-index", 10).show();
 	// 要判断是否是垃圾筒
@@ -1127,7 +1119,7 @@ Note.newNote = function(notebookId, isShare, fromUserId, isMarkdown) {
 	// 是否是为共享的notebook添加笔记, 如果是, 则还要记录fromUserId
 	var newItem = "";
 
-	var baseClasses = "item-my";
+	var baseClasses = "item-my item-active";
 	if(isShare) {
 		baseClasses = "item-shared";
 	}
@@ -1136,7 +1128,7 @@ Note.newNote = function(notebookId, isShare, fromUserId, isMarkdown) {
 	var notebookTitle = notebook ? notebook.Title : "";
 	var curDate = getCurDatetime();
 
-	newItem = tt(Note.newItemTpl, baseClasses, me.newNoteSeq(), "", note.NoteId, note.Title, notebookTitle, curDate, "");
+	newItem = tt(Note.itemTplNoImg, baseClasses, me.newNoteSeq(), note.NoteId, note.Title, notebookTitle, curDate, "");
 
 	newItem = $(newItem);
 	newItem.find(".item-blog").hide();