diff --git a/package-lock.json b/package-lock.json index aa985fc7..69e800b7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "nightTab", - "version": "5.69.0", + "version": "5.70.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 29d3ebb7..02b92026 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "nightTab", - "version": "5.69.0", + "version": "5.70.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": { diff --git a/src/js/link.js b/src/js/link.js index f767ec76..d5c5f901 100644 --- a/src/js/link.js +++ b/src/js/link.js @@ -905,7 +905,7 @@ var link = (function() { }; }); } else if (typeof className == "string") { - helper.addClass(element, className); + render.form.className(element, className.split(" ")); }; return element; }, @@ -927,26 +927,37 @@ var link = (function() { collapse: function(node) { return helper.node("div|class:link-form-collapse", node); }, - label: function(name, labelText, labelDescription, icon, className) { + label: function(override) { + var options = { + name: null, + labelText: null, + labelDescription: null, + icon: null, + className: null + }; + if (override) { + options = helper.applyOptions(options, override); + }; + var label; - if (name) { - label = helper.node("label|for:" + name); + if (options.name) { + label = helper.node("label|for:" + options.name); } else { label = helper.node("label"); }; - if (labelText && labelDescription) { + if (options.labelText && options.labelDescription) { label.appendChild(helper.node("span|class:label-block", [ - helper.node("span:" + labelText + "|class:label-block-item"), - helper.node("span:" + labelDescription + "|class:label-block-item small muted") + helper.node("span:" + options.labelText + "|class:label-block-item"), + helper.node("span:" + options.labelDescription + "|class:label-block-item small muted") ])); - } else if (labelText) { - label.appendChild(helper.node("span:" + labelText)); + } else if (options.labelText) { + label.appendChild(helper.node("span:" + options.labelText)); }; - if (icon) { + if (options.icon) { label.prepend(helper.node("span|class:label-icon")); }; - if (className) { - label = render.form.className(label, className); + if (options.className) { + label = render.form.className(label, options.className); }; return label; }, @@ -1110,9 +1121,18 @@ var link = (function() { var form = helper.node("form|class:group-form"); // name - var groupFormInputNameShowLabel = render.form.label("group-form-input-name-show", "Show Group name", false, true); + var groupFormInputNameShowLabel = render.form.label({ + name: "group-form-input-name-show", + labelText: "Show Group name", + icon: true + }); var groupFormInputNameShowInput = helper.node("input|type:checkbox,class:group-form-input-name-show,id:group-form-input-name-show,tabindex:1,checked"); - var groupFormInputName = helper.node("input|type:text,class:group-form-input-name,id:group-form-input-name,placeholder:Example group,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); + var groupFormInputNameLabel = render.form.label({ + name: "group-form-input-name", + labelText: "Name", + className: "sr-only" + }); + var groupFormInputNameInput = helper.node("input|type:text,class:group-form-input-name,id:group-form-input-name,placeholder:Example group,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var groupFormRandomNameButton = helper.node("button:Random Group name|class:button button-line,type:button,tabindex:1"); form.appendChild( @@ -1123,7 +1143,8 @@ var link = (function() { ]), render.form.indent([ render.form.wrap([ - groupFormInputName + groupFormInputNameLabel, + groupFormInputNameInput ]), render.form.wrap([ groupFormRandomNameButton @@ -1133,7 +1154,11 @@ var link = (function() { ); // open all - var groupFormInputOpenallLabel = render.form.label("group-form-input-openall", "Show Open all", false, true); + var groupFormInputOpenallLabel = render.form.label({ + name: "group-form-input-openall", + labelText: "Show Open all", + icon: true + }); var groupFormOpenAllInput = helper.node("input|type:checkbox,class:group-form-input-openall,id:group-form-input-openall,tabindex:1,checked"); var groupFormOpenAllInputHelperItem = render.form.helper("group-form-input-openall", "Open all button will appear if there is at least one Bookmark in this Group."); @@ -1151,7 +1176,11 @@ var link = (function() { ); // position - var groupFormPositionLabel = render.form.label("group-form-input-openall", "Position", false, true); + var groupFormPositionLabel = render.form.label({ + name: "group-form-input-openall", + labelText: "Position", + icon: true + }); var groupFormPositionSelect = helper.node("select|id:group-form-position,class:group-form-position,tabindex:1"); form.appendChild( @@ -1176,10 +1205,10 @@ var link = (function() { var populateForm = function() { groupFormInputNameShowInput.checked = stagedGroup.group.name.show; groupFormPositionSelect.selectedIndex = stagedGroup.position.origin; - groupFormInputName.value = stagedGroup.group.name.text; + groupFormInputNameInput.value = stagedGroup.group.name.text; groupFormOpenAllInput.checked = stagedGroup.group.openAll.show; if (!stagedGroup.group.name.show) { - groupFormInputName.setAttribute("disabled", ""); + groupFormInputNameInput.setAttribute("disabled", ""); groupFormRandomNameButton.setAttribute("disabled", ""); }; }; @@ -1205,17 +1234,17 @@ var link = (function() { groupFormInputNameShowInput.addEventListener("change", function(event) { stagedGroup.group.name.show = this.checked; if (stagedGroup.group.name.show) { - groupFormInputName.removeAttribute("disabled"); + groupFormInputNameInput.removeAttribute("disabled"); groupFormRandomNameButton.removeAttribute("disabled"); } else { - groupFormInputName.setAttribute("disabled", ""); + groupFormInputNameInput.setAttribute("disabled", ""); groupFormRandomNameButton.setAttribute("disabled", ""); }; }, false); groupFormPositionSelect.addEventListener("change", function(event) { stagedGroup.position.destination = this.selectedIndex; }, false); - groupFormInputName.addEventListener("input", function(event) { + groupFormInputNameInput.addEventListener("input", function(event) { stagedGroup.group.name.text = this.value; }, false); groupFormRandomNameButton.addEventListener("click", function(event) { @@ -1223,7 +1252,7 @@ var link = (function() { adjectivesCount: helper.randomNumber(1, 3) }); stagedGroup.group.name.text = randomName; - groupFormInputName.value = randomName; + groupFormInputNameInput.value = randomName; }, false); groupFormOpenAllInput.addEventListener("change", function(event) { stagedGroup.group.openAll.show = this.checked; @@ -1589,14 +1618,37 @@ var link = (function() { var formPreviewArea = helper.node("div|class:link-form-preview-area"); // group + + // console.log(name, labelText, labelDescription, icon, className); var groupExistingRadio = helper.node("input|class:link-form-input-group-existing,id:link-form-input-group-existing,type:radio,name:link-form-input-group,tabindex:1,value:existing"); - var groupExistingLabel = render.form.label("link-form-input-group-existing", "Existing group", false, true); - var groupExistingGroup = helper.node("select|id:link-form-select-group,class:link-form-select-group,tabindex:1"); - var groupExistingPositionLabel = render.form.label("link-form-position", "Position"); + var groupExistingLabel = render.form.label({ + name: "link-form-input-group-existing", + labelText: "Existing group", + icon: true + }); + var groupExistingGroupLabel = render.form.label({ + name: "link-form-select-group", + labelText: "Name", + className: "sr-only" + }); + var groupExistingGroupSelect = helper.node("select|id:link-form-select-group,class:link-form-select-group,tabindex:1"); + var groupExistingPositionLabel = render.form.label({ + name: "link-form-position", + labelText: "Position" + }); var groupExistingPosition = helper.node("select|id:link-form-position,class:link-form-position,tabindex:1"); var groupNewRadio = helper.node("input|class:link-form-input-group-new,id:link-form-input-group-new,type:radio,name:link-form-input-group,tabindex:1,value:new"); - var groupNewLabel = render.form.label("link-form-input-group-new", "New group", false, true); - var groupNewInput = helper.node("input|type:text,class:link-form-input-new-group,id:link-form-input-new-group,placeholder:Example group,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); + var groupNewLabel = render.form.label({ + name: "link-form-input-group-new", + labelText: "New group", + icon: true + }); + var groupNewNameLabel = render.form.label({ + name: "link-form-select-group", + labelText: "Name", + className: "sr-only" + }); + var groupNewNameInput = helper.node("input|type:text,class:link-form-input-new-group,id:link-form-input-new-group,placeholder:Example group,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var groupNewRandomNameButton = render.form.button("Random Group name"); form.appendChild( @@ -1613,7 +1665,8 @@ var link = (function() { render.form.wrap([ render.form.indent([ render.form.wrap([ - groupExistingGroup + groupExistingGroupLabel, + groupExistingGroupSelect ]), render.form.wrap([ groupExistingPositionLabel, @@ -1628,7 +1681,8 @@ var link = (function() { render.form.wrap([ render.form.indent([ render.form.wrap([ - groupNewInput, + groupNewNameLabel, + groupNewNameInput ]), render.form.wrap([ groupNewRandomNameButton @@ -1642,27 +1696,49 @@ var link = (function() { // display var displayShowCheckbox = helper.node("input|class:link-form-input-display-visual-show,id:link-form-input-display-visual-show,type:checkbox,tabindex:1"); - var displayShowLabel = render.form.label("link-form-input-display-visual-show", "Show Visual Element", "Display Letters, Icon or an Image on this Bookmark tile.", true); + var displayShowLabel = render.form.label({ + name: "link-form-input-display-visual-show", + labelText: "Show Visual Element", + labelDescription: "Display Letters, Icon or an Image on this Bookmark tile.", + icon: true + }); var displayLetterRadio = helper.node("input|class:link-form-input-display-visual-letter,id:link-form-input-display-visual-letter,type:radio,name:link-form-input-display-visual,tabindex:1,value:letter"); - var displayLetterLabel = render.form.label("link-form-input-display-visual-letter", "Letters", false, true); + var displayLetterLabel = render.form.label({ + name: "link-form-input-display-visual-letter", + labelText: "Letters", + icon: true + }); var displayLetterInput = helper.node("input|type:text,class:link-form-input-letter,placeholder:E,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var displayIconRadio = helper.node("input|class:link-form-input-display-visual-icon,id:link-form-input-display-visual-icon,type:radio,name:link-form-input-display-visual,tabindex:1,value:icon"); - var displayIconLabel = render.form.label("link-form-input-display-visual-icon", "Icon", false, true); + var displayIconLabel = render.form.label({ + name: "link-form-input-display-visual-icon", + labelText: "Icon", + icon: true + }); var displayIconInput = helper.node("input|type:text,class:link-form-input-display-visual-icon form-group-item-grow link-form-input-icon auto-suggest-input,placeholder:Search for Brands or Icons,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var displayIconFormGroupText = helper.node("div|class:form-group-text link-form-text-icon,tabindex:-1"); var displayIconFormGroupClear = render.form.button(false, false, "icon-close"); var displayIconHelper = render.form.helper("link-form-input-display-visual-icon-helper", "Refer to the \"Free\" and \"Brand\" icons from FontAwesome for full set of icons supported."); - var displayImageLabel = render.form.label("link-form-input-display-visual-image", "Image", false, true); + var displayImageLabel = render.form.label({ + name: "link-form-input-display-visual-image", + labelText: "Image", + icon: true + }); var displayImageRadio = helper.node("input|class:link-form-input-display-visual-image,id:link-form-input-display-visual-image,type:radio,name:link-form-input-display-visual,tabindex:1,value:image"); var displayImageInput = helper.node("input|type:text,class:link-form-input-image,placeholder:https://...,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var displayImageHelper = render.form.helper("link-form-input-display-visual-image-helper", "Display an image in place of a letter or icon."); // name var nameShowCheckbox = helper.node("input|class:link-form-input-display-name-show,id:link-form-input-display-name-show,type:checkbox,tabindex:1"); - var nameShowLabel = render.form.label("link-form-input-display-name-show", "Show Name", "Display a Name on this Bookmark tile.", true); + var nameShowLabel = render.form.label({ + name: "link-form-input-display-name-show", + labelText: "Show Name", + labelDescription: "Display a Name on this Bookmark tile.", + icon: true + }); var nameInput = helper.node("input|type:text,class:link-form-input-display-name,id:link-form-input-display-name,placeholder:Example,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); form.appendChild( @@ -1741,7 +1817,11 @@ var link = (function() { ); // url - var urlLabel = render.form.label("link-form-input-url", "URL", false, true); + var urlLabel = render.form.label({ + name: "link-form-input-url", + labelText: "URL", + icon: true + }); var urlInput = helper.node("input|type:text,class:link-form-input-url,id:link-form-input-url,placeholder:https://www.example.com/,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var urlInputHelper = render.form.helper("link-form-input-url-helper", "Be sure to use the full URL and include \"http://\" or \"https\://\"..."); @@ -1769,155 +1849,318 @@ var link = (function() { var advancedCollapseButtonHelper = render.form.helper("link-form-image-helper", "Customise this Bookmarks appearance, Background, Colour and Accent."); // background - var imageLabel = render.form.label("link-form-image", "Background image"); + var imageLabel = render.form.label({ + name: "link-form-image", + labelText: "Background image" + }); var imageInput = helper.node("input|type:text,class:link-form-image,id:link-form-image,placeholder:https://www.example.com/,tabindex:1,autocomplete:off,autocorrect:off,autocapitalize:off,spellcheck:false"); var imageInputHelper = render.form.helper("link-form-image-helper", "Display an image as the background of this Bookmark tile."); - var imageOpacityLabel = render.form.label("link-form-image-opacity-range", "Opacity"); + var imageOpacityLabel = render.form.label({ + name: "link-form-image-opacity-range", + labelText: "Opacity" + }); var imageOpacityInputRange = helper.node("input|class:link-form-image-opacity-range mr-3,id:link-form-image-opacity-range,type:range,name:link-form-image-opacity-range,min:0,max:100,tabindex:1"); var imageOpacityInputNumber = helper.node("input|class:link-form-image-opacity-number form-group-item-medium form-group-radius-left,type:number,min:0,max:100,tabindex:1"); var imageOpacityInputDefault = render.form.button(false, "link-form-image-opacity-default", "icon-replay"); // tall wide var wideInput = helper.node("input|type:checkbox,class:link-form-wide,id:link-form-wide,tabindex:1"); - var wideLabel = render.form.label("link-form-wide", "Wide tile", "Bookmark tile to span across two columns.", true); + var wideLabel = render.form.label({ + name: "link-form-wide", + labelText: "Wide tile", + labelDescription: "Bookmark tile to span across two columns.", + icon: true + }); var tallInput = helper.node("input|type:checkbox,class:link-form-tall,id:link-form-tall,tabindex:1"); - var tallLabel = render.form.label("link-form-tall", "Tall tile", "Bookmark tile to span across two rows.", true); + var tallLabel = render.form.label({ + name: "link-form-tall", + labelText: "Tall tile", + labelDescription: "Bookmark tile to span across two rows.", + icon: true, + }); var wideTallLabelHelper = render.form.helper("link-form-wide-tall-helper", "Bookmark tile will span across two columns or rows if the Bookmark Area is large enough."); // content - var displayAlignmentLabel = render.form.label(false, "Visual Element and Name alignment"); - var displayAlignmentTopLeftRadio = helper.node("input|class:link-form-input-display-alignment-topleft,id:link-form-input-display-alignment-topleft,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:topleft"); - var displayAlignmentTopLeftLabel = render.form.label("link-form-input-display-alignment-topleft", false, false, true, false); - var displayAlignmentTopCenterRadio = helper.node("input|class:link-form-input-display-alignment-topcenter,id:link-form-input-display-alignment-topcenter,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:topcenter"); - var displayAlignmentTopCenterLabel = render.form.label("link-form-input-display-alignment-topcenter", false, false, true, false); - var displayAlignmentTopRightRadio = helper.node("input|class:link-form-input-display-alignment-topright,id:link-form-input-display-alignment-topright,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:topright"); - var displayAlignmentTopRightLabel = render.form.label("link-form-input-display-alignment-topright", false, false, true, false); - var displayAlignmentCenterLeftRadio = helper.node("input|class:link-form-input-display-alignment-centerleft,id:link-form-input-display-alignment-centerleft,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:centerleft"); - var displayAlignmentCenterLeftLabel = render.form.label("link-form-input-display-alignment-centerleft", false, false, true, false); - var displayAlignmentCenterCenterRadio = helper.node("input|class:link-form-input-display-alignment-centercenter,id:link-form-input-display-alignment-centercenter,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:centercenter"); - var displayAlignmentCenterCenterLabel = render.form.label("link-form-input-display-alignment-centercenter", false, false, true, false); - var displayAlignmentCenterRightRadio = helper.node("input|class:link-form-input-display-alignment-centerright,id:link-form-input-display-alignment-centerright,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:centerright"); - var displayAlignmentCenterRightLabel = render.form.label("link-form-input-display-alignment-centerright", false, false, true, false); - var displayAlignmentBottomLeftRadio = helper.node("input|class:link-form-input-display-alignment-bottomleft,id:link-form-input-display-alignment-bottomleft,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:bottomleft"); - var displayAlignmentBottomLeftLabel = render.form.label("link-form-input-display-alignment-bottomleft", false, false, true, false); - var displayAlignmentBottomCenterRadio = helper.node("input|class:link-form-input-display-alignment-bottomcenter,id:link-form-input-display-alignment-bottomcenter,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:bottomcenter"); - var displayAlignmentBottomCenterLabel = render.form.label("link-form-input-display-alignment-bottomcenter", false, false, true, false); - var displayAlignmentBottomRightRadio = helper.node("input|class:link-form-input-display-alignment-bottomright,id:link-form-input-display-alignment-bottomright,type:radio,name:class:link-form-input-display-alignment,tabindex:1,value:bottomright"); - var displayAlignmentBottomRightLabel = render.form.label("link-form-input-display-alignment-bottomright", false, false, true, false); + var displayAlignmentLabel = render.form.label({ + labelText: "Visual Element and Name alignment" + }); + var displayAlignmentTopLeftRadio = helper.node("input|class:link-form-input-display-alignment-topleft,id:link-form-input-display-alignment-topleft,type:radio,name:link-form-input-display-alignment,tabindex:1,value:topleft"); + var displayAlignmentTopLeftLabel = render.form.label({ + name: "link-form-input-display-alignment-topleft", + icon: true + }); + var displayAlignmentTopCenterRadio = helper.node("input|class:link-form-input-display-alignment-topcenter,id:link-form-input-display-alignment-topcenter,type:radio,name:link-form-input-display-alignment,tabindex:1,value:topcenter"); + var displayAlignmentTopCenterLabel = render.form.label({ + name: "link-form-input-display-alignment-topcenter", + icon: true + }); + var displayAlignmentTopRightRadio = helper.node("input|class:link-form-input-display-alignment-topright,id:link-form-input-display-alignment-topright,type:radio,name:link-form-input-display-alignment,tabindex:1,value:topright"); + var displayAlignmentTopRightLabel = render.form.label({ + name: "link-form-input-display-alignment-topright", + icon: true + }); + var displayAlignmentCenterLeftRadio = helper.node("input|class:link-form-input-display-alignment-centerleft,id:link-form-input-display-alignment-centerleft,type:radio,name:link-form-input-display-alignment,tabindex:1,value:centerleft"); + var displayAlignmentCenterLeftLabel = render.form.label({ + name: "link-form-input-display-alignment-centerleft", + icon: true + }); + var displayAlignmentCenterCenterRadio = helper.node("input|class:link-form-input-display-alignment-centercenter,id:link-form-input-display-alignment-centercenter,type:radio,name:link-form-input-display-alignment,tabindex:1,value:centercenter"); + var displayAlignmentCenterCenterLabel = render.form.label({ + name: "link-form-input-display-alignment-centercenter", + icon: true + }); + var displayAlignmentCenterRightRadio = helper.node("input|class:link-form-input-display-alignment-centerright,id:link-form-input-display-alignment-centerright,type:radio,name:link-form-input-display-alignment,tabindex:1,value:centerright"); + var displayAlignmentCenterRightLabel = render.form.label({ + name: "link-form-input-display-alignment-centerright", + icon: true + }); + var displayAlignmentBottomLeftRadio = helper.node("input|class:link-form-input-display-alignment-bottomleft,id:link-form-input-display-alignment-bottomleft,type:radio,name:link-form-input-display-alignment,tabindex:1,value:bottomleft"); + var displayAlignmentBottomLeftLabel = render.form.label({ + name: "link-form-input-display-alignment-bottomleft", + icon: true + }); + var displayAlignmentBottomCenterRadio = helper.node("input|class:link-form-input-display-alignment-bottomcenter,id:link-form-input-display-alignment-bottomcenter,type:radio,name:link-form-input-display-alignment,tabindex:1,value:bottomcenter"); + var displayAlignmentBottomCenterLabel = render.form.label({ + name: "link-form-input-display-alignment-bottomcenter", + icon: true + }); + var displayAlignmentBottomRightRadio = helper.node("input|class:link-form-input-display-alignment-bottomright,id:link-form-input-display-alignment-bottomright,type:radio,name:link-form-input-display-alignment,tabindex:1,value:bottomright"); + var displayAlignmentBottomRightLabel = render.form.label({ + name: "link-form-input-display-alignment-bottomright", + icon: true + }); var displayAlignmentHelper = render.form.helper("link-form-input-display-alignment-helper", "Position the Visual Element (letter, icon or image) and Name inside the Bookmark tile."); - var displayLetterSizeLabel = render.form.label("link-form-input-display-visual-letter-size-range", "Letter size"); + var displayLetterSizeLabel = render.form.label({ + name: "link-form-input-display-visual-letter-size-range", + labelText: "Letter size" + }); var displayLetterSizeInputRange = helper.node("input|class:link-form-input-display-visual-letter-size-range mr-3,id:link-form-input-display-visual-letter-size-range,type:range,name:link-form-input-display-visual-letter-size-range,min:10,max:3000,step:10,tabindex:1"); var displayLetterSizeInputNumber = helper.node("input|class:link-form-input-display-visual-letter-size-number form-group-item-medium form-group-radius-left,type:number,min:10,max:3000,step:10,tabindex:1"); var displayLetterSizeInputDefault = render.form.button(false, "link-form-input-display-visual-letter-size-default", "icon-replay"); - var displayIconSizeLabel = render.form.label("link-form-input-display-visual-icon-size-range", "Icon size"); + var displayIconSizeLabel = render.form.label({ + name: "link-form-input-display-visual-icon-size-range", + labelText: "Icon size" + }); var displayIconSizeInputRange = helper.node("input|class:link-form-input-display-visual-icon-size-range mr-3,id:link-form-input-display-visual-icon-size-range,type:range,name:link-form-input-display-visual-icon-size-range,min:10,max:3000,step:10,tabindex:1"); var displayIconSizeInputNumber = helper.node("input|class:link-form-input-display-visual-icon-size-number form-group-item-medium form-group-radius-left,type:number,min:10,max:3000,step:10,tabindex:1"); var displayIconSizeInputDefault = render.form.button(false, "link-form-input-display-visual-icon-size-default", "icon-replay"); - var displayImageSizeLabel = render.form.label("link-form-input-display-visual-image-size-range", "Image size"); + var displayImageSizeLabel = render.form.label({ + name: "link-form-input-display-visual-image-size-range", + labelText: "Image size" + }); var displayImageSizeInputRange = helper.node("input|class:link-form-input-display-visual-image-size-range mr-3,id:link-form-input-display-visual-image-size-range,type:range,name:link-form-input-display-visual-image-size-range,min:10,max:3000,step:10,tabindex:1"); var displayImageSizeInputNumber = helper.node("input|class:link-form-input-display-visual-image-size-number form-group-item-medium form-group-radius-left,type:number,min:10,max:3000,step:10,tabindex:1"); var displayImageSizeInputDefault = render.form.button(false, "link-form-input-display-visual-image-size-default", "icon-replay"); - var displayShadowSizeLabel = render.form.label("link-form-input-display-visual-shadow-size-range", "Shadow size"); + var displayShadowSizeLabel = render.form.label({ + name: "link-form-input-display-visual-shadow-size-range", + labelText: "Shadow size" + }); var displayShadowSizeInputRange = helper.node("input|class:link-form-input-display-visual-shadow-size-range mr-3,id:link-form-input-display-visual-shadow-size-range,type:range,name:link-form-input-display-visual-shadow-size-range,min:0,max:100,tabindex:1"); var displayShadowSizeInputNumber = helper.node("input|class:link-form-input-display-visual-shadow-size-number form-group-item-medium form-group-radius-left,type:number,min:0,max:100,tabindex:1"); var displayShadowSizeInputDefault = render.form.button(false, "link-form-input-display-visual-shadow-size-default", "icon-replay"); var displayShadowSizeInputHelper = render.form.helper("link-form-input-display-visual-shadow-size-helper", "Only applies to Letters or Icons."); - var nameSizeLabel = render.form.label("link-form-input-display-name-size-range", "Name size"); + var nameSizeLabel = render.form.label({ + name: "link-form-input-display-name-size-range", + labelText: "Name size" + }); var nameSizeInputRange = helper.node("input|class:link-form-input-display-name-size-range mr-3,id:link-form-input-display-name-size-range,type:range,name:link-form-input-display-name-size-range,min:10,max:1500,step:10,tabindex:1"); var nameSizeInputNumber = helper.node("input|class:link-form-input-display-name-size-number form-group-item-medium form-group-radius-left,type:number,min:10,max:1500,step:10,tabindex:1"); var nameSizeInputDefault = render.form.button(false, "link-form-input-display-name-size-default", "icon-replay"); - var displayRotateLabel = render.form.label("link-form-input-display-rotate-range", "Rotation"); + var displayRotateLabel = render.form.label({ + name: "link-form-input-display-rotate-range", + labelText: "Rotation" + }); var displayRotateRange = helper.node("input|class:link-form-input-display-rotate-range mr-3,id:link-form-input-display-rotate-range,type:range,name:link-form-input-display-rotate-range,min:-180,max:180,tabindex:1"); var displayRotateNumber = helper.node("input|class:link-form-input-display-rotate-number form-group-item-medium form-group-radius-left,type:number,min:-180,max:180,tabindex:1"); var displayRotateDefault = render.form.button(false, "link-form-input-display-rotate-default", "icon-replay"); - var displayTranslateXLabel = render.form.label("link-form-input-display-translate-x-range", "Horizontally offset"); + var displayTranslateXLabel = render.form.label({ + name: "link-form-input-display-translate-x-range", + labelText: "Horizontally offset" + }); var displayTranslateXRange = helper.node("input|class:link-form-input-display-translate-x-range mr-3,id:link-form-input-display-translate-x-range,type:range,name:link-form-input-display-translate-x-range,min:-1000,max:1000,step:10,tabindex:1"); var displayTranslateXNumber = helper.node("input|class:link-form-input-display-translate-x-number form-group-item-medium form-group-radius-left,type:number,min:-1000,max:1000,step:10,tabindex:1"); var displayTranslateXDefault = render.form.button(false, "link-form-input-display-translate-x-default", "icon-replay"); - var displayTranslateYLabel = render.form.label("link-form-input-display-translate-y-range", "Vertically offset"); + var displayTranslateYLabel = render.form.label({ + name: "link-form-input-display-translate-y-range", + labelText: "Vertically offset" + }); var displayTranslateYRange = helper.node("input|class:link-form-input-display-translate-y-range mr-3,id:link-form-input-display-translate-y-range,type:range,name:link-form-input-display-translate-y-range,min:-1000,max:1000,step:10,tabindex:1"); var displayTranslateYNumber = helper.node("input|class:link-form-input-display-translate-y-number form-group-item-medium form-group-radius-left,type:number,min:-1000,max:1000,step:10,tabindex:1"); var displayTranslateYDefault = render.form.button(false, "link-form-input-display-translate-y-default", "icon-replay"); - var displayGutterLabel = render.form.label("link-form-input-display-gutter-range", "Gutter"); + var displayGutterLabel = render.form.label({ + name: "link-form-input-display-gutter-range", + labelText: "Gutter" + }); var displayGutterRange = helper.node("input|class:link-form-input-display-gutter-range mr-3,id:link-form-input-display-gutter-range,type:range,name:link-form-input-display-gutter-range,min:0,max:40,tabindex:1"); var displayGutterNumber = helper.node("input|class:link-form-input-display-gutter-number form-group-item-medium form-group-radius-left,type:number,min:0,max:40,tabindex:1"); var displayGutterDefault = render.form.button(false, "link-form-input-display-gutter-default", "icon-replay"); var displayAlignmentHorizontalRadio = helper.node("input|class:link-form-input-alignment-horizontal,id:link-form-input-alignment-horizontal,type:radio,name:link-form-input-alignment,tabindex:1,value:horizontal"); - var displayAlignmentHorizontalLabel = render.form.label("link-form-input-alignment-horizontal", "Align horizontally", "Works well with Bookmark List Style.", true); + var displayAlignmentHorizontalLabel = render.form.label({ + name: "link-form-input-alignment-horizontal", + labelText: "Align horizontally", + labelDescription: "Works well with Bookmark List Style.", + icon: true + }); var displayAlignmentVerticalRadio = helper.node("input|class:link-form-input-alignment-vertical,id:link-form-input-alignment-vertical,type:radio,name:link-form-input-alignment,tabindex:1,value:vertical"); - var displayAlignmentVerticalLabel = render.form.label("link-form-input-alignment-vertical", "Align vertically", "Works well with Bookmark Block Style.", true); + var displayAlignmentVerticalLabel = render.form.label({ + name: "link-form-input-alignment-vertical", + labelText: "Align vertically", + labelDescription: "Works well with Bookmark Block Style.", + icon: true + }); var displayAlignmentHelper = render.form.helper("link-form-wide-tall-helper", "Only available when Visual Element and Name are shown."); var displayDirectionVisualnameRadio = helper.node("input|class:link-form-input-direction-visualname,id:link-form-input-direction-visualname,type:radio,name:link-form-input-direction,tabindex:1,value:visualname"); - var displayDirectionVisualnameLabel = render.form.label("link-form-input-direction-visualname", "Visual Element then Name", "Stack the Visual Element (letter, icon or image) before the Name.", true); + var displayDirectionVisualnameLabel = render.form.label({ + name: "link-form-input-direction-visualname", + labelText: "Visual Element then Name", + labelDescription: "Stack the Visual Element (letter, icon or image) before the Name.", + icon: true + }); var displayDirectionNamevisualRadio = helper.node("input|class:link-form-input-direction-namevisual,id:link-form-input-direction-namevisual,type:radio,name:link-form-input-direction,tabindex:1,value:namevisual"); - var displayDirectionNamevisualLabel = render.form.label("link-form-input-direction-namevisual", "Name then Visual Element", "Stack the Name before the Visual Element (letter, icon or image).", true); + var displayDirectionNamevisualLabel = render.form.label({ + name: "link-form-input-direction-namevisual", + labelText: "Name then Visual Element", + labelDescription: "Stack the Name before the Visual Element (letter, icon or image).", + icon: true + }); var displayDirectionHelper = render.form.helper("link-form-wide-tall-helper", "Only available when Visual Element and Name are shown."); // color var colorThemeRadio = helper.node("input|class:link-form-input-color-theme,id:link-form-input-color-theme,type:radio,name:link-form-input-color,tabindex:1,value:theme"); - var colorThemeLabel = render.form.label("link-form-input-color-theme", "Theme colour", "Use the Colour defined by the Theme.", true); + var colorThemeLabel = render.form.label({ + name: "link-form-input-color-theme", + labelText: "Theme colour", + labelDescription: "Use the Colour defined by the Theme.", + icon: true + }); var colorCustomRadio = helper.node("input|class:link-form-input-color-custom,id:link-form-input-color-custom,type:radio,name:link-form-input-color,tabindex:1,value:custom"); - var colorCustomLabel = render.form.label("link-form-input-color-custom", "Custom colour", "Override the Theme colour.", true); + var colorCustomLabel = render.form.label({ + name: "link-form-input-color-custom", + labelText: "Custom colour", + labelDescription: "Override the Theme colour.", + icon: true + }); var colorColorPicker = helper.node("input|id:link-form-input-color-picker,class:form-group-item-half link-form-input-color-picker,type:color,value:#000000,tabindex:1"); var colorColorHex = helper.node("input|id:link-form-input-color-hex,class:form-group-item-half link-form-input-color-hex,type:text,placeholder:Hex code,value:#000000,tabindex:1,maxlength:7"); - var colorHslHLabel = helper.node("label:Hue|for:link-form-input-color-hsl-h-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var colorHslHLabel = render.form.label({ + name: "link-form-input-color-hsl-h-range", + labelText: "Hue", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var colorHslHRange = helper.node("input|class:link-form-input-color-hsl-h-range mr-3,id:link-form-input-color-hsl-h-range,type:range,name:link-form-input-color-hsl-h-range,value:0,min:0,max:359,tabindex:1"); var colorHslHNumber = helper.node("input|class:link-form-input-color-hsl-h-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:359,tabindex:1"); - var colorHslSLabel = helper.node("label:Saturation|for:link-form-input-color-hsl-s-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var colorHslSLabel = render.form.label({ + name: "link-form-input-color-hsl-s-range", + labelText: "Saturation", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var colorHslSRange = helper.node("input|class:link-form-input-color-hsl-s-range mr-3,id:link-form-input-color-hsl-s-range,type:range,name:link-form-input-color-hsl-s-range,value:0,min:0,max:100,tabindex:1"); var colorHslSNumber = helper.node("input|class:link-form-input-color-hsl-s-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:100,tabindex:1"); - var colorHslLLabel = helper.node("label:Lightness|for:link-form-input-color-hsl-l-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var colorHslLLabel = render.form.label({ + name: "link-form-input-color-hsl-l-range", + labelText: "Lightness", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var colorHslLRange = helper.node("input|class:link-form-input-color-hsl-l-range mr-3,id:link-form-input-color-hsl-l-range,type:range,name:link-form-input-color-hsl-l-range,value:0,min:0,max:100,tabindex:1"); var colorHslLNumber = helper.node("input|class:link-form-input-color-hsl-l-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:100,tabindex:1"); - var colorRgbRLabel = helper.node("label:Red|for:link-form-input-color-rgb-r-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var colorRgbRLabel = render.form.label({ + name: "link-form-input-color-rgb-r-range", + labelText: "Red", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var colorRgbRRange = helper.node("input|class:link-form-input-color-rgb-r-range mr-3,id:link-form-input-color-rgb-r-range,type:range,name:link-form-input-color-rgb-r-range,value:0,min:0,max:255,tabindex:1"); var colorRgbRNumber = helper.node("input|class:link-form-input-color-rgb-r-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:255,tabindex:1"); - var colorRgbGLabel = helper.node("label:Green|for:link-form-input-color-rgb-g-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var colorRgbGLabel = render.form.label({ + name: "link-form-input-color-rgb-g-range", + labelText: "Green", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var colorRgbGRange = helper.node("input|class:link-form-input-color-rgb-g-range mr-3,id:link-form-input-color-rgb-g-range,type:range,name:link-form-input-color-rgb-g-range,value:0,min:0,max:255,tabindex:1"); var colorRgbGNumber = helper.node("input|class:link-form-input-color-rgb-g-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:255,tabindex:1"); - var colorRgbBLabel = helper.node("label:Blue|for:link-form-input-color-rgb-b-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var colorRgbBLabel = render.form.label({ + name: "link-form-input-color-rgb-b-range", + labelText: "Blue", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var colorRgbBRange = helper.node("input|class:link-form-input-color-rgb-b-range mr-3,id:link-form-input-color-rgb-b-range,type:range,name:link-form-input-color-rgb-b-range,value:0,min:0,max:255,tabindex:1"); var colorRgbBNumber = helper.node("input|class:link-form-input-color-rgb-b-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:255,tabindex:1"); - var colorOpacityLabel = render.form.label("link-form-input-color-opacity-range", "Opacity"); + var colorOpacityLabel = render.form.label({ + name: "link-form-input-color-opacity-range", + labelText: "Opacity" + }); var colorOpacityInputRange = helper.node("input|class:link-form-input-color-opacity-range mr-3,id:link-form-input-color-opacity-range,type:range,name:link-form-input-color-opacity-range,min:0,max:100,tabindex:1"); var colorOpacityInputNumber = helper.node("input|class:link-form-input-color-opacity-number form-group-item-medium form-group-radius-left,type:number,min:0,max:100,tabindex:1"); var colorOpacityInputDefault = render.form.button(false, "link-form-input-color-opacity-default", "icon-replay"); // accent var accentThemeRadio = helper.node("input|class:link-form-input-accent-theme,id:link-form-input-accent-theme,type:radio,name:link-form-input-accent,tabindex:1,value:theme"); - var accentThemeLabel = render.form.label("link-form-input-accent-theme", "Theme accent", "Use the Accent defined by the Theme.", true); + var accentThemeLabel = render.form.label({ + name: "link-form-input-accent-theme", + labelText: "Theme accent", + labelDescription: "Use the Accent defined by the Theme.", + icon: true + }); var accentCustomRadio = helper.node("input|class:link-form-input-accent-custom,id:link-form-input-accent-custom,type:radio,name:link-form-input-accent,tabindex:1,value:custom"); - var accentCustomLabel = render.form.label("link-form-input-accent-custom", "Custom accent", "Override the Theme accent.", true); + var accentCustomLabel = render.form.label({ + name: "link-form-input-accent-custom", + labelText: "Custom accent", + labelDescription: "Override the Theme accent.", + icon: true + }); var accentColorPicker = helper.node("input|id:link-form-input-accent-picker,class:form-group-item-half link-form-input-accent-picker,type:color,value:#000000,tabindex:1"); var accentColorHex = helper.node("input|id:link-form-input-accent-hex,class:form-group-item-half link-form-input-accent-hex,type:text,placeholder:Hex code,value:#000000,tabindex:1,maxlength:7"); - var accentHslHLabel = helper.node("label:Hue|for:link-form-input-accent-hsl-h-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var accentHslHLabel = render.form.label({ + name: "link-form-input-accent-hsl-h-range", + labelText: "Hue", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var accentHslHRange = helper.node("input|class:link-form-input-accent-hsl-h-range mr-3,id:link-form-input-accent-hsl-h-range,type:range,name:link-form-input-accent-hsl-h-range,value:0,min:0,max:359,tabindex:1"); var accentHslHNumber = helper.node("input|class:link-form-input-accent-hsl-h-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:359,tabindex:1"); - var accentHslSLabel = helper.node("label:Saturation|for:link-form-input-accent-hsl-s-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var accentHslSLabel = render.form.label({ + name: "link-form-input-accent-hsl-s-range", + labelText: "Saturation", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var accentHslSRange = helper.node("input|class:link-form-input-accent-hsl-s-range mr-3,id:link-form-input-accent-hsl-s-range,type:range,name:link-form-input-accent-hsl-s-range,value:0,min:0,max:100,tabindex:1"); var accentHslSNumber = helper.node("input|class:link-form-input-accent-hsl-s-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:100,tabindex:1"); - var accentHslLLabel = helper.node("label:Lightness|for:link-form-input-accent-hsl-l-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var accentHslLLabel = render.form.label({ + name: "link-form-input-accent-hsl-l-range", + labelText: "Lightness", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var accentHslLRange = helper.node("input|class:link-form-input-accent-hsl-l-range mr-3,id:link-form-input-accent-hsl-l-range,type:range,name:link-form-input-accent-hsl-l-range,value:0,min:0,max:100,tabindex:1"); var accentHslLNumber = helper.node("input|class:link-form-input-accent-hsl-l-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:100,tabindex:1"); - var accentRgbRLabel = helper.node("label:Red|for:link-form-input-accent-rgb-r-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var accentRgbRLabel = render.form.label({ + name: "link-form-input-accent-rgb-r-range", + labelText: "Red", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var accentRgbRRange = helper.node("input|class:link-form-input-accent-rgb-r-range mr-3,id:link-form-input-accent-rgb-r-range,type:range,name:link-form-input-accent-rgb-r-range,value:0,min:0,max:255,tabindex:1"); var accentRgbRNumber = helper.node("input|class:link-form-input-accent-rgb-r-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:255,tabindex:1"); - var accentRgbGLabel = helper.node("label:Green|for:link-form-input-accent-rgb-g-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var accentRgbGLabel = render.form.label({ + name: "link-form-input-accent-rgb-g-range", + labelText: "Green", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var accentRgbGRange = helper.node("input|class:link-form-input-accent-rgb-g-range mr-3,id:link-form-input-accent-rgb-g-range,type:range,name:link-form-input-accent-rgb-g-range,value:0,min:0,max:255,tabindex:1"); var accentRgbGNumber = helper.node("input|class:link-form-input-accent-rgb-g-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:255,tabindex:1"); - var accentRgbBLabel = helper.node("label:Blue|for:link-form-input-accent-rgb-b-range,class:form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0"); + var accentRgbBLabel = render.form.label({ + name: "link-form-input-accent-rgb-b-range", + labelText: "Blue", + className: "form-group-text form-group-text-left form-group-text-transparent form-group-text-borderless form-group-item-medium mr-3 pb-0" + }); var accentRgbBRange = helper.node("input|class:link-form-input-accent-rgb-b-range mr-3,id:link-form-input-accent-rgb-b-range,type:range,name:link-form-input-accent-rgb-b-range,value:0,min:0,max:255,tabindex:1"); var accentRgbBNumber = helper.node("input|class:link-form-input-accent-rgb-b-number form-group-item-medium form-group-radius-left,type:number,value:0,min:0,max:255,tabindex:1"); @@ -2309,15 +2552,15 @@ var link = (function() { value: name }] }); - groupExistingGroup.appendChild(option); + groupExistingGroupSelect.appendChild(option); }); } else { groupNewRadio.checked = true; groupExistingRadio.setAttribute("disabled", ""); - groupExistingGroup.setAttribute("disabled", ""); + groupExistingGroupSelect.setAttribute("disabled", ""); helper.addClass(groupExistingPositionLabel, "disabled"); groupExistingPosition.setAttribute("disabled", ""); - groupNewInput.removeAttribute("disabled"); + groupNewNameInput.removeAttribute("disabled"); groupNewRandomNameButton.removeAttribute("disabled"); stagedLink.position.group.new = true; }; @@ -2354,7 +2597,7 @@ var link = (function() { var populateForm = function() { groupExistingRadio.checked = true; - groupExistingGroup.selectedIndex = stagedLink.position.origin.group; + groupExistingGroupSelect.selectedIndex = stagedLink.position.origin.group; if (options.useStagedLink) { groupExistingPosition.selectedIndex = stagedLink.position.origin.item; }; @@ -2710,16 +2953,20 @@ var link = (function() { var disableForm = function() { if (stagedLink.position.group.new) { - groupExistingGroup.setAttribute("disabled", ""); + helper.addClass(groupExistingGroupLabel, "disabled"); + groupExistingGroupSelect.setAttribute("disabled", ""); groupExistingPosition.setAttribute("disabled", ""); helper.addClass(groupExistingPositionLabel, "disabled"); - groupNewInput.removeAttribute("disabled"); + helper.removeClass(groupNewNameLabel, "disabled"); + groupNewNameInput.removeAttribute("disabled"); groupNewRandomNameButton.removeAttribute("disabled"); } else { - groupExistingGroup.removeAttribute("disabled"); + helper.removeClass(groupExistingGroupLabel, "disabled"); + groupExistingGroupSelect.removeAttribute("disabled"); groupExistingPosition.removeAttribute("disabled"); helper.removeClass(groupExistingPositionLabel, "disabled"); - groupNewInput.setAttribute("disabled", ""); + helper.addClass(groupNewNameLabel, "disabled"); + groupNewNameInput.setAttribute("disabled", ""); groupNewRandomNameButton.setAttribute("disabled", ""); }; @@ -3104,13 +3351,13 @@ var link = (function() { }; }, false); groupExistingRadio.addEventListener("change", function(event) { - stagedLink.position.destination.group = groupExistingGroup.selectedIndex; + stagedLink.position.destination.group = groupExistingGroupSelect.selectedIndex; stagedLink.position.group.new = false; stagedLink.position.group.name.show = false; stagedLink.position.group.openAll.show = false; disableForm(); }, false); - groupExistingGroup.addEventListener("change", function(event) { + groupExistingGroupSelect.addEventListener("change", function(event) { stagedLink.position.destination.group = this.selectedIndex; makePostionOptions(); stagedLink.position.destination.item = groupExistingPosition.selectedIndex; @@ -3125,7 +3372,7 @@ var link = (function() { stagedLink.position.group.openAll.show = true; disableForm(); }, false); - groupNewInput.addEventListener("input", function(event) { + groupNewNameInput.addEventListener("input", function(event) { stagedLink.position.group.name.text = this.value; }, false); groupNewRandomNameButton.addEventListener("click", function(event) { @@ -3133,7 +3380,7 @@ var link = (function() { adjectivesCount: helper.randomNumber(1, 3) }); stagedLink.position.group.name.text = randomName; - groupNewInput.value = randomName; + groupNewNameInput.value = randomName; }, false); displayShowCheckbox.addEventListener("change", function(event) { stagedLink.link.display.visual.show = this.checked; diff --git a/src/js/version.js b/src/js/version.js index 9ff98b04..5ade2a18 100644 --- a/src/js/version.js +++ b/src/js/version.js @@ -1,6 +1,6 @@ var version = (function() { - var current = "5.69.0"; + var current = "5.70.0"; var name = "Jaded Raven"; diff --git a/src/manifest.json b/src/manifest.json index c0b4e394..3c0d7f74 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -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": "5.69.0", + "version": "5.70.0", "manifest_version": 2, "chrome_url_overrides": { "newtab": "index.html"