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

Creation page with mobile support

Browse Source
This commit is contained in:
yflory
2017-12-11 12:19:44 +01:00
parent e96d54e655
commit 1922dbfd75
5 changed files with 280 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
www/common/common-ui-elements.js
View File

@@ -6,11 +6,12 @@ define([
'/common/common-language.js',
'/common/common-interface.js',
'/common/common-feedback.js',
'/common/hyperscript.js',
'/common/media-tag.js',
'/customize/messages.js',
'css!/common/tippy.css',
], function ($, Config, Util, Hash, Language, UI, Feedback, MediaTag, Messages) {
], function ($, Config, Util, Hash, Language, UI, Feedback, h, MediaTag, Messages) {
var UIElements = {};
// Configure MediaTags to use our local viewer
@@ -1119,33 +1120,124 @@ define([
});
};
UIElements.getPadCreationScreen = function (common, Toolbar, cb) {
UIElements.getPadCreationScreen = function (common, cb) {
if (!common.isLoggedIn()) { return void cb(); }
var sframeChan = common.getSframeChannel();
var metadataMgr = common.getMetadataMgr();
var type = metadataMgr.getMetadataLazy().type;
var $body = $('body');
var $creation = $('<div>', { id: 'cp-creation' }).appendTo($body);
var $bar = $('<div>', {'class': 'cp-toolbar'}).appendTo($creation);
var $creationContainer = $('<div>', { id: 'cp-creation-container' }).appendTo($body);
var $creation = $('<div>', { id: 'cp-creation' }).appendTo($creationContainer);
// Create a toolbar?
var displayed = ['useradmin', 'newpad', 'limit', 'pageTitle'];
var configTb = {
displayed: displayed,
hideDisplayName: true,
$container: $bar,
metadataMgr: metadataMgr,
sfCommon: common,
pageTitle: 'Pad creation BETA'
var setHTML = function (e, html) {
e.innerHTML = html;
return e;
};
var toolbar = Toolbar.create(configTb);
toolbar.$rightside.html('');
// Title
$creation.append(h('h1.cp-creation-title', Messages['button_new'+type]));
// Deleted pad warning
if (metadataMgr.getPrivateData().isDeleted) {
$creation.append(h('div.cp-creation-deleted', Messages.creation_404));
}
var createHelper = function (text) {
var q = h('span.cp-creation-help.fa.fa-question', {
title: text
});
return q;
};
// Owned pads
var owned = h('div.cp-creation-owned', [
h('h2', [
Messages.creation_ownedTitle,
createHelper(Messages.creation_owned1 + '\n' + Messages.creation_owned2)
]),
setHTML(h('p'), Messages.creation_owned1 + '<br>' + Messages.creation_owned2),
h('input#cp-creation-owned-true.cp-creation-owned-value', {
type: 'radio',
name: 'cp-creation-owned',
value: 1,
checked: 'checked'
}),
h('label', { 'for': 'cp-creation-owned-true' }, Messages.creation_ownedTrue),
h('input#cp-creation-owned-false.cp-creation-owned-value', {
type: 'radio',
name: 'cp-creation-owned',
value: 0
}),
h('label', { 'for': 'cp-creation-owned-false' }, Messages.creation_ownedFalse)
]);
$creation.append(owned);
// Life time
var expire = h('div.cp-creation-expire', [
h('h2', [
Messages.creation_expireTitle,
createHelper(Messages.creation_expire1, Messages.creation_expire2)
]),
setHTML(h('p'), Messages.creation_expire1 + '<br>' + Messages.creation_expire2),
h('input#cp-creation-expire-false.cp-creation-expire-value', {
type: 'radio',
name: 'cp-creation-expire',
value: 0,
checked: 'checked'
}),
h('label', { 'for': 'cp-creation-expire-false' }, Messages.creation_expireFalse),
h('input#cp-creation-expire-true.cp-creation-expire-value', {
type: 'radio',
name: 'cp-creation-expire',
value: 1
}),
h('label', { 'for': 'cp-creation-expire-true' }, [
Messages.creation_expireTrue,
h('span.cp-creation-expire-picker', [
h('input#cp-creation-expire-val', {
type: "number",
min: 1,
max: 100,
value: 3
}),
h('select#cp-creation-expire-unit', [
h('option', { value: 'hour' }, Messages.creation_expireHours),
h('option', { value: 'day' }, Messages.creation_expireDays),
h('option', {
value: 'month',
selected: 'selected'
}, Messages.creation_expireMonths)
])
])
])
]);
$creation.append(expire);
// Create the pad
var create = function (template) {
// Type of pad
var ownedVal = parseInt($('input[name="cp-creation-owned"]:checked').val());
// Life time
var expireVal = 0;
if(parseInt($('input[name="cp-creation-expire"]:checked').val())) {
var unit = 0;
switch ($('#cp-creation-expire-unit').val()) {
case "hour" : unit = 3600; break;
case "day" : unit = 3600 * 24; break;
case "month": unit = 3600 * 24 * 30; break;
default: unit = 0;
}
expireVal = ($('#cp-creation-expire-val').val() || 0) * unit;
}
// TODO remove these lines
ownedVal = undefined;
expire = undefined;
sframeChan.query("Q_CREATE_PAD", {
owned: true, // TODO
expire: false, // TODO
owned: ownedVal,
expire: expireVal,
template: template
}, function () {
$creation.remove();
@@ -1153,12 +1245,14 @@ define([
});
};
var $create = $(h('div.cp-creation-create', [
h('h2', Messages.creation_createTitle)
])).appendTo($creation);
// Pick a template?
var type = metadataMgr.getMetadataLazy().type;
sframeChan.query("Q_TEMPLATE_EXIST", type, function (err, data) {
if (!data) { return; }
var $templateButton = $('<button>').text('Create pad from template')
.appendTo($creation);
var $templateButton = $('<button>').text(Messages.creation_createFromTemplate)
.appendTo($create);
var pickerCfg = {
types: [type],
@@ -1175,15 +1269,8 @@ define([
var fileDialogCfg = {
onSelect: function (data) {
if (data.type === type && first) {
//UI.addLoadingScreen({hideTips: true});
create(data.href);
first = false;
/*sframeChan.query('Q_TEMPLATE_USE', data.href, function () {
UI.removeLoadingScreen();
Feedback.send('TEMPLATE_USED');
});*/
//if (focus) { focus.focus(); }
//return;
}
}
};
@@ -1191,8 +1278,10 @@ define([
});
});
var $button = $('<button>').text('Create pad').appendTo($creation);
$button.click();
var $button = $('<button>').text(Messages.creation_createFromScratch).appendTo($create);
$button.click(function () {
create();
});
};
return UIElements;