From ffedcb63f77bbf3a208bd1d6e46b3552bb1eb3c9 Mon Sep 17 00:00:00 2001 From: yflory Date: Fri, 25 Nov 2016 18:17:03 +0100 Subject: [PATCH] Display own column at the beginning, add uncommitted column --- customize.dist/main.css | 8 +++++++- www/poll/test/main.js | 29 ++++++++++++++++++++++++++--- www/poll/test/render.js | 24 +++++++++++++++++------- 3 files changed, 50 insertions(+), 11 deletions(-) diff --git a/customize.dist/main.css b/customize.dist/main.css index 2455aa465..ddccca51f 100644 --- a/customize.dist/main.css +++ b/customize.dist/main.css @@ -337,9 +337,11 @@ form.realtime table tr td div.text-cell { padding: 0px; margin: 0px; height: 100%; + width: 500px; } form.realtime table tr td div.text-cell input { width: 80%; + width: 90%; height: 100%; border: 0px; } @@ -351,9 +353,10 @@ form.realtime table tr td div.text-cell input[disabled] { form.realtime table tr td.checkbox-cell { margin: 0px; padding: 0px; + height: 100%; } form.realtime table tr td.checkbox-cell div.checkbox-contain { - display: block; + display: inline-block; height: 100%; width: 100%; position: relative; @@ -376,6 +379,9 @@ form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbo color: #302B28; display: block; } +form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after { + height: 100%; +} form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after { content: "✖"; } diff --git a/www/poll/test/main.js b/www/poll/test/main.js index cf2132478..22b3d06db 100644 --- a/www/poll/test/main.js +++ b/www/poll/test/main.js @@ -21,6 +21,18 @@ define([ //$bar: $('#toolbar').css({ border: '1px solid white', background: 'grey', 'margin-bottom': '1vh', }), }; + var sortColumns = function (order, firstcol) { + var colsOrder = order.slice(); + colsOrder.sort(function (a, b) { + return (a === firstcol) ? -1 : + ((b === firstcol) ? 1 : 0); + }); + if (colsOrder.indexOf(firstcol) === -1) { + colsOrder.unshift(firstcol); + } + return colsOrder; + }; + /* Any time the realtime object changes, call this function */ var change = function (o, n, path) { if (path && path.join) { @@ -29,7 +41,13 @@ define([ } var table = APP.$table[0]; - Render.updateTable(table, APP.proxy); + + var colsOrder = sortColumns(APP.proxy.table.colsOrder, APP.userid); + var conf = { + cols: colsOrder + }; + + Render.updateTable(table, APP.proxy, conf); /* FIXME browser autocomplete fills in new fields sometimes calling updateTable twice removes the autofilled in values @@ -38,7 +56,7 @@ define([ https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion */ window.setTimeout(function () { - Render.updateTable(table, APP.proxy); + Render.updateTable(table, APP.proxy, conf); }); }; @@ -53,6 +71,8 @@ define([ console.log(input); + if ($(input).hasClass("uncommitted-cell")) { console.log('do nothing'); return; } + switch (type) { case 'text': console.log("text[rt-id='%s'] [%s]", id, input.value); @@ -151,7 +171,9 @@ define([ prepareProxy(proxy, Render.Example); - var $table = APP.$table = $(Render.asHTML(proxy)); + var colsOrder = sortColumns(proxy.table.colsOrder, userid); + + var $table = APP.$table = $(Render.asHTML(proxy, null, colsOrder)); var $createRow = APP.$createRow = $('#create-option').click(function () { // console.error("BUTTON CLICKED! LOL"); @@ -227,6 +249,7 @@ define([ Cryptpad.getPadAttribute('userid', function (e, userid) { if (e) { console.error(e); } if (userid === null) { userid = Render.coluid(); } + APP.userid = userid; Cryptpad.setPadAttribute('userid', userid, function (e) { ready(info, userid); }); diff --git a/www/poll/test/render.js b/www/poll/test/render.js index fde96c54c..b27fd3db1 100644 --- a/www/poll/test/render.js +++ b/www/poll/test/render.js @@ -194,11 +194,16 @@ by maintaining indexes in rowsOrder and colsOrder return [null].concat(rows).map(function (row, i) { if (i === 0) { return [null].concat(cols.map(function (col) { - return { + var result = { 'data-rt-id': col, type: 'text', - value: getColumnValue(obj, col) || "", + value: getColumnValue(obj, col) || "" }; + if (getColumnValue(obj, col) === false) { + result.placeholder = 'new column here'; //TODO translate + result['class'] = 'uncommitted'; + } + return result; })); } @@ -215,7 +220,9 @@ by maintaining indexes in rowsOrder and colsOrder type: 'checkbox', autocomplete: 'nope' }; - + if (getColumnValue(obj, col) === false) { + result['class'] = 'uncommitted-cell'; + } if (val) { result.checked = true; } return result; })); @@ -232,9 +239,10 @@ by maintaining indexes in rowsOrder and colsOrder var makeHeadingCell = Render.makeHeadingCell = function (cell) { if (!cell) { return ['TD', {}, []]; } if (cell.type === 'text') { + var removeElement = cell['class'] !== "uncommitted" ? makeRemoveElement(cell['data-rt-id']) : ''; return ['TD', {}, [ ['INPUT', cell, []], - makeRemoveElement(cell['data-rt-id']) + removeElement ]]; } return ['TD', cell, []]; @@ -294,8 +302,8 @@ by maintaining indexes in rowsOrder and colsOrder return ['TABLE', {id:'table'}, [head, body]]; }; - var asHTML = Render.asHTML = function (obj) { - return Hyperjson.toDOM(toHyperjson(cellMatrix(obj))); + var asHTML = Render.asHTML = function (obj, rows, cols) { + return Hyperjson.toDOM(toHyperjson(cellMatrix(obj, rows, cols))); }; var diffIsInput = Render.diffIsInput = function (info) { @@ -369,7 +377,9 @@ by maintaining indexes in rowsOrder and colsOrder var updateTable = Render.updateTable = function (table, obj, conf) { var DD = new DiffDOM(diffOptions); - var matrix = cellMatrix(obj); + var rows = conf ? conf.rows : null; + var cols = conf ? conf.cols : null; + var matrix = cellMatrix(obj, rows, cols); var hj = toHyperjson(matrix);