From 5a9a79addb12bd5e7a15e8dca974336b9680a62e Mon Sep 17 00:00:00 2001 From: dm Date: Mon, 18 Jan 2021 20:53:54 +0100 Subject: [PATCH 1/5] allow for custom color swatches reset colors to black on deselect fix fill_color default black --- config/default.json | 3 ++- public/javascripts/spacedeck_sections.js | 21 +++++++-------------- views/spacedeck.ejs | 3 ++- 3 files changed, 11 insertions(+), 16 deletions(-) diff --git a/config/default.json b/config/default.json index 2838396..2354f70 100644 --- a/config/default.json +++ b/config/default.json @@ -26,5 +26,6 @@ "mail_smtp_secure": true, "mail_smtp_require_tls": true, "mail_smtp_user": "your.smtp.user", - "mail_smtp_pass": "your.secret.smtp.password" + "mail_smtp_pass": "your.secret.smtp.password", + "spacedeck": {} } diff --git a/public/javascripts/spacedeck_sections.js b/public/javascripts/spacedeck_sections.js index 6846a94..da1ba50 100644 --- a/public/javascripts/spacedeck_sections.js +++ b/public/javascripts/spacedeck_sections.js @@ -69,7 +69,7 @@ var SpacedeckSections = { letter_spacing: 0, stroke_color: "#000000", - fill_color: "#00000000", + fill_color: "#000000", text_color: "#000000", background_color: "#ffffff", @@ -109,7 +109,7 @@ var SpacedeckSections = { color_picker_hue: 127, color_picker_opacity: 255, - swatches: [ + swatches: ENV.options.swatches ? ENV.options.swatches : [ {id:1, hex:"#ff00ff"}, {id:2, hex:"#ffff00"}, {id:3, hex:"#00ffff"}, @@ -133,18 +133,7 @@ var SpacedeckSections = { {id:26, hex:"#d55c4b"}, {id:27, hex:"#6f4021"}, {id:29, hex:"#95a5a6"}, - {id:30, hex:"rgba(0,0,0,0)"}, - ], - - swatches_text: [ - {id:1, hex:"#9b59b6"}, - {id:2, hex:"#3498db"}, - {id:3, hex:"#2ecc71"}, - {id:4, hex:"#f1c40f"}, - {id:5, hex:"#e67e22"}, - {id:6, hex:"#d55c4b"}, - {id:8, hex:"#ffffff"}, - {id:10, hex:"#252525"}, + {id:30, hex:"rgba(0,0,0,0)"} ], fonts: [ @@ -933,6 +922,10 @@ var SpacedeckSections = { } this.hide_toolbar_props(); + // reset active_style to black for new creation of artifacts + this.active_style.text_color = "#000000"; + this.active_style.stroke_color = "#000000"; + this.active_style.fill_color = "#000000"; document.getSelection().removeAllRanges(); diff --git a/views/spacedeck.ejs b/views/spacedeck.ejs index 20b841f..71d6f31 100644 --- a/views/spacedeck.ejs +++ b/views/spacedeck.ejs @@ -21,7 +21,8 @@ webHost: location.host, webEndpoint: location.origin, apiEndpoint: location.origin, - websocketsEndpoint: location.origin.replace("https:","wss:").replace("http:","ws:") + websocketsEndpoint: location.origin.replace("https:","wss:").replace("http:","ws:"), + options: <%- JSON.stringify(config.spacedeck) %> }; From 3d391c571ced4f964fd1760d966e1582984900ee Mon Sep 17 00:00:00 2001 From: dm Date: Wed, 20 Jan 2021 09:14:49 +0100 Subject: [PATCH 2/5] ammend docs --- README.md | 29 +++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) diff --git a/README.md b/README.md index a70e100..8184ff8 100644 --- a/README.md +++ b/README.md @@ -45,6 +45,35 @@ To install all node dependencies, run (do this once): See [config/default.json](config/default.json). Set `storage_local_path` for a local sqlite database or `storage_region`, `storage_bucket`, `storage_cdn` and `storage_endpoint` for AWS S3. `mail_provider` may be one of `console` or `smtp`. Also, omit a trailing `/` for the `endpoint`. +## Configure color swatches + +Add a custom array of swatches to your config/default.json. +**You need to include black (#000000) and transparent (rgba(0,0,0,0)) in your custom swatches palette.** + +```json +... +"spacedeck": { + "swatches": [ + {"id":8, "hex":"#000000"}, + {"id":30, "hex":"rgba(0,0,0,0)"}, + {"id":31, "hex": "#E11F26"}, + {"id":32, "hex": "#9E0F13"}, + {"id":33, "hex": "#64BCCA"}, + {"id":34, "hex": "#40808A"}, + {"id":35, "hex": "#036492"}, + {"id":36, "hex": "#005179"}, + {"id":37, "hex": "#84427E"}, + {"id":38, "hex": "#6C3468"}, + {"id":39, "hex": "#F79B84"}, + {"id":40, "hex": "#B57362"}, + {"id":41, "hex": "#E7D45A"}, + {"id":42, "hex": "#ACA044"} + ] + } +} +... +``` + # Run (web server) node spacedeck.js From ba72cf7dc83cfe8d81c417f5c3786857e170ed7f Mon Sep 17 00:00:00 2001 From: dm Date: Thu, 21 Jan 2021 08:54:29 +0100 Subject: [PATCH 3/5] use configurable default colors on reset --- README.md | 46 ++++++++++++++---------- public/javascripts/spacedeck_sections.js | 12 ++++--- 2 files changed, 35 insertions(+), 23 deletions(-) diff --git a/README.md b/README.md index 8184ff8..4fbf0ce 100644 --- a/README.md +++ b/README.md @@ -47,29 +47,37 @@ See [config/default.json](config/default.json). Set `storage_local_path` for a l ## Configure color swatches -Add a custom array of swatches to your config/default.json. -**You need to include black (#000000) and transparent (rgba(0,0,0,0)) in your custom swatches palette.** +Add a custom array of swatches to your config/default.json. + +**You should include the swatch transparent (rgba(0,0,0,0)) so users can remove the color applied.** + +## Configure default colors +You can define text, stroke and fill color in your config/default.json. + +**You also should include the default colors in your custom swatches palette.** ```json ... "spacedeck": { - "swatches": [ - {"id":8, "hex":"#000000"}, - {"id":30, "hex":"rgba(0,0,0,0)"}, - {"id":31, "hex": "#E11F26"}, - {"id":32, "hex": "#9E0F13"}, - {"id":33, "hex": "#64BCCA"}, - {"id":34, "hex": "#40808A"}, - {"id":35, "hex": "#036492"}, - {"id":36, "hex": "#005179"}, - {"id":37, "hex": "#84427E"}, - {"id":38, "hex": "#6C3468"}, - {"id":39, "hex": "#F79B84"}, - {"id":40, "hex": "#B57362"}, - {"id":41, "hex": "#E7D45A"}, - {"id":42, "hex": "#ACA044"} - ] - } + "default_text_color": "#E11F26", + "default_stroke_color": "#9E0F13", + "default_fill_color": "#64BCCA", + "swatches": [ + {"id":8, "hex":"#000000"}, + {"id":30, "hex":"rgba(0,0,0,0)"}, + {"id":31, "hex": "#E11F26"}, + {"id":32, "hex": "#9E0F13"}, + {"id":33, "hex": "#64BCCA"}, + {"id":34, "hex": "#40808A"}, + {"id":35, "hex": "#036492"}, + {"id":36, "hex": "#005179"}, + {"id":37, "hex": "#84427E"}, + {"id":38, "hex": "#6C3468"}, + {"id":39, "hex": "#F79B84"}, + {"id":40, "hex": "#B57362"}, + {"id":41, "hex": "#E7D45A"}, + {"id":42, "hex": "#ACA044"} + ] } ... ``` diff --git a/public/javascripts/spacedeck_sections.js b/public/javascripts/spacedeck_sections.js index da1ba50..b21b601 100644 --- a/public/javascripts/spacedeck_sections.js +++ b/public/javascripts/spacedeck_sections.js @@ -109,6 +109,10 @@ var SpacedeckSections = { color_picker_hue: 127, color_picker_opacity: 255, + default_text_color: ENV.options.default_text_color ? ENV.options.default_text_color : "#000000", + default_stroke_color: ENV.options.default_stroke_color ? ENV.options.default_stroke_color : "#000000", + default_fill_color: ENV.options.default_fill_color ? ENV.options.default_fill_color : "#000000", + swatches: ENV.options.swatches ? ENV.options.swatches : [ {id:1, hex:"#ff00ff"}, {id:2, hex:"#ffff00"}, @@ -922,10 +926,10 @@ var SpacedeckSections = { } this.hide_toolbar_props(); - // reset active_style to black for new creation of artifacts - this.active_style.text_color = "#000000"; - this.active_style.stroke_color = "#000000"; - this.active_style.fill_color = "#000000"; + // reset active_style to defaults for new creation of artifacts + this.active_style.text_color = this.default_text_color; + this.active_style.stroke_color = this.default_stroke_color; + this.active_style.fill_color = this.default_fill_color; document.getSelection().removeAllRanges(); From 058c414ae3068a6a9dcd88d1e46a910228e74e9b Mon Sep 17 00:00:00 2001 From: dm Date: Thu, 21 Jan 2021 09:09:17 +0100 Subject: [PATCH 4/5] fix --- public/javascripts/spacedeck_sections.js | 14 +++----------- 1 file changed, 3 insertions(+), 11 deletions(-) diff --git a/public/javascripts/spacedeck_sections.js b/public/javascripts/spacedeck_sections.js index b21b601..11c4b3c 100644 --- a/public/javascripts/spacedeck_sections.js +++ b/public/javascripts/spacedeck_sections.js @@ -68,9 +68,9 @@ var SpacedeckSections = { line_height: 1.5, letter_spacing: 0, - stroke_color: "#000000", - fill_color: "#000000", - text_color: "#000000", + stroke_color: ENV.options.default_stroke_color ? ENV.options.default_stroke_color : "#000000", + fill_color: ENV.options.default_fill_color ? ENV.options.default_fill_color : "#000000", + text_color: ENV.options.default_text_color ? ENV.options.default_text_color : "#000000", background_color: "#ffffff", padding: 0, @@ -109,10 +109,6 @@ var SpacedeckSections = { color_picker_hue: 127, color_picker_opacity: 255, - default_text_color: ENV.options.default_text_color ? ENV.options.default_text_color : "#000000", - default_stroke_color: ENV.options.default_stroke_color ? ENV.options.default_stroke_color : "#000000", - default_fill_color: ENV.options.default_fill_color ? ENV.options.default_fill_color : "#000000", - swatches: ENV.options.swatches ? ENV.options.swatches : [ {id:1, hex:"#ff00ff"}, {id:2, hex:"#ffff00"}, @@ -926,10 +922,6 @@ var SpacedeckSections = { } this.hide_toolbar_props(); - // reset active_style to defaults for new creation of artifacts - this.active_style.text_color = this.default_text_color; - this.active_style.stroke_color = this.default_stroke_color; - this.active_style.fill_color = this.default_fill_color; document.getSelection().removeAllRanges(); From a7704875c5cc8556de9d15ed3b26844b1e79b966 Mon Sep 17 00:00:00 2001 From: dm Date: Thu, 21 Jan 2021 23:43:47 +0100 Subject: [PATCH 5/5] check existance of config value --- views/spacedeck.ejs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/views/spacedeck.ejs b/views/spacedeck.ejs index 71d6f31..35a57a6 100644 --- a/views/spacedeck.ejs +++ b/views/spacedeck.ejs @@ -22,7 +22,7 @@ webEndpoint: location.origin, apiEndpoint: location.origin, websocketsEndpoint: location.origin.replace("https:","wss:").replace("http:","ws:"), - options: <%- JSON.stringify(config.spacedeck) %> + options: <%- config.spacedeck ? JSON.stringify(config.spacedeck) : "{}" %> };