界面优化

public/js/app/note.js

@@ -679,7 +679,7 @@ Note.renderChangedNote = function(changedNote) {
 	// 找到左侧相应的note
 	var $leftNoteNav = $(tt('[noteId="?"]', changedNote.NoteId));
 	if(changedNote.Title) {
-		$leftNoteNav.find(".item-title").html(changedNote.Title);
+		$leftNoteNav.find(".item-title").html(trimTitle(changedNote.Title));
 	}
 	if(changedNote.Desc) {
 		$leftNoteNav.find(".desc").html(changedNote.Desc);
@@ -736,7 +736,8 @@ Note.renderNote = function(note) {
 		return;
 	}
 	// title
-	$("#noteTitle").val(trimTitle(note.Title));
+	// 不要trim, 允许用<>
+	$("#noteTitle").val(note.Title);
 	
 	// 当前正在编辑的
 	// tags
@@ -1138,6 +1139,71 @@ Note.listNoteContentHistories = function() {
 	});
 }
 
+// 导出成PDF
+Note.exportPDF = function(target) {
+	var noteId = $(target).attr("noteId");
+	/*
+	{
+	  "Ok": true,
+	  "Code": 0,
+	  "Msg": "",
+	  "Id": "upload/5368c1aa99c37b029d000001/images/weibo/我靠, 这是什么??.pdf",
+	  "List": null,
+	  "Item": null
+	}
+	*/
+	$('<form target="mdImageManager" action="/note/exportPdf" method="GET"><input name="noteId" value="' + noteId + '"/></form>').appendTo('body').submit().remove();
+	// $.get("/note/exportPdf?noteId=" + noteId);
+	// window.open("/note/exportPdf?noteId=" + noteId);
+	/*
+	ajaxGet(", {noteId: noteId}, function(ret) {
+		if(reIsOk(ret)) {
+			window.open(UrlPrefix + '/pubic/' + ret.Id);
+		} else {
+			alert('error!');
+		}
+	});
+	*/
+};
+
+// 长微博
+Note.html2Image = function(target) {
+	var noteId = $(target).attr("noteId");
+	showDialog("html2ImageDialog", {title: "分享到社区", postShow: function() {
+		ajaxGet("/note/html2Image", {noteId: noteId}, function(ret) {
+			if (typeof ret == "object" && ret.Ok) {
+				$("#leanoteDialog .weibo span").html("生成成功, 右键图片保存到本地.")
+				$("#leanoteDialog .weibo img").attr("src", ret.Id + "?" + ((new Date()).getTime()));
+				$("#leanoteDialog .btn-share").removeClass("disabled");
+				var note = Note.cache[noteId];
+				var pic = UrlPrefix + ret.Id;
+				var title = encodeURI(note.Title + " (" + UserInfo.Username + "分享. 来自leanote.com)");
+				var windowParam = 'width=700, height=580, top=180, left=320, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no';
+				$("#leanoteDialog .sendWeiboBtn").click(function() {
+					var url = "http://service.weibo.com/share/share.php?title=" + title;
+					url += "&pic=" + pic;
+					window.open(url, '分享到新浪微博', windowParam);
+				});
+				$("#leanoteDialog .sendTxWeiboBtn").click(function() {
+					var _appkey = '801542571';
+					var url = "http://share.v.t.qq.com/index.php?c=share&a=index&appkey=" + _appkey +"&title=" + title +"&url=&pic=" + pic
+					window.open(url, '分享到腾讯微博', windowParam);
+				});
+				$("#leanoteDialog .sendQQBtn").click(function() {
+					var url = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' + UrlPrefix + '&title=' + title + '&pics=' + pic;
+					window.open(url, '分享QQ空间', windowParam);
+				});
+				$("#leanoteDialog .sendRRBtn").click(function() {
+					var url = 'http://widget.renren.com/dialog/share?resourceUrl=' + UrlPrefix +  '&srcUrl=' + UrlPrefix + '&title=' + title + '&pic=' + pic;
+					window.open(url, '分享人人网', windowParam);
+				});
+			} else {
+				$("#leanoteDialog .weibo").html("对不起, 我们出错了!")
+			}
+		});
+	}});
+}
+
 //--------------
 // read only
 
@@ -1397,17 +1463,16 @@ Note.deleteNoteTag = function(item, tag) {
 };
 
 // readonly
-Note.readOnly = true;
+Note.readOnly = false; // 默认为false要好?
 // 切换只读模式
 Note.toggleReadOnly = function() {
-	if(LEA.em && LEA.em.isWriting()) {
+	if(LEA.em && LEA.em.isWriting()) { // 写作模式下
 		return Note.toggleWriteable();
 	}
 	
 	var me = this;
 	var note = me.getCurNote();
 
-	// console.log('(((((((((((((((((((((((');
 	// tinymce
 	var $editor = $('#editor');
 	$editor.addClass('read-only').removeClass('all-tool'); // 不要全部的
@@ -1422,6 +1487,7 @@ Note.toggleReadOnly = function() {
 		return;
 	}
 	
+	$('.info-toolbar').removeClass('invisible');
 	if(note.IsMarkdown) {
 		$('#mdInfoToolbar .created-time').html(goNowToDatetime(note.CreatedTime));
 		$('#mdInfoToolbar .updated-time').html(goNowToDatetime(note.UpdatedTime));
@@ -1460,7 +1526,7 @@ Note.toggleWriteable = function() {
 	if(!note) {
 		return;
 	}
-
+	
 	if(!note.readOnly) {
 		return;
 	}
@@ -1536,6 +1602,9 @@ Note.initContextmenu = function() {
 			{ text: getMsg("publicAsBlog"), alias: 'set2Blog', faIcon: "fa-bold", action: Note.setNote2Blog },
 			{ text: getMsg("cancelPublic"), alias: 'unset2Blog', faIcon: "fa-undo", action: Note.setNote2Blog },
 			{ type: "splitLine" },
+			// { text: "分享到社区", alias: 'html2Image', icon: "", action: Note.html2Image},
+			{ text: getMsg("exportPdf"), alias: 'exportPDF', faIcon: "fa-file-pdf-o", action: Note.exportPDF},
+			{ type: "splitLine" },
 			{ text: getMsg("delete"), icon: "", faIcon: "fa-trash-o", action: Note.deleteNote },
 			{ text: getMsg("move"), alias: "move", faIcon: "fa-arrow-right",
 				type: "group", 

public/js/app/page.js

@@ -481,6 +481,9 @@ function initEditor() {
 					return;
 				}
 				Note.saveNote(e);
+
+				// 当输入的时候, 把当前raw删除掉
+				LeaAce.removeCurToggleRaw();
 			});
 			
 			// 为了把下拉菜单关闭
@@ -504,17 +507,16 @@ function initEditor() {
 		skin : "custom",
 		language: LEA.locale, // 语言
 		plugins : [
-				"autolink link leaui_image lists charmap hr", "paste",
+				"autolink link leaui_image lists hr", "paste",
 				"searchreplace leanote_nav leanote_code tabfocus",
-				"table directionality textcolor" ], // nonbreaking
-				
+				"table textcolor" ], // nonbreaking directionality charmap
 		toolbar1 : "formatselect | forecolor backcolor | bold italic underline strikethrough | leaui_image | leanote_code leanote_inline_code | bullist numlist | alignleft aligncenter alignright alignjustify",
 		toolbar2 : "outdent indent blockquote | link unlink | table | hr removeformat | subscript superscript |searchreplace | pastetext pasteCopyImage | leanote_ace_pre | fontselect fontsizeselect",
 
 		// 使用tab键: http://www.tinymce.com/wiki.php/Plugin3x:nonbreaking
 		// http://stackoverflow.com/questions/13543220/tiny-mce-how-to-allow-people-to-indent
 		// nonbreaking_force_tab : true,
-		
+
 		menubar : false,
 		toolbar_items_size : 'small',
 		statusbar : false,
@@ -608,7 +610,10 @@ function scrollTo(self, tagName, text) {
 
 //--------------
 // 调用之
-$(function() {
+// $(function() {
+	LEA.s3 = new Date();
+	console.log('initing...');
+	
 	// 窗口缩放时
 	$(window).resize(function() {
 		Mobile.isMobile();
@@ -844,8 +849,7 @@ $(function() {
 	
 	// 手机端?
 	Mobile.init();
-});
-
+//});
 
 //------------
 // pjax
@@ -1333,19 +1337,34 @@ LeaAce = {
 			}
 		}
 	},
+	// 当删除了pre时, 也要删除toggle raw
+	removeAllToggleRaw: function () {
+		$('#editorContent .toggle-raw').remove();
+	},
+	removeCurToggleRaw: function() {
+		if(this.curToggleRaw) {
+			try {
+				this.curToggleRaw.remove();
+			}
+			catch(e){}
+		}
+	},
+	curToggleRaw: null,
 	// 转换raw <-> code
 	handleEvent: function () {
 		if(!this.canAce()) {
 			return;
 		}
 		var me = this;
-		$("#editorContent").on('mouseenter', 'pre', function(){
+		$("#editorContent").on('mouseenter', 'pre', function(e) {
 			// log('in');
 			// log($(this));
 			var $t = $(this);
 			$raw = $t.find('.toggle-raw');
 			if($raw.length == 0) {
-				$t.append('<div class="toggle-raw" title="Toggle code with raw html"><input type="checkbox" /></div>');
+				var curToggleRaw = $('<div class="toggle-raw" title="Toggle code with raw html"><input type="checkbox" /></div>');
+				$t.append(curToggleRaw);
+				me.curToggleRaw = curToggleRaw;
 			}
 			$input = $t.find('.toggle-raw input');
 			if(LeaAce.isInAce($t)) {
@@ -1361,20 +1380,49 @@ LeaAce = {
 		$("#editorContent").on('change', '.toggle-raw input', function(){
 			var checked = $(this).prop('checked');
 			var $pre = $(this).closest('pre');
-			if(checked) {
+			if (checked) {
 				// 转成ace
 				me.preToAce($pre, true);
 			} else {
 				me.aceToPre($pre, true);
 			}
 		});
+
+		// 当ace里没有内容时, 连续删除则把ace remove掉
+		// keydown的delete事件没有
+		var lastDeleteTime;
+		$("#editorContent").on('keyup', 'pre',  function(e) {
+			var keyCode = e.keyCode;
+			// console.log('keyup');
+			if(keyCode == 8 || keyCode == 46) { // BackSpace || Delete
+				// console.log('delete');
+				if(!lastDeleteTime) {
+					lastDeleteTime = (new Date()).getTime();
+				}
+				else {
+					var now = (new Date()).getTime();
+					if(now - lastDeleteTime < 300) { // 间隔时间很短
+						var inAce = me.isInAce($(this))
+						if(inAce && !inAce[0].getValue()) {
+							// console.log('destroy');
+							inAce[0].destroy();
+							$(this).remove();
+							return;
+						}
+					}
+					lastDeleteTime = now;
+				}
+				// console.log($(this));
+			}
+		});
 	}
 };
 
 // note.html调用
 // 实始化页面
 function initPage() {
-	$(function() {
+	// 不要用$(function() {}) 因为要等到<script>都加载了才执行
+	// $(function() {
 		Notebook.renderNotebooks(notebooks);
 		Share.renderShareNotebooks(sharedUserInfos, shareNotebooks);
 		
@@ -1397,7 +1445,7 @@ function initPage() {
 				}
 			}
 		}
-		
+
 		// 指定笔记, 也要保存最新笔记
 		if(latestNotes.length > 0) {
 			for(var i = 0; i < latestNotes.length; ++i) {
@@ -1410,5 +1458,5 @@ function initPage() {
 		initSlimScroll();
 
 		LeaAce.handleEvent();
-	});
+	// });
 }

public/js/app/tag.js

@@ -108,7 +108,7 @@ Tag.renderReadOnlyTags = function(tags) {
 		if(!classes) {
 			classes = getNextDefaultClasses();
 		}
-		tag = tt('<span class="?">?</span>', classes, text);
+		tag = tt('<span class="?">?</span>', classes, trimTitle(text));
 		
 		$("#noteReadTags").append(tag);
 	}
@@ -235,8 +235,9 @@ Tag.renderTagNav = function(tags) {
 		if(LEA.locale == "zh") {
 			var text = Tag.mapEn2Cn[tag] || text;
 		}
+		text = trimTitle(text);
 		var classes = Tag.classes[tag] || "label label-default";
-		$("#tagNav").append(tt('<li data-tag="?"><a> <span class="?">?</span> <span class="tag-delete">X</span></li>', tag, classes, text));
+		$("#tagNav").append(tt('<li data-tag="?"><a> <span class="?">?</span> <span class="tag-delete">X</span></li>', tag, classes, text));
 	}
 };
 

public/js/common.js

@@ -5,7 +5,9 @@
 //--------------
 
 // 最上级变量
-var LEA = {};
+if(typeof LEA === 'undefined') {
+	var LEA = {};
+}
 // 命名空间
 var Notebook = {
 	cache: {}, // notebookId => {Title, Seq}
@@ -365,6 +367,9 @@ function setEditorContent(content, isMarkdown, preview, callback) {
 		$("#editorContent").html(content);
 		if(typeof tinymce != "undefined" && tinymce.activeEditor) {
 			var editor = tinymce.activeEditor;
+			// console.log('set content');
+			LEA.s4 = new Date();
+			LEA.s4_1 = LEA.s4.getTime()-LEA.s1.getTime();
 			editor.setContent(content);
 			callback && callback();
 			/*
@@ -411,6 +416,8 @@ function setEditorContent(content, isMarkdown, preview, callback) {
 		if(MD) {
 			MD.setContent(content);
 			callback && callback();
+			LEA.s4 = new Date();
+			LEA.s4_1 = LEA.s4.getTime()-LEA.s1.getTime()
 		} else {
 			clearIntervalForSetContent = setTimeout(function() {
 				setEditorContent(content, true, false, callback);
@@ -886,7 +893,7 @@ var email2LoginAddress = {
     'eyou.com': 'http://www.eyou.com/',
     '21cn.com': 'http://mail.21cn.com/',
     '188.com': 'http://www.188.com/',
-    'foxmail.coom': 'http://www.foxmail.com'
+    'foxmail.com': 'http://mail.foxmail.com'
 };
 
 function getEmailLoginAddress(email) {
@@ -1298,5 +1305,9 @@ function setHash(key, value) {
 }
 
 var trimTitle = function(title) {
-	return title.replace(/<.*?script.*?>/g, '');
+	if(!title || typeof title != 'string') {
+		return '';
+	}
+	return title.replace(/</g, "&lt;").replace(/>/g, "&gt;");
+	// return title.replace(/<.*?script.*?>/g, '');
 };