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.
This commit is contained in:
Ben Harris
2022-12-10 17:49:49 +00:00
parent 02f1d55a02
commit 14eb35da4a
2 changed files with 22 additions and 2 deletions

6
emcc.c
View File

@ -51,6 +51,7 @@ extern void js_add_preset(int menuid, const char *name, int value);
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 @@ void restore_puzzle_size(int w, int h)
}
/*
* 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);
}
/*

View File

@ -143,6 +143,24 @@ mergeInto(LibraryManager.library, {
menuform.elements["preset"].value = n;
},
/*
* 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);
*