DeltaLima/flatpress-plugin-syntaxhighlighter-ng
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases 3 Packages Wiki Activity

Compare commits

base: DeltaLima:4d23ed47530c8f4e7836e76b8636af56796ac83e
Branches Tags
DeltaLima:main
DeltaLima:prism-bugfix-line-numbers
DeltaLima:prism-misc
DeltaLima:v1.0.3
DeltaLima:v1.0.2
DeltaLima:v1.0.1
DeltaLima:v1.0.0
...
compare: DeltaLima:12fe4183d09c55e488de6f1a9dc95798a993ca30
Branches Tags
DeltaLima:main
DeltaLima:prism-bugfix-line-numbers
DeltaLima:prism-misc
DeltaLima:v1.0.3
DeltaLima:v1.0.2
DeltaLima:v1.0.1
DeltaLima:v1.0.0

8 commits
4d23ed4753 ... 12fe4183d0

Author SHA1 Message Date
Marcus
12fe4183d0 README updates 2023-06-22 16:06:42 +02:00
DeltaLima
13ab2b4580 line-numbers config now done and working :) 2023-06-22 16:04:50 +02:00
Marcus
773b47984e forgot to remove unused var 2023-06-22 15:54:32 +02:00
Marcus
9f78840174 keep it simple, implementing to configure plugins would be too much for now, line-numbers boolean is enough atm 2023-06-22 15:52:58 +02:00
Marcus
45ae9c42dc put the used_plugins to <code> calsses 2023-06-22 15:24:32 +02:00
Marcus
a205a70ef3 forgot to modify config.php 2023-06-22 15:20:58 +02:00
Marcus
b0afedf4f2 read prism plugins from config.php 2023-06-22 15:06:12 +02:00
Marcus
0a3f88ada4 added missing plugin css files, added more languages to prism.small.js, added some more plugins 2023-06-22 14:54:33 +02:00
8 changed files with 81 additions and 52 deletions
Show stats Expand all files Collapse all files

4
.gitignore vendored Normal file
View file

@ -0,0 +1,4 @@
makerelease.sh
mirror.sh
syntaxhighlighter/
syntaxhighlighter-*.zip

23
README.md
View file

@ -45,24 +45,27 @@ The default values are `small` for size (see available languages below) and `oka
/* /*
* size: tiny, small, full * size: tiny, small, full
* *
* tiny: 21KB (Markup, HTML, XML, SVG, MathML, SSML, Atom, RSS, CSS, C-like, JavaScript) * tiny: 21KB (Markup, HTML, XML, SVG, MathML, SSML, Atom, RSS, CSS, C-like, JavaScript)
* *
* small: 95KB (Markup, HTML, XML,SVG, MathML, SSML, Atom, RSS, CSS, C-Linke, JavaScript * small: 95KB (markup, css, clike, javascript, apacheconf, arduino, bash, basic, batch,
* Apache, Bash, Batch, BBCode, C, C#, C++, CSV, Diff, Go, HTTP, ini, Java * bbcode, c, cpp, cmake, csv, diff, docker, git, go, http, ini, java, json,
* JSON, Makefile, Markdown, nginx, Perl, PHP, PowerShell, Python, Ruby * log, makefile, markdown, markup-templating, nginx, pascal, perl, php,
* Shell session, SQL, VB.Net, Wiki markup, YML) * powershell, python, ruby, shell-session, sql, typescript, vbnet,
* visual-basic, wiki, yaml)
* *
* full: 567KB (see https://prismjs.com/index.html#supported-languages for list of supported languages) * full: 567KB (see https://prismjs.com/index.html#supported-languages for list of supported languages)
* *
* theme: coy, dark, default, funky, okaidia, solarizedlight, tomorrow, twilight * theme: coy, dark, default, funky, okaidia, solarizedlight, tomorrow, twilight
* *
* line-numbers: 'true' or 'false' (Do show line numbers or not)
*
*/ */
return [ return [
// change here // change here
'size' => 'small', 'size' => 'small',
'theme' => 'okaidia', 'theme' => 'okaidia',
'line-numbers' => 'true',
] ]
?> ?>
``` ```

22
config.php
View file

@ -2,22 +2,26 @@
/* /*
* size: tiny, small, full * size: tiny, small, full
* *
* tiny: 21KB (Markup, HTML, XML, SVG, MathML, SSML, Atom, RSS, CSS, C-like, JavaScript) * tiny: 21KB (Markup, HTML, XML, SVG, MathML, SSML, Atom, RSS, CSS, C-like, JavaScript)
* *
* small: 95KB (Markup, HTML, XML,SVG, MathML, SSML, Atom, RSS, CSS, C-Linke, JavaScript * small: 95KB (markup, css, clike, javascript, apacheconf, arduino, bash, basic, batch,
* Apache, Bash, Batch, BBCode, C, C#, C++, CSV, Diff, Go, HTTP, ini, Java * bbcode, c, cpp, cmake, csv, diff, docker, git, go, http, ini, java, json,
* JSON, Makefile, Markdown, nginx, Perl, PHP, PowerShell, Python, Ruby * log, makefile, markdown, markup-templating, nginx, pascal, perl, php,
* Shell session, SQL, VB.Net, Wiki markup, YML) * powershell, python, ruby, shell-session, sql, typescript, vbnet,
* visual-basic, wiki, yaml)
* *
* full: 567KB (see https://prismjs.com/index.html#supported-languages for list of supported languages) * full: 567KB (see https://prismjs.com/index.html#supported-languages for list of supported languages)
* *
* theme: coy, dark, default, funky, okaidia, solarizedlight, tomorrow, twilight * theme: coy, dark, default, funky, okaidia, solarizedlight, tomorrow, twilight
* *
* line-numbers: 'true' or 'false' (Do show line numbers or not)
*
*/ */
return [ return [
// change here // change here
'size' => 'small', 'size' => 'small',
'theme' => 'okaidia', 'theme' => 'okaidia',
'line-numbers' => 'true',
] ]
?> ?>

44
plugin.syntaxhighlighter.php
View file

@ -34,13 +34,12 @@ function plugin_syntaxhighlighter_add($lang=null) {
$pdir=plugin_geturl('syntaxhighlighter'); $pdir=plugin_geturl('syntaxhighlighter');
// create array containing the used languages // create array containing the used languages
$languages[] = "{$lang}"; $languages[] = "{$lang}";
// remove unique // remove unique
$languages = array_unique($languages); $languages = array_unique($languages);
return $languages; return $languages;
} }
@ -51,7 +50,8 @@ function plugin_syntaxhighlighter_head() {
echo <<<PRISMJS echo <<<PRISMJS
<!-- start of prism.js header --> <!-- start of prism.js header -->
<link rel="stylesheet" type="text/css" href="{$pdir}res/prism-{$config['theme']}.css" /> <link rel="stylesheet" type="text/css" href="{$pdir}res/prism.plugins.css" />
<link rel="stylesheet" type="text/css" href="{$pdir}res/prism-{$config['theme']}.css" />
<!-- end of prism.js header --> <!-- end of prism.js header -->
PRISMJS; PRISMJS;
@ -63,26 +63,28 @@ add_action('wp_head', 'plugin_syntaxhighlighter_head');
function plugin_syntaxhighlighter_foot() { function plugin_syntaxhighlighter_foot() {
$config = include('config.php'); $config = include('config.php');
// convert the returned array into a json one, to have an easier time // convert the returned array into a json one, to have an easier time
// giving it to the javascript below // giving it to the javascript below
$used_languages = json_encode(plugin_syntaxhighlighter_add()); $used_languages = json_encode(plugin_syntaxhighlighter_add());
$pdir=plugin_geturl('syntaxhighlighter'); $pdir=plugin_geturl('syntaxhighlighter');
// javascript part // javascript part
echo <<<PRISMBOX
<!-- start of prism.js footer -->
<script type="text/javascript" src="{$pdir}res/prism.{$config['size']}.js"></script> echo <<<PRISMBOX
<!-- start of prism.js footer -->
<!-- include wrapping-function to wrap content of pre html-tags into code-tags, as said in https://prismjs.com/index.html#basic-usage --> <script type="text/javascript" src="{$pdir}res/prism.{$config['size']}.js"></script>
<script type="text/javascript" src="{$pdir}res/syntaxhighlighter-ng.js"></script>
<!-- call wrap_pre_tags() from syntaxhighlighter-ng.js --> <!-- include wrapping-function to wrap content of pre html-tags into code-tags, as said in https://prismjs.com/index.html#basic-usage -->
<script type="text/javascript"> <script type="text/javascript" src="{$pdir}res/syntaxhighlighter-ng.js"></script>
var used_languages = {$used_languages};
wrap_pre_tags(used_languages); <!-- call wrap_pre_tags() from syntaxhighlighter-ng.js -->
</script> <script type="text/javascript">
var used_languages = {$used_languages};
var enable_line_numbers = {$config['line-numbers']};
wrap_pre_tags(used_languages, enable_line_numbers);
</script>
<!-- end of prism.js footer --> <!-- end of prism.js footer -->
PRISMBOX; PRISMBOX;

4
res/prism.plugins.css Normal file
View file

@ -0,0 +1,4 @@
/* unescaped-markup */
[class*=lang-] script[type='text/plain'],[class*=language-] script[type='text/plain'],script[type='text/plain'][class*=lang-],script[type='text/plain'][class*=language-]{display:block;font:100% Consolas,Monaco,monospace;white-space:pre;overflow:auto}
/* line-numbers */
pre[class*=language-].line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre[class*=language-].line-numbers>code{position:relative;white-space:inherit}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}

9
res/prism.small.js
View file

File diff suppressed because one or more lines are too long

2
res/prism.tiny.js
View file

File diff suppressed because one or more lines are too long

13
res/syntaxhighlighter-ng.js
View file

@ -24,7 +24,14 @@
function wrap_pre_tags(used_languages) { function wrap_pre_tags(used_languages, enable_line_numbers) {
if ( enable_line_numbers == true )
{
enable_line_numbers = "line-numbers";
} else {
enable_line_numbers = "";
}
// iterate through all used_languages // iterate through all used_languages
for (let iUl = 0;iUl < used_languages.length; iUl++) for (let iUl = 0;iUl < used_languages.length; iUl++)
{ {
@ -44,9 +51,9 @@ function wrap_pre_tags(used_languages) {
{ {
// put the content of <pre> tag into org_html // put the content of <pre> tag into org_html
org_html = preElements[iEl].innerHTML; org_html = preElements[iEl].innerHTML;
// put <code> tag with 'language-' class and class for 'line-numbers' // put <code> tag with 'language-' class and plugin-classes
// prism.js plugin around the <pre> content // prism.js plugin around the <pre> content
new_html = "<code class=\"line-numbers language-" + used_languages[iUl] + "\">" + org_html + "</code>"; new_html = "<code class=\"language-" + used_languages[iUl] + " " + enable_line_numbers + "\">" + org_html + "</code>";
// write back our new html and enjoy syntax highlightning :) // write back our new html and enjoy syntax highlightning :)
preElements[iEl].innerHTML = new_html; preElements[iEl].innerHTML = new_html;
} }