Merge branch 'staging' into framework

customize.dist/pages.js

@@ -570,15 +570,12 @@ define([
     };
 
     var appToolbar = function () {
-        return h('div#toolbar.cryptpad-toolbar');
-    };
-    var appToolbar3 = function () {
         return h('div#cp-toolbar.cp-toolbar-container');
     };
 
     Pages['/whiteboard/'] = Pages['/whiteboard/index.html'] = function () {
         return [
-            appToolbar3(),
+            appToolbar(),
             h('div#cp-app-whiteboard-canvas-area', h('canvas#cp-app-whiteboard-canvas', {
                 width: 600,
                 height: 600
@@ -639,47 +636,49 @@ define([
     Pages['/poll/'] = Pages['/poll/index.html'] = function () {
         return [
             appToolbar(),
-            h('div#content', [
+            h('div#cp-app-poll-content', [
-                h('div#poll', [
+                h('div#cp-app-poll-form', [
-                    h('div#howItWorks', [
+                    h('div#cp-app-poll-help', [
                         h('h1', 'CryptPoll'),
                         setHTML(h('h2'), Msg.poll_subtitle),
                         h('p', Msg.poll_p_save),
                         h('p', Msg.poll_p_encryption)
                     ]),
-                    h('div.upper', [
+                    h('div.cp-app-poll-realtime', [
-                        h('button#publish.btn.btn-success', {
-                            style: { display: 'none' }
-                        }, Msg.poll_publish_button),
-                        h('button#admin.btn.btn-primary', {
-                            style: { display: 'none' },
-                            title: Msg.poll_admin_button
-                        }, Msg.poll_admin_button),
-                        h('button#help.btn.btn-secondary', {
-                            title: Msg.poll_show_help_button
-                        }, Msg.poll_show_help_button)
-                    ]),
-                    h('div.realtime', [
                         h('br'),
-                        h('center', [
+                        h('div', [
-                            h('textarea#description', {
+                            h('textarea#cp-app-poll-description', {
                                 rows: "5",
                                 cols: "50",
+                                placeholder: Msg.poll_descriptionHint,
                                 disabled: true
                             }),
+                            h('div#cp-app-poll-description-published'),
                             h('br')
                         ]),
-                        h('div#tableContainer', [
+                        h('div#cp-app-poll-table-container', [
-                            h('div#tableScroll'),
+                            h('div#cp-app-poll-table-scroll'),
-                            h('button#create-user.btn.btn-secondary', {
+                            h('button#cp-app-poll-create-user.btn.btn-secondary', {
                                 title: Msg.poll_create_user
                             }, h('span.fa.fa-plus')),
-                            h('button#create-option.btn.btn-secondary', {
+                            h('button#cp-app-poll-create-option.btn.btn-secondary', {
                                 title: Msg.poll_create_option
                             }, h('span.fa.fa-plus')),
-                            h('button#commit.btn.btn-secondary', {
+                        ]),
-                                title: Msg.poll_commit
+                        h('div#cp-app-poll-comments', [
-                            }, h('span.fa.fa-check'))
+                            h('h2#cp-app-poll-comments-add-title', Msg.poll_comment_add),
+                            h('div#cp-app-poll-comments-add', [
+                                h('input.cp-app-poll-comments-add-name', {
+                                    type: 'text'
+                                }),
+                                h('textarea.cp-app-poll-comments-add-msg'),
+                                h('button.cp-app-poll-comments-add-submit.btn.btn-secondary',
+                                    Msg.poll_comment_submit),
+                                h('button.cp-app-poll-comments-add-cancel.btn.btn-secondary',
+                                    Msg.cancel)
+                            ]),
+                            h('h2#cp-app-poll-comments-list-title', Msg.poll_comment_list),
+                            h('div#cp-app-poll-comments-list')
                         ])
                     ])
                 ])

customize.dist/src/less2/main.less

@@ -31,6 +31,6 @@ body.cp-app-slide { @import "../../../slide/app-slide.less"; }
 body.cp-app-file { @import "../../../file/app-file.less"; }
 body.cp-app-filepicker { @import "../../../filepicker/app-filepicker.less"; }
 body.cp-app-contacts {   @import "../../../contacts/app-contacts.less";    }
-//body.cp-app-poll { @import "../../../poll/app-poll.less"; }
+body.cp-app-poll { @import "../../../poll/app-poll.less"; }
 body.cp-app-whiteboard { @import "../../../whiteboard/app-whiteboard.less"; }
 

customize.dist/translations/messages.fr.js

@@ -245,7 +245,9 @@ define(function () {
     out.poll_removeUser = "Êtes-vous sûr de vouloir supprimer cet utilisateur ?";
 
     out.poll_titleHint = "Titre";
-    out.poll_descriptionHint = "Description";
+    out.poll_descriptionHint = "Décrivez votre sondage puis cliquer sur le bouton ✓ (Publier).\n" +
+                               "La description peut contenir de la syntaxe markdown, et vous pouvez y ajouter des images stockées dans votre CryptDrive.\n" +
+                               "Toutes les personnes possédant le lien d'édition de ce sondage peuvent modifier la description, bien que ce soit déconseillé.";
 
     out.poll_remove = "Supprimer";
     out.poll_edit = "Modifier";
@@ -255,6 +257,15 @@ define(function () {
     out.poll_show_help_button = "Afficher l'aide";
     out.poll_hide_help_button = "Cacher l'aide";
 
+    out.poll_bookmark_col = "Marquer cette colonne comme favorite pour qu'elle soit toujours déverouillée et affichée en première position.";
+    out.poll_bookmarked_col = "Voici votre colonne favorite; elle sera toujours dévérouillée et affichée en première position.";
+    out.poll_total = 'TOTAL';
+
+    out.poll_comment_list = "Commentaires";
+    out.poll_comment_add = "Ajouter un commentaire";
+    out.poll_comment_submit = "Envoyer";
+    out.poll_comment_remove = "Supprimer ce commentaire";
+
     // Canvas
     out.canvas_clear = "Nettoyer";
     out.canvas_delete = "Supprimer la sélection";

customize.dist/translations/messages.js

@@ -250,7 +250,9 @@ define(function () {
     out.poll_removeUser = "Are you sure you'd like to remove this user?";
 
     out.poll_titleHint = "Title";
-    out.poll_descriptionHint = "Describe your poll, and use the 'publish' button when you're done. Anyone with the link can change the description, but this is discouraged.";
+    out.poll_descriptionHint = "Describe your poll, and use the ✓ (publish) button when you're done.\n" +
+                               "The description can be written using markdown syntax and you can embed media elements from your CryptDrive.\n" +
+                               "Anyone with the link can change the description, but this is discouraged.";
 
     out.poll_remove = "Remove";
     out.poll_edit = "Edit";
@@ -260,6 +262,15 @@ define(function () {
     out.poll_show_help_button = "Show help";
     out.poll_hide_help_button = "Hide help";
 
+    out.poll_bookmark_col = 'Bookmark this column so that it is always unlocked and displayed at the beginning for you';
+    out.poll_bookmarked_col = 'This is your bookmarked column. It will always be unlocked and displayed at the beginning for you.';
+    out.poll_total = 'TOTAL';
+
+    out.poll_comment_list = "Comments";
+    out.poll_comment_add = "Add a comment";
+    out.poll_comment_submit = "Send";
+    out.poll_comment_remove = "Delete this comment";
+
     // Canvas
     out.canvas_clear = "Clear";
     out.canvas_delete = "Delete selection";
@@ -385,6 +396,7 @@ define(function () {
     out.fc_remove = "Delete permanently";
     out.fc_empty = "Empty the trash";
     out.fc_prop = "Properties";
+    out.fc_hashtag = "Tags";
     out.fc_sizeInKilobytes = "Size in Kilobytes";
     // fileObject.js (logs)
     out.fo_moveUnsortedError = "You can't move a folder to the list of unsorted pads";

www/common/common-interface.js

@@ -191,6 +191,8 @@ define([
 
         var listener;
         var close = Util.once(function (result, ev) {
+            ev.stopPropagation();
+            ev.preventDefault();
             var $frame = $(tagger).fadeOut(150, function () {
                 stopListening(listener);
                 $frame.remove();
@@ -198,17 +200,21 @@ define([
             });
         });
 
-        var $ok = findOKButton(tagger).click(function () {
+        var $ok = findOKButton(tagger).click(function (e) {
             var tokens = field.getTokens();
-            close(tokens);
+            close(tokens, e);
         });
-        var $cancel = findCancelButton(tagger).click(function () {
+        var $cancel = findCancelButton(tagger).click(function (e) {
-            close(null);
+            close(null, e);
         });
         listenForKeys(function () {
             $ok.click();
         }, function () {
             $cancel.click();
+        }, tagger);
+
+        $(tagger).on('click submit', function (e) {
+            e.stopPropagation();
         });
 
         document.body.appendChild(tagger);
@@ -503,7 +509,7 @@ define([
         var $icon = $defaultIcon.clone();
 
         if (AppConfig.applicationsIcon && AppConfig.applicationsIcon[type]) {
-            var appClass = ' cp-icon-color-'+type;
+            var appClass = ' cp-icon cp-icon-color-'+type;
             $icon = $('<span>', {'class': 'fa ' + AppConfig.applicationsIcon[type] + appClass});
         }
 

www/common/pdfjs/web/viewer.js

@@ -341,6 +341,7 @@ function isDataSchema(url) {
   return url.substr(i, 5).toLowerCase() === 'data:';
 }
 function getPDFFileNameFromURL(url) {
+  url = document.location.href;
   var query;
   var title;
   if (/\#/.test(url)) {

www/common/sframe-common-codemirror.js

@@ -10,6 +10,58 @@ define([
     var saveAs = window.saveAs;
     var module = {};
 
+    var cursorToPos = function(cursor, oldText) {
+        var cLine = cursor.line;
+        var cCh = cursor.ch;
+        var pos = 0;
+        var textLines = oldText.split("\n");
+        for (var line = 0; line <= cLine; line++) {
+            if(line < cLine) {
+                pos += textLines[line].length+1;
+            }
+            else if(line === cLine) {
+                pos += cCh;
+            }
+        }
+        return pos;
+    };
+
+    var posToCursor = function(position, newText) {
+        var cursor = {
+            line: 0,
+            ch: 0
+        };
+        var textLines = newText.substr(0, position).split("\n");
+        cursor.line = textLines.length - 1;
+        cursor.ch = textLines[cursor.line].length;
+        return cursor;
+    };
+
+    module.setValueAndCursor = function (editor, oldDoc, remoteDoc, TextPatcher) {
+        var scroll = editor.getScrollInfo();
+        //get old cursor here
+        var oldCursor = {};
+        oldCursor.selectionStart = cursorToPos(editor.getCursor('from'), oldDoc);
+        oldCursor.selectionEnd = cursorToPos(editor.getCursor('to'), oldDoc);
+
+        editor.setValue(remoteDoc);
+        editor.save();
+
+        var op = TextPatcher.diff(oldDoc, remoteDoc);
+        var selects = ['selectionStart', 'selectionEnd'].map(function (attr) {
+            return TextPatcher.transformCursor(oldCursor[attr], op);
+        });
+
+        if(selects[0] === selects[1]) {
+            editor.setCursor(posToCursor(selects[0], remoteDoc));
+        }
+        else {
+            editor.setSelection(posToCursor(selects[0], remoteDoc), posToCursor(selects[1], remoteDoc));
+        }
+
+        editor.scrollTo(scroll.left, scroll.top);
+    };
+
     module.create = function (Common, defaultMode, CMeditor) {
         var exp = {};
         var Messages = Cryptpad.Messages;
@@ -242,56 +294,8 @@ define([
             return { content: content };
         };
 
-        var cursorToPos = function(cursor, oldText) {
-            var cLine = cursor.line;
-            var cCh = cursor.ch;
-            var pos = 0;
-            var textLines = oldText.split("\n");
-            for (var line = 0; line <= cLine; line++) {
-                if(line < cLine) {
-                    pos += textLines[line].length+1;
-                }
-                else if(line === cLine) {
-                    pos += cCh;
-                }
-            }
-            return pos;
-        };
-
-        var posToCursor = function(position, newText) {
-            var cursor = {
-                line: 0,
-                ch: 0
-            };
-            var textLines = newText.substr(0, position).split("\n");
-            cursor.line = textLines.length - 1;
-            cursor.ch = textLines[cursor.line].length;
-            return cursor;
-        };
-
         exp.setValueAndCursor = function (oldDoc, remoteDoc, TextPatcher) {
-            var scroll = editor.getScrollInfo();
+            return module.setValueAndCursor(editor, oldDoc, remoteDoc, TextPatcher);
-            //get old cursor here
-            var oldCursor = {};
-            oldCursor.selectionStart = cursorToPos(editor.getCursor('from'), oldDoc);
-            oldCursor.selectionEnd = cursorToPos(editor.getCursor('to'), oldDoc);
-
-            editor.setValue(remoteDoc);
-            editor.save();
-
-            var op = TextPatcher.diff(oldDoc, remoteDoc);
-            var selects = ['selectionStart', 'selectionEnd'].map(function (attr) {
-                return TextPatcher.transformCursor(oldCursor[attr], op);
-            });
-
-            if(selects[0] === selects[1]) {
-                editor.setCursor(posToCursor(selects[0], remoteDoc));
-            }
-            else {
-                editor.setSelection(posToCursor(selects[0], remoteDoc), posToCursor(selects[1], remoteDoc));
-            }
-
-            editor.scrollTo(scroll.left, scroll.top);
         };
 
         /////

www/common/sframe-common-interface.js

@@ -28,6 +28,20 @@ define([
      *  - createDropdown
     */
 
+    UI.updateTags = function (common, href) {
+        var sframeChan = common.getSframeChannel();
+        sframeChan.query('Q_TAGS_GET', href || null, function (err, res) {
+            if (err || res.error) { return void console.error(err || res.error); }
+            Cryptpad.dialog.tagPrompt(res.data, function (tags) {
+                if (!Array.isArray(tags)) { return; }
+                sframeChan.event('EV_TAGS_SET', {
+                    tags: tags,
+                    href: href,
+                });
+            });
+        });
+    };
+
     UI.createButton = function (common, type, rightside, data, callback) {
         var AppConfig = common.getAppConfig();
         var button;
@@ -202,16 +216,7 @@ define([
                     title: Messages.tags_title,
                 })
                 .click(common.prepareFeedback(type))
-                .click(function () {
+                .click(function () { UI.updateTags(null); });
-                    sframeChan.query('Q_TAGS_GET', null, function (err, res) {
-                        if (err || res.error) { return void console.error(err || res.error); }
-                        Cryptpad.dialog.tagPrompt(res.data, function (tags) {
-                            if (!Array.isArray(tags)) { return; }
-                            console.error(tags);
-                            sframeChan.event('EV_TAGS_SET', tags);
-                        });
-                    });
-                });
                 break;
             default:
                 button = $('<button>', {

www/common/sframe-common-outer.js

@@ -65,6 +65,7 @@ define([
                 Cryptpad.ready(waitFor());
             }));
         }).nThen(function (waitFor) {
+            $('#sbox-iframe').focus();
 
             sframeChan.on('EV_CACHE_PUT', function (x) {
                 Object.keys(x).forEach(function (k) {
@@ -401,7 +402,7 @@ define([
             });
 
             sframeChan.on('Q_TAGS_GET', function (data, cb) {
-                Cryptpad.getPadTags(null, function (err, data) {
+                Cryptpad.getPadTags(data, function (err, data) {
                     cb({
                         error: err,
                         data: data
@@ -410,8 +411,7 @@ define([
             });
 
             sframeChan.on('EV_TAGS_SET', function (data) {
-                console.log(data);
+                Cryptpad.resetTags(data.href, data.tags);
-                Cryptpad.resetTags(null, data);
             });
 
             sframeChan.on('Q_PIN_GET_USAGE', function (data, cb) {

www/common/sframe-common-title.js

@@ -21,6 +21,7 @@ define([
         var $title;
         exp.setToolbar = function (toolbar) {
             $title = toolbar && (toolbar.title || toolbar.pageTitle);
+            console.log('SET TOOLBAR');
         };
 
         exp.getTitle = function () { return exp.title; };

www/common/sframe-common.js

@@ -78,6 +78,7 @@ define([
     funcs.displayAvatar = callWithCommon(UI.displayAvatar);
     funcs.createButton = callWithCommon(UI.createButton);
     funcs.createUsageBar = callWithCommon(UI.createUsageBar);
+    funcs.updateTags = callWithCommon(UI.updateTags);
 
     // History
     funcs.getHistory = callWithCommon(History.create);

www/common/toolbar3.js

@@ -228,7 +228,7 @@ define([
                 $span.append($rightCol);
             } else {
                 Common.displayAvatar($span, data.avatar, name, function ($img) {
-                    if (data.avatar && $img) {
+                    if (data.avatar && $img.length) {
                         avatars[data.avatar] = $img[0].outerHTML;
                     }
                     $span.append($rightCol);
@@ -448,7 +448,7 @@ define([
                 var $content = $('<div>');
                 $('<input>', {'style':'display:none;'}).appendTo($content);
                 $('<h3>').text(Messages.viewEmbedTitle).appendTo($content);
-                var $tag = $('<p>').text(Messages.fileEmbedTag).appendTo($content);
+                var $tag = $('<p>').text(Messages.viewEmbedTag).appendTo($content);
                 $('<br>').appendTo($tag);
                 var iframeId = uid();
                 var iframeEmbed = '<iframe src="' + url + '"></iframe>';

www/drive/app-drive.less

@@ -6,11 +6,13 @@
 @import (once) '../../customize/src/less2/include/leftside-menu.less';
 @import (once) "../../customize/src/less2/include/tools.less";
 @import (once) "../../customize/src/less2/include/limit-bar.less";
+@import (once) "../../customize/src/less2/include/tokenfield.less";
 
 .toolbar_main();
 .fileupload_main();
 .alertify_main();
 .limit-bar_main();
+.tokenfield_main();
 
 @drive_hover: #eee;
 @drive_hover-light: lighten(@drive_hover, 20%);
@@ -590,7 +592,7 @@ span {
                         margin-right: 5px;
                     }
                 }
-                &.cp-app-drive-content-icon, &.cp-app-drive-element-state {
+                &.cp-app-drive-content-icon, &.cp-app-drive-element-state, &.cp-icon {
                     width: 30px;
                 }
                 &.cp-app-drive-element-type, &.cp-app-drive-element-atime, &.cp-app-drive-element-ctime {

www/drive/inner.html

@@ -25,6 +25,7 @@
                 <li><a tabindex="-1" data-icon="fa-trash" class="cp-app-drive-context-delete cp-app-drive-context-editable dropdown-item" data-localization="fc_delete">Delete</a></li>
                 <li><a tabindex="-1" data-icon="fa-folder" class="cp-app-drive-context-newfolder cp-app-drive-context-editable dropdown-item" data-localization="fc_newfolder">New folder</a></li>
                 <li><a tabindex="-1" data-icon="fa-database" class="cp-app-drive-context-properties dropdown-item" data-localization="fc_prop">Properties</a></li>
+                <li><a tabindex="-1" data-icon="fa-hashtag" class="cp-app-drive-context-hashtag dropdown-item" data-localization="fc_hashtag">Tags</a></li>
             </ul>
         </div>
         <div id="cp-app-drive-context-content" class="cp-app-drive-context dropdown cp-unselectable">
@@ -43,6 +44,7 @@
                 <li><a tabindex="-1" data-icon="fa-eye" class="cp-app-drive-context-openro dropdown-item" data-localization="fc_open_ro">Open (read-only)</a></li>
                 <li><a tabindex="-1" data-icon="fa-trash" class="cp-app-drive-context-delete dropdown-item" data-localization="fc_delete">Delete</a></li>
                 <li><a tabindex="-1" data-icon="fa-database" class="cp-app-drive-context-properties dropdown-item" data-localization="fc_prop">Properties</a></li>
+                <li><a tabindex="-1" data-icon="fa-hashtag" class="cp-app-drive-context-hashtag dropdown-item" data-localization="fc_hashtag">Tags</a></li>
             </ul>
         </div>
         <div id="cp-app-drive-context-trashtree" class="cp-app-drive-context dropdown cp-unselectable">

www/drive/inner.js

@@ -1,6 +1,5 @@
 define([
     'jquery',
-    '/bower_components/chainpad-crypto/crypto.js',
     '/bower_components/textpatcher/TextPatcher.js',
     '/common/toolbar3.js',
     'json.sortify',
@@ -12,7 +11,6 @@ define([
     '/common/common-realtime.js',
     '/common/userObject.js',
     '/customize/application_config.js',
-    '/common/mergeDrive.js',
     '/common/sframe-chainpad-listmap.js',
 
     'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
@@ -20,7 +18,6 @@ define([
     'less!/customize/src/less2/main.less',
 ], function (
     $,
-    Crypto,
     TextPatcher,
     Toolbar,
     JSONSortify,
@@ -32,7 +29,6 @@ define([
     CommonRealtime,
     FO,
     AppConfig,
-    Merge,
     Listmap)
 {
     var Messages = Cryptpad.Messages;
@@ -663,6 +659,7 @@ define([
                     hasFolder = true;
                     hide.push($menu.find('a.cp-app-drive-context-openro'));
                     hide.push($menu.find('a.cp-app-drive-context-properties'));
+                    hide.push($menu.find('a.cp-app-drive-context-hashtag'));
                 }
                 // If we're in the trash, hide restore and properties for non-root elements
                 if ($menu.find('a.cp-app-drive-context-restore').length && path && path.length > 4) {
@@ -1121,7 +1118,7 @@ define([
                 e.preventDefault();
                 e.stopPropagation();
                 counter++;
-                $element.addClass('droppable');
+                $element.addClass('cp-app-drive-element-droppable');
             });
             $element.on('dragleave', function (e) {
                 e.preventDefault();
@@ -1129,7 +1126,7 @@ define([
                 counter--;
                 if (counter <= 0) {
                     counter = 0;
-                    $element.removeClass('droppable');
+                    $element.removeClass('cp-app-drive-element-droppable');
                 }
             });
         };
@@ -1838,7 +1835,7 @@ define([
                 var roClass = typeof(ro) === 'undefined' ? ' cp-app-drive-element-noreadonly' :
                                 ro ? ' cp-app-drive-element-readonly' : '';
                 var $element = $('<li>', {
-                    'class': 'cp-app-drive-element cp-app-drive-element-row' + roClass,
+                    'class': 'cp-app-drive-element cp-app-drive-element-file cp-app-drive-element-row' + roClass,
                     draggable: draggable
                 });
                 if (Array.isArray(APP.selectedFiles)) {
@@ -2014,7 +2011,7 @@ define([
                 var roClass = typeof(ro) === 'undefined' ? ' cp-app-drive-element-noreadonly' :
                                 ro ? ' cp-app-drive-element-readonly' : '';
                 var $element = $('<li>', {
-                    'class': 'cp-app-drive-element cp-app-drive-element-row' + roClass,
+                    'class': 'cp-app-drive-element cp-app-drive-element-file cp-app-drive-element-row' + roClass,
                 });
                 addFileData(id, $element);
                 $element.prepend($icon).dblclick(function () {
@@ -2521,6 +2518,8 @@ define([
             var paths = $(this).data('paths');
             //var path = $(this).data('path');
             //var $element = $(this).data('element');
+
+            var el;
             if (paths.length === 0) {
                 log(Messages.fm_forbidden);
                 debug("Directory context menu on a forbidden or unexisting element. ", paths);
@@ -2561,18 +2560,27 @@ define([
             }
             else if ($(this).hasClass("cp-app-drive-context-properties")) {
                 if (paths.length !== 1) { return; }
-                var el = filesOp.find(paths[0].path);
+                el = filesOp.find(paths[0].path);
                 getProperties(el, function (e, $prop) {
                     if (e) { return void logError(e); }
                     Cryptpad.alert($prop[0], undefined, true);
                 });
             }
+            else if ($(this).hasClass("cp-app-drive-context-hashtag")) {
+                if (paths.length !== 1) { return; }
+                el = filesOp.find(paths[0].path);
+                var data = filesOp.getFileData(el);
+                if (!data) { return void console.error("Expected to find a file"); }
+                var href = data.href;
+                common.updateTags(href);
+            }
             APP.hideMenu();
         });
 
         $defaultContextMenu.on("click", "a", function(e) {
             e.stopPropagation();
             var paths = $(this).data('paths');
+            var el;
             if (paths.length === 0) {
                 log(Messages.fm_forbidden);
                 debug("Context menu on a forbidden or unexisting element. ", paths);
@@ -2612,12 +2620,20 @@ define([
             }
             else if ($(this).hasClass("cp-app-drive-context-properties")) {
                 if (paths.length !== 1) { return; }
-                var el = filesOp.find(paths[0].path);
+                el = filesOp.find(paths[0].path);
                 getProperties(el, function (e, $prop) {
                     if (e) { return void logError(e); }
                     Cryptpad.alert($prop[0], undefined, true);
                 });
             }
+            else if ($(this).hasClass("cp-app-drive-context-hashtag")) {
+                if (paths.length !== 1) { return; }
+                el = filesOp.find(paths[0].path);
+                var data = filesOp.getFileData(el);
+                if (!data) { return void console.error("Expected to find a file"); }
+                var href = data.href;
+                common.updateTags(href);
+            }
             APP.hideMenu();
         });
 
@@ -2640,7 +2656,7 @@ define([
             else if ($(this).hasClass("cp-app-drive-context-newdoc")) {
                 var type = $(this).data('type') || 'pad';
                 sessionStorage[Cryptpad.newPadPathKey] = filesOp.isPathIn(currentPath, [TRASH]) ? '' : currentPath;
-                window.open('/' + type + '/');
+                window.open(APP.origin + '/' + type + '/');
             }
             APP.hideMenu();
         });

www/oldpoll/index.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html class="cp poll">
+<head>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
+    <title data-localization="poll_title">Zero Knowledge Date Picker</title>
+    <script async data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"
+        data-bootload="/customize/template.js"></script>
+</head>
+<body>
+

www/oldpoll/main.js

@@ -0,0 +1,806 @@
+define([
+    'jquery',
+    '/bower_components/textpatcher/TextPatcher.js',
+    '/bower_components/chainpad-listmap/chainpad-listmap.js',
+    '/bower_components/chainpad-crypto/crypto.js',
+    '/common/cryptpad-common.js',
+    '/common/cryptget.js',
+    '/bower_components/hyperjson/hyperjson.js',
+    'render.js',
+    '/common/toolbar2.js',
+    '/bower_components/file-saver/FileSaver.min.js',
+
+    'less!/bower_components/components-font-awesome/css/font-awesome.min.css',
+    'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
+    'less!/customize/src/less/toolbar.less',
+    'less!/customize/src/less/cryptpad.less',
+    'less!/poll/poll.less',
+], function ($, TextPatcher, Listmap, Crypto, Cryptpad, Cryptget, Hyperjson, Renderer, Toolbar) {
+
+    var Messages = Cryptpad.Messages;
+
+    $(function () {
+
+    var HIDE_INTRODUCTION_TEXT = "hide-text";
+    var defaultName;
+
+    var secret = Cryptpad.getSecrets();
+    var readOnly = secret.keys && !secret.keys.editKeyStr;
+    // DEPRECATE_F
+    if (!secret.keys) {
+        secret.keys = secret.key;
+    }
+
+    var DEBUG = false;
+    var debug = console.log;
+    if (!DEBUG) {
+        debug = function() {};
+    }
+
+    Cryptpad.addLoadingScreen();
+    var onConnectError = function () {
+        Cryptpad.errorLoadingScreen(Messages.websocketError);
+    };
+
+    var Render = Renderer(Cryptpad);
+
+    var APP = window.APP = {
+        Toolbar: Toolbar,
+        Hyperjson: Hyperjson,
+        Render: Render,
+        $bar: $('#toolbar'),
+        editable: {
+            row: [],
+            col: []
+        },
+        locked: false
+    };
+
+    var sortColumns = function (order, firstcol) {
+        var colsOrder = order.slice();
+        colsOrder.sort(function (a, b) {
+            return (a === firstcol) ? -1 :
+                        ((b === firstcol) ? 1 : 0);
+        });
+        return colsOrder;
+    };
+
+    var isOwnColumnCommitted = function () {
+        return APP.proxy && APP.proxy.table.colsOrder.indexOf(APP.userid) !== -1;
+    };
+
+    var mergeUncommitted = function (proxy, uncommitted, commit) {
+        var newObj;
+        if (commit) {
+            newObj = proxy;
+        } else {
+            newObj = $.extend(true, {}, proxy);
+        }
+        // We have uncommitted data only if the user's column is not in the proxy
+        // If it is already is the proxy, nothing to merge
+        if (isOwnColumnCommitted()) {
+            return newObj;
+        }
+        // Merge uncommitted into the proxy
+        uncommitted.table.colsOrder.forEach(function (x) {
+            if (newObj.table.colsOrder.indexOf(x) !== -1) { return; }
+            newObj.table.colsOrder.push(x);
+        });
+        for (var k in uncommitted.table.cols) {
+            if (!newObj.table.cols[k]) {
+                newObj.table.cols[k] = uncommitted.table.cols[k];
+            }
+        }
+        for (var l in uncommitted.table.cells) {
+            if (!newObj.table.cells[l]) {
+                newObj.table.cells[l] = uncommitted.table.cells[l];
+            }
+        }
+        return newObj;
+    };
+
+    var styleUncommittedColumn = function () {
+        var id = APP.userid;
+
+        // Enable the checkboxes for the user's column (committed or not)
+        $('input[disabled="disabled"][data-rt-id^="' + id + '"]').removeAttr('disabled');
+        $('input[type="number"][data-rt-id^="' + id + '"]').addClass('enabled');
+        $('.lock[data-rt-id="' + id + '"]').addClass('fa-unlock').removeClass('fa-lock').attr('title', Messages.poll_unlocked);
+
+        if (isOwnColumnCommitted()) { return; }
+        $('[data-rt-id^="' + id + '"]').closest('td').addClass("uncommitted");
+        $('td.uncommitted .cover').addClass("uncommitted");
+        $('.uncommitted input[type="text"]').attr("placeholder", Messages.poll_userPlaceholder);
+    };
+
+    var unlockElements = function () {
+        APP.editable.row.forEach(function (id) {
+            var $input = $('input[type="text"][disabled="disabled"][data-rt-id="' + id + '"]').removeAttr('disabled');
+            $input.parent().parent().addClass('editing');
+            $('span.edit[data-rt-id="' + id + '"]').css('visibility', 'hidden');
+        });
+        APP.editable.col.forEach(function (id) {
+            var $input = $('input[disabled="disabled"][data-rt-id^="' + id + '"]').removeAttr('disabled');
+            $input.parent().addClass('editing');
+            $('input[type="number"][data-rt-id^="' + id + '"]').addClass('enabled');
+            $('.lock[data-rt-id="' + id + '"]').addClass('fa-unlock').removeClass('fa-lock').attr('title', Messages.poll_unlocked);
+        });
+    };
+
+    var updateTableButtons = function () {
+        if (!isOwnColumnCommitted()) {
+            $('#commit').show();
+        }
+
+        var $createOption = APP.$table.find('tfoot tr td:first-child');
+        var $commitCell = APP.$table.find('tfoot tr td:nth-child(2)');
+        $createOption.append(APP.$createRow);
+        $commitCell.append(APP.$commit);
+        $('#create-user, #create-option').css('display', 'inline-flex');
+        if (!APP.proxy || !APP.proxy.table.rowsOrder || APP.proxy.table.rowsOrder.length === 0) { $('#create-user').hide(); }
+        var width = $('#table').outerWidth();
+        if (width) {
+            //$('#create-user').css('left', width + 30 + 'px');
+        }
+    };
+
+    var setTablePublished = function (bool) {
+        if (bool) {
+            if (APP.$publish) { APP.$publish.hide(); }
+            if (APP.$admin) { APP.$admin.show(); }
+            $('#create-option').hide();
+            $('.remove[data-rt-id^="y"], .edit[data-rt-id^="y"]').hide();
+        } else {
+            if (APP.$publish) { APP.$publish.show(); }
+            if (APP.$admin) { APP.$admin.hide(); }
+            $('#create-option').show();
+            $('.remove[data-rt-id^="y"], .edit[data-rt-id^="y"]').show();
+        }
+    };
+
+    var updateDisplayedTable = function () {
+        styleUncommittedColumn();
+        unlockElements();
+        updateTableButtons();
+        setTablePublished(APP.proxy.published);
+
+        /*
+        APP.proxy.table.rowsOrder.forEach(function (rowId) {
+            $('[data-rt-id="' + rowId +'"]').val(APP.proxy.table.rows[rowId] || '');
+        });*/
+    };
+
+    var unlockColumn = function (id, cb) {
+        if (APP.editable.col.indexOf(id) === -1) {
+            APP.editable.col.push(id);
+        }
+        if (typeof(cb) === "function") {
+            cb();
+        }
+    };
+    var unlockRow = function (id, cb) {
+        if (APP.editable.row.indexOf(id) === -1) {
+            APP.editable.row.push(id);
+        }
+        if (typeof(cb) === "function") {
+            cb();
+        }
+    };
+
+    /*  Any time the realtime object changes, call this function */
+    var change = function (o, n, path, throttle, cb) {
+        if (path && !Cryptpad.isArray(path)) {
+            return;
+        }
+        if (path && path.join) {
+            debug("Change from [%s] to [%s] at [%s]",
+                o, n, path.join(', '));
+        }
+
+        var table = APP.$table[0];
+
+        var displayedObj = mergeUncommitted(APP.proxy, APP.uncommitted);
+
+        var colsOrder = sortColumns(displayedObj.table.colsOrder, APP.userid);
+        var conf = {
+            cols: colsOrder,
+            readOnly: readOnly
+        };
+
+        //Render.updateTable(table, displayedObj, conf);
+
+        /*  FIXME browser autocomplete fills in new fields sometimes
+            calling updateTable twice removes the autofilled in values
+            setting autocomplete="off" is not reliable
+
+            https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
+        */
+        Cryptpad.notify();
+
+        var getFocus = function () {
+            var active = document.activeElement;
+            if (!active) { return; }
+            return {
+                el: active,
+                start: active.selectionStart,
+                end: active.selectionEnd
+            };
+        };
+        var setFocus = function (obj) {
+            if (obj.el) { obj.el.focus(); }
+            else { return; }
+            if (obj.start) { obj.el.selectionStart = obj.start; }
+            if (obj.end) { obj.el.selectionEnd = obj.end; }
+        };
+
+        var updateTable = function () {
+            var displayedObj2 = mergeUncommitted(APP.proxy, APP.uncommitted);
+            var f = getFocus();
+            Render.updateTable(table, displayedObj2, conf);
+            APP.proxy.table.rowsOrder.forEach(function (rowId) {
+                $('input[data-rt-id="' + rowId +'"]').val(APP.proxy.table.rows[rowId] || '');
+            });
+            updateDisplayedTable();
+            setFocus(f);
+            if (typeof(cb) === "function") {
+                cb();
+            }
+        };
+
+        if (throttle) {
+            if (APP.throttled) { window.clearTimeout(APP.throttled); }
+            updateTable();
+            APP.throttled = window.setTimeout(function () {
+                updateDisplayedTable();
+            }, throttle);
+            return;
+        }
+
+        window.setTimeout(updateTable);
+    };
+
+    var getRealtimeId = function (input) {
+        return input.getAttribute && input.getAttribute('data-rt-id');
+    };
+
+    /*  Called whenever an event is fired on an input element */
+    var handleInput = function (input) {
+        var type = input.type.toLowerCase();
+        var id = getRealtimeId(input);
+
+        debug(input);
+
+        var object = APP.proxy;
+
+        var x = Render.getCoordinates(id)[0];
+        if (type !== "row" && x === APP.userid && APP.proxy.table.colsOrder.indexOf(x) === -1) {
+            object = APP.uncommitted;
+        }
+
+        switch (type) {
+            case 'text':
+                debug("text[rt-id='%s'] [%s]", id, input.value);
+                Render.setValue(object, id, input.value);
+                change(null, null, null, 50);
+                break;
+            case 'number':
+                debug("checkbox[tr-id='%s'] %s", id, input.value);
+                if (APP.editable.col.indexOf(x) >= 0 || x === APP.userid) {
+                    var value = parseInt(input.value);
+
+                    if (isNaN(value)) {
+                        console.error("Got NaN?!");
+                        break;
+                    }
+
+                    Render.setValue(object, id, value);
+                    change();
+                } else {
+                    debug('checkbox locked');
+                }
+                break;
+            default:
+                debug("Input[type='%s']", type);
+                break;
+        }
+    };
+
+    var hideInputs = function (target, isKeyup) {
+        if (APP.locked) { return; }
+        if (!isKeyup && $(target).is('[type="text"]')) {
+            return;
+        }
+        $('.lock[data-rt-id!="' + APP.userid + '"]').addClass('fa-lock').removeClass('fa-unlock').attr('title', Messages.poll_locked);
+        var $cells = APP.$table.find('thead td:not(.uncommitted), tbody td');
+        $cells.find('[type="text"][data-rt-id!="' + APP.userid + '"]').attr('disabled', true);
+        $cells.removeClass('editing');
+        $('.edit[data-rt-id!="' + APP.userid + '"]').css('visibility', 'visible');
+        APP.editable.col = [APP.userid];
+        APP.editable.row = [];
+    };
+
+    /*  Called whenever an event is fired on a span */
+    var handleSpan = function (span) {
+        var id = span.getAttribute('data-rt-id');
+        var type = Render.typeofId(id);
+        var isRemove = span.className && span.className.split(' ').indexOf('remove') !== -1;
+        var isEdit = span.className && span.className.split(' ').indexOf('edit') !== -1;
+        var isLock = span.className && span.className.split(' ').indexOf('lock') !== -1;
+        var isLocked = span.className && span.className.split(' ').indexOf('fa-lock') !== -1;
+        if (type === 'row') {
+            if (isRemove) {
+                Cryptpad.confirm(Messages.poll_removeOption, function (res) {
+                    if (!res) { return; }
+                    Render.removeRow(APP.proxy, id, function () {
+                        change();
+                    });
+                });
+            } else if (isEdit) {
+                hideInputs(span);
+                unlockRow(id, function () {
+                    change(null, null, null, null, function() {
+                        $('input[data-rt-id="' + id + '"]').focus();
+                    });
+                });
+            }
+        } else if (type === 'col') {
+            if (isRemove) {
+                Cryptpad.confirm(Messages.poll_removeUser, function (res) {
+                    if (!res) { return; }
+                    Render.removeColumn(APP.proxy, id, function () {
+                        change();
+                    });
+                });
+            } else if (isLock && isLocked) {
+                hideInputs(span);
+                unlockColumn(id, function () {
+                    change(null, null, null, null, function() {
+                        $('input[data-rt-id="' + id + '"]').focus();
+                    });
+                });
+            }
+        } else if (type === 'cell') {
+            change();
+        } else {
+            debug("UNHANDLED");
+        }
+    };
+
+    var handleClick = function (e, isKeyup) {
+        if (APP.locked) { return; }
+
+        e.stopPropagation();
+
+        if (!APP.ready) { return; }
+        if (!isKeyup && e.which !== 1) { return; } // only allow left clicks
+
+        var target = e && e.target;
+
+        if (!target) { return void debug("NO TARGET"); }
+
+        var nodeName = target && target.nodeName;
+        var shouldLock = $(target).hasClass('fa-unlock');
+
+        if ((!$(target).parents('#table tbody').length && $(target).hasClass('lock'))) {
+            hideInputs(e);
+        }
+
+        switch (nodeName) {
+            case 'INPUT':
+                if (isKeyup && (e.keyCode === 13 || e.keyCode === 27)) {
+                    hideInputs(target, isKeyup);
+                    break;
+                }
+                if ($(target).is('input[type="number"]')) { console.error("number input focused?"); break; }
+
+                handleInput(target);
+                break;
+            case 'LABEL':
+                var input = $('input[type="number"][id=' + $(target).attr('for') + ']');
+                var value = parseInt(input.val());
+
+                input.val((value + 1) % 4);
+
+                handleInput(input[0]);
+                break;
+            case 'SPAN':
+                if (shouldLock) {
+                    break;
+                }
+                handleSpan(target);
+                break;
+            case undefined:
+                //console.error(new Error("C'est pas possible!"));
+                break;
+            default:
+                debug(target, nodeName);
+                break;
+        }
+    };
+
+    /*
+        Make sure that the realtime data structure has all the required fields
+    */
+    var prepareProxy = function (proxy, schema) {
+        if (proxy && proxy.version === 1) { return; }
+        debug("Configuring proxy schema...");
+
+        proxy.info = proxy.info || schema.info;
+        Object.keys(schema.info).forEach(function (k) {
+            if (!proxy.info[k]) { proxy.info[k] = schema.info[k]; }
+        });
+
+        proxy.table = proxy.table || schema.table;
+        Object.keys(schema.table).forEach(function (k) {
+            if (!proxy.table[k]) { proxy.table[k] = schema.table[k]; }
+        });
+
+        proxy.version = 1;
+        proxy.type = 'poll';
+    };
+
+    /*
+
+    */
+    var publish = APP.publish = function (bool) {
+        if (!APP.ready) { return; }
+        if (APP.proxy.published !== bool) {
+            APP.proxy.published = bool;
+        }
+        setTablePublished(bool);
+        ['textarea'].forEach(function (sel) {
+            $(sel).attr('disabled', bool);
+        });
+    };
+
+    var showHelp = function(help) {
+        if (typeof help === 'undefined') { help = !$('#howItWorks').is(':visible'); }
+
+        var msg = (help ? Messages.poll_hide_help_button : Messages.poll_show_help_button);
+
+        $('#howItWorks').toggle(help);
+        $('#help').text(msg);
+    };
+
+    var Title;
+    var UserList;
+
+    var copyObject = function (obj) {
+        return JSON.parse(JSON.stringify(obj));
+    };
+
+    // special UI elements
+    var $description = $('#description').attr('placeholder', Messages.poll_descriptionHint || 'description');
+
+var ready = function (info, userid, readOnly) {
+    debug("READY");
+    debug('userid: %s', userid);
+
+    var proxy = APP.proxy;
+
+    var isNew = false;
+    var userDoc = JSON.stringify(proxy);
+    if (userDoc === "" || userDoc === "{}") { isNew = true; }
+
+    if (!isNew && typeof(proxy.type) !== 'undefined' && proxy.type !== 'poll') {
+        var errorText = Messages.typeError;
+        Cryptpad.errorLoadingScreen(errorText);
+        throw new Error(errorText);
+    }
+
+    if (typeof(proxy.type) === 'undefined') {
+        proxy.type = 'poll';
+    }
+
+    var uncommitted = APP.uncommitted = {};
+    prepareProxy(proxy, copyObject(Render.Example));
+    prepareProxy(uncommitted, copyObject(Render.Example));
+    if (!readOnly && proxy.table.colsOrder.indexOf(userid) === -1 &&
+        uncommitted.table.colsOrder.indexOf(userid) === -1) {
+        uncommitted.table.colsOrder.unshift(userid);
+    }
+
+    var displayedObj = mergeUncommitted(proxy, uncommitted, false);
+
+    var colsOrder = sortColumns(displayedObj.table.colsOrder, userid);
+
+    var $table = APP.$table = $(Render.asHTML(displayedObj, null, colsOrder, readOnly));
+    APP.$createRow = $('#create-option').click(function () {
+        Render.createRow(proxy, function (empty, id) {
+            change(null, null, null, null, function() {
+                handleSpan($('.edit[data-rt-id="' + id + '"]')[0]);
+            });
+        });
+    });
+
+    APP.$createCol = $('#create-user').click(function () {
+        Render.createColumn(proxy, function (empty, id) {
+            change(null, null, null, null, function() {
+                handleSpan($('.lock[data-rt-id="' + id + '"]')[0]);
+            });
+        });
+    });
+
+    // Commit button
+    APP.$commit = $('#commit').click(function () {
+        var uncommittedCopy = JSON.parse(JSON.stringify(APP.uncommitted));
+        APP.uncommitted = {};
+        prepareProxy(APP.uncommitted, copyObject(Render.Example));
+        mergeUncommitted(proxy, uncommittedCopy, true);
+        APP.$commit.hide();
+        change();
+    });
+
+    // #publish button is removed in readonly
+    APP.$publish = $('#publish')
+        .click(function () {
+            publish(true);
+        });
+
+    APP.$admin = $('#admin')
+        .click(function () {
+            publish(false);
+        });
+
+    APP.$help = $('#help')
+        .click(function () {
+            showHelp();
+        });
+
+    // Title
+    if (APP.proxy.info.defaultTitle) {
+        Title.updateDefaultTitle(APP.proxy.info.defaultTitle);
+    } else {
+        APP.proxy.info.defaultTitle = Title.defaultTitle;
+    }
+
+    var andThen = function () {
+        if (readOnly) { return; }
+        Cryptpad.setPadAttribute('userid', userid, function (e) {
+            if (e) { console.error(e); }
+        });
+    };
+
+    if (Cryptpad.initialName && !APP.proxy.info.title) {
+        APP.proxy.info.title = Cryptpad.initialName;
+        Title.updateTitle(Cryptpad.initialName, null, andThen);
+    } else {
+        Title.updateTitle(APP.proxy.info.title || Title.defaultTitle, null, andThen);
+    }
+
+    // Description
+    var resize = function () {
+        var lineCount = $description.val().split('\n').length;
+        $description.css('height', lineCount + 'rem');
+    };
+    $description.on('change keyup', function () {
+        var val = $description.val();
+        proxy.info.description = val;
+        resize();
+    });
+    resize();
+    if (typeof(proxy.info.description) !== 'undefined') {
+        $description.val(proxy.info.description);
+    }
+
+    $('#tableScroll').html('').prepend($table);
+    updateDisplayedTable();
+
+    $table
+        .click(handleClick)
+        .on('keyup', function (e) { handleClick(e, true); });
+
+    $(window).click(function(e) {
+        if (e.which !== 1) { return; }
+        hideInputs();
+    });
+
+    proxy
+        .on('change', ['info'], function (o, n, p) {
+            if (p[1] === 'title') {
+                Title.updateTitle(n);
+                Cryptpad.notify();
+            } else if (p[1] === "userData") {
+                UserList.addToUserData(APP.proxy.info.userData);
+            } else if (p[1] === 'description') {
+                var op = TextPatcher.diff(o, n);
+                var el = $description[0];
+
+                var selects = ['selectionStart', 'selectionEnd'].map(function (attr) {
+                    return TextPatcher.transformCursor(el[attr], op);
+                });
+                $description.val(n);
+                if (op) {
+                    el.selectionStart = selects[0];
+                    el.selectionEnd = selects[1];
+                }
+                Cryptpad.notify();
+            }
+
+            debug("change: (%s, %s, [%s])", o, n, p.join(', '));
+        })
+        .on('change', ['table'], change)
+        .on('remove', [], change);
+
+    var userInput = $('.uncommitted > input');
+    if (userInput.val() === '')
+    {
+        userInput.val(Cryptpad.getProxy()[Cryptpad.displayNameKey]);
+    }
+
+    UserList.addToUserData(APP.proxy.info.userData);
+
+    APP.ready = true;
+    if (!proxy.published) {
+        publish(false);
+    } else {
+        publish(true);
+    }
+
+    Cryptpad.removeLoadingScreen();
+
+    if (readOnly) { return; }
+    UserList.getLastName(APP.toolbar.$userNameButton, isNew);
+};
+
+var setEditable = function (editable) {
+    APP.locked = !editable;
+
+    if (editable === false) {
+        // disable all the things
+        $('.realtime input, .realtime button, .upper button, .realtime textarea').attr('disabled', APP.locked);
+        $('span.edit, span.remove').hide();
+        $('span.lock').addClass('fa-lock').removeClass('fa-unlock')
+            .attr('title', Messages.poll_locked)
+            .css({'cursor': 'default'});
+    } else {
+        // enable
+        $('span.edit, span.remove').show();
+        $('span.lock').css({'cursor': ''});
+        $('.realtime button, .upper button, .realtime textarea').attr('disabled', APP.locked);
+        unlockElements();
+    }
+};
+
+var disconnect = function () {
+    setEditable(false);
+    APP.toolbar.failed();
+    Cryptpad.alert(Messages.common_connectionLost, undefined, true);
+};
+
+var reconnect = function (info) {
+    setEditable(true);
+    APP.toolbar.reconnecting(info.myId);
+    Cryptpad.findOKButton().click();
+};
+
+var create = function (info) {
+    APP.myID = info.myID;
+
+    var editHash;
+    if (!readOnly) {
+        editHash = Cryptpad.getEditHashFromKeys(info.channel, secret.keys);
+    }
+
+    if (APP.realtime !== info.realtime) {
+        APP.realtime = info.realtime;
+        APP.patchText = TextPatcher.create({
+            realtime: info.realtime,
+            logging: true,
+        });
+    }
+
+    var onLocal = function () {
+        APP.proxy.info.userData = UserList.userData;
+    };
+    UserList = Cryptpad.createUserList(info, onLocal, Cryptget, Cryptpad);
+
+    var onLocalTitle = function () {
+        APP.proxy.info.title = Title.isDefaultTitle() ? "" : Title.title;
+    };
+    Title = Cryptpad.createTitle({}, onLocalTitle, Cryptpad);
+
+    var configTb = {
+        displayed: ['title', 'useradmin', 'spinner', 'lag', 'state', 'share', 'userlist', 'newpad', 'limit', 'upgrade'],
+        userList: UserList.getToolbarConfig(),
+        share: {
+            secret: secret,
+            channel: info.channel
+        },
+        title: Title.getTitleConfig(),
+        common: Cryptpad,
+        readOnly: readOnly,
+        ifrw: window,
+        realtime: info.realtime,
+        network: info.network,
+        $container: APP.$bar,
+        $contentContainer: $('#content')
+    };
+    APP.toolbar = Toolbar.create(configTb);
+
+    Title.setToolbar(APP.toolbar);
+
+    var $rightside = APP.toolbar.$rightside;
+
+    /* add a forget button */
+    var forgetCb = function (err) {
+        if (err) { return; }
+        setEditable(false);
+    };
+    var $forgetPad = Cryptpad.createButton('forget', true, {}, forgetCb);
+    $rightside.append($forgetPad);
+
+    // set the hash
+    if (!readOnly) { Cryptpad.replaceHash(editHash); }
+
+    /* save as template */
+    if (!Cryptpad.isTemplate(window.location.href)) {
+        var templateObj = {
+            rt: info.realtime,
+            Crypt: Cryptget,
+            getTitle: function () { return document.title; }
+        };
+        var $templateButton = Cryptpad.createButton('template', true, templateObj);
+        $rightside.append($templateButton);
+    }
+};
+
+    // don't initialize until the store is ready.
+    Cryptpad.ready(function () {
+        Cryptpad.reportAppUsage();
+        var config = {
+            websocketURL: Cryptpad.getWebsocketURL(),
+            channel: secret.channel,
+            readOnly: readOnly,
+            data: {},
+            // our public key
+            validateKey: secret.keys.validateKey || undefined,
+            //readOnly: readOnly,
+            crypto: Crypto.createEncryptor(secret.keys),
+            userName: 'poll',
+            network: Cryptpad.getNetwork()
+        };
+
+        if (readOnly) {
+            $('#commit, #create-user, #create-option, #publish, #admin').remove();
+        }
+
+        var parsedHash = Cryptpad.parsePadUrl(window.location.href);
+        defaultName = Cryptpad.getDefaultName(parsedHash);
+        var rt = window.rt = APP.rt = Listmap.create(config);
+        APP.proxy = rt.proxy;
+        rt.proxy
+        .on('create', create)
+        .on('ready', function (info) {
+            Cryptpad.getPadAttribute('userid', function (e, userid) {
+                if (e) { console.error(e); }
+                if (!userid) { userid = Render.coluid(); }
+                APP.userid = userid;
+                ready(info, userid, readOnly);
+            });
+        })
+        .on('disconnect', disconnect)
+        .on('reconnect', reconnect);
+
+        Cryptpad.getAttribute(['poll', HIDE_INTRODUCTION_TEXT], function (e, value) {
+            if (e) { console.error(e); }
+            if (!value) {
+                Cryptpad.setAttribute(['poll', HIDE_INTRODUCTION_TEXT], "1", function (e) {
+                    if (e) { console.error(e); }
+                });
+                showHelp(true);
+            } else {
+                showHelp(false);
+            }
+        });
+
+        Cryptpad.onLogout(function () { setEditable(false); });
+    });
+    Cryptpad.onError(function (info) {
+        if (info) {
+            onConnectError();
+        }
+    });
+
+    });
+});

www/oldpoll/render.js

@@ -0,0 +1,453 @@
+define([
+    //'/common/cryptpad-common.js',
+    '/bower_components/hyperjson/hyperjson.js',
+    '/bower_components/textpatcher/TextPatcher.js',
+    '/bower_components/diff-dom/diffDOM.js',
+], function (Hyperjson, TextPatcher) {
+    var DiffDOM = window.diffDOM;
+
+    var Example = {
+        info: {
+            title: '',
+            description: '',
+            userData: {}
+        },
+        table: {
+/*  TODO
+
+deprecate the practice of storing cells, cols, and rows separately.
+
+Instead, keep everything in one map, and iterate over columns and rows
+by maintaining indexes in rowsOrder and colsOrder
+
+*/
+            cells: {},
+            cols: {},
+            colsOrder: [],
+            rows: {},
+            rowsOrder: []
+        }
+    };
+
+var Renderer = function (Cryptpad) {
+
+    var Render = {
+        Example: Example
+    };
+
+    var Uid = Render.Uid = function (prefix, f) {
+        f = f || function () {
+            return Number(Math.random() * Number.MAX_SAFE_INTEGER)
+                .toString(32).replace(/\./g, '');
+        };
+        return function () { return prefix + '-' + f(); };
+    };
+
+    var coluid = Render.coluid = Uid('x');
+    var rowuid = Render.rowuid = Uid('y');
+
+    var isRow = Render.isRow = function (id) { return /^y\-[^_]*$/.test(id); };
+    var isColumn = Render.isColumn = function (id) { return /^x\-[^_]*$/.test(id); };
+    var isCell = Render.isCell = function (id) { return /^x\-[^_]*_y\-.*$/.test(id); };
+
+    var typeofId = Render.typeofId = function (id) {
+        if (isRow(id)) { return 'row'; }
+        if (isColumn(id)) { return 'col'; }
+        if (isCell(id)) { return 'cell'; }
+        return null;
+    };
+
+    Render.getCoordinates = function (id) {
+        return id.split('_');
+    };
+
+    var getColumnValue = Render.getColumnValue = function (obj, colId) {
+        return Cryptpad.find(obj, ['table', 'cols'].concat([colId]));
+    };
+
+    var getRowValue = Render.getRowValue = function (obj, rowId) {
+        return Cryptpad.find(obj, ['table', 'rows'].concat([rowId]));
+    };
+
+    var getCellValue = Render.getCellValue = function (obj, cellId) {
+        var value = Cryptpad.find(obj, ['table', 'cells'].concat([cellId]));
+        if (typeof value === 'boolean') {
+            return (value === true ? 1 : 0);
+        } else {
+            return value;
+        }
+    };
+
+    var setRowValue = Render.setRowValue = function (obj, rowId, value) {
+        var parent = Cryptpad.find(obj, ['table', 'rows']);
+        if (typeof(parent) === 'object') { return (parent[rowId] = value); }
+        return null;
+    };
+
+    var setColumnValue = Render.setColumnValue = function (obj, colId, value) {
+        var parent = Cryptpad.find(obj, ['table', 'cols']);
+        if (typeof(parent) === 'object') { return (parent[colId] = value); }
+        return null;
+    };
+
+    var setCellValue = Render.setCellValue = function (obj, cellId, value) {
+        var parent = Cryptpad.find(obj, ['table', 'cells']);
+        if (typeof(parent) === 'object') { return (parent[cellId] = value); }
+        return null;
+    };
+
+    Render.createColumn = function (obj, cb, id, value) {
+        var order = Cryptpad.find(obj, ['table', 'colsOrder']);
+        if (!order) { throw new Error("Uninitialized realtime object!"); }
+        id = id || coluid();
+        value = value || "";
+        setColumnValue(obj, id, value);
+        order.push(id);
+        if (typeof(cb) === 'function') { cb(void 0, id); }
+    };
+
+    Render.removeColumn = function (obj, id, cb) {
+        var order = Cryptpad.find(obj, ['table', 'colsOrder']);
+        var parent = Cryptpad.find(obj, ['table', 'cols']);
+
+        if (!(order && parent)) { throw new Error("Uninitialized realtime object!"); }
+
+        var idx = order.indexOf(id);
+        if (idx === -1) {
+            return void console
+                .error(new Error("Attempted to remove id which does not exist"));
+        }
+
+        Object.keys(obj.table.cells).forEach(function (key) {
+            if (key.indexOf(id) === 0) {
+                delete obj.table.cells[key];
+            }
+        });
+
+        order.splice(idx, 1);
+        if (parent[id]) { delete parent[id]; }
+        if (typeof(cb) === 'function') {
+            cb();
+        }
+    };
+
+    Render.createRow = function (obj, cb, id, value) {
+        var order = Cryptpad.find(obj, ['table', 'rowsOrder']);
+        if (!order) { throw new Error("Uninitialized realtime object!"); }
+        id = id || rowuid();
+        value = value || "";
+        setRowValue(obj, id, value);
+        order.push(id);
+        if (typeof(cb) === 'function') { cb(void 0, id); }
+    };
+
+    Render.removeRow = function (obj, id, cb) {
+        var order = Cryptpad.find(obj, ['table', 'rowsOrder']);
+        var parent = Cryptpad.find(obj, ['table', 'rows']);
+
+        if (!(order && parent)) { throw new Error("Uninitialized realtime object!"); }
+
+        var idx = order.indexOf(id);
+        if (idx === -1) {
+            return void console
+                .error(new Error("Attempted to remove id which does not exist"));
+        }
+
+        order.splice(idx, 1);
+        if (parent[id]) { delete parent[id]; }
+        if (typeof(cb) === 'function') { cb(); }
+    };
+
+    Render.setValue = function (obj, id, value) {
+        var type = typeofId(id);
+
+        switch (type) {
+            case 'row': return setRowValue(obj, id, value);
+            case 'col': return setColumnValue(obj, id, value);
+            case 'cell': return setCellValue(obj, id, value);
+            case null: break;
+            default:
+                console.log("[%s] has type [%s]", id, type);
+            throw new Error("Unexpected type!");
+        }
+    };
+
+    Render.getValue = function (obj, id) {
+        switch (typeofId(id)) {
+            case 'row': return getRowValue(obj, id);
+            case 'col': return getColumnValue(obj, id);
+            case 'cell': return getCellValue(obj, id);
+            case null: break;
+            default: throw new Error("Unexpected type!");
+        }
+    };
+
+    var getRowIds = Render.getRowIds = function (obj) {
+        return Cryptpad.find(obj, ['table', 'rowsOrder']);
+    };
+
+    var getColIds = Render.getColIds = function (obj) {
+        return Cryptpad.find(obj, ['table', 'colsOrder']);
+    };
+
+    var getCells = Render.getCells = function (obj) {
+        return Cryptpad.find(obj, ['table', 'cells']);
+    };
+
+    /*  cellMatrix takes a proxy object, and optionally an alternate ordering
+        of row/column keys (as an array).
+
+        it returns an array of arrays containing the relevant data for each
+        cell in table we wish to construct.
+    */
+    var cellMatrix = Render.cellMatrix = function (obj, rows, cols, readOnly) {
+        if (typeof(obj) !== 'object') {
+            throw new Error('expected realtime-proxy object');
+        }
+
+        var cells = getCells(obj);
+        rows = rows || getRowIds(obj);
+        rows.push('');
+        cols = cols || getColIds(obj);
+
+        return [null].concat(rows).map(function (row, i) {
+            if (i === 0) {
+                return [null].concat(cols.map(function (col) {
+                    var result = {
+                        'data-rt-id': col,
+                        type: 'text',
+                        value: getColumnValue(obj, col) || "",
+                        placeholder: Cryptpad.Messages.poll_userPlaceholder,
+                        disabled: 'disabled'
+                    };
+                    return result;
+                }));
+            }
+            if (i === rows.length) {
+                return [null].concat(cols.map(function () {
+                    return {
+                        'class': 'lastRow',
+                    };
+                }));
+            }
+
+            return [{
+                'data-rt-id': row,
+                value: getRowValue(obj, row),
+                type: 'text',
+                placeholder: Cryptpad.Messages.poll_optionPlaceholder,
+                disabled: 'disabled'
+            }].concat(cols.map(function (col) {
+                var id = [col, rows[i-1]].join('_');
+                var val = cells[id];
+                var result = {
+                    'data-rt-id': id,
+                    type: 'number',
+                    autocomplete: 'nope',
+                    value: '3',
+                };
+                if (readOnly) {
+                    result.disabled = "disabled";
+                }
+                if (typeof val !== 'undefined') {
+                    if (typeof val === 'boolean') { val = (val ? '1' : '0'); }
+                    result.value = val;
+                }
+                return result;
+            }));
+        });
+    };
+
+    var makeRemoveElement = Render.makeRemoveElement = function (id) {
+        return ['SPAN', {
+            'data-rt-id': id,
+            'title': Cryptpad.Messages.poll_remove,
+            class: 'remove',
+        }, ['✖']];
+    };
+
+    var makeEditElement = Render.makeEditElement = function (id) {
+        return ['SPAN', {
+            'data-rt-id': id,
+            'title': Cryptpad.Messages.poll_edit,
+            class: 'edit',
+        }, ['✐']];
+    };
+
+    var makeLockElement = Render.makeLockElement = function (id) {
+        return ['SPAN', {
+            'data-rt-id': id,
+            'title': Cryptpad.Messages.poll_locked,
+            class: 'lock fa fa-lock',
+        }, []];
+    };
+
+    var makeHeadingCell = Render.makeHeadingCell = function (cell, readOnly) {
+        if (!cell) { return ['TD', {}, []]; }
+        if (cell.type === 'text') {
+            var elements = [['INPUT', cell, []]];
+            if (!readOnly) {
+                elements.unshift(makeRemoveElement(cell['data-rt-id']));
+                elements.unshift(makeLockElement(cell['data-rt-id']));
+            }
+            return ['TD', {}, elements];
+        }
+        return ['TD', cell, []];
+    };
+
+    var clone = function (o) {
+        return JSON.parse(JSON.stringify(o));
+    };
+
+    var makeCheckbox = Render.makeCheckbox = function (cell) {
+        var attrs = clone(cell);
+
+        // FIXME
+        attrs.id = cell['data-rt-id'];
+
+        var labelClass = 'cover';
+
+        // TODO implement Yes/No/Maybe/Undecided
+        return ['TD', {class:"checkbox-cell"}, [
+            ['DIV', {class: 'checkbox-contain'}, [
+                ['INPUT', attrs, []],
+                ['SPAN', {class: labelClass}, []],
+                ['LABEL', {
+                    for: attrs.id,
+                    'data-rt-id': attrs.id,
+                }, []]
+            ]]
+        ]];
+    };
+
+    var makeBodyCell = Render.makeBodyCell = function (cell, readOnly) {
+        if (cell && cell.type === 'text') {
+            var elements = [['INPUT', cell, []]];
+            if (!readOnly) {
+                elements.push(makeRemoveElement(cell['data-rt-id']));
+                elements.push(makeEditElement(cell['data-rt-id']));
+            }
+            return ['TD', {}, [
+                    ['DIV', {class: 'text-cell'}, elements]
+            ]];
+        }
+
+        if (cell && cell.type === 'number') {
+            return makeCheckbox(cell);
+        }
+        return ['TD', cell, []];
+    };
+
+    var makeBodyRow = Render.makeBodyRow = function (row, readOnly) {
+        return ['TR', {}, row.map(function (cell) {
+            return makeBodyCell(cell, readOnly);
+        })];
+    };
+
+    var toHyperjson = Render.toHyperjson = function (matrix, readOnly) {
+        if (!matrix || !matrix.length) { return; }
+        var head = ['THEAD', {}, [ ['TR', {}, matrix[0].map(function (cell) {
+            return makeHeadingCell(cell, readOnly);
+        })] ]];
+        var foot = ['TFOOT', {}, matrix.slice(-1).map(function (row) {
+            return makeBodyRow(row, readOnly);
+        })];
+        var body = ['TBODY', {}, matrix.slice(1, -1).map(function (row) {
+            return makeBodyRow(row, readOnly);
+        })];
+        return ['TABLE', {id:'table'}, [head, foot, body]];
+    };
+
+    Render.asHTML = function (obj, rows, cols, readOnly) {
+        return Hyperjson.toDOM(toHyperjson(cellMatrix(obj, rows, cols, readOnly), readOnly));
+    };
+
+    var diffIsInput = Render.diffIsInput = function (info) {
+        var nodeName = Cryptpad.find(info, ['node', 'nodeName']);
+        if (nodeName !== 'INPUT') { return; }
+        return true;
+    };
+
+    var getInputType = Render.getInputType = function (info) {
+        return Cryptpad.find(info, ['node', 'type']);
+    };
+
+    var preserveCursor = Render.preserveCursor = function (info) {
+        if (['modifyValue', 'modifyAttribute'].indexOf(info.diff.action) !== -1) {
+            var element = info.node;
+
+            if (typeof(element.selectionStart) !== 'number') { return; }
+
+            var o = info.oldValue || '';
+            var n = info.newValue || '';
+            var op = TextPatcher.diff(o, n);
+
+            info.selection = ['selectionStart', 'selectionEnd'].map(function (attr) {
+                return TextPatcher.transformCursor(element[attr], op);
+            });
+        }
+    };
+
+    var recoverCursor = Render.recoverCursor = function (info) {
+        try {
+            if (info.selection && info.node) {
+                info.node.selectionStart = info.selection[0];
+                info.node.selectionEnd = info.selection[1];
+            }
+        } catch (err) {
+            // FIXME LOL empty try-catch?
+            //console.log(info.node);
+            //console.error(err);
+        }
+    };
+
+    var diffOptions = {
+        preDiffApply: function (info) {
+            if (!diffIsInput(info)) { return; }
+            switch (getInputType(info)) {
+                case 'number':
+                    //console.log('checkbox');
+                    //console.log("[preDiffApply]", info);
+                    break;
+                case 'text':
+                    preserveCursor(info);
+                    break;
+                default: break;
+            }
+        },
+        postDiffApply: function (info) {
+            if (info.selection) { recoverCursor(info); }
+            /*
+            if (!diffIsInput(info)) { return; }
+            switch (getInputType(info)) {
+                case 'checkbox':
+                    console.log("[postDiffApply]", info);
+                    break;
+                case 'text': break;
+                default: break;
+            }*/
+        }
+    };
+
+    Render.updateTable = function (table, obj, conf) {
+        var DD = new DiffDOM(diffOptions);
+
+        var rows = conf ? conf.rows : null;
+        var cols = conf ? conf.cols : null;
+        var readOnly = conf ? conf.readOnly : false;
+        var matrix = cellMatrix(obj, rows, cols, readOnly);
+
+        var hj = toHyperjson(matrix, readOnly);
+
+        if (!hj) { throw new Error("Expected Hyperjson!"); }
+
+        var table2 = Hyperjson.toDOM(hj);
+        var patch = DD.diff(table, table2);
+        DD.apply(table, patch);
+    };
+
+    return Render;
+};
+
+    return Renderer;
+});

www/poll/app-poll.less

@@ -0,0 +1,565 @@
+@import (once) "../../customize/src/less2/include/browser.less";
+@import (once) "../../customize/src/less2/include/toolbar.less";
+@import (once) "../../customize/src/less2/include/markdown.less";
+@import (once) '../../customize/src/less2/include/fileupload.less';
+@import (once) '../../customize/src/less2/include/alertify.less';
+@import (once) '../../customize/src/less2/include/tokenfield.less';
+@import (once) '../../customize/src/less2/include/tools.less';
+@import (once) '../../customize/src/less2/include/avatar.less';
+
+.toolbar_main();
+.fileupload_main();
+.alertify_main();
+.tokenfield_main();
+
+@poll-fore: #555;
+
+@poll-th-bg: #005bef;
+@poll-th-fg: #fff;
+@poll-th-user-bg: darken(@poll-th-bg, 10%);
+@poll-editing: lighten(@poll-th-bg, 10%);
+@poll-winner: darken(@poll-th-bg, 15%);
+@poll-td-bg: @poll-th-bg;
+@poll-td-fg: @poll-th-fg;
+
+@poll-help-bg: #bbffbb; // lightgreen
+
+@poll-uncommitted-cell: #eee;
+@poll-uncommitted-bg: #ddd; //lighten(@poll-th-bg, 50%);
+@poll-uncommitted-text: black;
+
+@poll-placeholder: #666;
+@poll-border-color: #555;
+@poll-cover-color: #000;
+@poll-fg: #000;
+@poll-option-yellow: #ff5;
+@poll-option-gray: #ccc;
+
+.bottom-left(@s: 5px) { border-bottom-left-radius: @s; }
+.top-left(@s: 5px) { border-top-left-radius: @s; }
+
+display: flex;
+flex-flow: column;
+overflow-x: hidden;
+
+#cp-app-poll-content {
+    display: flex;
+    flex: 1;
+    min-height: 0;
+    #cp-app-poll-form {
+        flex: 1;
+        overflow-y: auto;
+        &.cp-app-poll-published {
+            #cp-app-poll-create-option {
+                display: none;
+            }
+            .cp-app-poll-table-remove[data-rt-id^="y"], .cp-app-poll-table-edit[data-rt-id^="y"] {
+                display: none;
+            }
+            tr.cp-app-poll-table-uncommitted {
+                display: none;
+            }
+        }
+    }
+}
+
+.cp-app-poll-table-text-cell input[type="text"] {
+    width: 400px;
+}
+
+input[type="text"], textarea {
+    background-color: white;
+    color: black;
+    border: 0;
+}
+
+input[type="text"][disabled], textarea[disabled] {
+    background-color: transparent;
+    border: 0px;
+}
+
+// The placeholder color only seems to effect Safari when not set
+
+input[type="text"][disabled]::placeholder {
+    //color: @poll-placeholder;
+    opacity: 1;
+}
+
+table#cp-app-poll-table {
+    margin: 0px;
+}
+#cp-app-poll-table-container {
+    position: relative;
+    padding: 30px 0;
+    width: ~"calc(100% - 30px)";
+}
+#cp-app-poll-table-container button {
+    //display: none;
+    border-radius: 0;
+    border: 0;
+}
+#cp-app-poll-create-user {
+    display: inline-flex;
+    height: 24px;
+    padding: 0;
+    width: 50px;
+    overflow: hidden;
+}
+#cp-app-poll-create-option {
+    display: inline-flex;
+    width: 50px;
+    height: 24px;
+    padding: 0;
+}
+#cp-app-poll-table-scroll {
+    overflow-y: hidden;
+    overflow-x: auto;
+    margin-left: ~"calc(25% + 30px)";
+    max-width: ~"calc(75% - 30px - 100px - 100px)";
+    width: auto;
+    display: inline-block;
+}
+#cp-app-poll-description {
+    &~ .CodeMirror {
+        margin: auto;
+        min-width: 80%;
+        width: 80%;
+        min-height: 200px;
+        border: 1px solid black;
+        .CodeMirror-placeholder {
+            color: #777;
+        }
+    }
+}
+#cp-app-poll-description-published {
+    display: none;
+    padding: 15px;
+    margin: auto;
+
+    min-width: 80%;
+    width: 80%;
+    min-height: 7em;
+    color: #000;
+    border: 1px solid transparent;
+    background-color: #eeeeee;
+    font: @colortheme_app-font;
+    text-align: left;
+    media-tag > * {
+        max-width: 100%;
+        max-height: 20em;
+    }
+}
+.cp-app-poll-published {
+    #cp-app-poll-description {
+        display: none;
+        &~ .CodeMirror {
+            display: none;
+        }
+    }
+    #cp-app-poll-description-published {
+        display: block;
+        &:empty {
+            display: none;
+        }
+    }
+}
+
+#cp-app-poll-help {
+    width: 100%;
+    margin: auto;
+    padding: 20px 10%;
+    background: @poll-help-bg;
+}
+
+// from cryptpad.less
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+    margin: 20px;
+}
+tbody {
+    //border: 1px solid @poll-border-color;
+    * {
+        box-sizing: border-box;
+    }
+    tr {
+        text-align: center;
+    }
+
+    td {
+        .tools_unselectable();
+        border-right: 1px solid @poll-border-color;
+        padding: 12px;
+        padding-top: 0px;
+        padding-bottom: 0px;
+        &:last-child {
+            border-right: none;
+        }
+    }
+}
+
+div.cp-app-poll-realtime {
+    display: block;
+    max-height: 100%;
+    max-width: 100%;
+
+    input {
+        &[type="text"] {
+            height: 1em;
+            margin: 0px;
+        }
+    }
+    > textarea {
+        width: 50%;
+        height: 15vh;
+    }
+
+    padding: 0px;
+    margin: 0px;
+
+    table {
+        border-collapse: collapse;
+        width: ~"calc(100% - 1px)";
+        .cp-app-poll-table-editing {
+            background-color: @poll-editing;
+        }
+        .cp-app-poll-table-uncommitted {
+            .cp-app-poll-table-cover {
+                background-color: @poll-uncommitted-cell !important;
+            }
+            div.cp-app-poll-table-text-cell {
+                background-color: @poll-uncommitted-bg !important;
+                color: @poll-uncommitted-text !important;
+                input {
+                    width: ~"calc(100% - 80px)" !important;
+                    vertical-align: middle;
+                }
+            }
+            text-align: center;
+            background-color: @poll-uncommitted-bg !important;
+            color: @poll-uncommitted-text !important;
+        }
+        tr {
+            height: 28px;
+            /* Options */
+            td:first-child {
+                position:absolute;
+                left: 30px;
+                top: auto;
+                width: 25%;
+            }
+            /* Uncommitted column */
+            td:nth-last-child(2) {
+                position: absolute;
+                top: auto;
+                width: 100px;
+                min-width: unset !important;
+                height: auto !important;
+            }
+            /* Results */
+            td:last-child {
+                color: @poll-th-fg;
+                position:absolute;
+                top: auto;
+                margin-left: 100px;
+                width: 100px;
+                min-width: unset !important;
+                background-color: @poll-th-bg;
+            }
+            td {
+                padding: 0px;
+                margin: 0px;
+
+                div.cp-app-poll-table-text-cell {
+                    padding: 0px;
+                    margin: 0px;
+                    height: 100%;
+
+                    input {
+                        width: 80%;
+                        width: 90%;
+                        height: 100%;
+                        border: 0px;
+                        margin: 2px;
+                        &[disabled] {
+                            background-color: transparent;
+                            color: @poll-td-fg;
+                            //font-weight: bold;
+                        }
+                    }
+                }
+
+                &.cp-app-poll-table-checkbox-cell {
+                    margin: 0px;
+                    padding: 0px;
+                    height: 100%;
+                    min-width: 100px;
+
+                    div.cp-app-poll-table-checkbox-contain {
+                        display: inline-block;
+                        height: 100%;
+                        width: 100%;
+                        position: relative;
+
+                        label {
+                            background-color: transparent;
+                            display: block;
+                            position: absolute;
+                            top: 0px;
+                            left: 0px;
+                            height: 100%;
+                            width: 100%;
+                        }
+
+                        input {
+                            &[type="number"] {
+                                &:not(.editable) {
+                                    display: none;
+
+                                    ~ .cp-app-poll-table-cover {
+                                        line-height: 28px;
+                                        display: block;
+                                        font-weight: bold;
+                                        height: 100%;
+                                        display: block;
+
+                                        color: @poll-cover-color;
+
+                                        &:after {
+                                            height: 100%;
+                                        }
+
+                                    }
+                                }
+                            }
+                        }
+
+                        input[type="number"][value="0"] {
+                            ~ .cp-app-poll-table-cover {
+                                background-color: @colortheme_cp-red;
+                                &:after { content: "✖"; }
+                            }
+                        }
+                        input[type="number"][value="1"] {
+                            ~ .cp-app-poll-table-cover {
+                                background-color: @colortheme_cp-green;
+                                &:after { content: "✔"; }
+                            }
+                        }
+                        input[type="number"][value="2"] {
+                            ~ .cp-app-poll-table-cover {
+                                background-color: @poll-option-yellow;
+                                &:after { content: "~"; }
+                            }
+                        }
+                        input[type="number"][value="3"] {
+                            ~ .cp-app-poll-table-cover {
+                                background-color: @poll-option-gray;
+                                &:after { content: "?"; }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
+        input {
+            &[type="text"] {
+                height: auto;
+                width: 80%;
+            }
+        }
+        span {
+            .tools_unselectable();
+        }
+        thead {
+            height: 52px;
+            td {
+                padding: 0px 5px;
+                background: @poll-th-bg;
+                color: @poll-th-fg;
+                &:not(:last-child) {
+                    border-right: 1px solid rgba(255,255,255,0.2);
+                }
+                &:nth-last-child(2) {
+                    border-right: 1px solid @poll-border-color;
+                }
+                //text-align: center;
+                &.cp-app-poll-table-own {
+                    background: @poll-th-user-bg;
+                    .cp-app-poll-table-lock {
+                        cursor: default;
+                    }
+                }
+                .cp-app-poll-table-buttons {
+                    display: flex;
+                    justify-content: space-between;
+                    flex-wrap: wrap;
+                    align-items: center;
+                    span {
+                        cursor: pointer;
+                        width: 1em;
+                        text-align: center;
+                    }
+                    .cp-app-poll-table-bookmark {
+                        color: darken(@poll-th-fg, 30%);
+                        &.cp-app-poll-table-bookmark-full {
+                            color: @poll-th-fg;
+                        }
+                    }
+                }
+                input {
+                    &[type="text"] {
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        break-after: always;
+                        width: ~"calc(100% - 2px)"; // borders...
+                        box-sizing: border-box;
+                        padding: 1px 5px;
+                        margin: 1px;
+                        &[disabled] {
+                            color: @poll-th-fg;
+                        }
+                    }
+                }
+            }
+        }
+
+        tbody {
+            td:first-child {
+                background: @poll-td-bg;
+                color: @poll-td-fg;
+            }
+            td.cp-app-poll-table-winner {
+                background-color: @poll-winner;
+                &:last-child { font-weight: bold; }
+            }
+            .cp-app-poll-table-text-cell {
+                input[type="text"] {
+                    width: ~"calc(100% - 50px)";
+                    padding: 0 0.5em;
+                }
+                .cp-app-poll-table-edit {
+                    float:right;
+                    margin: 2px 10px 0 0;
+                }
+                .cp-app-poll-table-remove {
+                    float: left;
+                    margin: 2px 0 0 10px;
+                }
+            }
+            tr:not(:first-child) {
+                td:not(:first-child) {
+                    label {
+                        border-top: 1px solid @poll-border-color;
+                    }
+                }
+            }
+        }
+        .cp-app-poll-table-edit {
+            //color: @poll-cover-color;
+            cursor: pointer;
+            float: left;
+            margin-left: 10px;
+        }
+
+        thead {
+            tr {
+                th {
+                    input[type="text"][disabled] {
+                        background-color: transparent;
+                        color: @poll-fore;
+                        font-weight: bold;
+                    }
+                    .cp-app-poll-table-remove {
+                        cursor: pointer;
+                        font-size: 20px;
+                    }
+                }
+            }
+        }
+        tbody {
+            tr {
+                td {
+
+                }
+            }
+        }
+        tfoot {
+            display: none;
+        }
+    }
+    #cp-app-poll-comments {
+        width: 50%;
+        margin: 20px auto;
+        min-width: 400px;
+        padding-bottom: 5px;
+        button {
+            border-radius: 0;
+        }
+        #cp-app-poll-comments-add {
+            input, textarea {
+                border: 1px solid black;
+                width: 90%;
+                margin: 5px 5%;
+            }
+            input {
+                padding: 5px;
+                height: 26px;
+                &[disabled] {
+                    background: #eee;
+                }
+            }
+            textarea {
+                padding: 5px;
+                height: 8em;
+                line-height: 1.5em;
+            }
+            button {
+                padding: 10px;
+            }
+            text-align: center;
+        }
+        #cp-app-poll-comments-list {
+            .cp-app-poll-comments-list-el {
+                width: 90%;
+                margin: 5px 5%;
+            }
+            .cp-app-poll-comments-list-msg {
+                display: flex;
+                background: #eee;
+                padding: 5px 10px;
+                .cp-app-poll-comments-list-msg-text {
+                    flex: 1;
+                    white-space: pre;
+                }
+                .cp-app-poll-comments-list-msg-actions {
+                    button {
+                        padding: 0;
+                        width: 25px;
+                        line-height: 20px;
+                    }
+                }
+            }
+            .cp-app-poll-comments-list-data {
+                background: #ddd;
+                padding: 5px 10px;
+                display: flex;
+                align-items: center;
+                .cp-app-poll-comments-list-data-name {
+                    margin-left: 10px;
+                    flex: 1;
+                }
+                .cp-app-poll-comments-list-data-avatar { .avatar_main(30px); }
+            }
+        }
+    }
+}
+
+.btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+

www/poll/index.html

@@ -1,11 +1,38 @@
 <!DOCTYPE html>
-<html class="cp poll">
+<html>
 <head>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>CryptPad</title>
     <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
-    <title data-localization="poll_title">Zero Knowledge Date Picker</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <script async data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"
+    <meta name="referrer" content="no-referrer" />
-        data-bootload="/customize/template.js"></script>
+    <script async data-bootload="main.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
+    <style>
+        html, body {
+            margin: 0px;
+            padding: 0px;
+        }
+        #sbox-iframe {
+            position:fixed;
+            top:0px;
+            left:0px;
+            bottom:0px;
+            right:0px;
+            width:100%;
+            height:100%;
+            border:none;
+            margin:0;
+            padding:0;
+            overflow:hidden;
+        }
+        #sbox-filePicker-iframe {
+            position: fixed;
+            top:0; left:0;
+            bottom:0; right:0;
+            width:100%;
+            height: 100%;
+            border: 0;
+        }
+    </style>
 </head>
 <body>
-
+<iframe id="sbox-iframe">

www/poll/inner.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html class="cp-app-noscroll">
+<head>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
+    <script async data-bootload="/poll/inner.js" data-main="/common/sframe-boot.js?ver=1.6" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
+    <style>
+        .loading-hidden { display: none; }
+        #editor1 { display: none; }
+        html, body {
+            width: 100%;
+            height: 100%;
+            margin: 0px;
+            padding: 0px;
+            border: 0px;
+        }
+    </style>
+</head>
+<body class="cp-app-poll">
+

www/poll/main.js

@@ -1,806 +1,41 @@
+// Load #1, load as little as possible because we are in a race to get the loading screen up.
 define([
+    '/bower_components/nthen/index.js',
+    '/api/config',
     'jquery',
-    '/bower_components/textpatcher/TextPatcher.js',
+    '/common/requireconfig.js',
-    '/bower_components/chainpad-listmap/chainpad-listmap.js',
+    '/common/sframe-common-outer.js',
-    '/bower_components/chainpad-crypto/crypto.js',
+], function (nThen, ApiConfig, $, RequireConfig, SFCommonO) {
-    '/common/cryptpad-common.js',
+    var requireConfig = RequireConfig();
-    '/common/cryptget.js',
+
-    '/bower_components/hyperjson/hyperjson.js',
+    // Loaded in load #2
-    'render.js',
+    nThen(function (waitFor) {
-    '/common/toolbar2.js',
+        $(waitFor());
-    '/bower_components/file-saver/FileSaver.min.js',
+    }).nThen(function (waitFor) {
-
+        var req = {
-    'less!/bower_components/components-font-awesome/css/font-awesome.min.css',
+            cfg: requireConfig,
-    'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
+            req: [ '/common/loading.js' ],
-    'less!/customize/src/less/toolbar.less',
+            pfx: window.location.origin
-    'less!/customize/src/less/cryptpad.less',
+        };
-    'less!/poll/poll.less',
+        window.rc = requireConfig;
-], function ($, TextPatcher, Listmap, Crypto, Cryptpad, Cryptget, Hyperjson, Renderer, Toolbar) {
+        window.apiconf = ApiConfig;
-
+        $('#sbox-iframe').attr('src',
-    var Messages = Cryptpad.Messages;
+            ApiConfig.httpSafeOrigin + '/poll/inner.html?' + requireConfig.urlArgs +
-
+                '#' + encodeURIComponent(JSON.stringify(req)));
-    $(function () {
+
-
+        // This is a cheap trick to avoid loading sframe-channel in parallel with the
-    var HIDE_INTRODUCTION_TEXT = "hide-text";
+        // loading screen setup.
-    var defaultName;
+        var done = waitFor();
-
+        var onMsg = function (msg) {
-    var secret = Cryptpad.getSecrets();
+            var data = JSON.parse(msg.data);
-    var readOnly = secret.keys && !secret.keys.editKeyStr;
+            if (data.q !== 'READY') { return; }
-    // DEPRECATE_F
+            window.removeEventListener('message', onMsg);
-    if (!secret.keys) {
+            var _done = done;
-        secret.keys = secret.key;
+            done = function () { };
-    }
+            _done();
-
+        };
-    var DEBUG = false;
+        window.addEventListener('message', onMsg);
-    var debug = console.log;
+    }).nThen(function (/*waitFor*/) {
-    if (!DEBUG) {
+        SFCommonO.start();
-        debug = function() {};
-    }
-
-    Cryptpad.addLoadingScreen();
-    var onConnectError = function () {
-        Cryptpad.errorLoadingScreen(Messages.websocketError);
-    };
-
-    var Render = Renderer(Cryptpad);
-
-    var APP = window.APP = {
-        Toolbar: Toolbar,
-        Hyperjson: Hyperjson,
-        Render: Render,
-        $bar: $('#toolbar'),
-        editable: {
-            row: [],
-            col: []
-        },
-        locked: false
-    };
-
-    var sortColumns = function (order, firstcol) {
-        var colsOrder = order.slice();
-        colsOrder.sort(function (a, b) {
-            return (a === firstcol) ? -1 :
-                        ((b === firstcol) ? 1 : 0);
-        });
-        return colsOrder;
-    };
-
-    var isOwnColumnCommitted = function () {
-        return APP.proxy && APP.proxy.table.colsOrder.indexOf(APP.userid) !== -1;
-    };
-
-    var mergeUncommitted = function (proxy, uncommitted, commit) {
-        var newObj;
-        if (commit) {
-            newObj = proxy;
-        } else {
-            newObj = $.extend(true, {}, proxy);
-        }
-        // We have uncommitted data only if the user's column is not in the proxy
-        // If it is already is the proxy, nothing to merge
-        if (isOwnColumnCommitted()) {
-            return newObj;
-        }
-        // Merge uncommitted into the proxy
-        uncommitted.table.colsOrder.forEach(function (x) {
-            if (newObj.table.colsOrder.indexOf(x) !== -1) { return; }
-            newObj.table.colsOrder.push(x);
-        });
-        for (var k in uncommitted.table.cols) {
-            if (!newObj.table.cols[k]) {
-                newObj.table.cols[k] = uncommitted.table.cols[k];
-            }
-        }
-        for (var l in uncommitted.table.cells) {
-            if (!newObj.table.cells[l]) {
-                newObj.table.cells[l] = uncommitted.table.cells[l];
-            }
-        }
-        return newObj;
-    };
-
-    var styleUncommittedColumn = function () {
-        var id = APP.userid;
-
-        // Enable the checkboxes for the user's column (committed or not)
-        $('input[disabled="disabled"][data-rt-id^="' + id + '"]').removeAttr('disabled');
-        $('input[type="number"][data-rt-id^="' + id + '"]').addClass('enabled');
-        $('.lock[data-rt-id="' + id + '"]').addClass('fa-unlock').removeClass('fa-lock').attr('title', Messages.poll_unlocked);
-
-        if (isOwnColumnCommitted()) { return; }
-        $('[data-rt-id^="' + id + '"]').closest('td').addClass("uncommitted");
-        $('td.uncommitted .cover').addClass("uncommitted");
-        $('.uncommitted input[type="text"]').attr("placeholder", Messages.poll_userPlaceholder);
-    };
-
-    var unlockElements = function () {
-        APP.editable.row.forEach(function (id) {
-            var $input = $('input[type="text"][disabled="disabled"][data-rt-id="' + id + '"]').removeAttr('disabled');
-            $input.parent().parent().addClass('editing');
-            $('span.edit[data-rt-id="' + id + '"]').css('visibility', 'hidden');
-        });
-        APP.editable.col.forEach(function (id) {
-            var $input = $('input[disabled="disabled"][data-rt-id^="' + id + '"]').removeAttr('disabled');
-            $input.parent().addClass('editing');
-            $('input[type="number"][data-rt-id^="' + id + '"]').addClass('enabled');
-            $('.lock[data-rt-id="' + id + '"]').addClass('fa-unlock').removeClass('fa-lock').attr('title', Messages.poll_unlocked);
-        });
-    };
-
-    var updateTableButtons = function () {
-        if (!isOwnColumnCommitted()) {
-            $('#commit').show();
-        }
-
-        var $createOption = APP.$table.find('tfoot tr td:first-child');
-        var $commitCell = APP.$table.find('tfoot tr td:nth-child(2)');
-        $createOption.append(APP.$createRow);
-        $commitCell.append(APP.$commit);
-        $('#create-user, #create-option').css('display', 'inline-flex');
-        if (!APP.proxy || !APP.proxy.table.rowsOrder || APP.proxy.table.rowsOrder.length === 0) { $('#create-user').hide(); }
-        var width = $('#table').outerWidth();
-        if (width) {
-            //$('#create-user').css('left', width + 30 + 'px');
-        }
-    };
-
-    var setTablePublished = function (bool) {
-        if (bool) {
-            if (APP.$publish) { APP.$publish.hide(); }
-            if (APP.$admin) { APP.$admin.show(); }
-            $('#create-option').hide();
-            $('.remove[data-rt-id^="y"], .edit[data-rt-id^="y"]').hide();
-        } else {
-            if (APP.$publish) { APP.$publish.show(); }
-            if (APP.$admin) { APP.$admin.hide(); }
-            $('#create-option').show();
-            $('.remove[data-rt-id^="y"], .edit[data-rt-id^="y"]').show();
-        }
-    };
-
-    var updateDisplayedTable = function () {
-        styleUncommittedColumn();
-        unlockElements();
-        updateTableButtons();
-        setTablePublished(APP.proxy.published);
-
-        /*
-        APP.proxy.table.rowsOrder.forEach(function (rowId) {
-            $('[data-rt-id="' + rowId +'"]').val(APP.proxy.table.rows[rowId] || '');
-        });*/
-    };
-
-    var unlockColumn = function (id, cb) {
-        if (APP.editable.col.indexOf(id) === -1) {
-            APP.editable.col.push(id);
-        }
-        if (typeof(cb) === "function") {
-            cb();
-        }
-    };
-    var unlockRow = function (id, cb) {
-        if (APP.editable.row.indexOf(id) === -1) {
-            APP.editable.row.push(id);
-        }
-        if (typeof(cb) === "function") {
-            cb();
-        }
-    };
-
-    /*  Any time the realtime object changes, call this function */
-    var change = function (o, n, path, throttle, cb) {
-        if (path && !Cryptpad.isArray(path)) {
-            return;
-        }
-        if (path && path.join) {
-            debug("Change from [%s] to [%s] at [%s]",
-                o, n, path.join(', '));
-        }
-
-        var table = APP.$table[0];
-
-        var displayedObj = mergeUncommitted(APP.proxy, APP.uncommitted);
-
-        var colsOrder = sortColumns(displayedObj.table.colsOrder, APP.userid);
-        var conf = {
-            cols: colsOrder,
-            readOnly: readOnly
-        };
-
-        //Render.updateTable(table, displayedObj, conf);
-
-        /*  FIXME browser autocomplete fills in new fields sometimes
-            calling updateTable twice removes the autofilled in values
-            setting autocomplete="off" is not reliable
-
-            https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
-        */
-        Cryptpad.notify();
-
-        var getFocus = function () {
-            var active = document.activeElement;
-            if (!active) { return; }
-            return {
-                el: active,
-                start: active.selectionStart,
-                end: active.selectionEnd
-            };
-        };
-        var setFocus = function (obj) {
-            if (obj.el) { obj.el.focus(); }
-            else { return; }
-            if (obj.start) { obj.el.selectionStart = obj.start; }
-            if (obj.end) { obj.el.selectionEnd = obj.end; }
-        };
-
-        var updateTable = function () {
-            var displayedObj2 = mergeUncommitted(APP.proxy, APP.uncommitted);
-            var f = getFocus();
-            Render.updateTable(table, displayedObj2, conf);
-            APP.proxy.table.rowsOrder.forEach(function (rowId) {
-                $('input[data-rt-id="' + rowId +'"]').val(APP.proxy.table.rows[rowId] || '');
-            });
-            updateDisplayedTable();
-            setFocus(f);
-            if (typeof(cb) === "function") {
-                cb();
-            }
-        };
-
-        if (throttle) {
-            if (APP.throttled) { window.clearTimeout(APP.throttled); }
-            updateTable();
-            APP.throttled = window.setTimeout(function () {
-                updateDisplayedTable();
-            }, throttle);
-            return;
-        }
-
-        window.setTimeout(updateTable);
-    };
-
-    var getRealtimeId = function (input) {
-        return input.getAttribute && input.getAttribute('data-rt-id');
-    };
-
-    /*  Called whenever an event is fired on an input element */
-    var handleInput = function (input) {
-        var type = input.type.toLowerCase();
-        var id = getRealtimeId(input);
-
-        debug(input);
-
-        var object = APP.proxy;
-
-        var x = Render.getCoordinates(id)[0];
-        if (type !== "row" && x === APP.userid && APP.proxy.table.colsOrder.indexOf(x) === -1) {
-            object = APP.uncommitted;
-        }
-
-        switch (type) {
-            case 'text':
-                debug("text[rt-id='%s'] [%s]", id, input.value);
-                Render.setValue(object, id, input.value);
-                change(null, null, null, 50);
-                break;
-            case 'number':
-                debug("checkbox[tr-id='%s'] %s", id, input.value);
-                if (APP.editable.col.indexOf(x) >= 0 || x === APP.userid) {
-                    var value = parseInt(input.value);
-
-                    if (isNaN(value)) {
-                        console.error("Got NaN?!");
-                        break;
-                    }
-
-                    Render.setValue(object, id, value);
-                    change();
-                } else {
-                    debug('checkbox locked');
-                }
-                break;
-            default:
-                debug("Input[type='%s']", type);
-                break;
-        }
-    };
-
-    var hideInputs = function (target, isKeyup) {
-        if (APP.locked) { return; }
-        if (!isKeyup && $(target).is('[type="text"]')) {
-            return;
-        }
-        $('.lock[data-rt-id!="' + APP.userid + '"]').addClass('fa-lock').removeClass('fa-unlock').attr('title', Messages.poll_locked);
-        var $cells = APP.$table.find('thead td:not(.uncommitted), tbody td');
-        $cells.find('[type="text"][data-rt-id!="' + APP.userid + '"]').attr('disabled', true);
-        $cells.removeClass('editing');
-        $('.edit[data-rt-id!="' + APP.userid + '"]').css('visibility', 'visible');
-        APP.editable.col = [APP.userid];
-        APP.editable.row = [];
-    };
-
-    /*  Called whenever an event is fired on a span */
-    var handleSpan = function (span) {
-        var id = span.getAttribute('data-rt-id');
-        var type = Render.typeofId(id);
-        var isRemove = span.className && span.className.split(' ').indexOf('remove') !== -1;
-        var isEdit = span.className && span.className.split(' ').indexOf('edit') !== -1;
-        var isLock = span.className && span.className.split(' ').indexOf('lock') !== -1;
-        var isLocked = span.className && span.className.split(' ').indexOf('fa-lock') !== -1;
-        if (type === 'row') {
-            if (isRemove) {
-                Cryptpad.confirm(Messages.poll_removeOption, function (res) {
-                    if (!res) { return; }
-                    Render.removeRow(APP.proxy, id, function () {
-                        change();
-                    });
-                });
-            } else if (isEdit) {
-                hideInputs(span);
-                unlockRow(id, function () {
-                    change(null, null, null, null, function() {
-                        $('input[data-rt-id="' + id + '"]').focus();
-                    });
-                });
-            }
-        } else if (type === 'col') {
-            if (isRemove) {
-                Cryptpad.confirm(Messages.poll_removeUser, function (res) {
-                    if (!res) { return; }
-                    Render.removeColumn(APP.proxy, id, function () {
-                        change();
-                    });
-                });
-            } else if (isLock && isLocked) {
-                hideInputs(span);
-                unlockColumn(id, function () {
-                    change(null, null, null, null, function() {
-                        $('input[data-rt-id="' + id + '"]').focus();
-                    });
-                });
-            }
-        } else if (type === 'cell') {
-            change();
-        } else {
-            debug("UNHANDLED");
-        }
-    };
-
-    var handleClick = function (e, isKeyup) {
-        if (APP.locked) { return; }
-
-        e.stopPropagation();
-
-        if (!APP.ready) { return; }
-        if (!isKeyup && e.which !== 1) { return; } // only allow left clicks
-
-        var target = e && e.target;
-
-        if (!target) { return void debug("NO TARGET"); }
-
-        var nodeName = target && target.nodeName;
-        var shouldLock = $(target).hasClass('fa-unlock');
-
-        if ((!$(target).parents('#table tbody').length && $(target).hasClass('lock'))) {
-            hideInputs(e);
-        }
-
-        switch (nodeName) {
-            case 'INPUT':
-                if (isKeyup && (e.keyCode === 13 || e.keyCode === 27)) {
-                    hideInputs(target, isKeyup);
-                    break;
-                }
-                if ($(target).is('input[type="number"]')) { console.error("number input focused?"); break; }
-
-                handleInput(target);
-                break;
-            case 'LABEL':
-                var input = $('input[type="number"][id=' + $(target).attr('for') + ']');
-                var value = parseInt(input.val());
-
-                input.val((value + 1) % 4);
-
-                handleInput(input[0]);
-                break;
-            case 'SPAN':
-                if (shouldLock) {
-                    break;
-                }
-                handleSpan(target);
-                break;
-            case undefined:
-                //console.error(new Error("C'est pas possible!"));
-                break;
-            default:
-                debug(target, nodeName);
-                break;
-        }
-    };
-
-    /*
-        Make sure that the realtime data structure has all the required fields
-    */
-    var prepareProxy = function (proxy, schema) {
-        if (proxy && proxy.version === 1) { return; }
-        debug("Configuring proxy schema...");
-
-        proxy.info = proxy.info || schema.info;
-        Object.keys(schema.info).forEach(function (k) {
-            if (!proxy.info[k]) { proxy.info[k] = schema.info[k]; }
-        });
-
-        proxy.table = proxy.table || schema.table;
-        Object.keys(schema.table).forEach(function (k) {
-            if (!proxy.table[k]) { proxy.table[k] = schema.table[k]; }
-        });
-
-        proxy.version = 1;
-        proxy.type = 'poll';
-    };
-
-    /*
-
-    */
-    var publish = APP.publish = function (bool) {
-        if (!APP.ready) { return; }
-        if (APP.proxy.published !== bool) {
-            APP.proxy.published = bool;
-        }
-        setTablePublished(bool);
-        ['textarea'].forEach(function (sel) {
-            $(sel).attr('disabled', bool);
-        });
-    };
-
-    var showHelp = function(help) {
-        if (typeof help === 'undefined') { help = !$('#howItWorks').is(':visible'); }
-
-        var msg = (help ? Messages.poll_hide_help_button : Messages.poll_show_help_button);
-
-        $('#howItWorks').toggle(help);
-        $('#help').text(msg);
-    };
-
-    var Title;
-    var UserList;
-
-    var copyObject = function (obj) {
-        return JSON.parse(JSON.stringify(obj));
-    };
-
-    // special UI elements
-    var $description = $('#description').attr('placeholder', Messages.poll_descriptionHint || 'description');
-
-var ready = function (info, userid, readOnly) {
-    debug("READY");
-    debug('userid: %s', userid);
-
-    var proxy = APP.proxy;
-
-    var isNew = false;
-    var userDoc = JSON.stringify(proxy);
-    if (userDoc === "" || userDoc === "{}") { isNew = true; }
-
-    if (!isNew && typeof(proxy.type) !== 'undefined' && proxy.type !== 'poll') {
-        var errorText = Messages.typeError;
-        Cryptpad.errorLoadingScreen(errorText);
-        throw new Error(errorText);
-    }
-
-    if (typeof(proxy.type) === 'undefined') {
-        proxy.type = 'poll';
-    }
-
-    var uncommitted = APP.uncommitted = {};
-    prepareProxy(proxy, copyObject(Render.Example));
-    prepareProxy(uncommitted, copyObject(Render.Example));
-    if (!readOnly && proxy.table.colsOrder.indexOf(userid) === -1 &&
-        uncommitted.table.colsOrder.indexOf(userid) === -1) {
-        uncommitted.table.colsOrder.unshift(userid);
-    }
-
-    var displayedObj = mergeUncommitted(proxy, uncommitted, false);
-
-    var colsOrder = sortColumns(displayedObj.table.colsOrder, userid);
-
-    var $table = APP.$table = $(Render.asHTML(displayedObj, null, colsOrder, readOnly));
-    APP.$createRow = $('#create-option').click(function () {
-        Render.createRow(proxy, function (empty, id) {
-            change(null, null, null, null, function() {
-                handleSpan($('.edit[data-rt-id="' + id + '"]')[0]);
-            });
-        });
-    });
-
-    APP.$createCol = $('#create-user').click(function () {
-        Render.createColumn(proxy, function (empty, id) {
-            change(null, null, null, null, function() {
-                handleSpan($('.lock[data-rt-id="' + id + '"]')[0]);
-            });
-        });
-    });
-
-    // Commit button
-    APP.$commit = $('#commit').click(function () {
-        var uncommittedCopy = JSON.parse(JSON.stringify(APP.uncommitted));
-        APP.uncommitted = {};
-        prepareProxy(APP.uncommitted, copyObject(Render.Example));
-        mergeUncommitted(proxy, uncommittedCopy, true);
-        APP.$commit.hide();
-        change();
-    });
-
-    // #publish button is removed in readonly
-    APP.$publish = $('#publish')
-        .click(function () {
-            publish(true);
-        });
-
-    APP.$admin = $('#admin')
-        .click(function () {
-            publish(false);
-        });
-
-    APP.$help = $('#help')
-        .click(function () {
-            showHelp();
-        });
-
-    // Title
-    if (APP.proxy.info.defaultTitle) {
-        Title.updateDefaultTitle(APP.proxy.info.defaultTitle);
-    } else {
-        APP.proxy.info.defaultTitle = Title.defaultTitle;
-    }
-
-    var andThen = function () {
-        if (readOnly) { return; }
-        Cryptpad.setPadAttribute('userid', userid, function (e) {
-            if (e) { console.error(e); }
-        });
-    };
-
-    if (Cryptpad.initialName && !APP.proxy.info.title) {
-        APP.proxy.info.title = Cryptpad.initialName;
-        Title.updateTitle(Cryptpad.initialName, null, andThen);
-    } else {
-        Title.updateTitle(APP.proxy.info.title || Title.defaultTitle, null, andThen);
-    }
-
-    // Description
-    var resize = function () {
-        var lineCount = $description.val().split('\n').length;
-        $description.css('height', lineCount + 'rem');
-    };
-    $description.on('change keyup', function () {
-        var val = $description.val();
-        proxy.info.description = val;
-        resize();
-    });
-    resize();
-    if (typeof(proxy.info.description) !== 'undefined') {
-        $description.val(proxy.info.description);
-    }
-
-    $('#tableScroll').html('').prepend($table);
-    updateDisplayedTable();
-
-    $table
-        .click(handleClick)
-        .on('keyup', function (e) { handleClick(e, true); });
-
-    $(window).click(function(e) {
-        if (e.which !== 1) { return; }
-        hideInputs();
-    });
-
-    proxy
-        .on('change', ['info'], function (o, n, p) {
-            if (p[1] === 'title') {
-                Title.updateTitle(n);
-                Cryptpad.notify();
-            } else if (p[1] === "userData") {
-                UserList.addToUserData(APP.proxy.info.userData);
-            } else if (p[1] === 'description') {
-                var op = TextPatcher.diff(o, n);
-                var el = $description[0];
-
-                var selects = ['selectionStart', 'selectionEnd'].map(function (attr) {
-                    return TextPatcher.transformCursor(el[attr], op);
-                });
-                $description.val(n);
-                if (op) {
-                    el.selectionStart = selects[0];
-                    el.selectionEnd = selects[1];
-                }
-                Cryptpad.notify();
-            }
-
-            debug("change: (%s, %s, [%s])", o, n, p.join(', '));
-        })
-        .on('change', ['table'], change)
-        .on('remove', [], change);
-
-    var userInput = $('.uncommitted > input');
-    if (userInput.val() === '')
-    {
-        userInput.val(Cryptpad.getProxy()[Cryptpad.displayNameKey]);
-    }
-
-    UserList.addToUserData(APP.proxy.info.userData);
-
-    APP.ready = true;
-    if (!proxy.published) {
-        publish(false);
-    } else {
-        publish(true);
-    }
-
-    Cryptpad.removeLoadingScreen();
-
-    if (readOnly) { return; }
-    UserList.getLastName(APP.toolbar.$userNameButton, isNew);
-};
-
-var setEditable = function (editable) {
-    APP.locked = !editable;
-
-    if (editable === false) {
-        // disable all the things
-        $('.realtime input, .realtime button, .upper button, .realtime textarea').attr('disabled', APP.locked);
-        $('span.edit, span.remove').hide();
-        $('span.lock').addClass('fa-lock').removeClass('fa-unlock')
-            .attr('title', Messages.poll_locked)
-            .css({'cursor': 'default'});
-    } else {
-        // enable
-        $('span.edit, span.remove').show();
-        $('span.lock').css({'cursor': ''});
-        $('.realtime button, .upper button, .realtime textarea').attr('disabled', APP.locked);
-        unlockElements();
-    }
-};
-
-var disconnect = function () {
-    setEditable(false);
-    APP.toolbar.failed();
-    Cryptpad.alert(Messages.common_connectionLost, undefined, true);
-};
-
-var reconnect = function (info) {
-    setEditable(true);
-    APP.toolbar.reconnecting(info.myId);
-    Cryptpad.findOKButton().click();
-};
-
-var create = function (info) {
-    APP.myID = info.myID;
-
-    var editHash;
-    if (!readOnly) {
-        editHash = Cryptpad.getEditHashFromKeys(info.channel, secret.keys);
-    }
-
-    if (APP.realtime !== info.realtime) {
-        APP.realtime = info.realtime;
-        APP.patchText = TextPatcher.create({
-            realtime: info.realtime,
-            logging: true,
-        });
-    }
-
-    var onLocal = function () {
-        APP.proxy.info.userData = UserList.userData;
-    };
-    UserList = Cryptpad.createUserList(info, onLocal, Cryptget, Cryptpad);
-
-    var onLocalTitle = function () {
-        APP.proxy.info.title = Title.isDefaultTitle() ? "" : Title.title;
-    };
-    Title = Cryptpad.createTitle({}, onLocalTitle, Cryptpad);
-
-    var configTb = {
-        displayed: ['title', 'useradmin', 'spinner', 'lag', 'state', 'share', 'userlist', 'newpad', 'limit', 'upgrade'],
-        userList: UserList.getToolbarConfig(),
-        share: {
-            secret: secret,
-            channel: info.channel
-        },
-        title: Title.getTitleConfig(),
-        common: Cryptpad,
-        readOnly: readOnly,
-        ifrw: window,
-        realtime: info.realtime,
-        network: info.network,
-        $container: APP.$bar,
-        $contentContainer: $('#content')
-    };
-    APP.toolbar = Toolbar.create(configTb);
-
-    Title.setToolbar(APP.toolbar);
-
-    var $rightside = APP.toolbar.$rightside;
-
-    /* add a forget button */
-    var forgetCb = function (err) {
-        if (err) { return; }
-        setEditable(false);
-    };
-    var $forgetPad = Cryptpad.createButton('forget', true, {}, forgetCb);
-    $rightside.append($forgetPad);
-
-    // set the hash
-    if (!readOnly) { Cryptpad.replaceHash(editHash); }
-
-    /* save as template */
-    if (!Cryptpad.isTemplate(window.location.href)) {
-        var templateObj = {
-            rt: info.realtime,
-            Crypt: Cryptget,
-            getTitle: function () { return document.title; }
-        };
-        var $templateButton = Cryptpad.createButton('template', true, templateObj);
-        $rightside.append($templateButton);
-    }
-};
-
-    // don't initialize until the store is ready.
-    Cryptpad.ready(function () {
-        Cryptpad.reportAppUsage();
-        var config = {
-            websocketURL: Cryptpad.getWebsocketURL(),
-            channel: secret.channel,
-            readOnly: readOnly,
-            data: {},
-            // our public key
-            validateKey: secret.keys.validateKey || undefined,
-            //readOnly: readOnly,
-            crypto: Crypto.createEncryptor(secret.keys),
-            userName: 'poll',
-            network: Cryptpad.getNetwork()
-        };
-
-        if (readOnly) {
-            $('#commit, #create-user, #create-option, #publish, #admin').remove();
-        }
-
-        var parsedHash = Cryptpad.parsePadUrl(window.location.href);
-        defaultName = Cryptpad.getDefaultName(parsedHash);
-        var rt = window.rt = APP.rt = Listmap.create(config);
-        APP.proxy = rt.proxy;
-        rt.proxy
-        .on('create', create)
-        .on('ready', function (info) {
-            Cryptpad.getPadAttribute('userid', function (e, userid) {
-                if (e) { console.error(e); }
-                if (!userid) { userid = Render.coluid(); }
-                APP.userid = userid;
-                ready(info, userid, readOnly);
-            });
-        })
-        .on('disconnect', disconnect)
-        .on('reconnect', reconnect);
-
-        Cryptpad.getAttribute(['poll', HIDE_INTRODUCTION_TEXT], function (e, value) {
-            if (e) { console.error(e); }
-            if (!value) {
-                Cryptpad.setAttribute(['poll', HIDE_INTRODUCTION_TEXT], "1", function (e) {
-                    if (e) { console.error(e); }
-                });
-                showHelp(true);
-            } else {
-                showHelp(false);
-            }
-        });
-
-        Cryptpad.onLogout(function () { setEditable(false); });
-    });
-    Cryptpad.onError(function (info) {
-        if (info) {
-            onConnectError();
-        }
-    });
-
     });
 });

www/poll/render.js

@@ -7,12 +7,13 @@ define([
     var DiffDOM = window.diffDOM;
 
     var Example = {
-        info: {
+        metadata: {
             title: '',
-            description: '',
             userData: {}
         },
-        table: {
+        description: '',
+        comments: {},
+        content: {
 /*  TODO
 
 deprecate the practice of storing cells, cols, and rows separately.
@@ -62,15 +63,15 @@ var Renderer = function (Cryptpad) {
     };
 
     var getColumnValue = Render.getColumnValue = function (obj, colId) {
-        return Cryptpad.find(obj, ['table', 'cols'].concat([colId]));
+        return Cryptpad.find(obj, ['content', 'cols'].concat([colId]));
     };
 
     var getRowValue = Render.getRowValue = function (obj, rowId) {
-        return Cryptpad.find(obj, ['table', 'rows'].concat([rowId]));
+        return Cryptpad.find(obj, ['content', 'rows'].concat([rowId]));
     };
 
     var getCellValue = Render.getCellValue = function (obj, cellId) {
-        var value = Cryptpad.find(obj, ['table', 'cells'].concat([cellId]));
+        var value = Cryptpad.find(obj, ['content', 'cells'].concat([cellId]));
         if (typeof value === 'boolean') {
             return (value === true ? 1 : 0);
         } else {
@@ -79,25 +80,25 @@ var Renderer = function (Cryptpad) {
     };
 
     var setRowValue = Render.setRowValue = function (obj, rowId, value) {
-        var parent = Cryptpad.find(obj, ['table', 'rows']);
+        var parent = Cryptpad.find(obj, ['content', 'rows']);
         if (typeof(parent) === 'object') { return (parent[rowId] = value); }
         return null;
     };
 
     var setColumnValue = Render.setColumnValue = function (obj, colId, value) {
-        var parent = Cryptpad.find(obj, ['table', 'cols']);
+        var parent = Cryptpad.find(obj, ['content', 'cols']);
         if (typeof(parent) === 'object') { return (parent[colId] = value); }
         return null;
     };
 
     var setCellValue = Render.setCellValue = function (obj, cellId, value) {
-        var parent = Cryptpad.find(obj, ['table', 'cells']);
+        var parent = Cryptpad.find(obj, ['content', 'cells']);
         if (typeof(parent) === 'object') { return (parent[cellId] = value); }
         return null;
     };
 
     Render.createColumn = function (obj, cb, id, value) {
-        var order = Cryptpad.find(obj, ['table', 'colsOrder']);
+        var order = Cryptpad.find(obj, ['content', 'colsOrder']);
         if (!order) { throw new Error("Uninitialized realtime object!"); }
         id = id || coluid();
         value = value || "";
@@ -107,8 +108,8 @@ var Renderer = function (Cryptpad) {
     };
 
     Render.removeColumn = function (obj, id, cb) {
-        var order = Cryptpad.find(obj, ['table', 'colsOrder']);
+        var order = Cryptpad.find(obj, ['content', 'colsOrder']);
-        var parent = Cryptpad.find(obj, ['table', 'cols']);
+        var parent = Cryptpad.find(obj, ['content', 'cols']);
 
         if (!(order && parent)) { throw new Error("Uninitialized realtime object!"); }
 
@@ -118,9 +119,9 @@ var Renderer = function (Cryptpad) {
                 .error(new Error("Attempted to remove id which does not exist"));
         }
 
-        Object.keys(obj.table.cells).forEach(function (key) {
+        Object.keys(obj.content.cells).forEach(function (key) {
             if (key.indexOf(id) === 0) {
-                delete obj.table.cells[key];
+                delete obj.content.cells[key];
             }
         });
 
@@ -132,7 +133,7 @@ var Renderer = function (Cryptpad) {
     };
 
     Render.createRow = function (obj, cb, id, value) {
-        var order = Cryptpad.find(obj, ['table', 'rowsOrder']);
+        var order = Cryptpad.find(obj, ['content', 'rowsOrder']);
         if (!order) { throw new Error("Uninitialized realtime object!"); }
         id = id || rowuid();
         value = value || "";
@@ -142,8 +143,8 @@ var Renderer = function (Cryptpad) {
     };
 
     Render.removeRow = function (obj, id, cb) {
-        var order = Cryptpad.find(obj, ['table', 'rowsOrder']);
+        var order = Cryptpad.find(obj, ['content', 'rowsOrder']);
-        var parent = Cryptpad.find(obj, ['table', 'rows']);
+        var parent = Cryptpad.find(obj, ['content', 'rows']);
 
         if (!(order && parent)) { throw new Error("Uninitialized realtime object!"); }
 
@@ -183,15 +184,15 @@ var Renderer = function (Cryptpad) {
     };
 
     var getRowIds = Render.getRowIds = function (obj) {
-        return Cryptpad.find(obj, ['table', 'rowsOrder']);
+        return Cryptpad.find(obj, ['content', 'rowsOrder']);
     };
 
     var getColIds = Render.getColIds = function (obj) {
-        return Cryptpad.find(obj, ['table', 'colsOrder']);
+        return Cryptpad.find(obj, ['content', 'colsOrder']);
     };
 
     var getCells = Render.getCells = function (obj) {
-        return Cryptpad.find(obj, ['table', 'cells']);
+        return Cryptpad.find(obj, ['content', 'cells']);
     };
 
     /*  cellMatrix takes a proxy object, and optionally an alternate ordering
@@ -217,26 +218,26 @@ var Renderer = function (Cryptpad) {
                         'data-rt-id': col,
                         type: 'text',
                         value: getColumnValue(obj, col) || "",
-                        placeholder: Cryptpad.Messages.poll_userPlaceholder,
+                        placeholder: Cryptpad.Messages.anonymous,
                         disabled: 'disabled'
                     };
                     return result;
-                }));
+                })).concat([null]);
             }
             if (i === rows.length) {
                 return [null].concat(cols.map(function () {
                     return {
-                        'class': 'lastRow',
+                        'class': 'cp-app-poll-table-lastrow',
                     };
                 }));
             }
 
             return [{
                 'data-rt-id': row,
-                value: getRowValue(obj, row),
+                value: getRowValue(obj, row) || '',
                 type: 'text',
                 placeholder: Cryptpad.Messages.poll_optionPlaceholder,
-                disabled: 'disabled'
+                disabled: 'disabled',
             }].concat(cols.map(function (col) {
                 var id = [col, rows[i-1]].join('_');
                 var val = cells[id];
@@ -254,7 +255,9 @@ var Renderer = function (Cryptpad) {
                     result.value = val;
                 }
                 return result;
-            }));
+            })).concat([{
+                'data-rt-count-id': row
+            }]);
         });
     };
 
@@ -262,7 +265,7 @@ var Renderer = function (Cryptpad) {
         return ['SPAN', {
             'data-rt-id': id,
             'title': Cryptpad.Messages.poll_remove,
-            class: 'remove',
+            class: 'cp-app-poll-table-remove',
         }, ['✖']];
     };
 
@@ -270,7 +273,7 @@ var Renderer = function (Cryptpad) {
         return ['SPAN', {
             'data-rt-id': id,
             'title': Cryptpad.Messages.poll_edit,
-            class: 'edit',
+            class: 'cp-app-poll-table-edit',
         }, ['✐']];
     };
 
@@ -278,7 +281,16 @@ var Renderer = function (Cryptpad) {
         return ['SPAN', {
             'data-rt-id': id,
             'title': Cryptpad.Messages.poll_locked,
-            class: 'lock fa fa-lock',
+            class: 'cp-app-poll-table-lock fa fa-lock',
+        }, []];
+    };
+
+    var makeBookmarkElement = Render.makeBookmarkElement = function (id) {
+        return ['SPAN', {
+            'data-rt-id': id,
+            'title': Cryptpad.Messages.poll_bookmark_col,
+            'style': 'visibility: hidden;',
+            class: 'cp-app-poll-table-bookmark fa fa-thumb-tack',
         }, []];
     };
 
@@ -287,8 +299,11 @@ var Renderer = function (Cryptpad) {
         if (cell.type === 'text') {
             var elements = [['INPUT', cell, []]];
             if (!readOnly) {
-                elements.unshift(makeRemoveElement(cell['data-rt-id']));
+                var buttons = [];
-                elements.unshift(makeLockElement(cell['data-rt-id']));
+                buttons.unshift(makeRemoveElement(cell['data-rt-id']));
+                buttons.unshift(makeLockElement(cell['data-rt-id']));
+                buttons.unshift(makeBookmarkElement(cell['data-rt-id']));
+                elements.unshift(['DIV', {'class': 'cp-app-poll-table-buttons'}, buttons]);
             }
             return ['TD', {}, elements];
         }
@@ -305,11 +320,11 @@ var Renderer = function (Cryptpad) {
         // FIXME
         attrs.id = cell['data-rt-id'];
 
-        var labelClass = 'cover';
+        var labelClass = 'cp-app-poll-table-cover';
 
         // TODO implement Yes/No/Maybe/Undecided
-        return ['TD', {class:"checkbox-cell"}, [
+        return ['TD', {class:"cp-app-poll-table-checkbox-cell"}, [
-            ['DIV', {class: 'checkbox-contain'}, [
+            ['DIV', {class: 'cp-app-poll-table-checkbox-contain'}, [
                 ['INPUT', attrs, []],
                 ['SPAN', {class: labelClass}, []],
                 ['LABEL', {
@@ -328,7 +343,7 @@ var Renderer = function (Cryptpad) {
                 elements.push(makeEditElement(cell['data-rt-id']));
             }
             return ['TD', {}, [
-                    ['DIV', {class: 'text-cell'}, elements]
+                    ['DIV', {class: 'cp-app-poll-table-text-cell'}, elements]
             ]];
         }
 
@@ -355,7 +370,7 @@ var Renderer = function (Cryptpad) {
         var body = ['TBODY', {}, matrix.slice(1, -1).map(function (row) {
             return makeBodyRow(row, readOnly);
         })];
-        return ['TABLE', {id:'table'}, [head, foot, body]];
+        return ['TABLE', {id:'cp-app-poll-table'}, [head, foot, body]];
     };
 
     Render.asHTML = function (obj, rows, cols, readOnly) {

www/whiteboard/inner.js

@@ -363,7 +363,7 @@ define([
             updateLocalPalette(palette);
             readOnly = metadataMgr.getPrivateData().readOnly;
 
-            Title = common.createTitle({}, config.onLocal);
+            Title = common.createTitle({});
 
             var configTb = {
                 displayed: ['title', 'useradmin', 'spinner', 'share', 'userlist', 'newpad', 'limit'],