[feature] add custom theme rename controls

Author: zombieFox

package-lock.json

@@ -1,6 +1,6 @@
 {
 "name": "nighttab",
-"version": "4.12.1",
+"version": "4.13.0",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
 "main": "index.js",
 "scripts":{

package.json

@@ -1094,6 +1094,9 @@ var theme = (function(){
 add: function(){
 state.get.current().theme.custom.all.push(JSON.parse(JSON.stringify(stagedThemeCustom.theme)));
 },
+edit: function(){
+state.get.current().theme.custom.all.splice(stagedThemeCustom.position.index,1,JSON.parse(JSON.stringify(stagedThemeCustom.theme)));
+},
 remove: function(copyStagedThemeCustom){
 state.get.current().theme.custom.all.splice(stagedThemeCustom.position.index,1);
 },
@@ -1463,7 +1466,9 @@ var theme = (function(){
 varthemeCustomButton=helper.node("button|class:theme-custom-button button mb-0,tabindex:-1");
 varthemeCustomPreview=helper.node("span|class:theme-custom-preview");
 varthemeCustomControl=helper.node("div|class:theme-custom-control");
-varthemeCustomRemove=helper.node("button|class:theme-custom-control-item theme-custom-control-item-remove button mb-0,tabindex:-2");
+varthemeCustomEdit=helper.node("button|class:theme-custom-control-item theme-custom-control-item-remove button button-small mb-0,tabindex:-2");
+varthemeCustomEditIcon=helper.node("spa|class:button-icon icon-edit");
+varthemeCustomRemove=helper.node("button|class:theme-custom-control-item theme-custom-control-item-remove button button-small mb-0,tabindex:-2");
 varthemeCustomRemoveIcon=helper.node("spa|class:button-icon icon-close");
 varshadeSteps=4;
 varrgb=arrayItem.color.rgb;
@@ -1505,7 +1510,9 @@ var theme = (function(){
 };
 
 themeCustomButton.appendChild(themeCustomPreview);
+themeCustomEdit.appendChild(themeCustomEditIcon);
 themeCustomRemove.appendChild(themeCustomRemoveIcon);
+themeCustomControl.appendChild(themeCustomEdit);
 themeCustomControl.appendChild(themeCustomRemove);
 themeCustomTile.appendChild(themeCustomButton);
 themeCustomTile.appendChild(themeCustomControl);
@@ -1535,6 +1542,11 @@ var theme = (function(){
 control.render.class();
 },false);
 
+themeCustomEdit.addEventListener("click",function(){
+menu.close();
+render.custom.edit(copyStagedThemeCustom);
+},false);
+
 themeCustomRemove.addEventListener("click",function(){
 menu.close();
 render.custom.remove(copyStagedThemeCustom);
@@ -1546,28 +1558,39 @@ var theme = (function(){
 themeCustomSaved.appendChild(helper.node("hr"));
 };
 },
-add: function(){
-varform=function(){
-varform=helper.node("form|class:group-form");
-varfieldset=helper.node("fieldset");
-varinputWrap=helper.node("div|class:input-wrap");
-varlabel=helper.node("label:Name|for:theme-name");
-varinput=helper.node("input|id:theme-name,class:theme-name mb-0,type:text,tabindex:1,placeholder:Example theme,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false");
-inputWrap.appendChild(label);
-inputWrap.appendChild(input);
-fieldset.appendChild(inputWrap);
-form.appendChild(fieldset);
-input.addEventListener("input",function(){
-stagedThemeCustom.theme.name=this.value;
-},false);
-form.addEventListener("keydown",function(event){
-if(event.keyCode==13){
-event.preventDefault();
-returnfalse;
-};
-},false);
-returnform;
+form: function(override){
+varoptions={
+useStagedTheme: null
 };
+if(override){
+options=helper.applyOptions(options,override);
+};
+varform=helper.node("form|class:group-form");
+varfieldset=helper.node("fieldset");
+varinputWrap=helper.node("div|class:input-wrap");
+varlabel=helper.node("label:Name|for:theme-name");
+varinput=helper.node("input|id:theme-name,class:theme-name mb-0,type:text,tabindex:1,placeholder:Example theme,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false");
+inputWrap.appendChild(label);
+inputWrap.appendChild(input);
+fieldset.appendChild(inputWrap);
+form.appendChild(fieldset);
+
+if(options.useStagedTheme){
+input.value=stagedThemeCustom.theme.name;
+};
+
+input.addEventListener("input",function(){
+stagedThemeCustom.theme.name=this.value;
+},false);
+form.addEventListener("keydown",function(event){
+if(event.keyCode==13){
+event.preventDefault();
+returnfalse;
+};
+},false);
+returnform;
+},
+add: function(){
 varsuccessAction=function(){
 stagedThemeCustom.theme.font=state.get.current().theme.font;
 stagedThemeCustom.theme.color=state.get.current().theme.color;
@@ -1592,11 +1615,54 @@ var theme = (function(){
 };
 modal.open({
 heading: "Save current Theme",
+content: render.custom.form(),
+successAction: successAction,
+cancelAction: cancelAction,
+actionText: "Save",
+size: "small"
+});
+shade.open({
+action: function(){
+modal.close();
+pagelock.unlock();
+stagedThemeCustom.reset();
+}
+});
+pagelock.lock();
+},
+edit: function(copyStagedThemeCustom){
+stagedThemeCustom.position.index=JSON.parse(JSON.stringify(copyStagedThemeCustom.position.index));
+stagedThemeCustom.theme=JSON.parse(JSON.stringify(copyStagedThemeCustom.theme));
+varform=render.custom.form({
+useStagedTheme: true
+});
+varheading;
+if(stagedThemeCustom.theme.name!=null&&stagedThemeCustom.theme.name!=""){
+heading="Edit "+stagedThemeCustom.theme.name;
+}else{
+heading="Edit unnamed theme";
+};
+varsuccessAction=function(){
+mod.custom.edit();
+data.save();
+render.custom.clear();
+render.custom.all();
+shade.close();
+pagelock.unlock();
+stagedThemeCustom.reset();
+};
+varcancelAction=function(){
+shade.close();
+pagelock.unlock();
+stagedThemeCustom.reset();
+};
+modal.open({
+heading: heading,
 successAction: successAction,
 cancelAction: cancelAction,
 actionText: "Save",
 size: "small",
-content: form()
+content: form
 });
 shade.open({
 action: function(){

src/js/theme.js

@@ -1,6 +1,6 @@
 varversion=(function(){
 
-varcurrent="4.12.1";
+varcurrent="4.13.0";
 
 varname="Naughty Goose";
 

src/js/version.js

@@ -2,7 +2,7 @@
 "name": "nightTab",
 "short_name": "nightTab",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
-"version": "4.12.1",
+"version": "4.13.0",
 "manifest_version": 2,
 "chrome_url_overrides":{
 "newtab": "index.html"