infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

poll: Implement multiple choices

pull/1/head
Pierre Bondoerffer 2017-06-12 18:01:51 +02:00
parent 685b352db8
commit b8e394db67
No known key found for this signature in database
GPG Key ID: C0C7C0C5063F2236
4 changed files with 101 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
www/poll/main.js
View File

@ -98,7 +98,7 @@ define([
// Enable the checkboxes for the user's column (committed or not)
$('input[disabled="disabled"][data-rt-id^="' + id + '"]').removeAttr('disabled');
$('input[type="checkbox"][data-rt-id^="' + id + '"]').addClass('enabled');
$('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; }
@ -117,7 +117,7 @@ define([
APP.editable.col.forEach(function (id) {
$input = $('input[disabled="disabled"][data-rt-id^="' + id + '"]').removeAttr('disabled');
$input.parent().addClass('editing');
$('input[type="checkbox"][data-rt-id^="' + id + '"]').addClass('enabled');
$('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);
});
};
@ -276,10 +276,10 @@ define([
Render.setValue(object, id, input.value);
change(null, null, null, 50);
break;
case 'checkbox':
debug("checkbox[tr-id='%s'] %s", id, input.checked);
case 'number':
debug("checkbox[tr-id='%s'] %s", id, input.value);
if (APP.editable.col.indexOf(x) >= 0 || x === APP.userid) {
Render.setValue(object, id, input.checked);
Render.setValue(object, id, parseInt(input.value));
change();
} else {
debug('checkbox locked');
@ -378,10 +378,18 @@ define([
hideInputs(target, isKeyup);
break;
}
if ($(target).is('input[type="number"]')) { 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':
//case 'LABEL':
if (shouldLock) {
break;
}

65
www/poll/poll.css
View File

@ -229,41 +229,64 @@ div.realtime table tr td.checkbox-cell div.checkbox-contain label {
height: 100%;
width: 100%;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable),
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) {
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable),
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) {
display: none;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover {
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover {
font-weight: bold;
background-color: #FA5858;
color: #000;
display: block;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after {
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover:after {
height: 100%;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after {
content: "✖";
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.yes,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.yes {
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover.yes,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover.yes {
background-color: #46E981;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.yes:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.yes:after {
content: "✔";
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.uncommitted,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.uncommitted {
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover.uncommitted,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover.uncommitted {
background: #ddd;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.mine,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.mine {
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover.mine,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"]:not(.editable) ~ .cover.mine {
display: none;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="0"] ~ .cover,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="0"] ~ .cover {
background-color: #FA5858;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="0"] ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="0"] ~ .cover:after {
content: "✖";
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="1"] ~ .cover,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="1"] ~ .cover {
background-color: #46E981;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="1"] ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="1"] ~ .cover:after {
content: "✔";
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="2"] ~ .cover,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="2"] ~ .cover {
background-color: #ff5;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="2"] ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="2"] ~ .cover:after {
content: "~";
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="3"] ~ .cover,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="3"] ~ .cover {
background-color: #ccc;
}
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="3"] ~ .cover:after,
div.realtime table tr td.checkbox-cell div.checkbox-contain input[type="number"][value="3"] ~ .cover:after {
content: "?";
}
form.realtime table input[type="text"],
div.realtime table input[type="text"] {
height: auto;

34
www/poll/poll.less
View File

@ -9,6 +9,8 @@
@poll-border-color: #555;
@poll-cover-color: #000;
@poll-fg: #000;
@poll-option-yellow: #ff5;
@poll-option-gray: #ccc;
html, body {
width: 100%;
@ -251,7 +253,7 @@ form.realtime, div.realtime {
}
input {
&[type="checkbox"] {
&[type="number"] {
&:not(.editable) {
display: none;
@ -259,26 +261,21 @@ form.realtime, div.realtime {
display: block;
font-weight: bold;
background-color: @cp-red;
color: @poll-cover-color;
&:after {
height: 100%;
}
&:after { content: "✖"; }
display: block;
&.yes {
background-color: @cp-green;
&:after { content: "✔"; }
}
&.uncommitted {
background: #ddd;
}
&.mine {
display: none;
}
@ -286,6 +283,31 @@ form.realtime, div.realtime {
}
}
}
input[type="number"][value="0"] {
~ .cover {
background-color: @cp-red;
&:after { content: "✖"; }
}
}
input[type="number"][value="1"] {
~ .cover {
background-color: @cp-green;
&:after { content: "✔"; }
}
}
input[type="number"][value="2"] {
~ .cover {
background-color: @poll-option-yellow;
&:after { content: "~"; }
}
}
input[type="number"][value="3"] {
~ .cover {
background-color: @poll-option-gray;
&:after { content: "?"; }
}
}
}
}
}

24
www/poll/render.js
View File

@ -70,7 +70,12 @@ var Renderer = function (Cryptpad) {
};
var getCellValue = Render.getCellValue = function (obj, cellId) {
return Cryptpad.find(obj, ['table', 'cells'].concat([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) {
@ -234,16 +239,20 @@ var Renderer = function (Cryptpad) {
disabled: 'disabled'
}].concat(cols.map(function (col) {
var id = [col, rows[i-1]].join('_');
var val = cells[id] || false;
var val = cells[id];
var result = {
'data-rt-id': id,
type: 'checkbox',
type: 'number',
autocomplete: 'nope',
value: '3',
};
if (readOnly) {
result.disabled = "disabled";
}
if (val) { result.checked = true; }
if (typeof val !== 'undefined') {
if (typeof val === 'boolean') { val = (val ? '1' : '0'); }
result.value = val;
}
return result;
}));
});
@ -297,9 +306,6 @@ var Renderer = function (Cryptpad) {
attrs.id = cell['data-rt-id'];
var labelClass = 'cover';
if (cell.checked) {
labelClass += ' yes';
}
// TODO implement Yes/No/Maybe/Undecided
return ['TD', {class:"checkbox-cell"}, [
@ -326,7 +332,7 @@ var Renderer = function (Cryptpad) {
]];
}
if (cell && cell.type === 'checkbox') {
if (cell && cell.type === 'number') {
return makeCheckbox(cell);
}
return ['TD', cell, []];
@ -399,7 +405,7 @@ var Renderer = function (Cryptpad) {
preDiffApply: function (info) {
if (!diffIsInput(info)) { return; }
switch (getInputType(info)) {
case 'checkbox':
case 'number':
//console.log('checkbox');
//console.log("[preDiffApply]", info);
break;