Qlock – A JavaScript Quine Clock

Partly because it is not exactly a "proper" quine, which is not allowed to access its own source code in any way. This program uses the fact that JS requires `Function.prototype.toString()` to return something that resembles the original JS source code [1], which can be regarded as reading its own source code (a more precise statement would be that it relies on an implementation-defined behavior though). A proper quine in comparison tends to be longer because it has to repeat itself twice in general.

[1] https://tc39.es/ecma262/#sec-function.prototype.tostring

Aha this is exactly what I had hoped for. Thank you!

Since I'm bored - here's a quick run down of how this works, split into chunks.

#1 - Function Wrapper:

   (r = n => setInterval(t => {
        ...
    }, 100))()

Here a number of things are done:

- set `r` to the function that runs the whole quine.

- when r is called (inline immediately at the end) it sets an interval to call the body every 100ms.

- `n` is unused, and is there for spacing instead of using `()` to indicate no params.

#2 - Row Looper:

    for (j = o = "\n", y = 5; y--; document.body['innerHTML'] = "
&lt" + (S = "script>\n") + o + "\n\n&lt/" + S)

- create a loop that will occur 5 times (one for each row of the output).
- initialize some variables `j` and `o` to newlines. `o` will contain our rendered output, `j` will soon become an incrementor.
- after each loop, put the contents of 'o' between two strings of "".
- the `S = "script>\n"` portion helps with spacing and S is no longer needed after this line.
#3 - Column Looper:
    for (x = -001; x++ 

- loop through the 64 columns, incrementing x and j.
- x keeps track of the column, j keeps track of the character within the Function `r`.
- each loop, `o` adds a letter from `r`. (In Javascript, functions can be converted to strings which contain their source).
- Also add the `)()` to the end of `r`, which the implicit Function.toString() will not have.
- Set the fontcolor on that string based on `c` - String.fontcolor() is an old deprecated method which wraps your string in a `` tag.
#4 - Renderer:
    c = x / 2 % 4 

- The array of numbers is essentially a font, defining the numbers 0..9 and lastly ":"
- We pick which character of this font to render based on a Substring of Date(). Either a number, or ":".
- Date()[16] is where the Time string starts, and chars are rendered 8 blocks wide.
- With the beginning `x / 2 % 4 - At the end, render our `font` with the x and y coords
-  x is divided by two, so all pixels in this font are two characters wide.
-  font glyphs are 3x5, and thus defined as 15 bits.
-  for example, the glyph for '0' is:
   111
   101
   101
   101
   111

 - which results in 0b111101101101111 and therefor 31599  
 - To render these characters, we bit shift (

#5 - Coming together
Now just travel the last few steps back up the chain again, and you can see how these characters are placed in `o` - and if `c` is true (we hit a character) it is rendered yellow. `o` is put between a "" and that resulting string is put in document.innerHTML every 100 milliseconds.