From e9df76a681667fe57a320b5d1c5b7c567c78d3f6 Mon Sep 17 00:00:00 2001
From: Djeeberjr <djeeberjr@gmail.com>
Date: Wed, 11 May 2022 00:38:41 +0200
Subject: [PATCH] syntax hightlighting

---
 package-lock.json              |  32 ++-
 package.json                   |  11 +-
 web/opener/Text.svelte         |  37 +--
 web/opener/getLangFromShare.ts | 420 +++++++++++++++++++++++++++++++++
 4 files changed, 479 insertions(+), 21 deletions(-)
 create mode 100644 web/opener/getLangFromShare.ts

diff --git a/package-lock.json b/package-lock.json
index f30fb3e..1241a15 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,7 +8,8 @@
       "name": "s3-share",
       "version": "1.0.0",
       "dependencies": {
-        "sirv-cli": "^2.0.0"
+        "sirv-cli": "^2.0.0",
+        "svelte-highlight": "^6.0.1"
       },
       "devDependencies": {
         "@rollup/plugin-commonjs": "^17.0.0",
@@ -587,6 +588,14 @@
         "node": ">=4"
       }
     },
+    "node_modules/highlight.js": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.5.0.tgz",
+      "integrity": "sha512-SM6WDj5/C+VfIY8pZ6yW6Xa0Fm1tniYVYWYW1Q/DcMnISZFrC3aQAZZZFAAZtybKNrGId3p/DNbFTtcTXXgYBw==",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
     "node_modules/import-fresh": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -1375,6 +1384,14 @@
         "svelte": "^3.24.0"
       }
     },
+    "node_modules/svelte-highlight": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/svelte-highlight/-/svelte-highlight-6.0.1.tgz",
+      "integrity": "sha512-FOe0ePVoP59VO7e0cAXZ7OMooXEuC/lh0FK4Zr++3qRzNWm14a/ljICBTGZXqD+/l3mAIB5EzkVu3Nc/TZEyuA==",
+      "dependencies": {
+        "highlight.js": "11.5.0"
+      }
+    },
     "node_modules/svelte-preprocess": {
       "version": "4.10.6",
       "resolved": "https://registry.npmjs.org/svelte-preprocess/-/svelte-preprocess-4.10.6.tgz",
@@ -2004,6 +2021,11 @@
       "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
       "dev": true
     },
+    "highlight.js": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.5.0.tgz",
+      "integrity": "sha512-SM6WDj5/C+VfIY8pZ6yW6Xa0Fm1tniYVYWYW1Q/DcMnISZFrC3aQAZZZFAAZtybKNrGId3p/DNbFTtcTXXgYBw=="
+    },
     "import-fresh": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -2585,6 +2607,14 @@
         "typescript": "*"
       }
     },
+    "svelte-highlight": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/svelte-highlight/-/svelte-highlight-6.0.1.tgz",
+      "integrity": "sha512-FOe0ePVoP59VO7e0cAXZ7OMooXEuC/lh0FK4Zr++3qRzNWm14a/ljICBTGZXqD+/l3mAIB5EzkVu3Nc/TZEyuA==",
+      "requires": {
+        "highlight.js": "11.5.0"
+      }
+    },
     "svelte-preprocess": {
       "version": "4.10.6",
       "resolved": "https://registry.npmjs.org/svelte-preprocess/-/svelte-preprocess-4.10.6.tgz",
diff --git a/package.json b/package.json
index 9deb191..d181753 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,8 @@
   "devDependencies": {
     "@rollup/plugin-commonjs": "^17.0.0",
     "@rollup/plugin-node-resolve": "^11.0.0",
+    "@rollup/plugin-typescript": "^8.0.0",
+    "@tsconfig/svelte": "^2.0.0",
     "rollup": "^2.3.4",
     "rollup-plugin-css-only": "^3.1.0",
     "rollup-plugin-livereload": "^2.0.0",
@@ -19,12 +21,11 @@
     "svelte": "^3.0.0",
     "svelte-check": "^2.0.0",
     "svelte-preprocess": "^4.0.0",
-    "@rollup/plugin-typescript": "^8.0.0",
-    "typescript": "^4.0.0",
     "tslib": "^2.0.0",
-    "@tsconfig/svelte": "^2.0.0"
+    "typescript": "^4.0.0"
   },
   "dependencies": {
-    "sirv-cli": "^2.0.0"
+    "sirv-cli": "^2.0.0",
+    "svelte-highlight": "^6.0.1"
   }
-}
\ No newline at end of file
+}
diff --git a/web/opener/Text.svelte b/web/opener/Text.svelte
index eeca54a..7c70414 100644
--- a/web/opener/Text.svelte
+++ b/web/opener/Text.svelte
@@ -1,31 +1,38 @@
 <script lang="ts">
-import { onMount } from "svelte";
+	import Highlight from "svelte-highlight";
+	import highlightStyle from "svelte-highlight/styles/vs2015";
+	import getLangFromShare from "./getLangFromShare";
+
 	export let contentType: string;
 	export let filename: string;
 	export let slug: string;
 
-	let content = "";
-
-	onMount(async () => {
+	async function loadShare() {
 		const res = await fetch(`/s/${slug}`);
-		content = await res.text();
-	});
+		return await res.text();
+	}
+
+	async function loadLang() {
+		return await getLangFromShare(contentType,filename).then(v => v.default);
+	}
 </script>
 
+
+<svelte:head>
+	{@html highlightStyle}
+</svelte:head>
+
 <div class="container" >
 	<header>{filename}</header>
-	<pre><code>{ content }</code></pre>
+	
+	{#await Promise.all([loadShare(), loadLang()])}
+		Loading...
+	{:then v} 
+		<Highlight language={v[1]} code={v[0]} />
+	{/await}
 </div>
 
 <style>
-	code{
-		color: #c9d1d9;
-	}
-
-	pre{
-		padding: 1rem;
-	}
-
 	header{
 		font-size: 1.5rem;
 		font-weight: bold;
diff --git a/web/opener/getLangFromShare.ts b/web/opener/getLangFromShare.ts
new file mode 100644
index 0000000..0591941
--- /dev/null
+++ b/web/opener/getLangFromShare.ts
@@ -0,0 +1,420 @@
+export default function getLangFromShare(contentType: string, filename: string) {
+    switch (contentType) {
+        case "application/json":
+        case "application/ld+json":
+            return import("svelte-highlight/languages/json");
+        case "application/xhtml+xml":
+        case "application/xml":
+            return import("svelte-highlight/languages/xml");
+    }
+
+    const ext = filename.split(".").pop().toLowerCase();
+
+    switch (ext) {
+        // case "":
+        //     return import("svelte-highlight/languages/1c");
+        // case "":
+        //     return import("svelte-highlight/languages/abnf");
+        // case "":
+        //     return import("svelte-highlight/languages/accesslog");
+        case "actionscript":
+            return import("svelte-highlight/languages/actionscript");
+        case "ada":
+            return import("svelte-highlight/languages/ada");
+        // case "":
+        //     return import("svelte-highlight/languages/angelscript");
+        // case "":
+        //     return import("svelte-highlight/languages/apache");
+        // case "":
+        //     return import("svelte-highlight/languages/applescript");
+        // case "":
+        //     return import("svelte-highlight/languages/arcade");
+        // case "ino":
+        //     return import("svelte-highlight/languages/arduino");
+        // case "":
+        //     return import("svelte-highlight/languages/armasm");
+        // case "":
+        //     return import("svelte-highlight/languages/asciidoc");
+        // case "":
+        //     return import("svelte-highlight/languages/aspectj");
+        case "ahk":
+            return import("svelte-highlight/languages/autohotkey");
+        // case "":
+        //     return import("svelte-highlight/languages/autoit");
+        // case "":
+        //     return import("svelte-highlight/languages/avrasm");
+        // case "":
+        //     return import("svelte-highlight/languages/awk");
+        // case "":
+        //     return import("svelte-highlight/languages/axapta");
+        case "sh":
+            return import("svelte-highlight/languages/bash");
+        // case "":
+        //     return import("svelte-highlight/languages/basic");
+        // case "":
+        //     return import("svelte-highlight/languages/bnf");
+        case "bf":
+            return import("svelte-highlight/languages/brainfuck");
+        case "c":
+        case "h":
+            return import("svelte-highlight/languages/c");
+        // case "":
+        //     return import("svelte-highlight/languages/cal");
+        // case "":
+        //     return import("svelte-highlight/languages/capnproto");
+        // case "":
+        //     return import("svelte-highlight/languages/ceylon");
+        // case "":
+        //     return import("svelte-highlight/languages/clean");
+        // case "":
+        //     return import("svelte-highlight/languages/clojure-repl");
+        case "clj":
+        case "cljs": 
+        case "cljc":
+        case ".edn":
+            return import("svelte-highlight/languages/clojure");
+        case "cmake":
+            return import("svelte-highlight/languages/cmake");
+        case "coffee":
+        case "litcoffee":
+            return import("svelte-highlight/languages/coffeescript");
+        // case "":
+        //     return import("svelte-highlight/languages/coq");
+        // case "":
+        //     return import("svelte-highlight/languages/cos");
+        case "cpp":
+            return import("svelte-highlight/languages/cpp");
+        // case "":
+        //     return import("svelte-highlight/languages/crmsh");
+        // case "":
+        //     return import("svelte-highlight/languages/crystal");
+        case "cs":
+            return import("svelte-highlight/languages/csharp");
+        // case "":
+        //     return import("svelte-highlight/languages/csp");
+        case "css":
+            return import("svelte-highlight/languages/css");
+        // case "":
+        //     return import("svelte-highlight/languages/d");
+        case "dart":
+            return import("svelte-highlight/languages/dart");
+        // case "":
+        //     return import("svelte-highlight/languages/delphi");
+        case "diff":
+            return import("svelte-highlight/languages/diff");
+        // case "":
+        //     return import("svelte-highlight/languages/django");
+        // case "":
+        //     return import("svelte-highlight/languages/dns");
+        // case "":
+        //     return import("svelte-highlight/languages/dos");
+        // case "":
+        //     return import("svelte-highlight/languages/dsconfig");
+        // case "":
+        //     return import("svelte-highlight/languages/dts");
+        // case "":
+        //     return import("svelte-highlight/languages/dust");
+        // case "":
+        //     return import("svelte-highlight/languages/ebnf");
+        case "ex":
+        case "exs":
+            return import("svelte-highlight/languages/elixir");
+        case "elm":
+            return import("svelte-highlight/languages/elm");
+        // case "":
+        //     return import("svelte-highlight/languages/erb");
+        // case "":
+        //     return import("svelte-highlight/languages/erlang-repl");
+        // case "":
+        //     return import("svelte-highlight/languages/erlang");
+        // case "":
+        //     return import("svelte-highlight/languages/excel");
+        // case "":
+        //     return import("svelte-highlight/languages/fix");
+        // case "":
+        //     return import("svelte-highlight/languages/flix");
+        // case "":
+        //     return import("svelte-highlight/languages/fortran");
+        case "fs":
+        case "fsi":
+        case "fsx":
+        case "fsscript":
+            return import("svelte-highlight/languages/fsharp");
+        // case "":
+        //     return import("svelte-highlight/languages/gams");
+        // case "":
+        //     return import("svelte-highlight/languages/gauss");
+        // case "":
+        //     return import("svelte-highlight/languages/gcode");
+        // case "":
+        //     return import("svelte-highlight/languages/gherkin");
+        // case "":
+        //     return import("svelte-highlight/languages/glsl");
+        // case "":
+        //     return import("svelte-highlight/languages/gml");
+        case "go":
+            return import("svelte-highlight/languages/go");
+        // case "":
+        //     return import("svelte-highlight/languages/golo");
+        // case "":
+        //     return import("svelte-highlight/languages/gradle");
+        // case "":
+        //     return import("svelte-highlight/languages/graphql");
+        // case "":
+        //     return import("svelte-highlight/languages/groovy");
+        // case "":
+        //     return import("svelte-highlight/languages/haml");
+        // case "":
+        //     return import("svelte-highlight/languages/handlebars");
+        case "hs":
+        case "lhs":
+            return import("svelte-highlight/languages/haskell");
+        case "hx":
+            return import("svelte-highlight/languages/haxe");
+        // case "":
+        //     return import("svelte-highlight/languages/hsp");
+        // case "":
+        //     return import("svelte-highlight/languages/http");
+        // case "":
+        //     return import("svelte-highlight/languages/hy");
+        // case "":
+        //     return import("svelte-highlight/languages/inform7");
+        case "ini":
+            return import("svelte-highlight/languages/ini");
+        // case "":
+        //     return import("svelte-highlight/languages/irpf90");
+        // case "":
+        //     return import("svelte-highlight/languages/isbl");
+        case "java":
+            return import("svelte-highlight/languages/java");
+        case "js":
+            return import("svelte-highlight/languages/javascript");
+        // case "":
+        //     return import("svelte-highlight/languages/jboss-cli");
+        case "json":
+            return import("svelte-highlight/languages/json");
+        // case "":
+        //     return import("svelte-highlight/languages/julia-repl");
+        // case "":
+        //     return import("svelte-highlight/languages/julia");
+        // case "":
+        //     return import("svelte-highlight/languages/kotlin");
+        // case "":
+        //     return import("svelte-highlight/languages/lasso");
+        // case "":
+        //     return import("svelte-highlight/languages/latex");
+        // case "":
+        //     return import("svelte-highlight/languages/ldif");
+        // case "":
+        //     return import("svelte-highlight/languages/leaf");
+        // case "":
+        //     return import("svelte-highlight/languages/less");
+        // case "":
+        //     return import("svelte-highlight/languages/lisp");
+        // case "":
+        //     return import("svelte-highlight/languages/livecodeserver");
+        // case "":
+        //     return import("svelte-highlight/languages/livescript");
+        // case "":
+        //     return import("svelte-highlight/languages/llvm");
+        // case "":
+        //     return import("svelte-highlight/languages/lsl");
+        case "lua":
+            return import("svelte-highlight/languages/lua");
+        case "md":
+            return import("svelte-highlight/languages/markdown");
+        // case "":
+        //     return import("svelte-highlight/languages/mathematica");
+        // case "":
+        //     return import("svelte-highlight/languages/matlab");
+        // case "":
+        //     return import("svelte-highlight/languages/maxima");
+        // case "":
+        //     return import("svelte-highlight/languages/mel");
+        // case "":
+        //     return import("svelte-highlight/languages/mercury");
+        // case "":
+        //     return import("svelte-highlight/languages/mipsasm");
+        // case "":
+        //     return import("svelte-highlight/languages/mizar");
+        // case "":
+        //     return import("svelte-highlight/languages/mojolicious");
+        // case "":
+        //     return import("svelte-highlight/languages/monkey");
+        // case "":
+        //     return import("svelte-highlight/languages/moonscript");
+        // case "":
+        //     return import("svelte-highlight/languages/n1ql");
+        // case "":
+        //     return import("svelte-highlight/languages/nestedtext");
+        // case "":
+        //     return import("svelte-highlight/languages/nginx");
+        // case "":
+        //     return import("svelte-highlight/languages/nim");
+        // case "":
+        //     return import("svelte-highlight/languages/nix");
+        // case "":
+        //     return import("svelte-highlight/languages/node-repl");
+        // case "":
+        //     return import("svelte-highlight/languages/nsis");
+        case "h":
+        case "m":
+        case "mm":
+            return import("svelte-highlight/languages/objectivec");
+        // case "":
+        //     return import("svelte-highlight/languages/ocaml");
+        // case "":
+        //     return import("svelte-highlight/languages/openscad");
+        // case "":
+        //     return import("svelte-highlight/languages/oxygene");
+        // case "":
+        //     return import("svelte-highlight/languages/parser3");
+        case "plx":
+        case "pl":
+        case "pm":
+        case "xs":
+            return import("svelte-highlight/languages/perl");
+        // case "":
+        //     return import("svelte-highlight/languages/pf");
+        // case "":
+        //     return import("svelte-highlight/languages/pgsql");
+        // case "":
+        //     return import("svelte-highlight/languages/php-template");
+        case "php":
+            return import("svelte-highlight/languages/php");
+        case "txt":
+            return import("svelte-highlight/languages/plaintext");
+        // case "":
+        //     return import("svelte-highlight/languages/pony");
+        case "ps1":
+            return import("svelte-highlight/languages/powershell");
+        // case "":
+        //     return import("svelte-highlight/languages/processing");
+        // case "":
+        //     return import("svelte-highlight/languages/profile");
+        // case "":
+        //     return import("svelte-highlight/languages/prolog");
+        // case "":
+        //     return import("svelte-highlight/languages/properties");
+        case "protobuf":
+            return import("svelte-highlight/languages/protobuf");
+        // case "":
+        //     return import("svelte-highlight/languages/puppet");
+        // case "":
+        //     return import("svelte-highlight/languages/purebasic");
+        // case "":
+        //     return import("svelte-highlight/languages/python-repl");
+        case "py":
+            return import("svelte-highlight/languages/python");
+        // case "":
+        //     return import("svelte-highlight/languages/q");
+        // case "":
+        //     return import("svelte-highlight/languages/qml");
+        case "r":
+            return import("svelte-highlight/languages/r");
+        // case "":
+        //     return import("svelte-highlight/languages/reasonml");
+        // case "":
+        //     return import("svelte-highlight/languages/rib");
+        // case "":
+        //     return import("svelte-highlight/languages/roboconf");
+        // case "":
+        //     return import("svelte-highlight/languages/routeros");
+        // case "":
+        //     return import("svelte-highlight/languages/rsl");
+        case "rb":
+            return import("svelte-highlight/languages/ruby");
+        // case "":
+        //     return import("svelte-highlight/languages/ruleslanguage");
+        case "rs":
+            return import("svelte-highlight/languages/rust");
+        // case "":
+        //     return import("svelte-highlight/languages/sas");
+        // case "":
+        //     return import("svelte-highlight/languages/scala");
+        // case "":
+        //     return import("svelte-highlight/languages/scheme");
+        // case "":
+        //     return import("svelte-highlight/languages/scilab");
+        case "scss":
+            return import("svelte-highlight/languages/scss");
+        case "sh":
+            return import("svelte-highlight/languages/shell");
+        // case "":
+        //     return import("svelte-highlight/languages/smali");
+        // case "":
+        //     return import("svelte-highlight/languages/smalltalk");
+        // case "":
+        //     return import("svelte-highlight/languages/sml");
+        case "sqf":
+            return import("svelte-highlight/languages/sqf");
+        case "sql":
+            return import("svelte-highlight/languages/sql");
+        // case "":
+        //     return import("svelte-highlight/languages/stan");
+        // case "":
+        //     return import("svelte-highlight/languages/stata");
+        // case "":
+        //     return import("svelte-highlight/languages/step21");
+        // case "":
+        //     return import("svelte-highlight/languages/stylus");
+        // case "":
+        //     return import("svelte-highlight/languages/subunit");
+        case "swift":
+            return import("svelte-highlight/languages/swift");
+        // case "":
+        //     return import("svelte-highlight/languages/taggerscript");
+        // case "":
+        //     return import("svelte-highlight/languages/tap");
+        // case "":
+        //     return import("svelte-highlight/languages/tcl");
+        // case "":
+        //     return import("svelte-highlight/languages/thrift");
+        // case "":
+        //     return import("svelte-highlight/languages/tp");
+        // case "":
+        //     return import("svelte-highlight/languages/twig");
+        case "ts":
+            return import("svelte-highlight/languages/typescript");
+        // case "":
+        //     return import("svelte-highlight/languages/vala");
+        // case "":
+        //     return import("svelte-highlight/languages/vbnet");
+        // case "":
+        //     return import("svelte-highlight/languages/vbscript-html");
+        case "vbs":
+            return import("svelte-highlight/languages/vbscript");
+        // case "":
+        //     return import("svelte-highlight/languages/verilog");
+        // case "":
+        //     return import("svelte-highlight/languages/vhdl");
+        // case "":
+        //     return import("svelte-highlight/languages/vim");
+        // case "":
+        //     return import("svelte-highlight/languages/wasm");
+        // case "":
+        //     return import("svelte-highlight/languages/wren");
+        // case "":
+        //     return import("svelte-highlight/languages/x86asm");
+        // case "":
+        //     return import("svelte-highlight/languages/xl");
+        // case "":
+        //     return import("svelte-highlight/languages/xml");
+        // case "":
+        //     return import("svelte-highlight/languages/xquery");
+        case "yml":
+        case "yaml":
+            return import("svelte-highlight/languages/yaml");
+        // case "":
+        //     return import("svelte-highlight/languages/zephir");
+    }
+
+    switch (filename) {
+        case "Dockerfile":
+            return import("svelte-highlight/languages/dockerfile");
+        case "Makefile":
+            return import("svelte-highlight/languages/makefile");
+    }
+
+    return import("svelte-highlight/languages/plaintext");
+}