shithub: puzzles

Info  •  Files  •  Log  •  Branches

js: Set the default colour from the CSS background of the canvas

This allows the HTML/CSS to decide that it would like a different
background colour without the need to recompile.  The default if the CSS
specifies no colour (and hence the canvas is transparent) is the same
grey as before.

--- a/emcc.c

+++ b/emcc.c

@@ -51,6 +51,7 @@

 extern int js_add_preset_submenu(int menuid, const char *name);

 extern int js_get_selected_preset(void);

 extern void js_select_preset(int n);

+extern void js_default_colour(float *output);

 extern void js_set_background_colour(const char *bg);

 extern void js_get_date_64(unsigned *p);

 extern void js_update_permalinks(const char *desc, const char *seed);

@@ -226,12 +227,13 @@

 }

 /*

- * HTML doesn't give us a default frontend colour of its own, so we

- * just make up a lightish grey ourselves.

+ * Try to extract a background colour from the canvas's CSS.  In case

+ * it doesn't have a usable one, make up a lightish grey ourselves.

  */

 void frontend_default_colour(frontend *fe, float *output)

 {

     output[0] = output[1] = output[2] = 0.9F;

+    js_default_colour(output);

 }

 /*

--- a/emcclib.js

+++ b/emcclib.js

@@ -144,6 +144,24 @@

     },

     /*

+     * void js_default_colour(float *output);

+     *

+     * Try to extract a default colour from the CSS computed

+     * background colour of the canvas element.

+     */

+    js_default_colour: function(output) {

+        var col = window.getComputedStyle(onscreen_canvas).backgroundColor;

+        /* We only support opaque sRGB colours. */

+        var m = col.match(

+            /^rgb\((\d+(?:\.\d+)?), (\d+(?:\.\d+)?), (\d+(?:\.\d+)?)\)$/);

+        if (m) {

+            setValue(output,     +m[1] / 255, "float");

+            setValue(output + 4, +m[2] / 255, "float");

+            setValue(output + 8, +m[3] / 255, "float");

+        }

+    },

+

+    /*

      * void js_set_background_colour(const char *bg);

      *

      * Record the puzzle background colour in a CSS variable so