Update hlJS

assets/js/system/modules/hl.js

@@ -5,14 +5,11 @@ export function init() {
 function highlight() {
   const $el = document.querySelectorAll('pre code');
   const $len = $el.length;
-  const $codeDataList = [];
-  const $codeList = [];
+  let $codeDataList = [], $codeList = [], $code = [], $lang =[];
 
   for (let $i = 0; $i < $len; ++$i) {
-    let $code = $el[$i];
-    let $lang = Array.from($code.classList).find((c) =>
-      c.startsWith('language-')
-    );
+    $code = $el[$i];
+    $lang = [...$code.classList].find(($c) => $c.startsWith('language-'));
 
     if (!$lang) $lang = 'plaintext';
 
@@ -28,14 +25,9 @@ function highlight() {
   $worker.onmessage = ($event) => {
     for (let $i = 0; $i < $len; ++$i) {
       $codeList[$i].innerHTML = $event.data[$i];
+      $codeList[$i].classList.add('hljs');
+      $codeList[$i].classList.add('language-' + $codeDataList[$i].language);
     }
-
-    // $codeList.forEach(($code, $i) => {
-    //   $code.innerHTML = $event.data[$i];
-    //   $code.setAttribute('data-highlighted', 'yes');
-    //   $code.classList.add('hljs');
-    //   $code.classList.add('language' + $codeDataList[$i].language);
-    // });
   }
 
   $worker.postMessage($codeDataList);

data/ui.yml

@@ -65,22 +65,24 @@ scripts:
       - 'js/system.js'
   code:
     internal:
-      - 'js/code/highlight.min.js'
-      - 'js/code/apache.min.js'
-      - 'js/code/autohotkey.min.js'
-      - 'js/code/autoit.min.js'
-      - 'js/code/awk.min.js'
-      - 'js/code/cmake.min.js'
-      - 'js/code/dns.min.js'
-      - 'js/code/dockerfile.min.js'
-      - 'js/code/dos.min.js'
-      - 'js/code/excel.min.js'
-      - 'js/code/http.min.js'
-      - 'js/code/nginx.min.js'
-      - 'js/code/pf.min.js'
-      - 'js/code/pgsql.min.js'
-      - 'js/code/powershell.min.js'
-      - 'js/code/properties.min.js'
-      - 'js/code/routeros.min.js'
-      - 'js/code/twig.min.js'
-      - 'js/code/vbscript.min.js'
+      core:
+        - 'js/code/highlight.min.js'
+      modules:
+        - 'js/code/apache.min.js'
+        - 'js/code/autohotkey.min.js'
+        - 'js/code/autoit.min.js'
+        - 'js/code/awk.min.js'
+        - 'js/code/cmake.min.js'
+        - 'js/code/dns.min.js'
+        - 'js/code/dockerfile.min.js'
+        - 'js/code/dos.min.js'
+        - 'js/code/excel.min.js'
+        - 'js/code/http.min.js'
+        - 'js/code/nginx.min.js'
+        - 'js/code/pf.min.js'
+        - 'js/code/pgsql.min.js'
+        - 'js/code/powershell.min.js'
+        - 'js/code/properties.min.js'
+        - 'js/code/routeros.min.js'
+        - 'js/code/twig.min.js'
+        - 'js/code/vbscript.min.js'

layouts/partials/head.html

@@ -36,9 +36,7 @@
 
 <!--[ theme-color ]-->
 {{ $uiTheme := ((resources.Get "js/theme.js") | minify) }}
-{{ $uiTheme = (($uiTheme) | resources.Fingerprint) }}
-<script src="{{ ($uiTheme.RelPermalink) }}" integrity="{{ ($uiTheme.Data.Integrity) }}"
-        crossorigin="anonymous"></script>
+<script src="{{ ($uiTheme.RelPermalink) }}" crossorigin="anonymous"></script>
 <!--[ / theme-color ]-->
 
 <!--[ ui-fonts ]-->

layouts/partials/ui.js.html

@@ -14,17 +14,23 @@
     {{ $bundle := slice }}
     {{ range . }}{{ $bundle = (($bundle) | append (resources.Get .)) }}{{ end }}
     {{ $bundle = (($bundle) | resources.Concat "js/vendor.bundle.js") }}
-    {{ $bundle = ((($bundle) | minify) | resources.Fingerprint) }}
-    <script src="{{ ($bundle.RelPermalink) }}" integrity="{{ ($bundle.Data.Integrity) }}"
-            crossorigin="anonymous" defer></script>
+    {{ $bundle = (($bundle) | minify) }}
+    <script src="{{ ($bundle.RelPermalink) }}" crossorigin="anonymous" defer></script>
 {{ end }}
 <!--[ / vendor-internal ]-->
 
 <!--[ code-internal ]-->
-{{ with ($scripts.code.internal) }}
+{{ with ($scripts.code.internal.core) }}
     {{ $bundle := slice }}
     {{ range . }}{{ $bundle = (($bundle) | append (resources.Get .)) }}{{ end }}
-    {{ $bundle = (($bundle) | resources.Concat "js/code.bundle.js") }}
+    {{ $bundle = (($bundle) | resources.Concat "js/code.core.bundle.js") }}
+    {{ $bundle = (($bundle) | minify) }}
+    <script src="{{ ($bundle.RelPermalink) }}" crossorigin="anonymous" defer></script>
+{{ end }}
+{{ with ($scripts.code.internal.modules) }}
+    {{ $bundle := slice }}
+    {{ range . }}{{ $bundle = (($bundle) | append (resources.Get .)) }}{{ end }}
+    {{ $bundle = (($bundle) | resources.Concat "js/code.modules.bundle.js") }}
     {{ $bundle = (($bundle) | minify) }}
     <script src="{{ ($bundle.RelPermalink) }}" crossorigin="anonymous" defer></script>
 {{ end }}
@@ -36,9 +42,8 @@
     {{ range . }}{{ $bundle = (($bundle) | append (resources.Get .)) }}{{ end }}
     {{ $bundle = ((($bundle) | resources.Concat "js/system.bundle.js") | js.Build) }}
     {{ $bundle = (($bundle) | resources.ExecuteAsTemplate ("js/system.bundle.js" | relLangURL) .) }}
-    {{ $bundle = ((($bundle) | minify) | resources.Fingerprint) }}
-    <script src="{{ ($bundle.RelPermalink) }}" integrity="{{ ($bundle.Data.Integrity) }}"
-            crossorigin="anonymous" defer></script>
+    {{ $bundle = (($bundle) | minify) }}
+    <script src="{{ ($bundle.RelPermalink) }}" crossorigin="anonymous" defer></script>
 {{ end }}
 <!--[ / system-internal ]-->
 

static/js/hl.worker.js

@@ -1,14 +1,16 @@
 onmessage = ($event) => {
   importScripts('/js/code.bundle.min.js');
-  const $result = [];
-  $event.data.forEach(($codeData) => {
-    let $language = $codeData.language;
-    if (self.hljs.getLanguage($language) === undefined) {
-      $language = 'plaintext';
-    }
-    $result.push(
-      self.hljs.highlight($codeData.code, {language: $language}).value
-    );
-  });
+  self.hljs.registerAliases(['rsc'], {languageName: 'routeros'});
+
+  const $len = $event.data.length;
+  let $result = [];
+
+  for (let $i = 0; $i < $len; ++$i) {
+    const $data = $event.data[$i];
+    const $lang = $data.language;
+    if (self.hljs.getLanguage($lang) === undefined) $lang = 'plaintext';
+    $result.push(self.hljs.highlight($data.code, {language: $lang}).value);
+  }
+
   postMessage($result);
-};
+}