lewdev · June 26, 2026 18:57
diff --git a/#README.md b/#README.md
diff --git a/code-editor-src.html b/code-editor-src.html
 <!DOCTYPE html>
 <head>
  <link rel=icon href='data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 99 99"><text y="85" font-size="72">&#128187;</text></svg>'>
  <title>code</title>
  <style>
  *{color-scheme:dark;box-sizing:border-box;margin:0}
  #d,#f{width:calc(50% - 2px);height:calc(100vh - 2px);vertical-align:top}
  .h>#d,.h>#f{width:100vh;height:50vh}
  #p{position:fixed;bottom:1px;background:#333}
  .q>#d,.r>#f{width:100%}
  .r>#d,.q>#f{display:none}
  </style>
 </head>
 <body id=b>
 <textarea id=d spellcheck=false style=resize:none;padding-bottom:2em>
 close
 stop
 focus
 blur
 open
 alert
 confirm
 prompt
 1 print
 2 postMessage
 3 captureEvents
 4 releaseEvents
 5 getSelection
 6 getComputedStyle
 7 matchMedia
 8 moveTo
 9 moveBy
 0 resizeTo
 resizeBy
 scroll
 scrollTo
 scrollBy</textarea>
 <iframe id=f></iframe>
 <p id=p></p>
 <script>
 // h = changing layout
 // Q = setTimeout
 // N = edit history index
 h = Q = N = 0,

 // set cursor & highlighted positions
 S = "selection",
 O = (a, b = a) => (A = d[S + "Start"] = a, B = d[S + "End"] = b),

 F = s => s.split`\n`,
 J = a => a.join`\n`,
 W = [d.value], // edit history
 M = "()[]{}\"\"''``",
 X = v => V = d.value = v,

 d.onkeydown = d.onclick = e => (
  P = _ => e.preventDefault(),
  A = d[S + "Start"],
  B = d[S + "End"],
  V = d.value,
  H = n => V.substr(0, n),
  K = e.key,
  C = e.keyCode,
  I = e.shiftKey,
  U = C == 38, // up key pressed
  D = C == 40, // down key pressed
  R = F(V),
  T = R.length,
  u = 0,

  // get cursor position by line
  G = L => F(V).reduce((t, l, i) => (i < L ? l.length + 1 : 0) + t, 0),

  Y = F(H(A)).length - 2, //selected start line #
  E = F(H(B)),
  Z = E.length, // selected end line #

  // Ctrl + Enter runs code
  C == 10 && (f.srcdoc = V),

  e.ctrlKey && (
    // Ctrl + Enter runs code
    C == 13 && (f.srcdoc = V),

    // goto line by pressing Ctrl + L
    "l" == K && (
      P(),
      L = parseInt(prompt("Goto line")),
      L = L < 0 ? 0 : L < T ? L : T,
      m = J(R.slice(0, L)).length,
      O(m - R[L - 1].length, m),
      E = F(H(B))
    ),

    // duplicate line
    "d" == K && (
      P(),
      R.splice(Y + 1, 0, J(R.filter((_, i) => i > Y && i < Z))),
      X(J(R)),
      O(G(Y + 1), G(Z) - 1)
    ),

    // scroll up/down
    (U || D) && P(d.scrollTop += U ? -15 : D ? 15 : 0),

    // move line up/down (WIP)
    /*
    (I && (U || D)) && (
      P(),
      n = U ? -1 : 1,
      (U && Y + 1 > 0 || D && Z < T) && (
        V = d.value = (U ? R.reduce((t, l, i) => (
          (i >= Y + 1 && i < Z) && (
            W = t[i],
            t[i] = t[i + n],
            t[i + n] = W
          ),
          t
        ), R) : R.map((l, k) => (
          i = T - k,
          (i >= Y + 1 && i < Z) && (
            W = R[i + n],
            R[i + n] = R[i],
            R[i] = W
          ),
          R[k]
        )).join`\n`,
        O(G(Y + 1 + n), G(Z + n) - 1),
        E = F(V.substr(0, A))
      ))
    ),
    */
    // save as a file
    "s" == K && (
      P(a = document.createElement`a`),
      (m = prompt("Filename", "f.html")) && (
        a.href = URL.createObjectURL(new Blob([V], { type: "text/plain" })),
        a.click(a.download = m),
        URL.revokeObjectURL(a.href)
      )
    ),
    // undo & redo
    (((k = "z" == K) && N > 0) || ("y" == K && N < W.length - 1)) && (
      P(),
      v = W[k ? --N : ++N], // new value
      f = V.length - v.length, // new and old value length diff
      V = d.value = v,
      O(A - f), // try to keep the cursor where it was
      // TODO: I can improve by moving cursor to where the change happened
      u = 1 // don't update edit history at the end
    )
  ),
  // Tab / Shift + Tab add or remove two spaces on selected lines
  "Tab" == K && (
    P(),
    X(J(R.map((l, i) => i > Y && i < Z ? I ? l.replace(/^ {1,2}/,"") : "  " + l : l))),
    O(G(Y + 1), G(Z) - 1)
  ),

  //"()[]{}<>" enclose parenthesis
  k = M.indexOf(K)) % 2 == 0 && (
    P(),
    X(V.slice(0, A) + K + V.slice(A, B) + M[k + 1] + V.slice(B)),
    O(A + 1, B + 1)
  ),

  // update edit history
  V != W[N] && !u && (W = W.slice(0, N + 1), W[++N] = V),

  // show cursor info
  p.innerHTML = `<button onclick=d.click(b.className='mhqr'[++h%4])>H</button> `+(h%4==3?"":`Ln:${E.length}, Col:${E.pop().length+1}, ${A == B ? 'Pos:' + B : 'Sel:' + (B - A)}, Len:${V.length}`)
 )
 </script></body>
	<!DOCTYPE html>
	<head>
	<link rel=icon href='data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 99 99"><text y="85" font-size="72">💻</text></svg>'>
	<title>code</title>
	<style>
	*{color-scheme:dark;box-sizing:border-box;margin:0}
	#d,#f{width:calc(50% - 2px);height:calc(100vh - 2px);vertical-align:top}
	.h>#d,.h>#f{width:100vh;height:50vh}
	#p{position:fixed;bottom:1px;background:#333}
	.q>#d,.r>#f{width:100%}
	.r>#d,.q>#f{display:none}
	</style>
	</head>
	<body id=b>
	<textarea id=d spellcheck=false style=resize:none;padding-bottom:2em>
	close
	stop
	focus
	blur
	open
	alert
	confirm
	prompt
	1 print
	2 postMessage
	3 captureEvents
	4 releaseEvents
	5 getSelection
	6 getComputedStyle
	7 matchMedia
	8 moveTo
	9 moveBy
	0 resizeTo
	resizeBy
	scroll
	scrollTo
	scrollBy</textarea>
	<iframe id=f></iframe>
	<p id=p></p>
	<script>
	// h = changing layout
	// Q = setTimeout
	// N = edit history index
	h = Q = N = 0,

	// set cursor & highlighted positions
	S = "selection",
	O = (a, b = a) => (A = d[S + "Start"] = a, B = d[S + "End"] = b),

	F = s => s.split`\n`,
	J = a => a.join`\n`,
	W = [d.value], // edit history
	M = "()[]{}\"\"''``",
	X = v => V = d.value = v,

	d.onkeydown = d.onclick = e => (
	P = _ => e.preventDefault(),
	A = d[S + "Start"],
	B = d[S + "End"],
	V = d.value,
	H = n => V.substr(0, n),
	K = e.key,
	C = e.keyCode,
	I = e.shiftKey,
	U = C == 38, // up key pressed
	D = C == 40, // down key pressed
	R = F(V),
	T = R.length,
	u = 0,

	// get cursor position by line
	G = L => F(V).reduce((t, l, i) => (i < L ? l.length + 1 : 0) + t, 0),

	Y = F(H(A)).length - 2, //selected start line #
	E = F(H(B)),
	Z = E.length, // selected end line #

	// Ctrl + Enter runs code
	C == 10 && (f.srcdoc = V),

	e.ctrlKey && (
	// Ctrl + Enter runs code
	C == 13 && (f.srcdoc = V),

	// goto line by pressing Ctrl + L
	"l" == K && (
	P(),
	L = parseInt(prompt("Goto line")),
	L = L < 0 ? 0 : L < T ? L : T,
	m = J(R.slice(0, L)).length,
	O(m - R[L - 1].length, m),
	E = F(H(B))
	),

	// duplicate line
	"d" == K && (
	P(),
	R.splice(Y + 1, 0, J(R.filter((_, i) => i > Y && i < Z))),
	X(J(R)),
	O(G(Y + 1), G(Z) - 1)
	),

	// scroll up/down
	(U \|\| D) && P(d.scrollTop += U ? -15 : D ? 15 : 0),

	// move line up/down (WIP)
	/*
	(I && (U \|\| D)) && (
	P(),
	n = U ? -1 : 1,
	(U && Y + 1 > 0 \|\| D && Z < T) && (
	V = d.value = (U ? R.reduce((t, l, i) => (
	(i >= Y + 1 && i < Z) && (
	W = t[i],
	t[i] = t[i + n],
	t[i + n] = W
	),
	t
	), R) : R.map((l, k) => (
	i = T - k,
	(i >= Y + 1 && i < Z) && (
	W = R[i + n],
	R[i + n] = R[i],
	R[i] = W
	),
	R[k]
	)).join`\n`,
	O(G(Y + 1 + n), G(Z + n) - 1),
	E = F(V.substr(0, A))
	))
	),
	*/
	// save as a file
	"s" == K && (
	P(a = document.createElement`a`),
	(m = prompt("Filename", "f.html")) && (
	a.href = URL.createObjectURL(new Blob([V], { type: "text/plain" })),
	a.click(a.download = m),
	URL.revokeObjectURL(a.href)
	)
	),
	// undo & redo
	(((k = "z" == K) && N > 0) \|\| ("y" == K && N < W.length - 1)) && (
	P(),
	v = W[k ? --N : ++N], // new value
	f = V.length - v.length, // new and old value length diff
	V = d.value = v,
	O(A - f), // try to keep the cursor where it was
	// TODO: I can improve by moving cursor to where the change happened
	u = 1 // don't update edit history at the end
	)
	),
	// Tab / Shift + Tab add or remove two spaces on selected lines
	"Tab" == K && (
	P(),
	X(J(R.map((l, i) => i > Y && i < Z ? I ? l.replace(/^ {1,2}/,"") : " " + l : l))),
	O(G(Y + 1), G(Z) - 1)
	),

	//"()[]{}<>" enclose parenthesis
	k = M.indexOf(K)) % 2 == 0 && (
	P(),
	X(V.slice(0, A) + K + V.slice(A, B) + M[k + 1] + V.slice(B)),
	O(A + 1, B + 1)
	),

	// update edit history
	V != W[N] && !u && (W = W.slice(0, N + 1), W[++N] = V),

	// show cursor info
	p.innerHTML = `<button onclick=d.click(b.className='mhqr'[++h%4])>H</button> `+(h%4==3?"":`Ln:${E.length}, Col:${E.pop().length+1}, ${A == B ? 'Pos:' + B : 'Sel:' + (B - A)}, Len:${V.length}`)
	)
	</script></body>
No results found