web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Improve UI, fix issues with the table

Browse Source
This commit is contained in:
yflory
2016-12-06 18:55:10 +01:00
parent 6dff82ede2
commit 740b6e955e
8 changed files with 231 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
www/poll/test/index.html
View File

@@ -55,7 +55,7 @@
#tableContainer {
position: relative;
padding: 29px;
padding-right: 82px;
padding-right: 79px;
}
#tableContainer button {
height: 2rem;
@@ -67,8 +67,8 @@
#create-user {
position: absolute;
display: inline-block;
/*left: 0px;
top: 31px;*/
/*left: 0px;*/
top: 55px;
width: 50px;
overflow: hidden;
}
@@ -77,11 +77,20 @@
}
#tableScroll {
overflow-x: auto;
margin-left: 400px;
margin-left: calc(30% - 50px + 29px);
max-width: 70%;
width: auto;
display: inline-block;
}
#description[disabled] {
resize: none;
}
#description {
padding: 5px;
}
#commit {
width: 100%;
}
</style>
</head>
<body>
@@ -96,17 +105,17 @@
<p data-localization="poll_p_encryption"></p>
</div>
<button id="publish" style="display: none;">publish poll</button>
<button id="admin" style="display: none;">admin</button>
<button id="publish" data-localization-title="poll_publish_button" data-localization="poll_publish_button" style="display: none;">publish poll</button>
<button id="admin" data-localization-title="poll_admin_button" data-localization="poll_admin_button" style="display: none;">admin</button>
<form class="realtime">
<div class="realtime">
<br />
<textarea rows=5 cols=50 disabled="disabled" id="description"></textarea><br />
<div id="tableContainer">
<div id="tableScroll"></div>
<button id="create-user"><span class="fa fa-plus"></span></button>
<button id="create-option"><span class="fa fa-plus"></span></button>
<button id="commit"><span class="fa fa-check"></span></button>
<button data-localization-title="poll_create_user" id="create-user"><span class="fa fa-plus"></span></button>
<button data-localization-title="poll_create_option" id="create-option"><span class="fa fa-plus"></span></button>
<button data-localization-title="poll_commit" id="commit"><span class="fa fa-check"></span></button>
</div>
</form>
</div>

68
www/poll/test/main.js
View File

@@ -96,7 +96,7 @@ define([
$('[data-rt-id^="' + id + '"]').closest('td').addClass("uncommitted");
$('td.uncommitted .remove, td.uncommitted .edit').css('visibility', 'hidden');
$('td.uncommitted .cover').addClass("uncommitted");
$('.uncommitted input[type="text"]').attr("placeholder", "New column here"); //TODO
$('.uncommitted input[type="text"]').attr("placeholder", Messages.poll_userPlaceholder);
};
var unlockElements = function () {
@@ -114,7 +114,6 @@ define([
var updateTableButtons = function () {
if ($('.checkbox-cell').length && !isOwnColumnCommitted()) {
$('#commit').show();
$('#commit').css('width', $($('.checkbox-cell')[0]).width());
}
var $createOption = APP.$table.find('tfoot tr td:first-child');
@@ -129,10 +128,25 @@ define([
}
};
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);
};
var unlockColumn = function (id, cb) {
@@ -211,7 +225,7 @@ define([
break;
case 'checkbox':
console.log("checkbox[tr-id='%s'] %s", id, input.checked);
if ($(input).hasClass('enabled')) {
if (APP.editable.col.indexOf(x) >= 0 || x === APP.userid) {
Render.setValue(object, id, input.checked);
change();
} else {
@@ -329,18 +343,7 @@ define([
if (APP.proxy.published !== bool) {
APP.proxy.published = bool;
}
if (bool) {
APP.$publish.hide();
APP.$admin.show();
$('#create-option').hide();
$('.remove[data-rt-id^="y"], .edit[data-rt-id^="y"]').hide();
} else {
APP.$publish.show();
APP.$admin.hide();
$('#create-option').show();
$('.remove[data-rt-id^="y"], .edit[data-rt-id^="y"]').show();
}
setTablePublished(bool);
['textarea'].forEach(function (sel) {
$(sel).attr('disabled', bool);
});
@@ -456,7 +459,6 @@ define([
var $table = APP.$table = $(Render.asHTML(displayedObj, null, colsOrder, readOnly));
var $createRow = APP.$createRow = $('#create-option').click(function () {
//
console.error("BUTTON CLICKED! LOL");
Render.createRow(proxy, function () {
change();
@@ -479,6 +481,18 @@ define([
change();
});
// #publish button is removed in readonly
var $publish = APP.$publish = $('#publish')
.click(function () {
publish(true);
});
// #publish button is removed in readonly
var $admin = APP.$admin = $('#admin')
.click(function () {
publish(false);
});
// Title
if (APP.proxy.info.defaultTitle) {
updateDefaultTitle(APP.proxy.info.defaultTitle);
@@ -488,10 +502,16 @@ define([
updateTitle(APP.proxy.info.title || defaultName);
// 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);
}
@@ -530,18 +550,6 @@ define([
.on('change', ['table'], change)
.on('remove', [], change);
// #publish button is removed in readonly
var $publish = APP.$publish = $('#publish')
.click(function () {
publish(true);
});
// #publish button is removed in readonly
var $admin = APP.$admin = $('#admin')
.click(function () {
publish(false);
});
addToUserData(APP.proxy.info.userData);
getLastName(function (err, lastName) {
@@ -686,10 +694,10 @@ define([
})
.on('disconnect', disconnect);
Cryptpad.getPadAttribute(HIDE_INTRODUCTION_TEXT, function (e, value) {
Cryptpad.getAttribute(HIDE_INTRODUCTION_TEXT, function (e, value) {
if (e) { console.error(e); }
if (value === null) {
Cryptpad.setPadAttribute(HIDE_INTRODUCTION_TEXT, "1", function (e) {
Cryptpad.setAttribute(HIDE_INTRODUCTION_TEXT, "1", function (e) {
if (e) { console.error(e) }
});
} else if (value === "1") {

10
www/poll/test/render.js
View File

@@ -205,7 +205,7 @@ by maintaining indexes in rowsOrder and colsOrder
'data-rt-id': col,
type: 'text',
value: getColumnValue(obj, col) || "",
placeholder: 'User', //TODO translate
placeholder: Cryptpad.Messages.poll_userPlaceholder,
disabled: 'disabled'
};
return result;
@@ -223,7 +223,7 @@ by maintaining indexes in rowsOrder and colsOrder
'data-rt-id': row,
value: getRowValue(obj, row),
type: 'text',
placeholder: 'Option', //TODO translate
placeholder: Cryptpad.Messages.poll_optionPlaceholder,
disabled: 'disabled'
}].concat(cols.map(function (col) {
var id = [col, rows[i-1]].join('_');
@@ -253,7 +253,7 @@ by maintaining indexes in rowsOrder and colsOrder
return ['SPAN', {
'data-rt-id': id,
class: 'edit',
}, ['']];
}, ['✐']];
};
var makeHeadingCell = Render.makeHeadingCell = function (cell, readOnly) {
@@ -263,8 +263,8 @@ by maintaining indexes in rowsOrder and colsOrder
var editElement = makeEditElement(cell['data-rt-id']);
var elements = [['INPUT', cell, []]];
if (!readOnly) {
elements.push(removeElement);
elements.push(editElement);
elements.unshift(removeElement);
elements.unshift(editElement);
}
return ['TD', {}, elements];
}