From 81eb4f4b66e46a04767616b80957f90fb7e84641 Mon Sep 17 00:00:00 2001 From: Leamsi Escribano Date: Mon, 14 Sep 2020 10:48:15 -0400 Subject: [PATCH 1/4] Fixed issue #9 when creating a new drawing --- js/_createColorPalette.js | 6 +++--- js/_newPixel.js | 23 ++++++++++++----------- js/_presets.js | 10 ++++++++-- 3 files changed, 23 insertions(+), 16 deletions(-) diff --git a/js/_createColorPalette.js b/js/_createColorPalette.js index da51707..8f7352b 100644 --- a/js/_createColorPalette.js +++ b/js/_createColorPalette.js @@ -1,5 +1,5 @@ -function createColorPalette(selectedPalette, fillBackground, deletePreviousPalette = true) { +function createColorPalette(paletteColors, fillBackground, deletePreviousPalette = true) { //remove current palette if (deletePreviousPalette) { colors = document.getElementsByClassName('color-button'); @@ -11,8 +11,8 @@ function createColorPalette(selectedPalette, fillBackground, deletePreviousPalet var lightestColor = '#000000'; var darkestColor = '#ffffff'; - for (var i = 0; i < selectedPalette.length; i++) { - var newColor = selectedPalette[i]; + for (var i = 0; i < paletteColors.length; i++) { + var newColor = paletteColors[i]; var newColorElement = addColor(newColor); var newColorHex = hexToRgb(newColor); diff --git a/js/_newPixel.js b/js/_newPixel.js index 1473738..595ab77 100644 --- a/js/_newPixel.js +++ b/js/_newPixel.js @@ -73,29 +73,30 @@ function newPixel (width, height, editorMode, fileContent = null) { colors[0].parentElement.remove(); } + // set the default color variables + let fg = hslToRgb(Math.floor(Math.random()*255), 230,70); + let bg = hslToRgb(Math.floor(Math.random()*255), 230,170); + + let defaultForegroundColor = rgbToHex(fg.r,fg.g,fg.b); + let defaultBackgroundColor = rgbToHex(bg.r,bg.g,bg.b); + //add colors from selected palette var selectedPalette = getText('palette-button'); if (selectedPalette != 'Choose a palette...' && fileContent == null) { - //if this palette isnt the one specified in the url, then reset the url - if (!palettes[selectedPalette].specified) + if (!presets[selectedPalette].specified) history.pushState(null, null, '/pixel-editor/app'); + presets[selectedPalette].colors.push(defaultForegroundColor); + presets[selectedPalette].colors.push(defaultBackgroundColor); + //fill the palette with specified palette - createColorPalette(palettes[selectedPalette].colors,true); + createColorPalette(presets[selectedPalette].colors,true); } else if (fileContent == null) { //this wasn't a specified palette, so reset the url history.pushState(null, null, '/pixel-editor/app'); - //generate default colors - var fg = hslToRgb(Math.floor(Math.random()*255), 230,70); - var bg = hslToRgb(Math.floor(Math.random()*255), 230,170); - - //convert colors to hex - var defaultForegroundColor = rgbToHex(fg.r,fg.g,fg.b); - var defaultBackgroundColor = rgbToHex(bg.r,bg.g,bg.b); - //add colors to palette addColor(defaultForegroundColor).classList.add('selected'); addColor(defaultBackgroundColor); diff --git a/js/_presets.js b/js/_presets.js index bc4e02d..c36e563 100644 --- a/js/_presets.js +++ b/js/_presets.js @@ -3,17 +3,23 @@ var presets = { 'Gameboy Color': { width: 240, height: 203, - palette: 'Gameboy Color' + palette: 'Gameboy Color', + specified: false, + colors: [] }, 'PICO-8': { width: 128, height: 128, palette: 'PICO-8', + specified: false, + colors: [] }, 'Commodore 64': { width: 40, height: 80, - palette: 'Commodore 64' + palette: 'Commodore 64', + specified: false, + colors: [] } }; From dab2a7c6624436a5d9525da76e32df1ec286fa3d Mon Sep 17 00:00:00 2001 From: Leamsi Escribano Date: Tue, 15 Sep 2020 18:16:44 -0400 Subject: [PATCH 2/4] Reverted some changes and added default palettes to fix #9 bug --- js/_newPixel.js | 28 ++++++++++++++++------------ js/_presets.js | 12 +++--------- 2 files changed, 19 insertions(+), 21 deletions(-) diff --git a/js/_newPixel.js b/js/_newPixel.js index 595ab77..de6e916 100644 --- a/js/_newPixel.js +++ b/js/_newPixel.js @@ -1,5 +1,10 @@ let firstPixel = true; +// Set the default palettes +palettes["Commodore 64"] = {"name":"Commodore 64","author":"","colors":["000000","626262","898989","adadad","ffffff","9f4e44","cb7e75","6d5412","a1683c","c9d487","9ae29b","5cab5e","6abfc6","887ecb","50459b","a057a3"]} +palettes["PICO-8"] = {"name":"PICO-8","author":"","colors":["000000","1D2B53","7E2553","008751","AB5236","5F574F","C2C3C7","FFF1E8","FF004D","FFA300","FFEC27","00E436","29ADFF","83769C","FF77A8","FFCCAA"]} +palettes["Gameboy Color"] = {"name":"Nintendo Gameboy (Black Zero)","author":"","colors":["2e463d","385d49","577b46","7e8416"]} + function newPixel (width, height, editorMode, fileContent = null) { pixelEditorMode = editorMode; @@ -73,30 +78,29 @@ function newPixel (width, height, editorMode, fileContent = null) { colors[0].parentElement.remove(); } - // set the default color variables - let fg = hslToRgb(Math.floor(Math.random()*255), 230,70); - let bg = hslToRgb(Math.floor(Math.random()*255), 230,170); - - let defaultForegroundColor = rgbToHex(fg.r,fg.g,fg.b); - let defaultBackgroundColor = rgbToHex(bg.r,bg.g,bg.b); - //add colors from selected palette var selectedPalette = getText('palette-button'); if (selectedPalette != 'Choose a palette...' && fileContent == null) { + //if this palette isnt the one specified in the url, then reset the url - if (!presets[selectedPalette].specified) + if (!palettes[selectedPalette].specified) history.pushState(null, null, '/pixel-editor/app'); - presets[selectedPalette].colors.push(defaultForegroundColor); - presets[selectedPalette].colors.push(defaultBackgroundColor); - //fill the palette with specified palette - createColorPalette(presets[selectedPalette].colors,true); + createColorPalette(palettes[selectedPalette].colors,true); } else if (fileContent == null) { //this wasn't a specified palette, so reset the url history.pushState(null, null, '/pixel-editor/app'); + //generate default colors + var fg = hslToRgb(Math.floor(Math.random()*255), 230,70); + var bg = hslToRgb(Math.floor(Math.random()*255), 230,170); + + //convert colors to hex + var defaultForegroundColor = rgbToHex(fg.r,fg.g,fg.b); + var defaultBackgroundColor = rgbToHex(bg.r,bg.g,bg.b); + //add colors to palette addColor(defaultForegroundColor).classList.add('selected'); addColor(defaultBackgroundColor); diff --git a/js/_presets.js b/js/_presets.js index c36e563..c0f4714 100644 --- a/js/_presets.js +++ b/js/_presets.js @@ -3,23 +3,17 @@ var presets = { 'Gameboy Color': { width: 240, height: 203, - palette: 'Gameboy Color', - specified: false, - colors: [] + palette: 'Gameboy Color' }, 'PICO-8': { width: 128, height: 128, - palette: 'PICO-8', - specified: false, - colors: [] + palette: 'PICO-8' }, 'Commodore 64': { width: 40, height: 80, - palette: 'Commodore 64', - specified: false, - colors: [] + palette: 'Commodore 64' } }; From e58326600d0bc0aeb44c34e4cc9eee7a21a7972e Mon Sep 17 00:00:00 2001 From: Leamsi Escribano Date: Tue, 15 Sep 2020 20:22:53 -0400 Subject: [PATCH 3/4] Moved default palettes to .hbs file --- js/_newPixel.js | 5 ----- views/pixel-editor.hbs | 6 ++++++ 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/js/_newPixel.js b/js/_newPixel.js index de6e916..1473738 100644 --- a/js/_newPixel.js +++ b/js/_newPixel.js @@ -1,10 +1,5 @@ let firstPixel = true; -// Set the default palettes -palettes["Commodore 64"] = {"name":"Commodore 64","author":"","colors":["000000","626262","898989","adadad","ffffff","9f4e44","cb7e75","6d5412","a1683c","c9d487","9ae29b","5cab5e","6abfc6","887ecb","50459b","a057a3"]} -palettes["PICO-8"] = {"name":"PICO-8","author":"","colors":["000000","1D2B53","7E2553","008751","AB5236","5F574F","C2C3C7","FFF1E8","FF004D","FFA300","FFEC27","00E436","29ADFF","83769C","FF77A8","FFCCAA"]} -palettes["Gameboy Color"] = {"name":"Nintendo Gameboy (Black Zero)","author":"","colors":["2e463d","385d49","577b46","7e8416"]} - function newPixel (width, height, editorMode, fileContent = null) { pixelEditorMode = editorMode; diff --git a/views/pixel-editor.hbs b/views/pixel-editor.hbs index 3afca14..507f648 100644 --- a/views/pixel-editor.hbs +++ b/views/pixel-editor.hbs @@ -339,6 +339,12 @@ {{#specifiedPalette}} var keepUrl = true; {{/specifiedPalette}} + + // Set the default palettes + palettes["Commodore 64"] = {"name":"Commodore 64","author":"","colors":["000000","626262","898989","adadad","ffffff","9f4e44","cb7e75","6d5412","a1683c","c9d487","9ae29b","5cab5e","6abfc6","887ecb","50459b","a057a3"]} + palettes["PICO-8"] = {"name":"PICO-8","author":"","colors":["000000","1D2B53","7E2553","008751","AB5236","5F574F","C2C3C7","FFF1E8","FF004D","FFA300","FFEC27","00E436","29ADFF","83769C","FF77A8","FFCCAA"]} + palettes["Gameboy Color"] = {"name":"Nintendo Gameboy (Black Zero)","author":"","colors":["2e463d","385d49","577b46","7e8416"]} + From 54f7d74a38b662761184e400d2d1e243333340c1 Mon Sep 17 00:00:00 2001 From: Leamsi Escribano Date: Wed, 16 Sep 2020 15:39:58 -0400 Subject: [PATCH 4/4] Fixed issue #16 by decreasing maxXOffset --- js/_setCanvasOffset.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/_setCanvasOffset.js b/js/_setCanvasOffset.js index 695551b..3e34749 100644 --- a/js/_setCanvasOffset.js +++ b/js/_setCanvasOffset.js @@ -1,7 +1,7 @@ function setCanvasOffset (canvas, offsetLeft, offsetTop) { //horizontal offset var minXOffset = -canvasSize[0]*zoom+ 164; - var maxXOffset = window.innerWidth - 148; + var maxXOffset = window.innerWidth - 300; if (offsetLeft < minXOffset) canvas.style.left = minXOffset +'px';