add a forget button. clean up toolbar a bit

www/code/main.js

@@ -183,17 +183,23 @@ define([
                 var config = {
                     userData: userList,
                     changeNameID: 'cryptpad-changeName',
-                    exportContentID: 'cryptpad-saveContent',
-                    importContentID: 'cryptpad-loadContent',
                 };
                 toolbar = info.realtime.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, info.userList, config);
                 createChangeName('cryptpad-changeName', $bar);
 
-                /*  Let the user export their content with a click */
+                var $rightside = $bar.find('.rtwysiwyg-toolbar-rightside');
-                $bar.find('#cryptpad-saveContent').click(exportText);
 
-                /*  Let the user import content with a click */
+                /* add an export button */
-                $bar.find('#cryptpad-loadContent')
+                var $export = $('<button>')
+                    .text('EXPORT')
+                    .addClass('rightside-button')
+                    .click(exportText);
+                $rightside.append($export);
+
+                /* add an import button */
+                var $import = $('<button>')
+                    .text('IMPORT')
+                    .addClass('rightside-button')
                     .click(Cryptpad.importContent('text/plain', function (content, file) {
                         var mime = CodeMirror.findModeByMIME(file.type);
 
@@ -211,11 +217,14 @@ define([
                         editor.setValue(content);
                         onLocal();
                     }));
+                $rightside.append($import);
 
+                /* add a rename button */
                 var $setTitle = $('<button>', {
                         id: 'name-pad'
                     })
-                    .addClass('cryptpad-rename')
+                    .addClass('rightside-button')
+                    .text('RENAME')
                     .click(function () {
                         var title = window.prompt("How would you like this pad to be titled?",
                             Cryptpad.getPadTitle());
@@ -228,9 +237,24 @@ define([
                         Cryptpad.setPadTitle(title);
                         document.title = title;
                     });
+                $rightside.append($setTitle);
+
+                /* add a forget button */
+                var $forgetPad = $('<button>', {
+                        id: 'cryptpad-forget',
+                    })
+                    .text('FORGET')
+                    .addClass('cryptpad-forget rightside-button')
+                    .click(function () {
+                        var href = window.location.href;
+                        var question = "Clicking OK will remove the URL for this pad from localStorage, are you sure?";
 
-                $bar.find('.rtwysiwyg-toolbar-rightside')
+                        if (window.confirm(question)) {
-                    .append($setTitle);
+                            Cryptpad.forgetPad(href);
+                            document.title = window.location.hash.slice(1,9);
+                        }
+                    });
+                $rightside.append($forgetPad);
 
                 /*  Let the user select different syntax highlighting modes */
                 var syntaxDropdown = '<select title="syntax highlighting" id="language-mode">\n' +
@@ -252,16 +276,14 @@ define([
                     }).join('\n') +
                     '</select>';
 
-                $bar.find('.rtwysiwyg-toolbar-rightside')
+                $rightside.append(syntaxDropdown);
-                    .append(syntaxDropdown);
 
                 var $language = module.$language = $bar.find('#language-mode').on('change', function () {
                     var mode = $language.val();
                     setMode(mode);
                 });
 
-                $bar.find('.rtwysiwyg-toolbar-rightside')
+                $rightside.append(themeDropdown);
-                    .append(themeDropdown);
 
                 var $theme = $bar.find('select#display-theme');
 

www/common/toolbar.js

@@ -14,10 +14,6 @@ define([
     /** Id of the div containing the lag info. */
     var LAG_ELEM_CLS = 'rtwysiwyg-lag';
 
-    var SAVE_ELEMENT_CLS = 'cryptpad-saveContent';
-    var LOAD_ELEMENT_CLS = 'cryptpad-loadContent';
-    var SET_TITLE_CLS = 'cryptpad-rename';
-
     /** The toolbar class which contains the user list, debug link and lag. */
     var TOOLBAR_CLS = 'rtwysiwyg-toolbar';
 
@@ -118,22 +114,16 @@ define([
     padding-right: 5px;
     padding-left: 5px;
 }
-.{{TOOLBAR_CLS}} .{{SAVE_ELEMENT_CLS}}, .{{TOOLBAR_CLS}} .{{LOAD_ELEMENT_CLS}}, .{{TOOLBAR_CLS}} .{{SET_TITLE_CLS}} {
+.{{TOOLBAR_CLS}} .rightside-button {
     float: right;
-    margin-right: 5px;
     cursor: pointer;
 }
-.{{TOOLBAR_CLS}} .{{SAVE_ELEMENT_CLS}}:after {
-    content: 'EXPORT';
-}
 
-.{{TOOLBAR_CLS}} .{{LOAD_ELEMENT_CLS}}:after {
+.{{TOOLBAR_CLS}} .leftside-button {
-    content: 'IMPORT';
+    cursor: pointer;
+    float: left;
 }
 
-.{{TOOLBAR_CLS}} .{{SET_TITLE_CLS}}:after {
-    content: 'RENAME';
-}
 .{{TOOLBAR_CLS}} select {
     border: 0px;
     margin-left: 5px;
@@ -143,9 +133,6 @@ define([
 </style>
         */}.toString().slice(14,-3), {
             TOOLBAR_CLS: TOOLBAR_CLS,
-            SAVE_ELEMENT_CLS: SAVE_ELEMENT_CLS,
-            LOAD_ELEMENT_CLS: LOAD_ELEMENT_CLS,
-            SET_TITLE_CLS: SET_TITLE_CLS,
             USERNAME_BUTTON_GROUP: USERNAME_BUTTON_GROUP,
             DEBUG_LINK_CLS: DEBUG_LINK_CLS,
         }).trim();
@@ -230,16 +217,6 @@ define([
         return $container.find('#'+id)[0];
     };
 
-    var createSaveElement = function (id, $container) {
-        $container.append('<button class="'+ SAVE_ELEMENT_CLS + '" id="' + id + '"></button>');
-        return $container.find('#'+id)[0];
-    };
-
-    var createLoadElement = function (id, $container) {
-        $container.append('<button class="'+ LOAD_ELEMENT_CLS + '" id="' + id + '"></button>');
-        return $container.find('#'+id)[0];
-    };
-
     var checkLag = function (getLag, lagElement) {
         if(typeof getLag !== "function") { return; }
         var lag = getLag();
@@ -277,14 +254,6 @@ define([
             userListElement = createChangeName($container, userListElement, changeNameID);
         }
 
-        if (saveContentID) {
-            saveElement = createSaveElement(saveContentID, toolbar.find('.rtwysiwyg-toolbar-rightside'));
-        }
-
-        if (loadContentID) {
-            loadElement = createLoadElement(loadContentID, toolbar.find('.rtwysiwyg-toolbar-rightside'));
-        }
-
         var connected = false;
 
         userList.onChange = function(newUserData) {

www/pad/main.js

@@ -354,27 +354,35 @@ define([
                 var config = {
                     userData: userList,
                     changeNameID: 'cryptpad-changeName',
-                    exportContentID: 'cryptpad-saveContent',
-                    importContentID: 'cryptpad-loadContent',
                 };
                 toolbar = info.realtime.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, info.userList, config);
                 createChangeName('cryptpad-changeName', $bar);
 
-                var $saver = $bar.find('#cryptpad-saveContent').click(exportFile);
+                var $rightside = $bar.find('.rtwysiwyg-toolbar-rightside');
+
+                /* add an export button */
+                var $export = $('<button>')
+                    .text('EXPORT')
+                    .addClass('rightside-button')
+                    .click(exportFile);
 
-                $bar.find('#cryptpad-loadContent')
+                /* add an import button */
+                var $import = $('<button>')
+                    .text('IMPORT')
+                    .addClass('rightside-button')
                     .click(Cryptpad.importContent('text/plain', function (content) {
                         var shjson = stringify(Hyperjson.fromDOM(domFromHTML(content).body));
                         applyHjson(shjson);
                         realtimeOptions.onLocal();
                     }));
+                $rightside.append($export).append($import);
 
-                var $rightside = $bar.find('.rtwysiwyg-toolbar-rightside');
+                /* add a rename button */
-
                 var $rename = $('<button>', {
                         id: 'name-pad',
                     })
-                    .addClass('cryptpad-rename')
+                    .addClass('cryptpad-rename rightside-button')
+                    .text('RENAME')
                     .click(function () {
                         var suggestion = $(inner).find('h1:first-of-type').text();
 
@@ -389,9 +397,25 @@ define([
                         Cryptpad.setPadTitle(title);
                         document.title = title;
                     });
-
                 $rightside.append($rename);
 
+                /* add a forget button */
+                var $forgetPad = $('<button>', {
+                        id: 'cryptpad-forget',
+                    })
+                    .text("FORGET")
+                    .addClass('cryptpad-forget rightside-button')
+                    .click(function () {
+                        var href = window.location.href;
+                        var question = "Clicking OK will remove the URL for this pad from localStorage, are you sure?";
+
+                        if (window.confirm(question)) {
+                            Cryptpad.forgetPad(href);
+                            document.title = window.location.hash.slice(1,9);
+                        }
+                    });
+                $rightside.append($forgetPad);
+
                 // set the hash
                 window.location.hash = info.channel + secret.key;