Add class command-line to your <pre>. For a server command line, specify the user and host names using the data-user and data-host attributes. The resulting prompt displays a # for the root user and $ for all other users. For any other command line, such as a Windows prompt, you may specify the entire prompt using the data-prompt attribute.
Optional: You may specify the lines to be presented as output (no prompt and no highlighting) through the data-output attribute on the <pre> element in the following simple format:
You may specify the lines to be presented as output (no prompt and no highlighting) through the data-output attribute on the <pre> element in the following simple format:
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.
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:
+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 desirable 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 >.
You can configure the plugin to handle multi-line commands. This can be done in two ways; a line continuation string (as in Bash); or a command termination string (as in SQL).
+ +data-continuation-strdata-continuation-str="\"data-termination-strdata-termination-str=";"data-continuation-promptdata-continuation-prompt="->". If this attribute is not set then a default of > will be used.<pre class="command-line">cd ~/.vim
+
+vim vimrc<pre class="command-line"
+ data-user="root"
+ data-host="localhost">cd /usr/local/etc
cp php.ini php.ini.bak
vi php.ini<pre class="command-line"
+ data-user="chris"
+ data-host="remotehost"
+ data-output="2, 4-8">pwd
/usr/home/chris/bin
ls -la
@@ -78,6 +111,11 @@ Non-Root User With Output
-rwxr-xr-x 1 chris chris 642 Jan 17 14:42 deploy<pre class="command-line"
+ data-prompt="PS C:\Users\Chris>"
+ data-output="2-19">dir
@@ -99,7 +137,14 @@ Windows PowerShell With Output
d-r-- 10/14/2015 5:06 PM Videosecho "hello"
+
+<pre class="command-line"
+ data-filter-output="(out)"
+ data-continuation-str="\" >
+
+
+export MY_VAR=123
+echo "hello"
(out)hello
echo one \
two \
@@ -110,7 +155,14 @@ Line continuation with Output (bash)
(out)goodbye
Line continuation with Output (PowerShell)
-Write-Host `
+
+<pre class="command-line"
+ data-prompt="ps c:\users\chris>"
+ data-continuation-prompt=">>"
+ data-filter-output="(out)"
+ data-continuation-str=" `">
+
+Write-Host `
'Hello' `
'from' `
'PowerShell!'
@@ -118,6 +170,37 @@ Line continuation with Output (PowerShell)
Write-Host 'Goodbye from PowerShell!'
(out)Goodbye from PowerShell!
+ Line termination with Output (SQL/MySQL)
+
+<pre class="command-line"
+ data-prompt="mysql>"
+ data-continuation-prompt="->"
+ data-filter-output="(out)"
+ data-termination-str=";">
+
+set @my_var = 'foo';
+(out)Query OK, 0 rows affected (0.00 sec)
+(out)
+CREATE TABLE people (
+first_name VARCHAR(30) NOT NULL,
+last_name VARCHAR(30) NOT NULL
+);
+(out)Query OK, 0 rows affected (0.09 sec)
+(out)
+insert into people
+values ('John', 'Doe');
+(out)Query OK, 1 row affected (0.02 sec)
+(out)
+select *
+from people
+order by last_name;
+(out)+------------+-----------+
+(out)| first_name | last_name |
+(out)+------------+-----------+
+(out)| John | Doe |
+(out)+------------+-----------+
+(out)1 row in set (0.00 sec)
+
data-continuation-str="\"data-termination-strdata-termination-str=";"data-termination-str=";"data-continuation-promptdata-continuation-prompt="->". If this attribute is not set then a default of > will be used.data-continuation-prompt="->". If this attribute is not set then a default of > will be used.<pre class="command-line"
data-prompt="mysql>"
From ed733beb206e54a0e7b9872b9f42a58c6b136eb2 Mon Sep 17 00:00:00 2001
From: at055612 <22818309+at055612@users.noreply.github.com>
Date: Tue, 22 Feb 2022 18:14:43 +0000
Subject: [PATCH 3/7] Command Line: Replace data-termination-str with
data-filter-continuation
---
plugins/command-line/index.html | 28 ++++++------
plugins/command-line/prism-command-line.js | 43 ++++++++-----------
.../command-line/prism-command-line.min.js | 2 +-
3 files changed, 35 insertions(+), 38 deletions(-)
diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html
index 6f884429db..db5654ce90 100644
--- a/plugins/command-line/index.html
+++ b/plugins/command-line/index.html
@@ -52,6 +52,8 @@ Optional: Command output (positional)
Optional: Command output (prefix)
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.
+ A blank line will render as an empty line with a prompt. If you want an empty line without a prompt then you can use a line containing just the output prefix, e.g. (out). See the blank lines in the examples below.
+
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 desirable 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 {
@@ -59,14 +61,14 @@ Optional: Command output (prefix)
}
Optional: Multi-line commands
- You can configure the plugin to handle multi-line commands. This can be done in two ways; a line continuation string (as in Bash); or a command termination string (as in SQL).
+ You can configure the plugin to handle multi-line commands. This can be done in two ways; setting a line continuation string (as in Bash); or explicitly marking continuation lines with a prefix for languages that do not have a continuation string/character, e.g. SQL, Scala, etc..
data-continuation-str- Set this attribute to the line continuation string/character, e.g. for bash
data-continuation-str="\"
- data-termination-str- Set this attribute to the command termination string/character, e.g. for SQL
data-termination-str=";"
+ data-filter-continuation- This works in a similar way to
data-filter-output. Prefix all continuation lines with the value of data-filter-continuation and they will be displayed with the prompt set in data-continuation-prompt. For example, data-filter-continuation="(con)" will treat lines beginning with (con) as continuation lines and remove the prefix.
data-continuation-prompt- Set this attribute to define the prompt to be displayed when the command has continued beyond the first line (whether using line continuation or command termination), e.g. for MySQL
data-continuation-prompt="->". If this attribute is not set then a default of > will be used.
@@ -170,30 +172,30 @@ Line continuation with Output (PowerShell)
Write-Host 'Goodbye from PowerShell!'
(out)Goodbye from PowerShell!
<pre class="command-line"
data-prompt="mysql>"
data-continuation-prompt="->"
data-filter-output="(out)"
- data-termination-str=";">set @my_var = 'foo';
-(out)Query OK, 0 rows affected (0.00 sec)
+set @my_var = 'foo';
+set @my_other_var = 'bar';
(out)
CREATE TABLE people (
-first_name VARCHAR(30) NOT NULL,
-last_name VARCHAR(30) NOT NULL
-);
+(con)first_name VARCHAR(30) NOT NULL,
+(con)last_name VARCHAR(30) NOT NULL
+(con));
(out)Query OK, 0 rows affected (0.09 sec)
(out)
insert into people
-values ('John', 'Doe');
+(con)values ('John', 'Doe');
(out)Query OK, 1 row affected (0.02 sec)
(out)
select *
-from people
-order by last_name;
+(con)from people
+(con)order by last_name;
(out)+------------+-----------+
(out)| first_name | last_name |
(out)+------------+-----------+
diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js
index a1969bafe0..3ae1b5f56c 100644
--- a/plugins/command-line/prism-command-line.js
+++ b/plugins/command-line/prism-command-line.js
@@ -73,6 +73,7 @@
}
var codeLines = env.code.split('\n');
+
commandLine.numberOfLines = codeLines.length;
/** @type {string[]} */
var outputLines = commandLine.outputLines = [];
@@ -113,32 +114,26 @@
var continuationLineIndicies = commandLine.continuationLineIndicies = new Set();
var lineContinuationStr = pre.getAttribute('data-continuation-str');
- var lineTerminationStr = pre.getAttribute('data-termination-str');
+ var continuationFilter = pre.getAttribute('data-filter-continuation');
// Identify code lines that are a continuation line and thus need
- // a different prompt. Need to do this after the output lines have been
- // removed.
- if (codeLines.length > 1 && (lineTerminationStr || lineContinuationStr)) {
- for (var j = 0; j < codeLines.length; j++) {
- var isCodeLine = codeLines.hasOwnProperty(j) && codeLines[j] !== '';
-
- if (isCodeLine) {
- var isCodeOnPrevLine = codeLines.hasOwnProperty(j - 1)
- && codeLines[j - 1] !== '';
- var hasTerminationOnPrevLine = isCodeOnPrevLine
- && endsWith(codeLines[j - 1], lineTerminationStr);
- var hasContinuationOnPrevLine = isCodeOnPrevLine
- && endsWith(codeLines[j - 1], lineContinuationStr);
-
- var isFirstLineOfStatement = j === 0
- || !isCodeOnPrevLine
- || hasTerminationOnPrevLine
- || (lineContinuationStr && !hasContinuationOnPrevLine);
-
- if (hasContinuationOnPrevLine
- || (lineTerminationStr && !isFirstLineOfStatement)) {
- continuationLineIndicies.add(j);
- }
+ // a different prompt. Need to do this after the output lines have been removed
+ // to ensure we don't pick up a continuation string in an output line.
+ if (codeLines.length > 1) {
+ for (var j = 1; j < codeLines.length; j++) {
+ // Record lines where the previous line ended in a continuation str
+ if (lineContinuationStr
+ && codeLines.hasOwnProperty(j - 1)
+ && endsWith(codeLines[j - 1], lineContinuationStr)) {
+ continuationLineIndicies.add(j);
+ }
+ // Record lines explicitly marked with a continuation prefix
+ // (that we will remove)
+ if (continuationFilter
+ && codeLines.hasOwnProperty(j)
+ && startsWith(codeLines[j], continuationFilter)) {
+ codeLines[j] = codeLines[j].slice(continuationFilter.length);
+ continuationLineIndicies.add(j);
}
}
}
diff --git a/plugins/command-line/prism-command-line.min.js b/plugins/command-line/prism-command-line.min.js
index d4d6326839..d4806c61dc 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",b="".startsWith?function(e,t){return e.startsWith(t)}:function(e,t){return 0===e.indexOf(t)},N="".endsWith?function(e,t){return e.endsWith(t)}:function(e,t){var n=e.length;return e.substring(n-t.length,n)===t};Prism.hooks.add("before-highlight",function(e){var t=P(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");t.numberOfLines=i.length;var s=t.outputLines=[],r=n.getAttribute("data-output"),o=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>i.length&&(a=i.length),a--;for(var r=--n;r<=a;r++)s[r]=i[r],i[r]=""}});else if(o)for(var l=0;l'+Prism.util.encode(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=P(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;mi.length&&(a=i.length),a--;for(var r=--n;r<=a;r++)o[r]=i[r],i[r]=""}});else if(s)for(var l=0;l'+Prism.util.encode(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=b(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,o=h("data-prompt","");if(""!==o)a='';else a='';for(var s=t.continuationLineIndicies||new Set,l='")+'">',m=0;m
Date: Wed, 23 Feb 2022 09:26:58 +0000
Subject: [PATCH 4/7] Command Line: Simplify completion line logic
Co-authored-by: Michael Schmidt
---
plugins/command-line/prism-command-line.js | 31 +++++++++++-----------
1 file changed, 15 insertions(+), 16 deletions(-)
diff --git a/plugins/command-line/prism-command-line.js b/plugins/command-line/prism-command-line.js
index 3ae1b5f56c..3d01b7ec91 100644
--- a/plugins/command-line/prism-command-line.js
+++ b/plugins/command-line/prism-command-line.js
@@ -119,22 +119,21 @@
// Identify code lines that are a continuation line and thus need
// a different prompt. Need to do this after the output lines have been removed
// to ensure we don't pick up a continuation string in an output line.
- if (codeLines.length > 1) {
- for (var j = 1; j < codeLines.length; j++) {
- // Record lines where the previous line ended in a continuation str
- if (lineContinuationStr
- && codeLines.hasOwnProperty(j - 1)
- && endsWith(codeLines[j - 1], lineContinuationStr)) {
- continuationLineIndicies.add(j);
- }
- // Record lines explicitly marked with a continuation prefix
- // (that we will remove)
- if (continuationFilter
- && codeLines.hasOwnProperty(j)
- && startsWith(codeLines[j], continuationFilter)) {
- codeLines[j] = codeLines[j].slice(continuationFilter.length);
- continuationLineIndicies.add(j);
- }
+ for (var j = 0; j < codeLines.length; j++) {
+ var line = codeLines[j];
+ if (!line) {
+ continue;
+ }
+
+ // Record lines where the previous line ended in a continuation str
+ if (lineContinuationStr && endsWith(line, lineContinuationStr)) {
+ continuationLineIndicies.add(j + 1);
+ }
+ // Record lines explicitly marked with a continuation prefix
+ // (that we will remove)
+ if (j > 0 && continuationFilter && startsWith(line, continuationFilter)) {
+ codeLines[j] = line.slice(continuationFilter.length);
+ continuationLineIndicies.add(j);
}
}
From b66b29bccc21fe356ca61348bb10c900bfa4a3b0 Mon Sep 17 00:00:00 2001
From: at055612 <22818309+at055612@users.noreply.github.com>
Date: Wed, 23 Feb 2022 09:43:26 +0000
Subject: [PATCH 5/7] Command Line: Add scipt tag for language-sql
---
plugins/command-line/index.html | 1 +
1 file changed, 1 insertion(+)
diff --git a/plugins/command-line/index.html b/plugins/command-line/index.html
index db5654ce90..2aa0fed7e7 100644
--- a/plugins/command-line/index.html
+++ b/plugins/command-line/index.html
@@ -214,6 +214,7 @@ Line continuation using prefix (MySQL/SQL)
+