remove mode picker from new pixel dialog

This commit is contained in:
skeddles 2021-07-06 21:05:41 -04:00
parent 562b9ad074
commit e0e634d7f7
5 changed files with 3 additions and 67 deletions

View File

@ -9,7 +9,7 @@ function create(isSplash) {
var height = getValue('size-height' + splashPostfix); var height = getValue('size-height' + splashPostfix);
// If I'm creating from the splash screen, I use the splashMode variable // If I'm creating from the splash screen, I use the splashMode variable
var mode = isSplash ? splashMode : getValue('editor-mode'); var mode = isSplash ? splashMode : pixelEditorMode;
newPixel(width, height, mode); newPixel(width, height, mode);
@ -29,9 +29,7 @@ function create(isSplash) {
//reset new form //reset new form
setValue('size-width', 64); setValue('size-width', 64);
setValue('size-height', 64); setValue('size-height', 64);
setValue("editor-mode", 'Advanced')
setText('editor-mode-button', 'Choose a mode...');
setText('palette-button', 'Choose a palette...'); setText('palette-button', 'Choose a palette...');
setText('preset-button', 'Choose a preset...'); setText('preset-button', 'Choose a preset...');
} }
@ -43,10 +41,9 @@ on('click', 'create-button', function (){
// Getting the values of the form // Getting the values of the form
var width = getValue('size-width'); var width = getValue('size-width');
var height = getValue('size-height'); var height = getValue('size-height');
var mode = getValue("editor-mode");
// Creating a new pixel with those properties // Creating a new pixel with those properties
newPixel(width, height, mode); newPixel(width, height);
document.getElementById('new-pixel-warning').style.display = 'block'; document.getElementById('new-pixel-warning').style.display = 'block';
//get selected palette name //get selected palette name
@ -61,9 +58,7 @@ on('click', 'create-button', function (){
//reset new form //reset new form
setValue('size-width', 64); setValue('size-width', 64);
setValue('size-height', 64); setValue('size-height', 64);
setValue("editor-mode", 'Advanced')
setText('editor-mode-button', 'Choose a mode...');
setText('palette-button', 'Choose a palette...'); setText('palette-button', 'Choose a palette...');
setText('preset-button', 'Choose a preset...'); setText('preset-button', 'Choose a preset...');
}); });
@ -95,9 +90,7 @@ on('click', 'create-button-splash', function (){
//reset new pixel form //reset new pixel form
setValue('size-width-splash', 64); setValue('size-width-splash', 64);
setValue('size-height-splash', 64); setValue('size-height-splash', 64);
setValue("editor-mode", 'Advanced')
setText('editor-mode-button', 'Choose a mode...');
setText('palette-button', 'Choose a palette...'); setText('palette-button', 'Choose a palette...');
setText('preset-button', 'Choose a preset...'); setText('preset-button', 'Choose a preset...');
}); });

View File

@ -7,8 +7,6 @@ let modes = {
} }
} }
let infoBox = document.getElementById('editor-mode-info');
on('click', 'switch-editor-mode-splash', function (e) { on('click', 'switch-editor-mode-splash', function (e) {
console.log('switching mode') console.log('switching mode')
switchMode(); switchMode();
@ -74,50 +72,3 @@ function switchMode(mustConfirm = true) {
on('click', 'switch-mode-button', function (e) { on('click', 'switch-mode-button', function (e) {
switchMode(); switchMode();
}); });
// Makes the menu open
on('click', 'editor-mode-button', function (e){
//open or close the preset menu
toggle('editor-mode-button');
toggle('editor-mode-menu');
//close the palette menu
deselect('palette-button');
deselect('palette-menu');
//close the preset menu
deselect('preset-button');
deselect('preset-menu');
//stop the click from propogating to the parent element
e.stopPropagation();
});
//populate preset list in new pixel menu
Object.keys(modes).forEach(function(modeName,index) {
var editorModeMenu = document.getElementById('editor-mode-menu');
//create button
var button = document.createElement('button');
button.appendChild(document.createTextNode(modeName));
//insert new element
editorModeMenu.appendChild(button);
//add click event listener
on('click', button, function() {
//change mode on new pixel
setValue('editor-mode', modeName);
// Change description
infoBox.innerHTML = modes[modeName].description;
//hide the dropdown menu
deselect('editor-mode-menu');
deselect('editor-mode-button');
//set the text of the dropdown to the newly selected mode
setText('editor-mode-button', modeName);
});
});

View File

@ -47,7 +47,7 @@ window.onload = function () {
//firstPixel = false; //firstPixel = false;
//create new document //create new document
newPixel(width, height, getValue('editor-mode')); newPixel(width, height);
} }
//dimentions were not specified -- show splash screen with palette preselected //dimentions were not specified -- show splash screen with palette preselected

View File

@ -141,7 +141,6 @@ palettes["Gameboy Color"] = {"name":"Nintendo Gameboy (Black Zero)","author":"",
}) })
newPixelElement.addEventListener('click', () => { newPixelElement.addEventListener('click', () => {
Util.deselect('editor-mode-menu');
Util.deselect('preset-button'); Util.deselect('preset-button');
Util.deselect('preset-menu'); Util.deselect('preset-menu');
Util.deselect('palette-button'); Util.deselect('palette-button');

View File

@ -3,13 +3,6 @@
<button class="close-button">{{svg "x.svg" width="20" height="20"}}</button> <button class="close-button">{{svg "x.svg" width="20" height="20"}}</button>
<h1>New Pixel</h1> <h1>New Pixel</h1>
<!-- Editor mode-->
<h2>Editor mode</h2>
<button id = "editor-mode-button" class = "dropdown-button">Choose a mode...</button>
<div id = "editor-mode-menu" class = "dropdown-menu"></div>
<input id="editor-mode" value="{{#if mode}}{{mode}}{{else}}'Advanced'{{/if}}" autocomplete="off" />
<p id = "editor-mode-info"></p>
<!-- Preset--> <!-- Preset-->
<h2>Preset</h2> <h2>Preset</h2>
<button id="preset-button" class="dropdown-button">Choose a preset...</button> <button id="preset-button" class="dropdown-button">Choose a preset...</button>