[refactor] all module exposed functions

src/js/control.js

@@ -10,43 +10,43 @@ var control = (function() {
     element: helper.e(".control-menu-layout"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-layout"));
+      menu.nav(this.element, helper.e(".menu-content-area-layout"));
     }
   }, {
     element: helper.e(".control-menu-header"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-header"));
+      menu.nav(this.element, helper.e(".menu-content-area-header"));
     }
   }, {
     element: helper.e(".control-menu-bookmarks"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-bookmarks"));
+      menu.nav(this.element, helper.e(".menu-content-area-bookmarks"));
     }
   }, {
     element: helper.e(".control-menu-theme"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-theme"));
+      menu.nav(this.element, helper.e(".menu-content-area-theme"));
     }
   }, {
     element: helper.e(".control-menu-background"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-background"));
+      menu.nav(this.element, helper.e(".menu-content-area-background"));
     }
   }, {
     element: helper.e(".control-menu-data"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-data"));
+      menu.nav(this.element, helper.e(".menu-content-area-data"));
     }
   }, {
     element: helper.e(".control-menu-nightTab"),
     type: "button",
     func: function() {
-      menu.render.tab(this.element, helper.e(".menu-content-area-nightTab"));
+      menu.nav(this.element, helper.e(".menu-content-area-nightTab"));
     }
   }, {
     element: helper.e(".control-menu-close"),
@@ -65,8 +65,8 @@ var control = (function() {
     path: "link.edit",
     type: "checkbox",
     func: function() {
+      link.tabindex();
       render();
-      link.render.tabindex();
     }
   }, {
     element: helper.e(".control-theme-accent-current"),

src/js/data.js

@@ -95,7 +95,7 @@ var data = (function() {
     var para2 = helper.node("p:This can not be undone.");
     clearContent.appendChild(para1);
     clearContent.appendChild(para2);
-    modal.render.make({
+    modal.open({
       heading: "Clear all nightTab data?",
       content: clearContent,
       successAction: function() {

src/js/init.js

@@ -17,4 +17,5 @@ background.init();
 search.init();
 header.init();
 modal.init();
+shade.init();
 version.init();

src/js/keyboard.js

@@ -10,11 +10,14 @@ var keyboard = (function() {
           edge.render.clear();
         } else if (state.get().menu) {
           menu.close();
+          shade.close();
+          pagelock.unlock();
         } else if (state.get().autoSuggest) {
           autoSuggest.destroy();
         } else if (state.get().modal) {
-          modal.render.clear();
+          modal.close();
-          shade.destroy();
+          shade.close();
+          pagelock.unlock();
         } else if (state.get().link.edit) {
           helper.setObject({
             object: state.get(),
@@ -38,9 +41,15 @@ var keyboard = (function() {
             menu.close();
           };
           if (state.get().modal) {
-            modal.render.clear();
+            modal.close();
           };
           link.add();
+          shade.open({
+            action: function() {
+              modal.close();
+              pagelock.unlock();
+            }
+          });
         };
       };
     }, false);
@@ -63,7 +72,8 @@ var keyboard = (function() {
       // ctrl+alt+m
       if (event.ctrlKey && event.altKey && event.keyCode == 77) {
         if (state.get().modal) {
-          modal.render.clear();
+          modal.close();
+          shade.close();
         };
         menu.toggle();
       };
@@ -74,8 +84,8 @@ var keyboard = (function() {
     window.addEventListener("keydown", function(event) {
       // ctrl+alt+e
       if (event.ctrlKey && event.altKey && event.keyCode == 69) {
-        link.mod.edit.toggle();
+        link.edit();
-        link.render.tabindex();
+        link.tabindex();
         control.update();
         control.render();
         data.save();

src/js/link.js

@@ -31,6 +31,13 @@ var link = (function() {
   };
 
   mod.edit = {
+    toggle: function() {
+      if (state.get().link.edit) {
+        mod.edit.close()
+      } else {
+        mod.edit.open()
+      };
+    },
     open: function() {
       helper.setObject({
         object: state.get(),
@@ -45,21 +52,6 @@ var link = (function() {
         newValue: false
       });
     },
-    toggle: function() {
-      if (state.get().link.edit) {
-        helper.setObject({
-          object: state.get(),
-          path: "link.edit",
-          newValue: false
-        });
-      } else {
-        helper.setObject({
-          object: state.get(),
-          path: "link.edit",
-          newValue: true
-        });
-      };
-    },
     check: function() {
       if (bookmarks.get().length <= 0) {
         helper.setObject({
@@ -71,38 +63,6 @@ var link = (function() {
     }
   };
 
-  mod.add = {
-    open: function() {
-      helper.setObject({
-        object: state.get(),
-        path: "link.add",
-        newValue: true
-      });
-    },
-    close: function() {
-      helper.setObject({
-        object: state.get(),
-        path: "link.add",
-        newValue: false
-      });
-    },
-    toggle: function() {
-      if (state.get().link.add) {
-        helper.setObject({
-          object: state.get(),
-          path: "link.add",
-          newValue: false
-        });
-      } else {
-        helper.setObject({
-          object: state.get(),
-          path: "link.add",
-          newValue: true
-        });
-      };
-    }
-  };
-
   var bind = {};
 
   bind.sort = function() {
@@ -164,90 +124,8 @@ var link = (function() {
 
   var render = {};
 
-  render.add = function() {
-    stagedLink.init();
-    var form = render.form();
-    modal.render.make({
-      heading: "Add a new bookmark",
-      successAction: function() {
-        stagedLink.data.timeStamp = new Date().getTime();
-        bookmarks.add(JSON.parse(JSON.stringify(stagedLink.data)));
-        data.save();
-        mod.add.close();
-        render.clear();
-        render.item.all();
-        render.tabindex();
-        sortable(".link-area");
-        control.dependents();
-        control.render();
-        stagedLink.reset();
-      },
-      cancelAction: function() {
-        mod.add.close();
-        stagedLink.reset();
-        autoSuggest.destroy();
-      },
-      actionText: "Add",
-      size: "small",
-      content: form
-    });
-  };
-
-  render.edit = function(bookmarkData) {
-    stagedLink.data = JSON.parse(JSON.stringify(bookmarkData));
-    var form = render.form();
-    if (stagedLink.data.display == "letter" || stagedLink.data.display == null) {
-      form.querySelector(".link-form-input-letter").removeAttribute("disabled");
-      form.querySelector(".link-form-input-icon").setAttribute("disabled", "");
-      form.querySelector(".form-group-text").setAttribute("disabled", "");
-      form.querySelector(".link-form-input-icon").setAttribute("disabled", "");
-      form.querySelector(".link-form-input-helper-icon").setAttribute("disabled", "");
-      form.querySelector(".link-form-icon-clear").setAttribute("disabled", "");
-      form.querySelector(".link-form-text-icon").tabIndex = -1;
-    } else if (stagedLink.data.display == "icon") {
-      form.querySelector(".link-form-input-letter").setAttribute("disabled", "");
-      form.querySelector(".link-form-input-icon").removeAttribute("disabled");
-      form.querySelector(".form-group-text").removeAttribute("disabled");
-      form.querySelector(".link-form-input-icon").removeAttribute("disabled");
-      form.querySelector(".link-form-input-helper-icon").removeAttribute("disabled");
-      form.querySelector(".link-form-icon-clear").removeAttribute("disabled");
-      form.querySelector(".link-form-input-display-icon").checked = true;
-      form.querySelector(".link-form-text-icon").tabIndex = 1;
-    };
-    if (stagedLink.data.icon.name != null && stagedLink.data.icon.prefix != null && stagedLink.data.icon.label != null) {
-      form.querySelector(".link-form-text-icon").appendChild(helper.node("span|class:link-form-icon " + stagedLink.data.icon.prefix + " fa-" + stagedLink.data.icon.name));
-    };
-    form.querySelector(".link-form-input-letter").value = stagedLink.data.letter;
-    form.querySelector(".link-form-input-icon").value = stagedLink.data.icon.label;
-    form.querySelector(".link-form-input-name").value = stagedLink.data.name;
-    form.querySelector(".link-form-input-url").value = stagedLink.data.url;
-    if (stagedLink.data.accent.override) {
-      form.querySelector(".link-form-input-color").value = helper.rgbToHex(stagedLink.data.accent.color);
-    };
-    modal.render.make({
-      heading: "Edit " + stagedLink.data.name,
-      successAction: function() {
-        bookmarks.edit(JSON.parse(JSON.stringify(stagedLink.data)));
-        data.save();
-        render.clear();
-        render.item.all();
-        render.tabindex();
-        render.previousFocus();
-        sortable(".link-area");
-        stagedLink.reset();
-      },
-      cancelAction: function() {
-        render.previousFocus();
-        stagedLink.reset();
-      },
-      actionText: "Save",
-      size: "small",
-      content: form
-    });
-  };
-
   render.remove = function(bookmarkData) {
-    modal.render.make({
+    modal.open({
       heading: "Remove " + bookmarkData.name + " bookmark",
       content: "Are you sure you want to remove this bookmark? This can not be undone.",
       successAction: function() {
@@ -258,17 +136,29 @@ var link = (function() {
         data.save();
         render.clear();
         render.item.all();
+        render.item.tabindex();
         render.previousFocus();
         sortable(".link-area");
         control.dependents();
         control.render();
+        shade.close();
+        pagelock.unlock();
       },
       cancelAction: function() {
         render.previousFocus();
+        shade.close();
+        pagelock.unlock();
       },
       actionText: "Remove",
       size: "small"
     });
+    shade.open({
+      action: function() {
+        modal.close();
+        pagelock.unlock();
+      }
+    });
+    pagelock.lock();
   };
 
   render.clear = function() {
@@ -552,7 +442,7 @@ var link = (function() {
 
       linkEdit.addEventListener("click", function() {
         _previousFocus = index;
-        render.edit(data);
+        render.item.edit(data);
       }, false);
       linkRemove.addEventListener("click", function() {
         _previousFocus = index;
@@ -560,6 +450,81 @@ var link = (function() {
       }, false);
 
       return linkItem;
+    },
+    edit: function(bookmarkData) {
+      stagedLink.data = JSON.parse(JSON.stringify(bookmarkData));
+      var form = render.form();
+      if (stagedLink.data.display == "letter" || stagedLink.data.display == null) {
+        form.querySelector(".link-form-input-letter").removeAttribute("disabled");
+        form.querySelector(".link-form-input-icon").setAttribute("disabled", "");
+        form.querySelector(".form-group-text").setAttribute("disabled", "");
+        form.querySelector(".link-form-input-icon").setAttribute("disabled", "");
+        form.querySelector(".link-form-input-helper-icon").setAttribute("disabled", "");
+        form.querySelector(".link-form-icon-clear").setAttribute("disabled", "");
+        form.querySelector(".link-form-text-icon").tabIndex = -1;
+      } else if (stagedLink.data.display == "icon") {
+        form.querySelector(".link-form-input-letter").setAttribute("disabled", "");
+        form.querySelector(".link-form-input-icon").removeAttribute("disabled");
+        form.querySelector(".form-group-text").removeAttribute("disabled");
+        form.querySelector(".link-form-input-icon").removeAttribute("disabled");
+        form.querySelector(".link-form-input-helper-icon").removeAttribute("disabled");
+        form.querySelector(".link-form-icon-clear").removeAttribute("disabled");
+        form.querySelector(".link-form-input-display-icon").checked = true;
+        form.querySelector(".link-form-text-icon").tabIndex = 1;
+      };
+      if (stagedLink.data.icon.name != null && stagedLink.data.icon.prefix != null && stagedLink.data.icon.label != null) {
+        form.querySelector(".link-form-text-icon").appendChild(helper.node("span|class:link-form-icon " + stagedLink.data.icon.prefix + " fa-" + stagedLink.data.icon.name));
+      };
+      form.querySelector(".link-form-input-letter").value = stagedLink.data.letter;
+      form.querySelector(".link-form-input-icon").value = stagedLink.data.icon.label;
+      form.querySelector(".link-form-input-name").value = stagedLink.data.name;
+      form.querySelector(".link-form-input-url").value = stagedLink.data.url;
+      if (stagedLink.data.accent.override) {
+        form.querySelector(".link-form-input-color").value = helper.rgbToHex(stagedLink.data.accent.color);
+      };
+      modal.open({
+        heading: "Edit " + stagedLink.data.name,
+        successAction: function() {
+          bookmarks.edit(JSON.parse(JSON.stringify(stagedLink.data)));
+          data.save();
+          render.clear();
+          render.item.all();
+          render.item.tabindex();
+          render.previousFocus();
+          sortable(".link-area");
+          stagedLink.reset();
+          shade.close();
+          pagelock.unlock();
+        },
+        cancelAction: function() {
+          render.previousFocus();
+          stagedLink.reset();
+          autoSuggest.destroy();
+          shade.close();
+          pagelock.unlock();
+        },
+        actionText: "Save",
+        size: "small",
+        content: form
+      });
+      shade.open({
+        action: function() {
+          modal.close();
+          pagelock.unlock();
+        }
+      });
+    },
+    tabindex: function() {
+      var allLinkControlItem = helper.eA(".link-control-item");
+      if (state.get().link.edit) {
+        allLinkControlItem.forEach(function(arrayItem, index) {
+          arrayItem.tabIndex = 1;
+        });
+      } else {
+        allLinkControlItem.forEach(function(arrayItem, index) {
+          arrayItem.tabIndex = -1;
+        });
+      };
     }
   };
 
@@ -582,19 +547,6 @@ var link = (function() {
     }
   };
 
-  render.tabindex = function() {
-    var allLinkControlItem = helper.eA(".link-control-item");
-    if (state.get().link.edit) {
-      allLinkControlItem.forEach(function(arrayItem, index) {
-        arrayItem.tabIndex = 1;
-      });
-    } else {
-      allLinkControlItem.forEach(function(arrayItem, index) {
-        arrayItem.tabIndex = -1;
-      });
-    };
-  };
-
   render.previousFocus = function() {
     if (_previousFocus != null) {
       var linkPanelFront = helper.eA(".link-panel-front");
@@ -759,13 +711,54 @@ var link = (function() {
   };
 
   var add = function() {
-    mod.add.open();
+    stagedLink.init();
-    render.add();
+    modal.open({
+      heading: "Add a new bookmark",
+      successAction: function() {
+        stagedLink.data.timeStamp = new Date().getTime();
+        bookmarks.add(JSON.parse(JSON.stringify(stagedLink.data)));
+        data.save();
+        render.clear();
+        render.item.all();
+        render.item.tabindex();
+        sortable(".link-area");
+        control.dependents();
+        control.render();
+        stagedLink.reset();
+        shade.close();
+        pagelock.unlock();
+      },
+      cancelAction: function() {
+        stagedLink.reset();
+        autoSuggest.destroy();
+        shade.close();
+        pagelock.unlock();
+      },
+      actionText: "Add",
+      size: "small",
+      content: render.form()
+    });
+    shade.open({
+      action: function() {
+        modal.close();
+        pagelock.unlock();
+      }
+    });
+    pagelock.lock();
+  };
+
+  var edit = function() {
+    mod.edit.toggle();
+  };
+
+  var tabindex = function() {
+    render.item.tabindex();
   };
 
   var init = function() {
     render.area.width();
     render.item.all();
+    render.item.tabindex();
     render.item.size();
     render.item.display.letter();
     render.item.display.icon();
@@ -778,7 +771,9 @@ var link = (function() {
     init: init,
     mod: mod,
     render: render,
-    add: add
+    add: add,
+    edit: edit,
+    tabindex: tabindex
   };
 
 })();

src/js/menu.js

@@ -18,23 +18,6 @@ var menu = (function() {
     });
   };
 
-  mod.toggle = function() {
-    if (state.get().menu) {
-      helper.setObject({
-        object: state.get(),
-        path: "menu",
-        newValue: false
-      });
-    } else {
-      render.scrollToTop();
-      helper.setObject({
-        object: state.get(),
-        path: "menu",
-        newValue: true
-      });
-    };
-  };
-
   var render = {};
 
   render.scrollToTop = function() {
@@ -45,7 +28,7 @@ var menu = (function() {
     };
   };
 
-  render.tab = function(menuNavButton, menuContentArea) {
+  render.nav = function(menuNavButton, menuContentArea) {
     var allMenuNavButton = helper.eA(".menu-nav-button");
     var allMenuContentArea = helper.eA(".menu-content-area");
     allMenuNavButton.forEach(function(arrayItem, index) {
@@ -56,27 +39,6 @@ var menu = (function() {
     });
     helper.addClass(menuNavButton, "active");
     helper.removeClass(menuContentArea, "is-hidden");
-    render.scrollToTop();
-  };
-
-  render.toggle = function() {
-    var html = helper.e("html");
-    if (state.get().menu) {
-      helper.addClass(html, "is-menu-open");
-      render.focus();
-      render.scrollToTop();
-      shade.render({
-        action: function() {
-          mod.close();
-          render.toggle();
-          render.tabindex.toggle();
-          pagelock.render.toggle();
-        }
-      });
-    } else {
-      helper.removeClass(html, "is-menu-open");
-      shade.destroy();
-    };
   };
 
   render.tabindex = {
@@ -100,30 +62,54 @@ var menu = (function() {
     helper.e(".menu").focus();
   };
 
-  var toggle = function() {
+  render.open = function() {
-    mod.toggle();
+    helper.addClass(helper.e("html"), "is-menu-open");
-    render.toggle();
+    render.focus();
+    render.scrollToTop();
     render.tabindex.toggle();
-    pagelock.render.toggle();
+  };
+
+  render.close = function() {
+    helper.removeClass(helper.e("html"), "is-menu-open");
+    render.tabindex.toggle();
+  };
+
+  var nav = function(button, area) {
+    render.nav(button, area);
+    render.scrollToTop();
+  };
+
+  var toggle = function() {
+    if (state.get().menu) {
+      close();
+    } else {
+      open();
+    };
   };
 
   var open = function() {
     mod.open();
-    render.toggle();
+    render.open();
-    render.tabindex.toggle();
+    shade.open({
-    pagelock.render.toggle();
+      action: function() {
+        mod.close();
+        render.close();
+        pagelock.unlock();
+      }
+    });
+    pagelock.lock();
   };
 
   var close = function() {
     mod.close();
-    render.toggle();
+    render.close();
-    render.tabindex.toggle();
+    shade.close();
-    pagelock.render.toggle();
+    pagelock.unlock();
   };
 
   var init = function() {
     mod.close();
-    render.toggle();
+    render.close();
   };
 
   return {
@@ -132,7 +118,8 @@ var menu = (function() {
     render: render,
     open: open,
     close: close,
-    toggle: toggle
+    toggle: toggle,
+    nav: nav
   };
 
 })();

src/js/modal.js

@@ -1,6 +1,6 @@
 var modal = (function() {
 
-  var previousModal = null;
+  var _previousModal = null;
 
   var mod = {};
 
@@ -22,16 +22,24 @@ var modal = (function() {
 
   var render = {};
 
-  render.clear = function() {
+  render.toggle = function(override) {
+    if (state.get().modal) {
+      render.open(override);
+    } else {
+      render.close();
+    };
+  };
+
+  render.close = function() {
     var allModal = helper.eA(".modal");
     if (allModal[0]) {
       for (var i = 0; i < allModal.length; i++) {
-        allModal[i].clear();
+        allModal[i].close();
       };
     };
   };
 
-  render.make = function(override) {
+  render.open = function(override) {
     var options = {
       heading: "Modal",
       content: "Body",
@@ -57,7 +65,7 @@ var modal = (function() {
       } else if (options.size) {
         modal.setAttribute("class", "modal");
       };
-      modal.clear = function() {
+      modal.close = function() {
         if (modal.classList.contains("is-opaque")) {
           helper.removeClass(modal, "is-opaque");
           helper.addClass(modal, "is-transparent");
@@ -115,52 +123,49 @@ var modal = (function() {
         if (options.successAction) {
           options.successAction();
         };
-        this.clear();
+        this.close();
-        shade.destroy();
-        pagelock.render.toggle();
       }.bind(modal), false);
       cancelButton.addEventListener("click", function(event) {
         if (options.cancelAction) {
           options.cancelAction();
         };
-        this.clear();
+        this.close();
-        shade.destroy();
-        pagelock.render.toggle();
       }.bind(modal), false);
-      previousModal = modal;
+      _previousModal = modal;
-      shade.render({
-        action: function() {
-          if (options.cancelAction) {
-            options.cancelAction();
-          };
-          modal.clear();
-          pagelock.render.toggle();
-        },
-        includeHeader: true
-      });
       body.appendChild(modal);
       getComputedStyle(modal).opacity;
       helper.removeClass(modal, "is-transparent");
       helper.addClass(modal, "is-opaque");
       modalHeading.focus(this);
     };
-    if (previousModal != null) {
+    if (_previousModal != null) {
-      render.clear();
+      render.close();
     };
     _makeModal();
-    pagelock.render.toggle();
+  };
+
+  var open = function(override) {
+    mod.open();
+    render.open(override);
+  };
+
+  var close = function() {
+    mod.close();
+    render.close();
   };
 
   var init = function() {
     mod.close();
-    render.clear();
+    render.close();
   };
 
   // exposed methods
   return {
     init: init,
     mod: mod,
-    render: render
+    render: render,
+    open: open,
+    close: close
   };
 
 })();

src/js/pagelock.js

@@ -1,32 +1,71 @@
 var pagelock = (function() {
 
+  var mod = {};
+
+  mod.lock = function() {
+    helper.setObject({
+      object: state.get(),
+      path: "pagelock",
+      newValue: true
+    });
+  };
+
+  mod.unlock = function() {
+    helper.setObject({
+      object: state.get(),
+      path: "pagelock",
+      newValue: false
+    });
+  };
+
+  mod.toggle = function() {
+    if (state.get().menu || state.get().modal || state.get().autoSuggest) {
+      mod.lock();
+    } else {
+      mod.unlock();
+    };
+  };
+
   var render = {};
 
-  render.toggle = function() {
-    var body = helper.e("body");
-    var menu = state.get().menu;
-    var modal = state.get().modal;
-    var autoSuggest = state.get().autoSuggest;
-    if (menu || modal || autoSuggest) {
-      helper.addClass(body, "scroll-disabled");
-    } else {
-      helper.removeClass(body, "scroll-disabled");
-    };
-  };
-
   render.lock = function() {
-    var body = helper.e("body");
+    helper.addClass(helper.e("body"), "scroll-disabled");
-    helper.addClass(body, "scroll-disabled");
   };
 
   render.unlock = function() {
-    var body = helper.e("body");
+    helper.removeClass(helper.e("body"), "scroll-disabled");
-    helper.removeClass(body, "scroll-disabled");
+  };
+
+  render.toggle = function() {
+    if (state.get().pagelock) {
+      render.lock();
+    } else {
+      render.unlock();
+    };
+  };
+
+  var lock = function() {
+    mod.lock();
+    render.toggle();
+  };
+
+  var unlock = function() {
+    mod.unlock();
+    render.unlock();
+  };
+
+  var toggle = function() {
+    mod.toggle();
+    render.toggle();
   };
 
   // exposed methods
   return {
-    render: render
+    mod: mod,
+    render: render,
+    toggle: toggle,
+    lock: lock,
+    unlock: unlock
   };
 
 })();

src/js/shade.js

@@ -1,39 +1,80 @@
 var shade = (function() {
 
-  var previousShade = null;
+  var _previousShade = null;
 
-  var destroy = function() {
+  var mod = {};
+
+  mod.open = function() {
+    helper.setObject({
+      object: state.get(),
+      path: "shade",
+      newValue: true
+    });
+  };
+
+  mod.close = function() {
+    helper.setObject({
+      object: state.get(),
+      path: "shade",
+      newValue: false
+    });
+  };
+
+  mod.toggle = function() {
+    if (state.get().shade) {
+      helper.setObject({
+        object: state.get(),
+        path: "shade",
+        newValue: false
+      });
+    } else {
+      helper.setObject({
+        object: state.get(),
+        path: "shade",
+        newValue: true
+      });
+    };
+  };
+
+  var render = {};
+
+  render.toggle = function(override) {
+    if (state.get().shade) {
+      render.open(override);
+    } else {
+      render.close();
+    };
+  };
+
+  render.close = function() {
     var allShade = helper.eA(".shade");
     if (allShade[0]) {
       for (var i = 0; i < allShade.length; i++) {
-        allShade[i].destroy();
+        allShade[i].close();
       };
     };
   };
 
-  var render = function(override) {
+  render.open = function(override) {
     var options = {
       action: null
     };
     if (override) {
       options = helper.applyOptions(options, override);
     };
-    var _destroyPreviousShade = function() {
-      if (previousShade != null) {
-        destroy();
-      };
-    };
     var _makeShade = function() {
+      mod.open();
       var body = helper.e("body");
       var shade = document.createElement("div");
       shade.setAttribute("class", "shade");
-      shade.destroy = function() {
+      shade.close = function() {
         if (shade.classList.contains("is-opaque")) {
           helper.removeClass(shade, "is-opaque");
           helper.addClass(shade, "is-transparent");
         } else {
           shade.remove();
         };
+        mod.close();
       };
       shade.addEventListener("transitionend", function(event, elapsed) {
         if (event.propertyName === "opacity" && getComputedStyle(this).opacity == 0) {
@@ -44,25 +85,46 @@ var shade = (function() {
         };
       }.bind(shade), false);
       shade.addEventListener("click", function() {
-        this.destroy();
         if (options.action) {
           options.action();
         };
+        this.close();
       }, false);
-      previousShade = shade;
+      _previousShade = shade;
       body.appendChild(shade);
       getComputedStyle(shade).opacity;
       helper.removeClass(shade, "is-transparent");
       helper.addClass(shade, "is-opaque");
     };
-    _destroyPreviousShade();
+    if (_previousShade != null) {
+      render.close();
+    };
     _makeShade();
   };
 
+  var open = function(override) {
+    mod.open();
+    render.open(override);
+  };
+
+  var close = function() {
+    mod.close();
+    render.close();
+  };
+
+  var init = function() {
+    mod.close();
+    render.close();
+  };
+
   // exposed methods
   return {
-    destroy: destroy,
+    init: init,
-    render: render
+    mod: mod,
+    render: render,
+    open: open,
+    close: close,
+    toggle: toggle
   };
 
 })();

src/js/state.js

@@ -166,7 +166,6 @@ var state = (function() {
       },
       show: true,
       edit: false,
-      add: false,
       style: "block"
     },
     layout: {
@@ -209,6 +208,8 @@ var state = (function() {
         accent: 0
       }
     },
+    pagelock: false,
+    shade: false,
     edge: false,
     search: false,
     menu: false,

src/js/update.js

@@ -581,6 +581,11 @@ var update = (function() {
         data: ""
       };
       return data;
+    },
+    "3.50.0": function(data) {
+      data.state.pagelock = false;
+      data.state.shade = false;
+      return data;
     }
   };
 

src/js/version.js

@@ -1,6 +1,6 @@
 var version = (function() {
 
-  var current = "3.49.0";
+  var current = "3.50.0";
 
   var compare = function(a, b) {
     var pa = a.split(".");

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": "3.49.0",
+  "version": "3.50.0",
   "manifest_version": 2,
   "chrome_url_overrides": {
     "newtab": "index.html"