More toolbar buttons, add file picker, proper filenames in view

package.json

@@ -1,6 +1,6 @@
 {
   "name": "naiveboom",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "license": "MIT License",
   "private": true,
   "scripts": {

public/javascripts/a.js

@@ -30,8 +30,30 @@ app = new Vue({
 			onToggleFullScreen: function() { $('.navbar').toggle(); },
 			sideBySideFullscreen: false,
 			spellChecker: false,
+			toolbar: [
+				'undo', 'redo', '|',
+				'bold', 'italic', 'strikethrough', 'heading', '|',
+				'quote', 'unordered-list', 'ordered-list', 'check-list', '|',
+				'link', 'image',
+				{
+					name: 'upload-image',
+					action: EasyMDE.drawUploadedImage,
+					className: 'fa fa-upload',
+					title: 'Upload File',
+				},
+				{
+					name: 'add-table',
+					action: EasyMDE.drawTable,
+					className: 'fa fa-table',
+					title: 'Insert Table',
+				},
+				'horizontal-rule', '|',
+				'preview', 'side-by-side', 'fullscreen', '|', 'guide'
+			],
 			renderingConfig: { codeSyntaxHighlighting: true },
 			uploadImage: true,
+			imageAccept: '*',
+			imageMaxSize: 268435456,
 			imageUploadFunction: function(file, onSuccess, onError) {
 				var url = URL.createObjectURL(file);
 				var reader = new FileReader();

public/javascripts/sw.js

@@ -0,0 +1,15 @@
+self.addEventListener('activate', function(event) {
+	event.waitUntil(clients.claim());
+});
+
+self.addEventListener('install', function() {
+	self.skipWaiting();
+});
+
+self.addEventListener('fetch', function(event) {
+    event.respondWith(
+		caches.match(event.request).then(function(res) {
+			return res || fetch(event.request);
+		})
+	);
+});

public/javascripts/view.js

@@ -1,26 +1,26 @@
-function replaceDataURLFrom(text) {
-	var blobMap = {};
-	var promises = [];
-	var test = /\]\((data:.*?)\)/g
-	for (var match = test.exec(text); match; match = test.exec(text)) {
-		promises.push(
-			fetch(match[1]).then(function(res) {
-				return Promise.all([res.url, res.blob()]);
-			}).then(function([dataURL, blob]) {
-				blobMap[dataURL] = URL.createObjectURL(blob);
-			})
-		);
-	};
-	return Promise.all(promises).then(function() {
-		return text.replace(test, function(_, dataURL) {
-			return '](' + blobMap[dataURL] + ')';
-		});
+function cacheDataURLFrom(text, toCache) {
+	var urlMap = {};
+	var attachmentCount = 0;
+	var test = /\[(.*?)\]\((data:.*?)\)/g;
+	var newText = text.replace(test, function (_, fileName, dataURL) {
+		var fakeURL = location.href + '/' + ++attachmentCount +'/' + fileName;
+		urlMap[fakeURL] = dataURL;
+		return '[' + fileName + '](' + fakeURL + ')';
+	});
+	return Promise.all(
+		Object.entries(urlMap).map(function([fakeURL, dataURL]) {
+			return fetch(dataURL).then(function(res) {
+				return toCache.put(fakeURL, new Response(res.body, res));
+			});
+		})
+	).then(function() {
+		return newText;
 	});
 }
 
 Vue.component('vue-easymde', VueEasyMDE.VueEasyMDE)
 
-var origText;
+var origText
 
 // 查看消息需要用到的JS
 app = new Vue({
@@ -51,14 +51,23 @@ app = new Vue({
 	mounted: function() {
 		// 从URL获取GUID，然后透过POST获取消息
 		var guid = reg_guid.exec(location.href)[0];
-		axios.post('/api/get-msg', {
-			guid: guid
+		navigator.serviceWorker.register('./sw.js').then(function () {
+			return navigator.serviceWorker.ready;
+		}).then(function() {
+			return axios.post('/api/get-msg', {
+				guid: guid
+			});
 		}).then(function(response) {
 			var data = response.data;
 			app.status = data.status;
 			if (app.status !== 1) return null;
 			origText = data.text;
-			return replaceDataURLFrom(data.text);
+			$(window).on('navigate unload', function() {
+				caches.delete(guid);
+			});
+			return caches.open(guid);
+		}).then(function(toCache) {
+			return toCache && cacheDataURLFrom(origText, toCache);
 		}).then(function(text) {
 			app.text = text;
 		}).catch(function(error) {

routes/index.js

@@ -1,11 +1,17 @@
 var express = require('express');
+var path = require('path');
 var router = express.Router();
 var conf = require('../config.js');
 var mtool = new (require('../lib/tools.js'))(conf);// 消息操作工具
 
 /* GET home page. */
 router.get('/', function(req, res, next) {
-  res.render('index', { title: 'Naiveboom - 比较安全' });
+	res.render('index', { title: 'Naiveboom - 比较安全' });
+});
+
+/* GET service worker. */
+router.get('/sw.js', function (req, res, next) {
+	res.sendFile(path.join(__dirname, '../public/javascripts' + req.url));
 });
 
 /**