From dea978cda53392281afae2ba57f9e310d8b395e7 Mon Sep 17 00:00:00 2001 From: Vladimir Ananiev Date: Thu, 25 Oct 2018 14:34:19 +0300 Subject: Homework 1 JavaScript highlighter in JavaScript (#14) * Js2Html in Js * remove screenshot --- homework/81459/js2html/README.md | 9 ++++ homework/81459/js2html/highlight.js | 103 ++++++++++++++++++++++++++++++++++++ homework/81459/js2html/output.html | 74 ++++++++++++++++++++++++++ homework/81459/js2html/testfile.js | 35 ++++++++++++ 4 files changed, 221 insertions(+) create mode 100644 homework/81459/js2html/README.md create mode 100644 homework/81459/js2html/highlight.js create mode 100644 homework/81459/js2html/output.html create mode 100644 homework/81459/js2html/testfile.js diff --git a/homework/81459/js2html/README.md b/homework/81459/js2html/README.md new file mode 100644 index 0000000..bb0d3a7 --- /dev/null +++ b/homework/81459/js2html/README.md @@ -0,0 +1,9 @@ +# Requirements +- [Node.js](https://nodejs.org/en/) + +# Usage +```bash +node highlight.js +``` +`` - the file with code to highlight (**testfile.js**)
+`` - the file where to save the computed html (**output.html**) *If missing the result will be printed on the console* diff --git a/homework/81459/js2html/highlight.js b/homework/81459/js2html/highlight.js new file mode 100644 index 0000000..947ae5f --- /dev/null +++ b/homework/81459/js2html/highlight.js @@ -0,0 +1,103 @@ +(() => { + const inputFile = process.argv[2]; + const outputFile = process.argv[3]; + + const fs = require('fs'); + + fs.readFile(inputFile, 'utf8', (err, contents) => { + if (err) { + throw err; + } + + const html = generateHtml(contents); + + if (outputFile) { + fs.writeFile(outputFile, html, 'utf8', (err) => { + if (err) { + throw err; + } + }); + } else { + console.log(html); + } + }); +})(); + +const tokens = [ + {type: 'KEYWORD', className: 'orange', regex: /^(break|case|catch|class|const|continue|debugger|default|delete|do|else|export|extends|finally|for|function|if|import|in|instanceof|new|of|return|super|switch|this|throw|try|typeof|var|void|while|with|yield)\b/}, + {type: 'WHITESPACE', className: '', regex: /^\s+/}, + {type: 'BRACKET', className: 'white', regex: /^[\[\]{}()]/}, + {type: 'PUNCTUATION', className: 'white', regex: /^[:;,.]/}, + {type: 'COMMENT', className: 'grey', regex: /^\/\/.*/}, + {type: 'OPERATOR', className: 'red', regex: /^(\+|-|\/|={1,3}|!={0,2}|&{1,2}|\|{1,2}|\*|~|\^)/}, + {type: 'BOOLEAN_LITERAL', className: 'purple', regex: /^(true|false)\b/}, + {type: 'NUMBER_LITERAL', className: 'blue', regex: /^-?\d+(?:\.\d+)?(?:e[+\-]?\d+)?/i}, + {type: 'STRING_LITERAL', className: 'green', regex: /^("(?:\\.|[^"])*"|'(?:\\.|[^'])*')/}, + {type: 'NULL', className: 'orange', regex: /^(null|undefined)\b/}, + {type: 'IDENTIFIER', className: 'white', regex: /^\w+/}, + {type: "UNKNOWN", className: 'white', regex: /^./} +]; + +function generateHtml(code) { + let highlitedTokens = []; + + while (code && code.length) { + for (const token of tokens) { + if (token.regex.test(code)) { + const match = token.regex.exec(code); + highlitedTokens.push(highlightToken(match[0], token)); + code = code.substring(match[0].length); + break; + } + } + } + + return `${getHtmlHeader()}${highlitedTokens.join('')}${getHtmlFooter()}` +} + +function highlightToken(token, tokenType) { + return `${token}` +} + +const getHtmlHeader = () => ` + + + + + + 
+`;
+
+const getHtmlFooter = () => `
+
+ + +`; diff --git a/homework/81459/js2html/output.html b/homework/81459/js2html/output.html new file mode 100644 index 0000000..52eeeb6 --- /dev/null +++ b/homework/81459/js2html/output.html @@ -0,0 +1,74 @@ + + + + + + + 
+class Nonsense {
+   constructor() {
+      this.arbitraryArray = ['string with no meaning', 42];
+   }
+
+   doesThisMakeSense() {
+      return false;
+   }
+
+   answer(answer) {
+      console.log(answer);
+   }
+
+   whatIsTheMeaning() {
+      return this.arbitraryArray[this.getRandomIndex()]
+   }
+
+   getRandomIndex() {
+      return Math.floor(Math.random() * 2);
+   }
+}
+
+(function () {
+   console.log((-~function(){}-~function(){})); // 2, now that's weird
+   console.log(Array(16).join("lol" - 2) + " Batman!"); // ;)
+
+
+   const nonsense = new Nonsense();
+
+   while(nonsense.doesThisMakeSense()) { // No, it doesn't
+      nonsense.answer(nonsense.whatIsTheMeaning());
+   }
+})();
+
+
+
+
+ + diff --git a/homework/81459/js2html/testfile.js b/homework/81459/js2html/testfile.js new file mode 100644 index 0000000..0097012 --- /dev/null +++ b/homework/81459/js2html/testfile.js @@ -0,0 +1,35 @@ +class Nonsense { + constructor() { + this.arbitraryArray = ['string with no meaning', 42]; + } + + doesThisMakeSense() { + return false; + } + + answer(answer) { + console.log(answer); + } + + whatIsTheMeaning() { + return this.arbitraryArray[this.getRandomIndex()] + } + + getRandomIndex() { + return Math.floor(Math.random() * 2); + } +} + +(function () { + console.log((-~function(){}-~function(){})); // 2, now that's weird + console.log(Array(16).join("lol" - 2) + " Batman!"); // ;) + + + const nonsense = new Nonsense(); + + while(nonsense.doesThisMakeSense()) { // No, it doesn't + nonsense.answer(nonsense.whatIsTheMeaning()); + } +})(); + + -- cgit v1.3.1-23-gd82d