From fce132a3cd914ff82164e33116ccec01c2ee1c2c Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Wed, 9 Feb 2022 16:59:47 +0000 Subject: [PATCH 01/13] Command Line: Add support for line continuation --- plugins/command-line/index.html | 21 +++++++++++ plugins/command-line/prism-command-line.css | 5 +++ plugins/command-line/prism-command-line.js | 36 +++++++++++++++++-- .../command-line/prism-command-line.min.css | 2 +- .../command-line/prism-command-line.min.js | 2 +- 5 files changed, 61 insertions(+), 5 deletions(-) diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html index 04398bbb24..9e90f0043a 100644 --- a/plugins/command-line/index.html +++ b/plugins/command-line/index.html @@ -49,6 +49,8 @@

How to use

Optional: To automatically present some lines as output, you can prefix those lines with any string and specify the prefix using the data-filter-output attribute on the <pre> element. For example, data-filter-output="(out)" will treat lines beginning with (out) as output and remove the prefix.

+ +

Optional: For multi-line commands you can specify the data-continuation-str attribute on the <pre> element. For example, data-continuation-str="\" will treat lines ending with \ as being continued on the following line. Continued lines will have a prompt as set by the attribute data-continuation-prompt or a default of >.

@@ -90,6 +92,25 @@

Windows PowerShell With Output

d-r-- 10/14/2015 5:06 PM Searches d-r-- 10/14/2015 5:06 PM Videos +

Line continuation with Output (bash)

+
echo "hello"
+(out)hello
+echo one \
+two \
+three
+(out)one two three
+echo "goodbye"
+(out)goodbye
+ +

Line continuation with Output (PowerShell)

+
Write-Host `
+'Hello' `
+'from' `
+'PowerShell!'
+(out)Hello from PowerShell!
+Write-Host 'Goodbye from PowerShell!'
+(out)Goodbye from PowerShell!
+
diff --git a/plugins/command-line/prism-command-line.css b/plugins/command-line/prism-command-line.css index 153a87076a..3934918a0f 100644 --- a/plugins/command-line/prism-command-line.css +++ b/plugins/command-line/prism-command-line.css @@ -6,6 +6,7 @@ letter-spacing: -1px; margin-right: 1em; pointer-events: none; + text-align: right; -webkit-user-select: none; -moz-user-select: none; @@ -31,3 +32,7 @@ .command-line-prompt > span[data-prompt]:before { content: attr(data-prompt); } + +.command-line-prompt > span[data-continuation-prompt]:before { + content: attr(data-continuation-prompt); +} diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js index c54697768f..cc4be94d11 100644 --- a/plugins/command-line/prism-command-line.js +++ b/plugins/command-line/prism-command-line.js @@ -79,6 +79,21 @@ } var codeLines = env.code.split('\n'); + + /** @type {int[]} */ + var continuationLineIdxs = commandLine.continuationLineIdxs = []; + var lineContinuationStr = pre.getAttribute('data-continuation-str'); + + // Identify code lines that are a continuation line and thus don't need + // a prompt + if (lineContinuationStr && codeLines.length > 1) { + for (var i = 1; i < codeLines.length; i++) { + if (codeLines.hasOwnProperty(i - 1) && codeLines[i - 1].endsWith(lineContinuationStr)) { + continuationLineIdxs.push(i); + } + } + } + commandLine.numberOfLines = codeLines.length; /** @type {string[]} */ var outputLines = commandLine.outputLines = []; @@ -168,15 +183,29 @@ } // Create the "rows" that will become the command-line prompts. -- cwells - var promptLines; + var promptLines = ''; var rowCount = commandLine.numberOfLines || 0; var promptText = getAttribute('data-prompt', ''); + var promptLine; if (promptText !== '') { - promptLines = repeat('', rowCount); + promptLine = ''; } else { var user = getAttribute('data-user', 'user'); var host = getAttribute('data-host', 'localhost'); - promptLines = repeat('', rowCount); + promptLine = ''; + } + + var continuationLineIdxs = commandLine.continuationLineIdxs || []; + var continuationPromptText = getAttribute('data-continuation-prompt', '>'); + var continuationPromptLine = ''; + + // Assemble all the appropriate prompt/continuation lines + for (var i = 0; i < rowCount; i++) { + if (continuationLineIdxs.includes(i)) { + promptLines+=continuationPromptLine; + } else { + promptLines+=promptLine; + } } // Create the wrapper element. -- cwells @@ -200,3 +229,4 @@ }); }()); +// vim: set tabstop=2 shiftwidth=2 noexpandtab: diff --git a/plugins/command-line/prism-command-line.min.css b/plugins/command-line/prism-command-line.min.css index 97b41d587e..6cecc806ac 100644 --- a/plugins/command-line/prism-command-line.min.css +++ b/plugins/command-line/prism-command-line.min.css @@ -1 +1 @@ -.command-line-prompt{border-right:1px solid #999;display:block;float:left;font-size:100%;letter-spacing:-1px;margin-right:1em;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.command-line-prompt>span:before{color:#999;content:' ';display:block;padding-right:.8em}.command-line-prompt>span[data-user]:before{content:"[" attr(data-user) "@" attr(data-host) "] $"}.command-line-prompt>span[data-user=root]:before{content:"[" attr(data-user) "@" attr(data-host) "] #"}.command-line-prompt>span[data-prompt]:before{content:attr(data-prompt)} \ No newline at end of file +.command-line-prompt{border-right:1px solid #999;display:block;float:left;font-size:100%;letter-spacing:-1px;margin-right:1em;pointer-events:none;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.command-line-prompt>span:before{color:#999;content:' ';display:block;padding-right:.8em}.command-line-prompt>span[data-user]:before{content:"[" attr(data-user) "@" attr(data-host) "] $"}.command-line-prompt>span[data-user=root]:before{content:"[" attr(data-user) "@" attr(data-host) "] #"}.command-line-prompt>span[data-prompt]:before{content:attr(data-prompt)}.command-line-prompt>span[data-continuation-prompt]:before{content:attr(data-continuation-prompt)} \ No newline at end of file diff --git a/plugins/command-line/prism-command-line.min.js b/plugins/command-line/prism-command-line.min.js index cfef753cba..4784609702 100644 --- a/plugins/command-line/prism-command-line.min.js +++ b/plugins/command-line/prism-command-line.min.js @@ -1 +1 @@ -!function(){if("undefined"!=typeof Prism&&"undefined"!=typeof document){var p=/(?:^|\s)command-line(?:\s|$)/,d="command-line-prompt",m="".startsWith?function(e,t){return e.startsWith(t)}:function(e,t){return 0===e.indexOf(t)};Prism.hooks.add("before-highlight",function(e){var t=h(e);if(!t.complete&&e.code){var n=e.element.parentElement;if(n&&/pre/i.test(n.nodeName)&&(p.test(n.className)||p.test(e.element.className))){var a=e.element.querySelector("."+d);a&&a.remove();var s=e.code.split("\n");t.numberOfLines=s.length;var o=t.outputLines=[],r=n.getAttribute("data-output"),i=n.getAttribute("data-filter-output");if(null!==r)r.split(",").forEach(function(e){var t=e.split("-"),n=parseInt(t[0],10),a=2===t.length?parseInt(t[1],10):n;if(!isNaN(n)&&!isNaN(a)){n<1&&(n=1),a>s.length&&(a=s.length),a--;for(var r=--n;r<=a;r++)o[r]=s[r],s[r]=""}});else if(i)for(var l=0;l'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=h(e);if(!t.complete){var n,a=e.element.parentElement;p.test(e.element.className)&&(e.element.className=e.element.className.replace(p," ")),p.test(a.className)||(a.className+=" command-line");var r=t.numberOfLines||0,s=u("data-prompt","");if(""!==s)n=f('',r);else n=f('',r);var o=document.createElement("span");o.className=d,o.innerHTML=n;for(var i=t.outputLines||[],l=0,m=i.length;ls.length&&(a=s.length),a--;for(var r=--n;r<=a;r++)l[r]=s[r],s[r]=""}});else if(u)for(i=0;i'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=g(e);if(!t.complete){var n=e.element.parentElement;h.test(e.element.className)&&(e.element.className=e.element.className.replace(h," ")),h.test(n.className)||(n.className+=" command-line");var a,r="",s=t.numberOfLines||0,o=f("data-prompt","");if(""!==o)a='';else a='';for(var i=t.continuationLineIdxs||[],l='")+'">',m=0;m Date: Wed, 9 Feb 2022 17:43:23 +0000 Subject: [PATCH 02/13] Command Line: Fix lint errors --- plugins/command-line/prism-command-line.js | 31 +++++----------------- 1 file changed, 7 insertions(+), 24 deletions(-) diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js index cc4be94d11..c10b30118d 100644 --- a/plugins/command-line/prism-command-line.js +++ b/plugins/command-line/prism-command-line.js @@ -12,23 +12,6 @@ ? function (s, p) { return s.startsWith(p); } : function (s, p) { return s.indexOf(p) === 0; }; - /** - * Repeats the given string some number of times. - * - * This is just a polyfill for `String.prototype.repeat`. - * - * @param {string} str - * @param {number} times - * @returns {string} - */ - function repeat(str, times) { - var s = ''; - for (var i = 0; i < times; i++) { - s += str; - } - return s; - } - /** * Returns whether the given hook environment has a command line info object. * @@ -87,9 +70,9 @@ // Identify code lines that are a continuation line and thus don't need // a prompt if (lineContinuationStr && codeLines.length > 1) { - for (var i = 1; i < codeLines.length; i++) { - if (codeLines.hasOwnProperty(i - 1) && codeLines[i - 1].endsWith(lineContinuationStr)) { - continuationLineIdxs.push(i); + for (var j = 1; j < codeLines.length; j++) { + if (codeLines.hasOwnProperty(j - 1) && codeLines[j - 1].endsWith(lineContinuationStr)) { + continuationLineIdxs.push(j); } } } @@ -200,11 +183,11 @@ var continuationPromptLine = ''; // Assemble all the appropriate prompt/continuation lines - for (var i = 0; i < rowCount; i++) { - if (continuationLineIdxs.includes(i)) { - promptLines+=continuationPromptLine; + for (var j = 0; j < rowCount; j++) { + if (continuationLineIdxs.includes(j)) { + promptLines += continuationPromptLine; } else { - promptLines+=promptLine; + promptLines += promptLine; } } From f987c79601dc6373a9496d72e7cbee0dca012556 Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Wed, 9 Feb 2022 17:44:27 +0000 Subject: [PATCH 03/13] Command Line: Rebuild prism-command-line.min.js --- plugins/command-line/prism-command-line.min.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/command-line/prism-command-line.min.js b/plugins/command-line/prism-command-line.min.js index 4784609702..9570d5e544 100644 --- a/plugins/command-line/prism-command-line.min.js +++ b/plugins/command-line/prism-command-line.min.js @@ -1 +1 @@ -!function(){if("undefined"!=typeof Prism&&"undefined"!=typeof document){var h=/(?:^|\s)command-line(?:\s|$)/,v="command-line-prompt",c="".startsWith?function(e,t){return e.startsWith(t)}:function(e,t){return 0===e.indexOf(t)};Prism.hooks.add("before-highlight",function(e){var t=g(e);if(!t.complete&&e.code){var n=e.element.parentElement;if(n&&/pre/i.test(n.nodeName)&&(h.test(n.className)||h.test(e.element.className))){var a=e.element.querySelector("."+v);a&&a.remove();var s=e.code.split("\n"),r=t.continuationLineIdxs=[],o=n.getAttribute("data-continuation-str");if(o&&1s.length&&(a=s.length),a--;for(var r=--n;r<=a;r++)l[r]=s[r],s[r]=""}});else if(u)for(i=0;i'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=g(e);if(!t.complete){var n=e.element.parentElement;h.test(e.element.className)&&(e.element.className=e.element.className.replace(h," ")),h.test(n.className)||(n.className+=" command-line");var a,r="",s=t.numberOfLines||0,o=f("data-prompt","");if(""!==o)a='';else a='';for(var i=t.continuationLineIdxs||[],l='")+'">',m=0;ms.length&&(a=s.length),a--;for(var r=--n;r<=a;r++)l[r]=s[r],s[r]=""}});else if(u)for(var c=0;c'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=N(e);if(!t.complete){var n=e.element.parentElement;v.test(e.element.className)&&(e.element.className=e.element.className.replace(v," ")),v.test(n.className)||(n.className+=" command-line");var a,r="",s=t.numberOfLines||0,o=h("data-prompt","");if(""!==o)a='';else a='';for(var i=t.continuationLineIdxs||[],l='")+'">',m=0;m Date: Thu, 10 Feb 2022 08:54:22 +0000 Subject: [PATCH 04/13] Replace space indents Co-authored-by: Michael Schmidt --- plugins/command-line/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html index 9e90f0043a..df83ec7b86 100644 --- a/plugins/command-line/index.html +++ b/plugins/command-line/index.html @@ -50,7 +50,7 @@

How to use

Optional: To automatically present some lines as output, you can prefix those lines with any string and specify the prefix using the data-filter-output attribute on the <pre> element. For example, data-filter-output="(out)" will treat lines beginning with (out) as output and remove the prefix.

-

Optional: For multi-line commands you can specify the data-continuation-str attribute on the <pre> element. For example, data-continuation-str="\" will treat lines ending with \ as being continued on the following line. Continued lines will have a prompt as set by the attribute data-continuation-prompt or a default of >.

+

Optional: For multi-line commands you can specify the data-continuation-str attribute on the <pre> element. For example, data-continuation-str="\" will treat lines ending with \ as being continued on the following line. Continued lines will have a prompt as set by the attribute data-continuation-prompt or a default of >.

From eb30fbf471e4ca4334f85074e8c8b695036fbd5a Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 10:02:25 +0000 Subject: [PATCH 05/13] Command Line: Add polyfill for endsWith, [] => Set, rename variable --- plugins/command-line/prism-command-line.js | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js index c10b30118d..cbd089a772 100644 --- a/plugins/command-line/prism-command-line.js +++ b/plugins/command-line/prism-command-line.js @@ -4,6 +4,16 @@ return; } + // Polyfill for pre-ES6 Support, i.e. Internet Explorer + if (!String.prototype.endsWith) { + String.prototype.endsWith = function (search, this_len) { + if (this_len === undefined || this_len > this.length) { + this_len = this.length; + } + return this.substring(this_len - search.length, this_len) === search; + }; + } + var CLASS_PATTERN = /(?:^|\s)command-line(?:\s|$)/; var PROMPT_CLASS = 'command-line-prompt'; @@ -64,15 +74,16 @@ var codeLines = env.code.split('\n'); /** @type {int[]} */ - var continuationLineIdxs = commandLine.continuationLineIdxs = []; + var continuationLineIndicies = commandLine.continuationLineIndicies = new Set(); var lineContinuationStr = pre.getAttribute('data-continuation-str'); // Identify code lines that are a continuation line and thus don't need // a prompt if (lineContinuationStr && codeLines.length > 1) { for (var j = 1; j < codeLines.length; j++) { - if (codeLines.hasOwnProperty(j - 1) && codeLines[j - 1].endsWith(lineContinuationStr)) { - continuationLineIdxs.push(j); + if (codeLines.hasOwnProperty(j - 1) + && codeLines[j - 1].endsWith(lineContinuationStr)) { + continuationLineIndicies.add(j); } } } @@ -178,13 +189,13 @@ promptLine = ''; } - var continuationLineIdxs = commandLine.continuationLineIdxs || []; + var continuationLineIndicies = commandLine.continuationLineIndicies || new Set(); var continuationPromptText = getAttribute('data-continuation-prompt', '>'); var continuationPromptLine = ''; // Assemble all the appropriate prompt/continuation lines for (var j = 0; j < rowCount; j++) { - if (continuationLineIdxs.includes(j)) { + if (continuationLineIndicies.has(j)) { promptLines += continuationPromptLine; } else { promptLines += promptLine; From 7dcdb9516377636d4bbcc77540f74ed08a665a4a Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 10:04:54 +0000 Subject: [PATCH 06/13] Command Line: Change to use opacity and prevent selection on output Opacity works better with the different themes. Preventing user-select on shell output allows you to copy just the commands for pasting into a shell. --- plugins/command-line/prism-command-line.css | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/plugins/command-line/prism-command-line.css b/plugins/command-line/prism-command-line.css index 3934918a0f..08a188e6f9 100644 --- a/plugins/command-line/prism-command-line.css +++ b/plugins/command-line/prism-command-line.css @@ -15,7 +15,7 @@ } .command-line-prompt > span:before { - color: #999; + opacity: 0.4; content: ' '; display: block; padding-right: 0.8em; @@ -36,3 +36,10 @@ .command-line-prompt > span[data-continuation-prompt]:before { content: attr(data-continuation-prompt); } + +.command-line span.token.output { + /* Make shell output a bit lighter to distinguish them from shell commands */ + opacity: 0.7; + /* Ignore shell output lines when selecting to copy/paste */ + user-select: none; +} From d2b5b5575702aba2aa85ce4b0bfe4ae5f142a45b Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 10:10:53 +0000 Subject: [PATCH 07/13] Command Line: Rebuild minified files --- plugins/command-line/prism-command-line.min.css | 2 +- plugins/command-line/prism-command-line.min.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/plugins/command-line/prism-command-line.min.css b/plugins/command-line/prism-command-line.min.css index 6cecc806ac..e904d02086 100644 --- a/plugins/command-line/prism-command-line.min.css +++ b/plugins/command-line/prism-command-line.min.css @@ -1 +1 @@ -.command-line-prompt{border-right:1px solid #999;display:block;float:left;font-size:100%;letter-spacing:-1px;margin-right:1em;pointer-events:none;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.command-line-prompt>span:before{color:#999;content:' ';display:block;padding-right:.8em}.command-line-prompt>span[data-user]:before{content:"[" attr(data-user) "@" attr(data-host) "] $"}.command-line-prompt>span[data-user=root]:before{content:"[" attr(data-user) "@" attr(data-host) "] #"}.command-line-prompt>span[data-prompt]:before{content:attr(data-prompt)}.command-line-prompt>span[data-continuation-prompt]:before{content:attr(data-continuation-prompt)} \ No newline at end of file +.command-line-prompt{border-right:1px solid #999;display:block;float:left;font-size:100%;letter-spacing:-1px;margin-right:1em;pointer-events:none;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.command-line-prompt>span:before{opacity:.4;content:' ';display:block;padding-right:.8em}.command-line-prompt>span[data-user]:before{content:"[" attr(data-user) "@" attr(data-host) "] $"}.command-line-prompt>span[data-user=root]:before{content:"[" attr(data-user) "@" attr(data-host) "] #"}.command-line-prompt>span[data-prompt]:before{content:attr(data-prompt)}.command-line-prompt>span[data-continuation-prompt]:before{content:attr(data-continuation-prompt)}.command-line span.token.output{opacity:.7;user-select:none} \ No newline at end of file diff --git a/plugins/command-line/prism-command-line.min.js b/plugins/command-line/prism-command-line.min.js index 9570d5e544..44f47e0361 100644 --- a/plugins/command-line/prism-command-line.min.js +++ b/plugins/command-line/prism-command-line.min.js @@ -1 +1 @@ -!function(){if("undefined"!=typeof Prism&&"undefined"!=typeof document){var v=/(?:^|\s)command-line(?:\s|$)/,g="command-line-prompt",p="".startsWith?function(e,t){return e.startsWith(t)}:function(e,t){return 0===e.indexOf(t)};Prism.hooks.add("before-highlight",function(e){var t=N(e);if(!t.complete&&e.code){var n=e.element.parentElement;if(n&&/pre/i.test(n.nodeName)&&(v.test(n.className)||v.test(e.element.className))){var a=e.element.querySelector("."+g);a&&a.remove();var s=e.code.split("\n"),r=t.continuationLineIdxs=[],o=n.getAttribute("data-continuation-str");if(o&&1s.length&&(a=s.length),a--;for(var r=--n;r<=a;r++)l[r]=s[r],s[r]=""}});else if(u)for(var c=0;c'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=N(e);if(!t.complete){var n=e.element.parentElement;v.test(e.element.className)&&(e.element.className=e.element.className.replace(v," ")),v.test(n.className)||(n.className+=" command-line");var a,r="",s=t.numberOfLines||0,o=h("data-prompt","");if(""!==o)a='';else a='';for(var i=t.continuationLineIdxs||[],l='")+'">',m=0;mthis.length)&&(t=this.length),this.substring(t-e.length,t)===e});var v=/(?:^|\s)command-line(?:\s|$)/,g="command-line-prompt",u="".startsWith?function(e,t){return e.startsWith(t)}:function(e,t){return 0===e.indexOf(t)};Prism.hooks.add("before-highlight",function(e){var t=N(e);if(!t.complete&&e.code){var n=e.element.parentElement;if(n&&/pre/i.test(n.nodeName)&&(v.test(n.className)||v.test(e.element.className))){var a=e.element.querySelector("."+g);a&&a.remove();var i=e.code.split("\n"),r=t.continuationLineIndicies=new Set,s=n.getAttribute("data-continuation-str");if(s&&1i.length&&(a=i.length),a--;for(var r=--n;r<=a;r++)l[r]=i[r],i[r]=""}});else if(p)for(var c=0;c'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=N(e);if(!t.complete){var n=e.element.parentElement;v.test(e.element.className)&&(e.element.className=e.element.className.replace(v," ")),v.test(n.className)||(n.className+=" command-line");var a,r="",i=t.numberOfLines||0,s=f("data-prompt","");if(""!==s)a='';else a='';for(var o=t.continuationLineIndicies||new Set,l='")+'">',m=0;m Date: Thu, 10 Feb 2022 11:34:19 +0000 Subject: [PATCH 08/13] Command Line: Change Set to sparse [] to avoid eslint errors Also improve help page. --- plugins/command-line/index.html | 3 +++ plugins/command-line/prism-command-line.js | 12 +++++++----- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html index df83ec7b86..33f6db12fc 100644 --- a/plugins/command-line/index.html +++ b/plugins/command-line/index.html @@ -50,6 +50,8 @@

How to use

Optional: To automatically present some lines as output, you can prefix those lines with any string and specify the prefix using the data-filter-output attribute on the <pre> element. For example, data-filter-output="(out)" will treat lines beginning with (out) as output and remove the prefix.

+

Output lines are not user selectable so that you can select the whole content of the code block and only copy the shell commands, ignoreing any output lines. If you want the output to also be selectable then override the user-select CSS property for .command-line span.token.output.

+

Optional: For multi-line commands you can specify the data-continuation-str attribute on the <pre> element. For example, data-continuation-str="\" will treat lines ending with \ as being continued on the following line. Continued lines will have a prompt as set by the attribute data-continuation-prompt or a default of >.

@@ -99,6 +101,7 @@

Line continuation with Output (bash)

two \ three (out)one two three +(out) echo "goodbye" (out)goodbye diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js index cbd089a772..8d91d84ac5 100644 --- a/plugins/command-line/prism-command-line.js +++ b/plugins/command-line/prism-command-line.js @@ -73,8 +73,9 @@ var codeLines = env.code.split('\n'); - /** @type {int[]} */ - var continuationLineIndicies = commandLine.continuationLineIndicies = new Set(); + // Sparse array holding true if the line at that position is a continuation + /** @type {boolean[]} */ + var continuationLinePositions = commandLine.continuationLinePositions = []; var lineContinuationStr = pre.getAttribute('data-continuation-str'); // Identify code lines that are a continuation line and thus don't need @@ -83,7 +84,8 @@ for (var j = 1; j < codeLines.length; j++) { if (codeLines.hasOwnProperty(j - 1) && codeLines[j - 1].endsWith(lineContinuationStr)) { - continuationLineIndicies.add(j); + // Mark this line as being a continuation line + continuationLinePositions[j] = true; } } } @@ -189,13 +191,13 @@ promptLine = ''; } - var continuationLineIndicies = commandLine.continuationLineIndicies || new Set(); + var continuationLinePositions = commandLine.continuationLinePositions || []; var continuationPromptText = getAttribute('data-continuation-prompt', '>'); var continuationPromptLine = ''; // Assemble all the appropriate prompt/continuation lines for (var j = 0; j < rowCount; j++) { - if (continuationLineIndicies.has(j)) { + if (continuationLinePositions.hasOwnProperty(j)) { promptLines += continuationPromptLine; } else { promptLines += promptLine; From b0b87bc3b5f9fa29d5f1825e5ea03966d5f9ff69 Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 11:51:19 +0000 Subject: [PATCH 09/13] Command Line: Remove user-select:none from output, reword help --- plugins/command-line/index.html | 5 ++++- plugins/command-line/prism-command-line.css | 2 -- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html index 33f6db12fc..7ec06c7e43 100644 --- a/plugins/command-line/index.html +++ b/plugins/command-line/index.html @@ -50,7 +50,10 @@

How to use

Optional: To automatically present some lines as output, you can prefix those lines with any string and specify the prefix using the data-filter-output attribute on the <pre> element. For example, data-filter-output="(out)" will treat lines beginning with (out) as output and remove the prefix.

-

Output lines are not user selectable so that you can select the whole content of the code block and only copy the shell commands, ignoreing any output lines. If you want the output to also be selectable then override the user-select CSS property for .command-line span.token.output.

+

Output lines are user selectable by default, so if you select the whole content of the code block, it will select the shell commands and any output lines. This may not be desireable if you want to copy/paste just the commands and not the output. If you want to make the output not user selectable then add the following to your CSS.

+ 

.command-line span.token.output {
+	user-select: none;
+}

Optional: For multi-line commands you can specify the data-continuation-str attribute on the <pre> element. For example, data-continuation-str="\" will treat lines ending with \ as being continued on the following line. Continued lines will have a prompt as set by the attribute data-continuation-prompt or a default of >.

diff --git a/plugins/command-line/prism-command-line.css b/plugins/command-line/prism-command-line.css index 08a188e6f9..2de8687e87 100644 --- a/plugins/command-line/prism-command-line.css +++ b/plugins/command-line/prism-command-line.css @@ -40,6 +40,4 @@ .command-line span.token.output { /* Make shell output a bit lighter to distinguish them from shell commands */ opacity: 0.7; - /* Ignore shell output lines when selecting to copy/paste */ - user-select: none; } From 814c6f394bb5383973277e6287fd7f2e95bbc8c6 Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 12:20:43 +0000 Subject: [PATCH 10/13] Command Line: Remove pointless

--- plugins/command-line/index.html | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html index 7ec06c7e43..c8cd9c44be 100644 --- a/plugins/command-line/index.html +++ b/plugins/command-line/index.html @@ -50,10 +50,11 @@

How to use

Optional: To automatically present some lines as output, you can prefix those lines with any string and specify the prefix using the data-filter-output attribute on the <pre> element. For example, data-filter-output="(out)" will treat lines beginning with (out) as output and remove the prefix.

-

Output lines are user selectable by default, so if you select the whole content of the code block, it will select the shell commands and any output lines. This may not be desireable if you want to copy/paste just the commands and not the output. If you want to make the output not user selectable then add the following to your CSS.

- 

.command-line span.token.output {
+	
Output lines are user selectable by default, so if you select the whole content of the code block, it will select the shell commands and any output lines. This may not be desireable if you want to copy/paste just the commands and not the output. If you want to make the output not user selectable then add the following to your CSS:

+
+	
.command-line span.token.output {
 	user-select: none;
-}

+}

Optional: For multi-line commands you can specify the data-continuation-str attribute on the <pre> element. For example, data-continuation-str="\" will treat lines ending with \ as being continued on the following line. Continued lines will have a prompt as set by the attribute data-continuation-prompt or a default of >.

From 49a26cd15c4af7e448c706b08e6be9c3bf673984 Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 12:21:25 +0000 Subject: [PATCH 11/13] Command Line: Swap [] => Set now eslint is fixed to allow it --- plugins/command-line/prism-command-line.js | 11 ++++------- plugins/command-line/prism-command-line.min.css | 2 +- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js index 8d91d84ac5..58df662617 100644 --- a/plugins/command-line/prism-command-line.js +++ b/plugins/command-line/prism-command-line.js @@ -73,9 +73,7 @@ var codeLines = env.code.split('\n'); - // Sparse array holding true if the line at that position is a continuation - /** @type {boolean[]} */ - var continuationLinePositions = commandLine.continuationLinePositions = []; + var continuationLineIndicies = commandLine.continuationLineIndicies = new Set(); var lineContinuationStr = pre.getAttribute('data-continuation-str'); // Identify code lines that are a continuation line and thus don't need @@ -85,7 +83,7 @@ if (codeLines.hasOwnProperty(j - 1) && codeLines[j - 1].endsWith(lineContinuationStr)) { // Mark this line as being a continuation line - continuationLinePositions[j] = true; + continuationLineIndicies.add(j); } } } @@ -191,13 +189,13 @@ promptLine = ''; } - var continuationLinePositions = commandLine.continuationLinePositions || []; + var continuationLineIndicies = commandLine.continuationLineIndicies || new Set(); var continuationPromptText = getAttribute('data-continuation-prompt', '>'); var continuationPromptLine = ''; // Assemble all the appropriate prompt/continuation lines for (var j = 0; j < rowCount; j++) { - if (continuationLinePositions.hasOwnProperty(j)) { + if (continuationLineIndicies.has(j)) { promptLines += continuationPromptLine; } else { promptLines += promptLine; @@ -225,4 +223,3 @@ }); }()); -// vim: set tabstop=2 shiftwidth=2 noexpandtab: diff --git a/plugins/command-line/prism-command-line.min.css b/plugins/command-line/prism-command-line.min.css index e904d02086..5e5c875d7e 100644 --- a/plugins/command-line/prism-command-line.min.css +++ b/plugins/command-line/prism-command-line.min.css @@ -1 +1 @@ -.command-line-prompt{border-right:1px solid #999;display:block;float:left;font-size:100%;letter-spacing:-1px;margin-right:1em;pointer-events:none;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.command-line-prompt>span:before{opacity:.4;content:' ';display:block;padding-right:.8em}.command-line-prompt>span[data-user]:before{content:"[" attr(data-user) "@" attr(data-host) "] $"}.command-line-prompt>span[data-user=root]:before{content:"[" attr(data-user) "@" attr(data-host) "] #"}.command-line-prompt>span[data-prompt]:before{content:attr(data-prompt)}.command-line-prompt>span[data-continuation-prompt]:before{content:attr(data-continuation-prompt)}.command-line span.token.output{opacity:.7;user-select:none} \ No newline at end of file +.command-line-prompt{border-right:1px solid #999;display:block;float:left;font-size:100%;letter-spacing:-1px;margin-right:1em;pointer-events:none;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.command-line-prompt>span:before{opacity:.4;content:' ';display:block;padding-right:.8em}.command-line-prompt>span[data-user]:before{content:"[" attr(data-user) "@" attr(data-host) "] $"}.command-line-prompt>span[data-user=root]:before{content:"[" attr(data-user) "@" attr(data-host) "] #"}.command-line-prompt>span[data-prompt]:before{content:attr(data-prompt)}.command-line-prompt>span[data-continuation-prompt]:before{content:attr(data-continuation-prompt)}.command-line span.token.output{opacity:.7} \ No newline at end of file From 702d560949af100c84a62cb64de0a0b198711de8 Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 15:25:41 +0000 Subject: [PATCH 12/13] Command Line: Replace spaces with tab --- plugins/command-line/prism-command-line.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/command-line/prism-command-line.css b/plugins/command-line/prism-command-line.css index 2de8687e87..984a718c1f 100644 --- a/plugins/command-line/prism-command-line.css +++ b/plugins/command-line/prism-command-line.css @@ -38,6 +38,6 @@ } .command-line span.token.output { - /* Make shell output a bit lighter to distinguish them from shell commands */ + /* Make shell output lines a bit lighter to distinguish them from shell commands */ opacity: 0.7; } From 88cd35da3612b5795ff94f35fb8bc7cab129c270 Mon Sep 17 00:00:00 2001 From: at055612 <22818309+at055612@users.noreply.github.com> Date: Thu, 10 Feb 2022 15:26:53 +0000 Subject: [PATCH 13/13] Command Line: Remove endsWith polyfill --- plugins/command-line/prism-command-line.js | 23 ++++++++++--------- .../command-line/prism-command-line.min.js | 2 +- 2 files changed, 13 insertions(+), 12 deletions(-) diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js index 58df662617..6437775ce5 100644 --- a/plugins/command-line/prism-command-line.js +++ b/plugins/command-line/prism-command-line.js @@ -4,16 +4,6 @@ return; } - // Polyfill for pre-ES6 Support, i.e. Internet Explorer - if (!String.prototype.endsWith) { - String.prototype.endsWith = function (search, this_len) { - if (this_len === undefined || this_len > this.length) { - this_len = this.length; - } - return this.substring(this_len - search.length, this_len) === search; - }; - } - var CLASS_PATTERN = /(?:^|\s)command-line(?:\s|$)/; var PROMPT_CLASS = 'command-line-prompt'; @@ -22,6 +12,17 @@ ? function (s, p) { return s.startsWith(p); } : function (s, p) { return s.indexOf(p) === 0; }; + // Support for IE11 that has no endsWith() + /** @type {(str: string, suffix: string) => boolean} */ + var endsWith = ''.endsWith + ? function (str, suffix) { + return str.endsWith(suffix); + } + : function (str, suffix) { + var len = str.length; + return str.substring(len - suffix.length, len) === suffix; + }; + /** * Returns whether the given hook environment has a command line info object. * @@ -81,7 +82,7 @@ if (lineContinuationStr && codeLines.length > 1) { for (var j = 1; j < codeLines.length; j++) { if (codeLines.hasOwnProperty(j - 1) - && codeLines[j - 1].endsWith(lineContinuationStr)) { + && endsWith(codeLines[j - 1], lineContinuationStr)) { // Mark this line as being a continuation line continuationLineIndicies.add(j); } diff --git a/plugins/command-line/prism-command-line.min.js b/plugins/command-line/prism-command-line.min.js index 44f47e0361..ee6e6a47e7 100644 --- a/plugins/command-line/prism-command-line.min.js +++ b/plugins/command-line/prism-command-line.min.js @@ -1 +1 @@ -!function(){if("undefined"!=typeof Prism&&"undefined"!=typeof document){String.prototype.endsWith||(String.prototype.endsWith=function(e,t){return(void 0===t||t>this.length)&&(t=this.length),this.substring(t-e.length,t)===e});var v=/(?:^|\s)command-line(?:\s|$)/,g="command-line-prompt",u="".startsWith?function(e,t){return e.startsWith(t)}:function(e,t){return 0===e.indexOf(t)};Prism.hooks.add("before-highlight",function(e){var t=N(e);if(!t.complete&&e.code){var n=e.element.parentElement;if(n&&/pre/i.test(n.nodeName)&&(v.test(n.className)||v.test(e.element.className))){var a=e.element.querySelector("."+g);a&&a.remove();var i=e.code.split("\n"),r=t.continuationLineIndicies=new Set,s=n.getAttribute("data-continuation-str");if(s&&1i.length&&(a=i.length),a--;for(var r=--n;r<=a;r++)l[r]=i[r],i[r]=""}});else if(p)for(var c=0;c'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=N(e);if(!t.complete){var n=e.element.parentElement;v.test(e.element.className)&&(e.element.className=e.element.className.replace(v," ")),v.test(n.className)||(n.className+=" command-line");var a,r="",i=t.numberOfLines||0,s=f("data-prompt","");if(""!==s)a='';else a='';for(var o=t.continuationLineIndicies||new Set,l='")+'">',m=0;mi.length&&(a=i.length),a--;for(var r=--n;r<=a;r++)l[r]=i[r],i[r]=""}});else if(u)for(var c=0;c'+a[r]+"":n[r]=''+n[r]+"";e.highlightedCode=n.join("\n")}}),Prism.hooks.add("complete",function(e){if(function(e){return"command-line"in(e.vars=e.vars||{})}(e)){var t=N(e);if(!t.complete){var n=e.element.parentElement;v.test(e.element.className)&&(e.element.className=e.element.className.replace(v," ")),v.test(n.className)||(n.className+=" command-line");var a,r="",i=t.numberOfLines||0,s=h("data-prompt","");if(""!==s)a='';else a='';for(var o=t.continuationLineIndicies||new Set,l='")+'">',m=0;m