export pdf优化, 可取消, 加loading mockup

src/data/version

@@ -1 +1 @@
-{"version":"0.6.3","updatedTime":"2015-05-23T07:11:51.505Z"}
+{"version":"0.6.4","updatedTime":"2015-09-22T07:11:51.505Z"}

src/node_modules/api.js

@@ -670,7 +670,7 @@ var Api = {
 
 	exportPdf: function(noteId, callback) {
 		var me = this;
-		console.log(me.getUrl('note/exportPdf', {noteId: noteId}));
+		// console.log(me.getUrl('note/exportPdf', {noteId: noteId}));
 		needle.get(me.getUrl('note/exportPdf', {noteId: noteId}), function(err, resp) {
 			me.checkError(err, resp);
 			if(err) {
@@ -684,7 +684,7 @@ var Api = {
 			  'content-type': 'image/png',
 			  date: 'Mon, 19 Jan 2015 15:01:47 GMT',
   			*/
-  		
+ 
   			var body = resp.body;
   			if(typeof body == "object" && body.Msg === false) {
   				return callback(false, "", body.Msg);
@@ -695,8 +695,8 @@ var Api = {
 			var imagePathAll = imagePath + '/' + filename;
 			fs.writeFile(imagePathAll, resp.body, function(err) {
 				if(err) {
-					log(err);
-					log('local save pdf failed 本地保存失败');
+					// log(err);
+					// log('local save pdf failed 本地保存失败');
 					callback(false);
 				} else {
 					callback(imagePathAll, filename);

src/note.html

@@ -594,9 +594,19 @@ function log(o) {
       <div class="modal fade bs-modal-sm" id="loadingDialog" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
         <div class="modal-dialog modal-sm">
           <div class="modal-content">
+          
+          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
+
           <div class="modal-body" id="loadingDialogBody">
             <img src="public/images/loading-24.gif"/>
             <p id="loadingDialogBodyMsg"></p>
+
+            <div class="progress">
+              <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
+                <span class="sr-only">60% Complete</span>
+              </div>
+            </div>
+
           </div>
           </div><!-- /.modal-content -->
         </div><!-- /.modal-dialog -->

src/public/js/common.js

@@ -1557,10 +1557,36 @@ var trimTitle = function(title) {
 };
 
 var Loading = {
-	show: function(msg) {
+	$loadingDialog: $('#loadingDialog'),
+	$progressBar: $('#loadingDialog .progress-bar'),
+	// option {hasProgress: true, onClose: function}
+	inited: false,
+	show: function(msg, option) {
+		option = option || {};
 		msg || (msg = getMsg("loading..."));
 		$('#loadingDialogBodyMsg').html(msg);
-		$('#loadingDialog').modal({backdrop: 'static', keyboard: false});
+		this.$loadingDialog.modal({backdrop: 'static', keyboard: true});
+		if (option.hasProgress) {
+			this.$loadingDialog.addClass('has-progress');
+		}
+		else {
+			this.$loadingDialog.removeClass('has-progress');
+		}
+		this.onClose = option.onClose;
+		if (!this.inited) {
+			this.init();
+		}
+	},
+	init: function () {
+		this.inited = true;
+		var me = this;
+		this.$loadingDialog.on('hidden.bs.modal', function (e) {
+			me.onClose && me.onClose();
+		});
+	},
+	// '100'
+	setProgress: function (rate) {
+		this.$progressBar.width(rate + '%');
 	},
 	hide: function() {
 		$('#loadingDialog').modal('hide');

src/public/plugins/export_pdf/plugin.js

@@ -53,10 +53,29 @@ define(function() {
 				me.init();
 			}
 
-			Api.loading.show();
+			var closed = false;
+			var interval;
+			Api.loading.show('', {hasProgress: true, onClose: function () {
+				closed = true;
+				clearInterval(interval);
+			}});
+			Api.loading.setProgress(1);
+			var progress = 1;
+			interval = setInterval(function () {
+				progress += 5;
+				if (progress > 90) {
+					progress = 90;
+				}
+				Api.loading.setProgress(progress);
+			}, 500);
 
 			// 保存
 		    Api.noteService.exportPdf(note.NoteId, function(curPath, filename, msg) {
+		    	clearInterval(interval);
+		    	if (closed) {
+		    		return;
+		    	}
+				Api.loading.setProgress(99);
 		    	Api.loading.hide();
 
 		    	setTimeout(function() {

src/public/themes/basic.less

@@ -1817,6 +1817,29 @@ img::selection {
 	#loadingDialogBodyMsg {
 		font-size: 16px;
 	}
+
+    .progress {
+        margin: 0;
+        margin-top: 20px;
+        height: 1px;
+        display: none;
+    }
+
+    &.has-progress {
+        .progress {
+            display: block;
+        }
+    }
+
+    button {
+        margin: 5px;
+        font-size: 14px;
+        position: absolute;
+        z-index: 10;
+        right: 5px;
+        top: 0;
+        text-shadow: none;
+    }
 }
 
 #editorMask {

src/public/themes/default.css

@@ -1605,6 +1605,24 @@ img::selection {
 #loadingDialog #loadingDialogBodyMsg {
   font-size: 16px;
 }
+#loadingDialog .progress {
+  margin: 0;
+  margin-top: 20px;
+  height: 1px;
+  display: none;
+}
+#loadingDialog.has-progress .progress {
+  display: block;
+}
+#loadingDialog button {
+  margin: 5px;
+  font-size: 14px;
+  position: absolute;
+  z-index: 10;
+  right: 5px;
+  top: 0;
+  text-shadow: none;
+}
 #editorMask {
   z-index: 1030 !important;
 }