Releasing 1.5.1

CHANGELOG.md

@@ -2,6 +2,10 @@
 All notable changes to the "mjml" extension will be documented in this file.
 This project adheres to [Semantic Versioning](https://semver.org/).
 
+### [1.5.1] (2018-10-03)
+* [#41](https://github.com/attilabuti/vscode-mjml/issues/41): fixed preview issue.
+* [#40](https://github.com/attilabuti/vscode-mjml/issues/40): fixed comment issue.
+
 ### [1.5.0] (2018-09-28)
 * [new] Configuration property `mjml.previewBackgroundColor`: preview background color ([#39](https://github.com/attilabuti/vscode-mjml/issues/39)).
 * [new] Configuration property `mjml.showSaveDialog`: show the save as dialog instead of input box.

README.md

@@ -159,6 +159,10 @@ Please see the [Nodemailer](https://nodemailer.com) documentation for more infor
 
 ## Change Log
 
+### [1.5.1] (2018-10-03)
+* [#41](https://github.com/attilabuti/vscode-mjml/issues/41): fixed preview issue.
+* [#40](https://github.com/attilabuti/vscode-mjml/issues/40): fixed comment issue.
+
 ### [1.5.0] (2018-09-28)
 * [new] Configuration property `mjml.previewBackgroundColor`: preview background color ([#39](https://github.com/attilabuti/vscode-mjml/issues/39)).
 * [new] Configuration property `mjml.showSaveDialog`: show the save as dialog instead of input box.

documentation/build.ts

@@ -232,7 +232,7 @@ async function tryItLive(html: string): Promise<string> {
  if (tryItLive.indexOf(match[2]) == -1) {
  let response = await fetch(match[1]);
 
- let mjmlMatch = /"value":*?["']([\s\S]*?)["']*?}/gi.exec(await response.text());
+ let mjmlMatch: RegExpExecArray = /"value":*?["']([\s\S]*?)["']*?"}/gi.exec(await response.text());
 
  mjmlMatch[1].replace(/\\"/g, "\"").replace(/src="\/(assets\/img)\/(.*?)"/gi, "src=\"https://mjml.io/assets/img/$2\"").split("\\n").forEach((line) => {
  fs.appendFileSync(`./examples/${fileName}.mjml`, line.replace(/\\/g, "").toString() + "\n");

language-configuration.json

@@ -1,30 +1,33 @@
 {
  "comments": {
- // symbol used for single line comment. Remove this entry if your language does not support line comments
- "lineComment": "//",
- // symbols used for start and end a block comment. Remove this entry if your language does not support block comments
- "blockComment": [ "/*", "*/" ]
+ "blockComment": [ "<!--", "-->" ]
  },
- // symbols used as brackets
  "brackets": [
+ ["<!--", "-->"],
+ ["<", ">"],
  ["{", "}"],
- ["[", "]"],
  ["(", ")"]
  ],
- // symbols that are auto closed when typing
  "autoClosingPairs": [
- ["{", "}"],
- ["[", "]"],
- ["(", ")"],
- ["\"", "\""],
- ["'", "'"]
+ { "open": "{", "close": "}"},
+ { "open": "[", "close": "]"},
+ { "open": "(", "close": ")" },
+ { "open": "'", "close": "'" },
+ { "open": "\"", "close": "\"" },
+ { "open": "<!--", "close": "-->", "notIn": [ "comment", "string" ]}
  ],
- // symbols that that can be used to surround a selection
  "surroundingPairs": [
- ["{", "}"],
- ["[", "]"],
- ["(", ")"],
- ["\"", "\""],
- ["'", "'"]
- ]
+ { "open": "'", "close": "'" },
+ { "open": "\"", "close": "\"" },
+ { "open": "{", "close": "}"},
+ { "open": "[", "close": "]"},
+ { "open": "(", "close": ")" },
+ { "open": "<", "close": ">" }
+ ],
+ "folding": {
+ "markers": {
+ "start": "^\\s*<!--\\s*#region\\b.*-->",
+ "end": "^\\s*<!--\\s*#endregion\\b.*-->"
+ }
+ }
 }

package.json

@@ -2,7 +2,7 @@
  "name": "vscode-mjml",
  "displayName": "MJML",
  "description": "MJML preview, lint, compile for Visual Studio Code.",
- "version": "1.5.0",
+ "version": "1.5.1",
  "publisher": "attilabuti",
  "license": "MIT",
  "readme": "README.md",
@@ -189,7 +189,8 @@
  }
  }
  },
- "commands": [{
+ "commands": [
+ {
  "command": "mjml.previewToSide",
  "title": "Open Preview to the Side",
  "category": "MJML",
@@ -249,37 +250,47 @@
  "category": "MJML"
  }
  ],
- "languages": [{
- "id": "mjml",
- "extensions": [
- ".mjml"
- ],
- "aliases": [
- "MJML",
- "mjml"
- ],
- "configuration": "./language-configuration.json"
- }],
- "grammars": [{
- "language": "mjml",
- "scopeName": "text.mjml.basic",
- "path": "./syntaxes/MJML.tmLanguage"
- }],
- "snippets": [{
- "language": "mjml",
- "path": "./snippets/mjml.json"
- }],
+ "languages": [
+ {
+ "id": "mjml",
+ "extensions": [
+ ".mjml"
+ ],
+ "aliases": [
+ "MJML",
+ "mjml"
+ ],
+ "configuration": "./language-configuration.json"
+ }
+ ],
+ "grammars": [
+ {
+ "language": "mjml",
+ "scopeName": "text.mjml.basic",
+ "path": "./syntaxes/MJML.tmLanguage"
+ }
+ ],
+ "snippets": [
+ {
+ "language": "mjml",
+ "path": "./snippets/mjml.json"
+ }
+ ],
  "menus": {
- "editor/title": [{
- "when": "editorLangId == mjml",
- "command": "mjml.previewToSide",
- "group": "navigation"
- }],
- "editor/context": [{
- "when": "editorLangId == mjml",
- "command": "mjml.searchInDocumentation",
- "group": "mjml"
- }]
+ "editor/title": [
+ {
+ "when": "editorLangId == mjml",
+ "command": "mjml.previewToSide",
+ "group": "navigation"
+ }
+ ],
+ "editor/context": [
+ {
+ "when": "editorLangId == mjml",
+ "command": "mjml.searchInDocumentation",
+ "group": "mjml"
+ }
+ ]
  }
  },
  "scripts": {
@@ -295,7 +306,7 @@
  "@types/mime": "^2.0.0",
  "@types/node": "*",
  "@types/nodemailer": "^4.6.5",
- "typescript": "^3.0.3",
+ "typescript": "^3.1.1",
  "vscode": "^1.1.18",
  "@types/npm": "^2.0.29",
  "markdown-it": "^8.4.2",
@@ -305,14 +316,13 @@
  "dependencies": {
  "ab-webshot": "^1.0.0",
  "copy-paste": "^1.3.0",
- "file-url": "^2.0.2",
  "is-url": "^1.2.4",
  "js-beautify": "^1.8.6",
  "mime": "^2.3.1",
  "mjml": "^4.1.2",
  "node-fetch": "2.2.0",
- "node-mailjet": "^3.2.1",
+ "node-mailjet": "^3.3.0",
  "nodemailer": "^4.6.8",
- "npm": "^6.2.0"
+ "npm": "^6.4.1"
  }
-}
+}

src/helper.ts

@@ -2,9 +2,10 @@
 
 import * as vscode from "vscode";
 import * as path from "path";
+import * as fs from "fs";
 
 import * as beautifyJS from "js-beautify";
-import fileUrl = require("file-url");
+import * as mime from "mime";
 import mjml2html = require("mjml");
 
 export default class Helper {
@@ -65,11 +66,27 @@ export default class Helper {
  }
  }
 
+ static encodeImage(filePath: string, original: string): string {
+ let mimeType: string = mime.getType(filePath);
+ if (!mimeType || ["bmp", "gif", "jpeg", "jpg", "png", "svg"].indexOf(mime.getExtension(mimeType)) == -1) {
+ return original;
+ }
+
+ if (filePath && fs.existsSync(filePath) && fs.statSync(filePath).isFile()) {
+ let data: Buffer = fs.readFileSync(filePath);
+ if (data) {
+ return `data:${mimeType};base64,${data.toString("base64")}`;
+ }
+ }
+
+ return original;
+ }
+
  static fixLinks(text: string, mjmlPath?: string): string {
  return text.replace(
  new RegExp(/((?:src|href|url)(?:=|\()(?:[\'\"]|))((?!http|\\|"|#).+?)([\'\"]|\))/, "gmi"),
  (subString: string, p1: string, p2: string, p3: string): string => {
- return [p1, fileUrl(path.join(path.dirname(((mjmlPath) ? mjmlPath : this.getPath())), p2)), p3].join("");
+ return [p1, this.encodeImage(path.join(path.dirname(((mjmlPath) ? mjmlPath : this.getPath())), p2), p2), p3].join("");
  }
  );
  }