From 0540ab69906c6522988ec82f7846a33a37b4b9b8 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 19:32:50 -0400 Subject: [PATCH 01/13] Move demo to docs --- {www => docs}/demo.css | 0 {www => docs}/demo.html | 0 {www => docs}/demo.js | 0 3 files changed, 0 insertions(+), 0 deletions(-) rename {www => docs}/demo.css (100%) rename {www => docs}/demo.html (100%) rename {www => docs}/demo.js (100%) diff --git a/www/demo.css b/docs/demo.css similarity index 100% rename from www/demo.css rename to docs/demo.css diff --git a/www/demo.html b/docs/demo.html similarity index 100% rename from www/demo.html rename to docs/demo.html diff --git a/www/demo.js b/docs/demo.js similarity index 100% rename from www/demo.js rename to docs/demo.js From 2296958a130935343c1df140d8b36f07841455a8 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 19:45:36 -0400 Subject: [PATCH 02/13] Add doctype to demo.html --- docs/demo.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/docs/demo.html b/docs/demo.html index 4181e07778..e1c4f6dd36 100644 --- a/docs/demo.html +++ b/docs/demo.html @@ -1,4 +1,5 @@ - + + Marked Demo Page From 5a3565eec4e8c8b715c9a45c143a8097fbd47743 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 19:46:27 -0400 Subject: [PATCH 03/13] Change "Marked Demo Page" to "Marked Demo" --- docs/demo.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/demo.html b/docs/demo.html index e1c4f6dd36..d06acab2d3 100644 --- a/docs/demo.html +++ b/docs/demo.html @@ -1,7 +1,7 @@ - Marked Demo Page + Marked Demo @@ -9,7 +9,7 @@
From e9d5055fb4d6576c8fe4bd3dab5a1809f829dfae Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 19:46:49 -0400 Subject: [PATCH 04/13] Fix url to repo --- docs/demo.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/demo.html b/docs/demo.html index d06acab2d3..3183ae3bda 100644 --- a/docs/demo.html +++ b/docs/demo.html @@ -9,7 +9,7 @@
@@ -51,7 +51,7 @@

Marked Demo

Ready to start writing? Either start changing stuff on the left or [clear everything](?blank=1) with a simple click. -[Marked]: https://github.com/chjj/marked/ +[Marked]: https://github.com/markedjs/marked/ [Markdown]: http://daringfireball.net/projects/markdown/
From 57a5fb8212c36ae5dd96edd7fe5993e1bbaf8c09 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 19:47:12 -0400 Subject: [PATCH 05/13] Remove unused jquery --- docs/demo.html | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/demo.html b/docs/demo.html index 3183ae3bda..1e44ae6e1b 100644 --- a/docs/demo.html +++ b/docs/demo.html @@ -2,7 +2,6 @@ Marked Demo - From c5171e6ceb5a71728400f5b8da09d7bfbfb05f85 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 19:48:29 -0400 Subject: [PATCH 06/13] Move - @@ -239,6 +237,8 @@

Marked Demo

It is a pity, but markdown does **not** work in here for most markdown parsers. [Marked] handles it pretty well.
- + + + From 8e035bb3bef48e8de1261223dcc7db51d6cea4a8 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 20:07:48 -0400 Subject: [PATCH 07/13] Change jquery usage to querySelector --- docs/demo.js | 62 +++++++++++++++++++++++++++++----------------------- 1 file changed, 35 insertions(+), 27 deletions(-) diff --git a/docs/demo.js b/docs/demo.js index 36668a4d7f..11899bb9bf 100644 --- a/docs/demo.js +++ b/docs/demo.js @@ -1,30 +1,39 @@ -$(function () { - var $inputElem = $('#input'); - var $outputTypeElem = $('#outputType'); - var $previewElem = $('#preview'); - var $htmlElem = $('#html'); - var $lexerElem = $('#lexer'); - var $syntaxElem = $('#syntax'); +(function () { + var $inputElem = document.querySelector('#input'); + var $outputTypeElem = document.querySelector('#outputType'); + var $previewElem = document.querySelector('#preview'); + var $htmlElem = document.querySelector('#html'); + var $lexerElem = document.querySelector('#lexer'); + var $syntaxElem = document.querySelector('#syntax'); + var $pane = document.querySelector('#rightContainer .pane'); var inputDirty = true; var $activeElem = null; if (top.document.location.href.match(/\?blank=1$/)) { - $inputElem.val(''); + $inputElem.value = ''; } - $outputTypeElem.change(function () { - $('#rightContainer .pane').hide(); - $activeElem = $('#' + $outputTypeElem.val()).show(); - }).change(); + var handleChange = function () { + var panes = document.querySelectorAll('#rightContainer .pane'); + for (var i = 0; i < panes.length; i++) { + panes[i].style.display = 'none'; + } + $activeElem = document.querySelector('#' + $outputTypeElem.value); + $activeElem.style.display = 'block'; + }; + + $outputTypeElem.addEventListener('change', handleChange, false); + handleChange(); - var noticeChange = function () { + + var handleInput = function () { inputDirty = true; }; - $inputElem. - change(noticeChange). - keyup(noticeChange). - keypress(noticeChange). - keydown(noticeChange); + + $inputElem.addEventListener('change', handleInput, false); + $inputElem.addEventListener('keyup', handleInput, false); + $inputElem.addEventListener('keypress', handleInput, false); + $inputElem.addEventListener('keydown', handleInput, false); var jsonString = function (input) { var output = (input + ''). @@ -38,7 +47,7 @@ $(function () { }; var getScrollSize = function () { - var e = $activeElem[0]; + var e = $activeElem; return e.scrollHeight - e.clientHeight; }; @@ -49,10 +58,10 @@ $(function () { return 1; } - return $activeElem.scrollTop() / size; + return $activeElem.scrollTop / size; }; var setScrollPercent = function (percent) { - $activeElem.scrollTop(percent * getScrollSize()); + $activeElem.scrollTop = percent * getScrollSize(); }; var delayTime = 1; @@ -65,8 +74,7 @@ $(function () { var scrollPercent = getScrollPercent(); // Convert - var markdown = $inputElem.val(); - var lexed = marked.lexer(markdown); + var lexed = marked.lexer($inputElem.value); // Grab lexed output and convert to a string before the parser // destroys the data @@ -83,9 +91,9 @@ $(function () { var parsed = marked.parser(lexed); // Assign - $previewElem.html(parsed); - $htmlElem.val(parsed); - $lexerElem.val(lexedList.join("\n")); + $previewElem.innerHTML = (parsed); + $htmlElem.value = (parsed); + $lexerElem.value = (lexedList.join("\n")); // Set the scroll percent setScrollPercent(scrollPercent); @@ -102,4 +110,4 @@ $(function () { }; checkForChanges(); setScrollPercent(0); -}); +})(); From 4dbb434628aff96835ccb26c5d2c7b7d707e34fd Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 20:09:31 -0400 Subject: [PATCH 08/13] Replace double with single quotes, remove comments --- docs/demo.js | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/docs/demo.js b/docs/demo.js index 11899bb9bf..568ffe98a7 100644 --- a/docs/demo.js +++ b/docs/demo.js @@ -70,32 +70,26 @@ inputDirty = false; var startTime = new Date(); - // Save scroll position var scrollPercent = getScrollPercent(); - // Convert var lexed = marked.lexer($inputElem.value); - - // Grab lexed output and convert to a string before the parser - // destroys the data + var lexedList = []; for (var i = 0; i < lexed.length; i ++) { var lexedLine = []; for (var j in lexed[i]) { - lexedLine.push(j + ":" + jsonString(lexed[i][j])); + lexedLine.push(j + ':' + jsonString(lexed[i][j])); } - lexedList.push("{" + lexedLine.join(", ") + "}"); + lexedList.push('{' + lexedLine.join(', ') + '}'); } var parsed = marked.parser(lexed); - // Assign $previewElem.innerHTML = (parsed); $htmlElem.value = (parsed); - $lexerElem.value = (lexedList.join("\n")); + $lexerElem.value = (lexedList.join('\n')); - // Set the scroll percent setScrollPercent(scrollPercent); var endTime = new Date(); From 5618acf9cd0cbe889517b1a97ef71359a779aadf Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 20:28:22 -0400 Subject: [PATCH 09/13] Enhance demo.css --- docs/demo.css | 34 +++++++++------------------------- 1 file changed, 9 insertions(+), 25 deletions(-) diff --git a/docs/demo.css b/docs/demo.css index fed6e03fd4..0111185c04 100644 --- a/docs/demo.css +++ b/docs/demo.css @@ -1,13 +1,15 @@ html, body { margin: 0; padding: 0; - font-family: Helvetica, Arial, Verdana, sans-serif; - background-color: #DDF; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + color: #333; + background-color: #fbfbfb; height: 100%; } textarea { - font-family: monospace; + font-family: Menlo, Monaco, Consolas, "Courier New", monospace; + font-size: 12px; } #header { @@ -17,21 +19,8 @@ textarea { color: #002; } -#header h1 { - font-size: 2em; -} - -#header * { - margin: 0; - padding: 0; - line-height: 1em; - font-weight: 100; -} - -#header a { - color: #005; - position: relative; - z-index: 20; +#header > h1 { + margin-top: 0; } #bothContainers { @@ -85,19 +74,14 @@ textarea { #outputType { display: block; margin-left: auto; - font-weight: 900; - font-family: Arial, Verdana, sans-serif; - background-color: #dacccc; - color: #444; - border: 1px solid #999; } .pane { margin: 1.6em 0em 0.2em; padding: 0.6em; - background-color: #eee; display: block; - border: 1px solid #000; + border: 1px solid #ccc; + border-radius: 2px; top: 0; bottom: 0; left: 0; From 473c1556158d2ba73639587160ea595fd7793c17 Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 20:35:07 -0400 Subject: [PATCH 10/13] Add "Fork me on GitHub" ribbon --- docs/demo.css | 33 ++++++++++----------------------- docs/demo.html | 6 +++++- 2 files changed, 15 insertions(+), 24 deletions(-) diff --git a/docs/demo.css b/docs/demo.css index 0111185c04..2a1267a4d6 100644 --- a/docs/demo.css +++ b/docs/demo.css @@ -13,10 +13,8 @@ textarea { } #header { - margin: 0; - padding: 0.4em 0 0 0; + margin-top: 1em; text-align: center; - color: #002; } #header > h1 { @@ -27,7 +25,7 @@ textarea { position: absolute; top: 0; bottom: 0; - margin-top: 2.4em; + margin-top: 5em; width: 100%; } @@ -55,25 +53,7 @@ textarea { } .label { - margin: 0; - padding: 0; - position: relative; - width: 100%; - display: block; -} - -.label * { - position: relative; - font-weight: 900; -} - -.label span { - color: #444; -} - -#outputType { - display: block; - margin-left: auto; + float: none !important; } .pane { @@ -135,3 +115,10 @@ textarea { font-size: 1.3em; } +.github-ribbon { + position: absolute; + top: 0; + right: 0; + border: 0; + z-index: 1000; +} diff --git a/docs/demo.html b/docs/demo.html index c46fbd0ca4..887c32df02 100644 --- a/docs/demo.html +++ b/docs/demo.html @@ -5,8 +5,12 @@ + + Fork me on GitHub + +
From bd4da952e7ce36a3ca2e87243799fd75938e11cb Mon Sep 17 00:00:00 2001 From: Steven Date: Sun, 25 Mar 2018 20:36:41 -0400 Subject: [PATCH 11/13] Move script to the bottom --- README.md | 2 +- docs/README.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 57f720749c..08684d3bdc 100644 --- a/README.md +++ b/README.md @@ -33,10 +33,10 @@ $ cat hello.html Marked in the browser -
+
+