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

detect whether you are new to a page

Browse Source 
prompt for your name and create a column for your username
prompt before deleting columns as well
style a few elements differently
pull/1/head
ansuz 8 years ago
parent e2b162bf6d
commit 76bfb6ab35
4 changed files with 123 additions and 45 deletions
Show Stats Download Patch File Download Diff File

15
customize.dist/main.css
Unescape Escape View File

@ -302,24 +302,27 @@ form.realtime table tr td.checkbox-cell div.checkbox-contain {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] { form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.mine) {
display: none; display: none;
} }
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label { form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.mine) ~ .cover {
font-weight: bold; font-weight: bold;
background-color: #FF0073; background-color: #FF0073;
color: #302B28; color: #302B28;
display: block; display: block;
} }
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label:after { form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.mine) ~ .cover:after {
content: "✖"; content: "✖";
} }
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label.yes { form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.mine) ~ .cover.yes {
background-color: #46E981; background-color: #46E981;
} }
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label.yes:after { form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.mine) ~ .cover.yes:after {
content: "✔"; content: "✔";
} }
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.mine) ~ .cover.mine {
display: none;
}
form.realtime table input[type="text"] { form.realtime table input[type="text"] {
height: 100%; height: 100%;
width: 90%; width: 90%;
@ -333,7 +336,6 @@ form.realtime table tfoot tr td {
z-index: 4000; z-index: 4000;
cursor: pointer; cursor: pointer;
} }
form.realtime #adduser,
form.realtime #addoption { form.realtime #addoption {
color: #46E981; color: #46E981;
border: 1px solid #46E981; border: 1px solid #46E981;
@ -341,6 +343,7 @@ form.realtime #addoption {
} }
form.realtime #adduser { form.realtime #adduser {
border-top-left-radius: 5px; border-top-left-radius: 5px;
padding: 15px;
} }
form.realtime #addoption { form.realtime #addoption {
border-bottom-left-radius: 5px; border-bottom-left-radius: 5px;

20
customize.dist/src/cryptpad.less
Unescape Escape View File

@ -373,8 +373,14 @@ form.realtime {
input { input {
&[type="checkbox"] { &[type="checkbox"] {
&.mine {
// idk
}
&:not(.mine) {
display: none; display: none;
~ label {
~ .cover {
display: block; display: block;
font-weight: bold; font-weight: bold;
@ -387,6 +393,10 @@ form.realtime {
background-color: @cp-green; background-color: @cp-green;
&:after { content: "✔"; } &:after { content: "✔"; }
} }
&.mine {
display: none;
}
}
} }
} }
} }
@ -431,14 +441,18 @@ form.realtime {
} }
} }
#adduser, //#adduser,
#addoption { #addoption {
color: @cp-green; color: @cp-green;
border: 1px solid @cp-green; border: 1px solid @cp-green;
padding: 15px; padding: 15px;
} }
#adduser { .top-left; } #adduser {
.top-left;
//border: 1px solid grey;
padding: 15px;
}
#addoption { .bottom-left; } #addoption { .bottom-left; }
} }

2
www/poll/index.html
Unescape Escape View File

@ -62,7 +62,7 @@
<thead> <thead>
<tr> <tr>
<td> <td>
<div id="adduser" class="clickable" title="click to add a user">+ Users</div> <div id="adduser"></div>
</td> </td>
</tr> </tr>
</thead> </thead>

103
www/poll/main.js
Unescape Escape View File

@ -70,12 +70,6 @@ define([
}; };
}; };
var find = function (map, path) {
return (map && path.reduce(function (p, n) {
return typeof p[n] !== 'undefined' && p[n];
}, map)) || undefined;
};
var Input = function (opt) { return $('<input>', opt); }; var Input = function (opt) { return $('<input>', opt); };
var Checkbox = function (id) { var Checkbox = function (id) {
var p = parseXY(id); var p = parseXY(id);
@ -86,8 +80,9 @@ define([
'class': 'checkbox-contain', 'class': 'checkbox-contain',
}); });
var $label = $('<label>', { var $cover = $('<span>', {
'for': id, 'for': id,
'class': 'cover'
}); });
var $check = Input({ var $check = Input({
@ -98,15 +93,21 @@ define([
console.log("(%s, %s) => %s", p.x, p.y, $check[0].checked); console.log("(%s, %s) => %s", p.x, p.y, $check[0].checked);
var checked = proxy.table.cells[id] = $check[0].checked? 1: 0; var checked = proxy.table.cells[id] = $check[0].checked? 1: 0;
if (checked) { if (checked) {
$label.addClass('yes'); $cover.addClass('yes');
} }
else { else {
$label.removeClass('yes'); $cover.removeClass('yes');
} }
}); });
if (p.x === module.userId) {
$check.addClass('mine');
} else {
console.log(module.userId, p.x);
}
$div.append($check); $div.append($check);
$check.after($label); $check.after($cover);
return $div; //$check; return $div; //$check;
}; };
@ -116,7 +117,13 @@ define([
var setEditable = function (bool) { var setEditable = function (bool) {
module.isEditable = bool; module.isEditable = bool;
$('input, textarea').attr('disabled', !bool);
items.forEach(function ($item) {
$item.attr('disabled', !bool);
});
$('input[id^="y"]').each(function (i, e) {
$(this).attr('disabled', !bool);
});
}; };
var coluid = Uid('x'); var coluid = Uid('x');
@ -181,6 +188,7 @@ define([
id: id, id: id,
type: 'text', type: 'text',
placeholder: 'your name', placeholder: 'your name',
disabled: true,
}).on('keyup change', function () { }).on('keyup change', function () {
proxy.table.cols[id] = $user.val() || ""; proxy.table.cols[id] = $user.val() || "";
}); });
@ -193,8 +201,12 @@ define([
'class': 'remove', 'class': 'remove',
'title': 'remove column', // TODO translate 'title': 'remove column', // TODO translate
}).text('✖').click(function () { }).text('✖').click(function () {
Cryptpad.confirm("Are you sure you'd like to remove this user?", // TODO translate
function (yes) {
if (!yes) { return; }
removeColumn(proxy, id); removeColumn(proxy, id);
table.removeColumn(id); table.removeColumn(id);
});
})); }));
proxy.table.cols[id] = value || ""; proxy.table.cols[id] = value || "";
@ -243,11 +255,22 @@ define([
return $option; return $option;
}; };
/*
$('#adduser').click(function () { $('#adduser').click(function () {
if (!module.isEditable) { return; } if (!module.isEditable) { return; }
var id = coluid(); var id = coluid();
makeUser(module.rt.proxy, id).focus(); makeUser(module.rt.proxy, id).focus();
}); });
*/
var makeUserEditable = module.makeUserEditable = function (id, bool) {
var $name = $('input[type="text"][id="' + id + '"]').attr('disabled', !bool);
var $sel = $('input[id^="' + id + '"]')
[bool?'addClass':'removeClass']('mine');
return $sel;
};
$('#addoption').click(function () { $('#addoption').click(function () {
if (!module.isEditable) { return; } if (!module.isEditable) { return; }
@ -348,7 +371,7 @@ define([
} }
var checked = box.checked = proxy.table.cells[uid] ? true : false; var checked = box.checked = proxy.table.cells[uid] ? true : false;
if (checked) { if (checked) {
$(box).parent().find('label').addClass('yes'); $(box).parent().find('.cover').addClass('yes');
} }
}); });
@ -445,10 +468,10 @@ define([
if (!$parent.length) { console.log("couldn't find parent element of checkbox"); return; } if (!$parent.length) { console.log("couldn't find parent element of checkbox"); return; }
if (checked) { if (checked) {
$parent.find('label').addClass('yes'); $parent.find('.cover').addClass('yes');
//$(el).parent(). //$(el).parent().
} else { } else {
$parent.find('label').removeClass('yes'); $parent.find('.cover').removeClass('yes');
} }
break; break;
default: default:
@ -643,14 +666,52 @@ define([
// TODO prompt them with questions to set up their poll... // TODO prompt them with questions to set up their poll...
} }
/* TODO Cryptpad.getPadAttribute('column', function (err, column) {
even if the user isn't the first, check their storage to see if if (err) {
they've visited before and if they 'own' a column in the table. console.log("unable to retrieve column");
if they do, make it editable and suggest that they fill it in. return;
}
if they have not visited, make a column for them. module.userId = column;
don't propogate changes from this column until they make changes
*/ var promptForName = function () {
// HERE
Cryptpad.prompt("What is your name?", "", function (name, ev) {
if (name === null) {
name = '';
}
if (!module.isEditable) { return; }
var id = module.userId = coluid();
Cryptpad.setPadAttribute('column', id, function (err) {
if (err) {
console.error("Couldn't remember your column id");
return;
}
console.log(id);
makeUser(module.rt.proxy, id, name).focus().val(name);
makeUserEditable(id, true);
});
});
};
if (column === null) {
//console.log("Looks like you're new to this poll, why don't you make a column");
promptForName();
return;
}
// column might be defined, but that column might have been deleted...
if (proxy.table.colsOrder.indexOf(column) === -1) {
promptForName();
return;
}
// if column is defined, then you can just make that column editable
makeUserEditable(column, true);
});
}; };
var config = { var config = {

Write Preview
Loading…
Cancel
Save