@@ -2,12 +2,14 @@ import * as Base64 from "./base64.js";
22import { chroma } from "./chroma.js" ;
33
44document . addEventListener ( "DOMContentLoaded" , function ( ) {
5- var darkMode = ( window . matchMedia && window . matchMedia ( '(prefers-color-scheme: dark)' ) . matches ) ;
6- var style = document . createElement ( 'style' ) ;
7- var ref = document . querySelector ( 'script' ) ;
5+ var darkMode =
6+ window . matchMedia &&
7+ window . matchMedia ( "(prefers-color-scheme: dark)" ) . matches ;
8+ var style = document . createElement ( "style" ) ;
9+ var ref = document . querySelector ( "script" ) ;
810 ref . parentNode . insertBefore ( style , ref ) ;
911
10- var form = document . getElementById ( ' chroma' ) ;
12+ var form = document . getElementById ( " chroma" ) ;
1113 var textArea = form . elements [ "text" ] ;
1214 var styleSelect = form . elements [ "style" ] ;
1315 var languageSelect = form . elements [ "language" ] ;
@@ -16,49 +18,62 @@ document.addEventListener("DOMContentLoaded", function () {
1618 var output = document . getElementById ( "output" ) ;
1719 var htmlCheckbox = document . getElementById ( "html" ) ;
1820
19- ( document . querySelectorAll ( ' .notification .delete' ) || [ ] ) . forEach ( ( el ) => {
21+ ( document . querySelectorAll ( " .notification .delete" ) || [ ] ) . forEach ( ( el ) => {
2022 const notification = el . parentNode ;
21- el . addEventListener ( ' click' , ( ) => {
23+ el . addEventListener ( " click" , ( ) => {
2224 notification . parentNode . removeChild ( notification ) ;
2325 } ) ;
2426 } ) ;
2527
2628 async function renderServer ( formData ) {
27- return ( await fetch ( "api/render" , {
28- method : 'POST' ,
29- mode : 'cors' ,
30- cache : 'no-cache' ,
31- credentials : 'same-origin' ,
32- headers : {
33- 'X-CSRF-Token' : csrfToken ,
34- 'Content-Type' : 'application/json' ,
35- } ,
36- redirect : 'follow' ,
37- referrer : 'no-referrer' ,
38- body : JSON . stringify ( formData ) ,
39- } ) ) . json ( ) ;
29+ return (
30+ await fetch ( "api/render" , {
31+ method : "POST" ,
32+ mode : "cors" ,
33+ cache : "no-cache" ,
34+ credentials : "same-origin" ,
35+ headers : {
36+ "X-CSRF-Token" : csrfToken ,
37+ "Content-Type" : "application/json" ,
38+ } ,
39+ redirect : "follow" ,
40+ referrer : "no-referrer" ,
41+ body : JSON . stringify ( formData ) ,
42+ } )
43+ ) . json ( ) ;
4044 }
4145
4246 async function renderWasm ( formData ) {
43- return await chroma . highlight (
44- formData . text ,
45- formData . language ,
46- formData . style ,
47- formData . classes ,
48- ) ;
47+ return await chroma . highlight (
48+ formData . text ,
49+ formData . language ,
50+ formData . style ,
51+ formData . classes ,
52+ ) ;
4953 }
5054
5155 async function render ( formData ) {
52- return chroma !== null
53- ? renderWasm ( formData )
54- : renderServer ( formData ) ;
56+ return chroma !== null ? renderWasm ( formData ) : renderServer ( formData ) ;
5557 }
5658
57-
5859 // https://stackoverflow.com/a/37697925/7980
5960 function handleTab ( e ) {
60- var after , before , end , lastNewLine , changeLength , re , replace , selection , start , val ;
61- if ( ( e . charCode === 9 || e . keyCode === 9 ) && ! e . altKey && ! e . ctrlKey && ! e . metaKey ) {
61+ var after ,
62+ before ,
63+ end ,
64+ lastNewLine ,
65+ changeLength ,
66+ re ,
67+ replace ,
68+ selection ,
69+ start ,
70+ val ;
71+ if (
72+ ( e . charCode === 9 || e . keyCode === 9 ) &&
73+ ! e . altKey &&
74+ ! e . ctrlKey &&
75+ ! e . metaKey
76+ ) {
6277 e . preventDefault ( ) ;
6378 start = this . selectionStart ;
6479 end = this . selectionEnd ;
@@ -68,14 +83,14 @@ document.addEventListener("DOMContentLoaded", function () {
6883 replace = true ;
6984 if ( start !== end ) {
7085 selection = val . substring ( start , end ) ;
71- if ( ~ selection . indexOf ( '\n' ) ) {
86+ if ( ~ selection . indexOf ( "\n" ) ) {
7287 replace = false ;
7388 changeLength = 0 ;
74- lastNewLine = before . lastIndexOf ( '\n' ) ;
89+ lastNewLine = before . lastIndexOf ( "\n" ) ;
7590 if ( ! ~ lastNewLine ) {
7691 selection = before + selection ;
7792 changeLength = before . length ;
78- before = '' ;
93+ before = "" ;
7994 } else {
8095 selection = before . substring ( lastNewLine ) + selection ;
8196 changeLength = before . length - lastNewLine ;
@@ -87,9 +102,9 @@ document.addEventListener("DOMContentLoaded", function () {
87102 start -- ;
88103 changeLength -- ;
89104 }
90- selection = selection . replace ( re , '$1' ) ;
105+ selection = selection . replace ( re , "$1" ) ;
91106 } else {
92- selection = selection . replace ( / ( \n | ^ ) / g, ' $1\t' ) ;
107+ selection = selection . replace ( / ( \n | ^ ) / g, " $1\t" ) ;
93108 start ++ ;
94109 changeLength ++ ;
95110 }
@@ -99,7 +114,7 @@ document.addEventListener("DOMContentLoaded", function () {
99114 }
100115 }
101116 if ( replace && ! e . shiftKey ) {
102- this . value = before + '\t' + after ;
117+ this . value = before + "\t" + after ;
103118 this . selectionStart = this . selectionEnd = start + 1 ;
104119 }
105120 }
@@ -109,7 +124,8 @@ document.addEventListener("DOMContentLoaded", function () {
109124 function debounce ( func , wait , immediate ) {
110125 var timeout ;
111126 return function ( ) {
112- var context = this , args = arguments ;
127+ var context = this ;
128+ var args = arguments ;
113129 var later = function ( ) {
114130 timeout = null ;
115131 if ( ! immediate ) func . apply ( context , args ) ;
@@ -123,11 +139,11 @@ document.addEventListener("DOMContentLoaded", function () {
123139
124140 function getFormJSON ( ) {
125141 return {
126- " language" : languageSelect . value ,
127- " style" : styleSelect . value ,
128- " text" : textArea . value ,
129- " classes" : htmlCheckbox . checked ,
130- }
142+ language : languageSelect . value ,
143+ style : styleSelect . value ,
144+ text : textArea . value ,
145+ classes : htmlCheckbox . checked ,
146+ } ;
131147 }
132148
133149 async function update ( event ) {
@@ -145,12 +161,12 @@ document.addEventListener("DOMContentLoaded", function () {
145161 output . innerHTML = value . html ;
146162 }
147163 } catch ( error ) {
148- console . error ( ' Error highlighting code:' , error ) ;
164+ console . error ( " Error highlighting code:" , error ) ;
149165 // Fallback: display plain text
150166 if ( htmlCheckbox . checked ) {
151167 output . innerText = textArea . value ;
152168 } else {
153- output . innerHTML = ' <pre>' + textArea . value + ' </pre>' ;
169+ output . innerHTML = " <pre>" + textArea . value + " </pre>" ;
154170 }
155171 }
156172
@@ -160,7 +176,7 @@ document.addEventListener("DOMContentLoaded", function () {
160176 }
161177
162178 function share ( event ) {
163- let data = JSON . stringify ( getFormJSON ( ) )
179+ let data = JSON . stringify ( getFormJSON ( ) ) ;
164180 data = Base64 . encodeURI ( data ) ;
165181 location . hash = "#" + data ;
166182 try {
@@ -172,26 +188,29 @@ document.addEventListener("DOMContentLoaded", function () {
172188 }
173189
174190 if ( location . hash ) {
175- let json = Base64 . decode ( location . hash . substring ( 1 ) )
191+ let json = Base64 . decode ( location . hash . substring ( 1 ) ) ;
176192 json = JSON . parse ( json ) ;
177193 textArea . value = json . text ;
178194 languageSelect . value = json . language ;
179195 styleSelect . value = json . style ;
180196 htmlCheckbox . checked = json . classes ;
181- update ( new Event ( ' change' ) ) ;
182- } else if ( darkMode ) {
183- styleSelect . value = "monokai" ;
184- update ( new Event ( "change" ) ) ;
197+ update ( new Event ( " change" ) ) ;
198+ } else if ( darkMode ) {
199+ styleSelect . value = "monokai" ;
200+ update ( new Event ( "change" ) ) ;
185201 }
186202
187203 var eventHandler = ( event ) => update ( event ) ;
188- var debouncedEventHandler = debounce ( eventHandler , chroma === null ? 250 : 100 ) ;
189-
190- languageSelect . addEventListener ( 'change' , eventHandler ) ;
191- styleSelect . addEventListener ( 'change' , eventHandler ) ;
192- htmlCheckbox . addEventListener ( 'change' , eventHandler ) ;
193- copyButton . addEventListener ( 'click' , share ) ;
194-
195- textArea . addEventListener ( 'keydown' , handleTab ) ;
196- textArea . addEventListener ( 'change' , debouncedEventHandler ) ;
204+ var debouncedEventHandler = debounce (
205+ eventHandler ,
206+ chroma === null ? 250 : 100 ,
207+ ) ;
208+
209+ languageSelect . addEventListener ( "change" , eventHandler ) ;
210+ styleSelect . addEventListener ( "change" , eventHandler ) ;
211+ htmlCheckbox . addEventListener ( "change" , eventHandler ) ;
212+ copyButton . addEventListener ( "click" , share ) ;
213+
214+ textArea . addEventListener ( "keydown" , handleTab ) ;
215+ textArea . addEventListener ( "change" , debouncedEventHandler ) ;
197216} ) ;
0 commit comments