Fix for htmlembedded mode

close #2
nobuhito · Jan 1, 2018 · d2244e2 · d2244e2
1 parent 802cf88
commit d2244e2
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 21 deletions.
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
     "name": "printcode",
     "displayName": "PrintCode",
     "description": "Added printing function to VS Code!!",
-    "version": "1.0.4",
+    "version": "1.1.0",
     "author": {
         "name": "Nobuhito SATO",
         "email": "[email protected]",

diff --git a/src/extension.js b/src/extension.js
@@ -61,6 +61,10 @@ function buildHtml(text, language) {
     let javascript = "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.31.0/mode/javascript/javascript.js";
     let stylesheet = "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.31.0/mode/css/css.js";
 
+    // for htmlembedded
+    let multiplex = "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.31.0/addon/mode/multiplex.min.js";
+    let htmlmixed = "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.31.0/mode/htmlmixed/htmlmixed.js";
+
     let myConfig = vscode.workspace.getConfiguration("printcode");
     let tabSize = myConfig.get("tabSize");
     let fontSize = myConfig.get("fontSize");
@@ -73,11 +77,6 @@ function buildHtml(text, language) {
     <script src="${js}"></script>
     <link rel="stylesheet" href="${css}">
     <script src="${lang}"></script>
-
-    <script src="${xml}"></script> 
-    <script src="${javascript}"></script>
-    <script src="${stylesheet}"></script>
-
     <style>
          /* https://qiita.com/cognitom/items/d39d5f19054c8c8fd592 */
         .CodeMirror {
@@ -107,23 +106,45 @@ function buildHtml(text, language) {
 <body>
 </body>
     <script>
-        var cm = CodeMirror(document.body, {
-            value: "",
-            lineNumbers: true,
-            lineWrapping: true,
-            tabSize: ${tabSize},
-            readOnly: true,
-            scrollbarStyle: null,
-            viewportMargin: Infinity,
-            mode: "${mode}"
-        });
+        var head = document.getElementsByTagName("head")[0];
+
+        if (["htmlembedded", "htmlmixed"].indexOf("${mode}") > -1) {
+            var addScripts = ["${xml}", "${javascript}", "${stylesheet}"];
+            for (var script of addScripts) {
+                var source = document.createElement("script");
+                source.setAttribute("src", script);
+                head.appendChild(source);
+            }
+        }
+
+        if ("${mode}" == "htmlembedded") {
+            var addScripts = ["${multiplex}", "${htmlmixed}"];
+            for (var script of addScripts) {
+                var source = document.createElement("script");
+                source.setAttribute("src", script);
+                head.appendChild(source);
+            }
+        }
+
+        window.addEventListener("load", function(event) {
+            var cm = CodeMirror(document.body, {
+                value: "",
+                lineNumbers: true,
+                lineWrapping: true,
+                tabSize: ${tabSize},
+                readOnly: true,
+                scrollbarStyle: null,
+                viewportMargin: Infinity,
+                mode: "${mode}"
+            });
 
-        cm.on("changes", function() {
-            document.querySelector(".CodeMirror-scroll").style.height = cm.doc.height;
-            window.print();
+            cm.on("changes", function() {
+                document.querySelector(".CodeMirror-scroll").style.height = cm.doc.height;
+                window.print();
+            });
+            
+            cm.doc.setValue("${body}");
         });
-        
-        cm.doc.setValue("${body}");
     </script>
 </html>
 `;