[feature] adding control for page title

index.html

@@ -320,6 +320,10 @@
               <input id="control-layout-scroll-past-end" class="control-layout-scroll-past-end" type="checkbox" tabindex="1">
               <label for="control-layout-scroll-past-end"><span class="label-icon"></span>Scroll past end</label>
             </div>
+            <div class="input-wrap">
+              <label for="control-layout-title">Title</label>
+              <input id="control-layout-title" class="control-layout-title" type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="New Tab" tabindex="1">
+            </div>
           </div>
           <div class="menu-item">
             <h1 class="menu-header">Theme</h1>
@@ -410,6 +414,7 @@
 <script src="js/version.js"></script>
 <script src="js/keyboard.js"></script>
 <script src="js/background.js"></script>
+<script src="js/title.js"></script>
 <script src="js/init.js"></script>
 
 </html>

js/control.js

@@ -383,6 +383,13 @@ var control = (function() {
     func: function() {
       render();
     }
+  }, {
+    element: helper.e(".control-layout-title"),
+    path: "layout.title",
+    type: "text",
+    func: function() {
+      title.render();
+    }
   }, {
     element: helper.e(".control-layout-theme-random-active"),
     path: "layout.theme.random.active",

js/init.js

@@ -51,3 +51,6 @@ background.init();
 // render search engine
 // focus seach input
 search.init();
+
+// render page title
+title.init();

js/state.js

@@ -70,6 +70,7 @@ var state = (function() {
     layout: {
       width: "wide",
       scrollPastEnd: true,
+      title: "New Tab",
       theme: {
         current: {
           r: 0,

js/title.js

@@ -0,0 +1,17 @@
+var title = (function() {
+
+  var render = function() {
+    helper.e("title").textContent = state.get().layout.title;
+  };
+
+  var init = function() {
+    render();
+  };
+
+  // exposed methods
+  return {
+    render: render,
+    init: init
+  };
+
+})();

js/update.js

@@ -124,6 +124,12 @@ var update = (function() {
     return data;
   };
 
+  var _update_280 = function(data) {
+    data.state.layout.title = "New Tab";
+    data.version = 2.80;
+    return data;
+  };
+
   // var _update_300 = function(data) {
   //   data.version = 3.00;
   //   return data;
@@ -158,6 +164,10 @@ var update = (function() {
       console.log("\trunning update", 2.70);
       data = _update_270(data);
     };
+    if (data.version < 2.80) {
+      console.log("\trunning update", 2.80);
+      data = _update_280(data);
+    };
     // if (data.version < 3.00) {
     //   console.log("\t# running update", 3.00);
     //   data = _update_300(data);

js/version.js

@@ -1,7 +1,7 @@
 var version = (function() {
 
   // version is normally bumped when the state needs changing or any new functionality is added
-  var current = "2.7.0";
+  var current = "2.8.0";
 
   var get = function() {
     var number = current.split(".");