From 95dd851b3db881fa1f97412fb67d8ea527768d33 Mon Sep 17 00:00:00 2001
From: JimQing <jimqing@yeah.net>
Date: Sun, 8 Dec 2019 21:45:33 +0800
Subject: [PATCH] feat: merge params of  theme

---
 assets/scripts/editor.js | 18 ++++++++++--------
 assets/scripts/util.js   |  8 +++++++-
 index.html               |  2 +-
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/assets/scripts/editor.js b/assets/scripts/editor.js
index 6e7b532..e812c56 100644
--- a/assets/scripts/editor.js
+++ b/assets/scripts/editor.js
@@ -66,7 +66,7 @@ let app = new Vue({
     );
     this.editor.on("change", (cm, change) => {
       this.refresh();
-      this.saveEditorContent();
+      this.saveEditorContent(this.editor, '__editor_content');
     });
     this.cssEditor.on('update', (instance) => {
       this.cssChanged();
@@ -126,16 +126,18 @@ let app = new Vue({
       this.refresh();
     },
     colorChanged(color) {
-      let theme = setColor(color)
+      let theme = setColor(color);
       this.wxRenderer.setOptions({
         theme: theme
       });
       this.refresh();
     },
     cssChanged() {
-      let theme = JSON5.parse(this.cssEditor.getValue(0));
+      let theme = JSON.parse(this.cssEditor.getValue(0));
       this.wxRenderer.setOptions({
-        theme: customCss(theme)
+        theme: customCss(theme, this.currentColor),
+        font: this.currentFont,
+        size: this.currentSize
       });
       this.refresh();
     },
@@ -197,12 +199,12 @@ let app = new Vue({
       });
     },
     // 将左侧编辑器内容保存到 LocalStorage
-    saveEditorContent() {
-      let content = this.editor.getValue(0);
+    saveEditorContent(editor, name) {
+      const content = editor.getValue(0);
       if (content) {
-        localStorage.setItem("__editor_content", content);
+        localStorage.setItem(name, content);
       } else {
-        localStorage.removeItem("__editor_content");
+        localStorage.removeItem(name);
       }
     },
     customStyle() {
diff --git a/assets/scripts/util.js b/assets/scripts/util.js
index e157fc3..e57f0fe 100644
--- a/assets/scripts/util.js
+++ b/assets/scripts/util.js
@@ -13,7 +13,7 @@ function setColorWithTemplate(template) {
 
 let setColor = setColorWithTemplate(default_theme);
 
-function customCssWithTemplate(template) {
+function customCssWithTemplate(template, color) {
     return function (jsonString) {
         let custom_theme = JSON.parse(JSON.stringify(template));
         custom_theme.block.h1 = jsonString.h1;
@@ -21,6 +21,12 @@ function customCssWithTemplate(template) {
         custom_theme.block.h3 = jsonString.h3;
         custom_theme.block.h4 = jsonString.h4;
         custom_theme.block.p = jsonString.p;
+        // color
+        custom_theme.block.h1['border-bottom'] = `2px solid ${color}`;
+        custom_theme.block.h2['background'] = color;
+        custom_theme.block.h3['border-left'] = `3px solid ${color}`;
+        custom_theme.block.h4['color'] = color;
+        custom_theme.inline.strong['color'] = color;
         return custom_theme;
     };
 }
diff --git a/index.html b/index.html
index c88a567..dc44d71 100644
--- a/index.html
+++ b/index.html
@@ -104,7 +104,7 @@
             </section>
           </el-col>
           <el-col id="cssBox" :span="8" v-show="showBox">
-            <textarea id="cssEditor" type="textarea" placeholder="Custom css here." v-model="source">
+            <textarea id="cssEditor" type="textarea" @change="cssChanged" placeholder="Custom css here." v-model="source">
               </textarea>
           </el-col>
         </el-row>