Add a settings category for the pad creation screen

pull/1/head
yflory 7 years ago
parent 8c9490868b
commit ef480fea79

@ -48,6 +48,9 @@
display: block;
color: @description-color;
margin-bottom: 5px;
p {
margin-bottom: 0;
}
}
margin-bottom: 20px;
}

@ -487,6 +487,7 @@ define(function () {
out.settings_cat_drive = "CryptDrive";
out.settings_cat_code = "Code";
out.settings_cat_pad = "Documents texte";
out.settings_cat_creation = "Nouveau pad";
out.settings_title = "Préférences";
out.settings_save = "Sauver";
@ -547,6 +548,14 @@ define(function () {
out.settings_padWidthHint = "L'éditeur de documents texte occupe toute la largeur de l'écran disponible par défaut, ce qui peut rendre le texte difficile à lire. Vous pouvez ici réduire la largeur de l'éditeur.";
out.settings_padWidthLabel = "Réduire la largeur de l'éditeur";
out.settings_creationSkip = "Passer l'écran de création de pad";
out.settings_creationSkipHint = "L'écran de création de pad offre de nouvelles options pour créer un pad, permettant d'avoir plus de contrôle et de sécurité concernant vos données. Toutefois, il peut ralentir votre travail en ajoutant une étape supplémentaire et donc, ici, vous avez la possibilité de choisir de passer cet écran et d'utiliser les paramètres par défaut choisis au-dessus.";
out.settings_creationSkipTrue = "Passer";
out.settings_creationSkipFalse = "Afficher";
out.settings_templateSkip = "Passer la fenêtre de choix d'un modèle";
out.settings_templateSkipHint = "Quand vous créez un nouveau pad, et si vous possédez des modèles pour ce type de pad, une fenêtre peut apparaître pour demander si vous souhaitez importer un modèle. Ici vous pouvez choisir de ne jamais montrer cette fenêtre et donc de ne jamais utiliser de modèle.";
out.upload_title = "Hébergement de fichiers";
out.upload_rename = "Souhaitez-vous renommer <b>{0}</b> avant son stockage en ligne ?<br>" +
"<em>L'extension du fichier ({1}) sera ajoutée automatiquement. "+

@ -493,6 +493,7 @@ define(function () {
out.settings_cat_drive = "CryptDrive";
out.settings_cat_code = "Code";
out.settings_cat_pad = "Rich text";
out.settings_cat_creation = "New pad";
out.settings_title = "Settings";
out.settings_save = "Save";
@ -553,6 +554,14 @@ define(function () {
out.settings_padWidthHint = "Rich text pads use by default the maximum available width on your screen and it can be difficult to read. You can reduce the editor's width here.";
out.settings_padWidthLabel = "Reduce the editor's width";
out.settings_creationSkip = "Skip the pad creation screen";
out.settings_creationSkipHint = "The pad creation screen offers new options to create a pad, providing you more control and security over your data. However, it may slow down your workflow by adding one additionnal step so, here, you have the option to skip this screen and use the default settings selected above.";
out.settings_creationSkipTrue = "Skip";
out.settings_creationSkipFalse = "Display";
out.settings_templateSkip = "Skip the template selection modal";
out.settings_templateSkipHint = "When you create a new empty pad, if you have stored templates for this type of pad, a modal appears to ask if you want to use a template. Here you can choose to never show this modal and so to never use a template.";
out.upload_title = "File upload";
out.upload_rename = "Do you want to rename <b>{0}</b> before uploading it to the server?<br>" +
"<em>The file extension ({1}) will be added automatically. "+
@ -819,7 +828,7 @@ define(function () {
out.creation_expireHours = "Hours";
out.creation_expireDays = "Days";
out.creation_expireMonths = "Months";
out.creation_expire1 = "By default, a pad stored by a registered users will never be removed from the server, unless it is requested by its owner.";
out.creation_expire1 = "By default, a pad stored by a registered user will never be removed from the server, unless it is requested by its owner.";
out.creation_expire2 = "If you prefer, you can set a life time to make sure the pad will be permanently deleted from the server and unavailable after the specified date.";
out.creation_createTitle = "Create a pad";
out.creation_createFromTemplate = "From template";

@ -1317,7 +1317,29 @@ define([
});
};
UIElements.getPadCreationScreen = function (common, cb) {
UIElements.setExpirationValue = function (val, $expire) {
if (val && typeof (val) === "number") {
$expire.find('#cp-creation-expire-true').attr('checked', true);
if (val % (3600 * 24 * 30) === 0) {
$expire.find('#cp-creation-expire-unit').val("month");
$expire.find('#cp-creation-expire-val').val(val / (3600 * 24 * 30));
return;
}
if (val % (3600 * 24) === 0) {
$expire.find('#cp-creation-expire-unit').val("day");
$expire.find('#cp-creation-expire-val').val(val / (3600 * 24));
return;
}
if (val % 3600 === 0) {
$expire.find('#cp-creation-expire-unit').val("hour");
$expire.find('#cp-creation-expire-val').val(val / 3600);
return;
}
// if we're here, it means we don't have a valid value so we should check unlimited
$expire.find('#cp-creation-expire-false').attr('checked', true);
}
};
UIElements.getPadCreationScreen = function (common, cfg, cb) {
if (!common.isLoggedIn()) { return void cb(); }
var sframeChan = common.getSframeChannel();
var metadataMgr = common.getMetadataMgr();
@ -1372,6 +1394,11 @@ define([
]);
$creation.append(owned);
// If set to "open pad" or not set, check "open pad"
if (!cfg.owned && typeof cfg.owned !== "undefined") {
$creation.find('#cp-creation-owned-false').attr('checked', true);
}
// Life time
var expire = h('div.cp-creation-expire', [
h('h2', [
@ -1413,6 +1440,8 @@ define([
]);
$creation.append(expire);
UIElements.setExpirationValue(cfg.expire, $creation);
// Create the pad
var create = function (template) {
// Type of pad
@ -1430,7 +1459,7 @@ define([
expireVal = ($('#cp-creation-expire-val').val() || 0) * unit;
}
sframeChan.query("Q_CREATE_PAD", {
common.createPad({
owned: ownedVal,
expire: expireVal,
template: template

@ -300,7 +300,9 @@ define([
}
}
if (newPad && !AppConfig.displayCreationScreen) {
var skipTemp = Util.find(privateDat, ['settings', 'general', 'creation', 'noTemplate']);
var skipCreation = Util.find(privateDat, ['settings', 'general', 'creation', 'skip']);
if (newPad && (!skipTemp && skipCreation)) {
common.openTemplatePicker();
}
};
@ -402,8 +404,11 @@ define([
}).nThen(function (waitFor) {
Test.registerInner(common.getSframeChannel());
if (!AppConfig.displayCreationScreen) { return; }
if (common.getMetadataMgr().getPrivateData().isNewFile) {
common.getPadCreationScreen(waitFor());
var priv = common.getMetadataMgr().getPrivateData();
if (priv.isNewFile) {
var c = (priv.settings.general && priv.settings.general.creation) || {};
if (c.skip) { return void common.createPad(c, waitFor()); }
common.getPadCreationScreen(c, waitFor());
}
}).nThen(function (waitFor) {
cpNfInner = common.startRealtime({

@ -165,6 +165,14 @@ define([
};
// Store
funcs.createPad = function (cfg, cb) {
ctx.sframeChan.query("Q_CREATE_PAD", {
owned: cfg.owned,
expire: cfg.expire,
template: cfg.template
}, cb);
};
funcs.sendAnonRpcMsg = function (msg, content, cb) {
ctx.sframeChan.query('Q_ANON_RPC_MESSAGE', {
msg: msg,

@ -2604,7 +2604,6 @@ define([
moveElements(pathsList, [TRASH], false, refresh);
}
else if ($(this).hasClass('cp-app-drive-context-deleteowned')) {
var pathsListD = [];
var msgD = Messages.fm_deleteOwnedPads;
UI.confirm(msgD, function(res) {
$(window).focus();
@ -2716,7 +2715,6 @@ define([
moveElements(pathsList, [TRASH], false, refresh);
}
else if ($(this).hasClass('cp-app-drive-context-deleteowned')) {
var pathsListD = [];
var msgD = Messages.fm_deleteOwnedPads;
UI.confirm(msgD, function(res) {
$(window).focus();

@ -5,6 +5,7 @@
@import (once) '../../customize/src/less2/include/alertify.less';
@import (once) '../../customize/src/less2/include/sidebar-layout.less';
@import (once) "../../customize/src/less2/include/limit-bar.less";
@import (once) "../../customize/src/less2/include/creation.less";
.toolbar_main(
@bg-color: @colortheme_settings-bg,
@ -14,6 +15,7 @@
.alertify_main();
.sidebar-layout_main();
.limit-bar_main();
.creation_main();
// body
&.cp-app-settings {
@ -55,7 +57,7 @@
width: @sidebar_button-width;
}
}
.cp-settings-backup-drive {
.cp-settings-drive-backup {
button {
span.fa {
margin-right: 5px;
@ -63,6 +65,78 @@
margin-right: 5px;
}
}
.cp-settings-creation-owned, .cp-settings-creation-expire,
.cp-settings-creation-skip, .cp-settings-creation-template {
input[type="radio"] {
display: none;
&:checked {
& + label {
font-weight: bold;
background-color: lighten(@colortheme_loading-bg, 20%);
cursor: default;
border: 1px solid #c1158e;
color: @colortheme_loading-color;
&:hover {
background-color: lighten(@colortheme_loading-bg, 20%);
}
}
}
}
input[type="radio"] + label {
.tools_unselectable();
display: inline-flex;
align-items: center;
justify-content: center;
width: 200px;
height: 50px;
padding: 5px;
margin: 0 20px;
border: 1px solid black;
cursor: pointer;
&:hover {
background-color: lighten(@colortheme_loading-bg, 10%);
}
}
.fa {
display: none;
margin-left: 50px;
}
}
.cp-settings-creation-skipped {
display: none !important; // we have to override an inline style attribute
}
.cp-settings-creation-expire {
#cp-creation-expire-true {
display: none;
&:checked {
& + label {
height: 100px;
.cp-creation-expire-picker {
display: inline;
}
}
}
}
label[for="cp-creation-expire-true"] {
flex-wrap: wrap;
.cp-creation-expire-picker {
display: none;
}
input {
width: 70px;
}
select {
width: 100px;
}
input, select {
border: none;
height: 30px;
background: @colortheme_loading-bg;
color: @colortheme_loading-color;
border-radius: 3px;
}
}
}
}
}
}

@ -4,9 +4,11 @@ define([
'/bower_components/nthen/index.js',
'/common/sframe-common.js',
'/common/common-interface.js',
'/common/common-ui-elements.js',
'/common/common-util.js',
'/common/common-hash.js',
'/customize/messages.js',
'/common/hyperscript.js',
'/bower_components/file-saver/FileSaver.min.js',
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
@ -18,9 +20,11 @@ define([
nThen,
SFCommon,
UI,
UIElements,
Util,
Hash,
Messages
Messages,
h
)
{
var saveAs = window.saveAs;
@ -41,21 +45,31 @@ define([
'cp-settings-thumbnails',
'cp-settings-userfeedback'
],
'creation': [
'cp-settings-creation-owned',
'cp-settings-creation-expire',
'cp-settings-creation-skip',
'cp-settings-creation-template'
],
'drive': [
'cp-settings-backup-drive',
'cp-settings-import-local-pads',
'cp-settings-reset-drive'
'cp-settings-drive-backup',
'cp-settings-drive-import-local',
'cp-settings-drive-reset'
],
'pad': [
'cp-settings-pad-width',
],
'code': [
'cp-settings-indent-unit',
'cp-settings-indent-type'
'cp-settings-code-indent-unit',
'cp-settings-code-indent-type'
]
};
var createInfoBlock = function () {
var create = {};
// Account settings
create['info-block'] = function () {
var $div = $('<div>', {'class': 'cp-settings-info-block'});
var $account = $('<div>', {'class': 'cp-sidebarlayout-element'}).appendTo($div);
@ -81,7 +95,7 @@ define([
};
// Create the block containing the display name field
var createDisplayNameInput = function () {
create['displayname'] = function () {
var $div = $('<div>', {'class': 'cp-settings-displayname cp-sidebarlayout-element'});
$('<label>', {'for' : 'cp-settings-displayname'}).text(Messages.user_displayName).appendTo($div);
var $inputBlock = $('<div>', {'class': 'cp-sidebarlayout-input-block'}).appendTo($div);
@ -124,111 +138,49 @@ define([
return $div;
};
var createIndentUnitSelector = function () {
var $div = $('<div>', {
'class': 'cp-settings-indent-unit cp-sidebarlayout-element'
});
$('<label>').text(Messages.settings_codeIndentation).appendTo($div);
var $inputBlock = $('<div>', {
'class': 'cp-sidebarlayout-input-block',
}).appendTo($div);
var $input = $('<input>', {
'min': 1,
'max': 8,
type: 'number',
}).on('change', function () {
var val = parseInt($input.val());
if (typeof(val) !== 'number') { return; }
common.setAttribute(['codemirror', 'indentUnit'], val);
}).appendTo($inputBlock);
common.getAttribute(['codemirror', 'indentUnit'], function (e, val) {
if (e) { return void console.error(e); }
if (typeof(val) !== 'number') {
$input.val(2);
} else {
$input.val(val);
}
});
return $div;
};
var createIndentTypeSelector = function () {
var key = 'indentWithTabs';
var $div = $('<div>', {
'class': 'cp-settings-indent-type cp-sidebarlayout-element'
});
$('<label>').text(Messages.settings_codeUseTabs).appendTo($div);
var $inputBlock = $('<div>', {
'class': 'cp-sidebarlayout-input-block',
}).css('flex-flow', 'column')
.appendTo($div);
var $input = $('<input>', {
type: 'checkbox',
}).on('change', function () {
var val = $input.is(':checked');
if (typeof(val) !== 'boolean') { return; }
common.setAttribute(['codemirror', key], val);
}).appendTo($inputBlock);
/*proxy.on('change', ['settings', 'codemirror', key], function (o, n) {
$input[0].checked = !!n;
});*/
common.getAttribute(['codemirror', key], function (e, val) {
if (e) { return void console.error(e); }
$input[0].checked = !!val;
});
create['language-selector'] = function () {
var $div = $('<div>', {'class': 'cp-settings-language-selector cp-sidebarlayout-element'});
$('<label>').text(Messages.language).appendTo($div);
var $b = common.createLanguageSelector($div);
$b.find('button').addClass('btn btn-secondary');
return $div;
};
var createPadWidthSelector = function () {
var $div = $('<div>', {
'class': 'cp-settings-pad-width cp-sidebarlayout-element'
});
$('<span>', {'class': 'label'}).text(Messages.settings_padWidth).appendTo($div);
create['logout-everywhere'] = function () {
if (!common.isLoggedIn()) { return; }
var $div = $('<div>', { 'class': 'cp-settings-logout-everywhere cp-sidebarlayout-element'});
$('<label>', { 'for': 'cp-settings-logout-everywhere'})
.text(Messages.settings_logoutEverywhereTitle).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.text(Messages.settings_padWidthHint).appendTo($div);
.text(Messages.settings_logoutEverywhere).appendTo($div);
var $button = $('<button>', {
id: 'cp-settings-logout-everywhere',
'class': 'btn btn-primary'
}).text(Messages.settings_logoutEverywhereButton)
.appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved}).hide().appendTo($div);
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'}).hide().appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
$button.click(function () {
var $label = $('<label>', { 'for': 'cp-settings-padwidth', 'class': 'noTitle' })
.text(Messages.settings_padWidthLabel);
var $input = $('<input>', {
type: 'checkbox',
id: 'cp-settings-padwidth'
}).on('change', function () {
UI.confirm(Messages.settings_logoutEverywhereConfirm, function (yes) {
if (!yes) { return; }
$spinner.show();
$ok.hide();
var val = $input.is(':checked');
common.setAttribute(['pad', 'width'], val, function () {
sframeChan.query('Q_SETTINGS_LOGOUT', null, function () {
$spinner.hide();
$ok.show();
window.setTimeout(function () {
$ok.fadeOut(1500);
}, 2500);
});
});
}).appendTo($div);
$label.appendTo($div);
$ok.hide().appendTo($div);
$spinner.hide().appendTo($div);
common.getAttribute(['pad', 'width'], function (e, val) {
if (e) { return void console.error(e); }
if (val) {
$input.attr('checked', 'checked');
}
});
return $div;
};
var createResetTips = function () {
create['resettips'] = function () {
var $div = $('<div>', {'class': 'cp-settings-resettips cp-sidebarlayout-element'});
$('<label>').text(Messages.settings_resetTips).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
@ -249,7 +201,7 @@ define([
return $div;
};
var createThumbnails = function () {
create['thumbnails'] = function () {
var $div = $('<div>', {'class': 'cp-settings-thumbnails cp-sidebarlayout-element'});
$('<label>').text(Messages.settings_thumbnails).appendTo($div);
@ -301,8 +253,286 @@ define([
return $div;
};
var createBackupDrive = function () {
var $div = $('<div>', {'class': 'cp-settings-backup-drive cp-sidebarlayout-element'});
create['userfeedback'] = function () {
var $div = $('<div>', { 'class': 'cp-settings-userfeedback cp-sidebarlayout-element'});
$('<span>', {'class': 'label'}).text(Messages.settings_userFeedbackTitle).appendTo($div);
var $label = $('<label>', { 'for': 'cp-settings-userfeedback', 'class': 'noTitle' })
.text(Messages.settings_userFeedback);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.append(Messages.settings_userFeedbackHint1)
.append(Messages.settings_userFeedbackHint2).appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
var $checkbox = $('<input>', {
'type': 'checkbox',
id: 'cp-settings-userfeedback'
}).on('change', function () {
$spinner.show();
$ok.hide();
var val = $checkbox.is(':checked') || false;
common.setAttribute(['general', 'allowUserFeedback'], val, function () {
$spinner.hide();
$ok.show();
});
});
$checkbox.appendTo($div);
$label.appendTo($div);
$ok.hide().appendTo($div);
$spinner.hide().appendTo($div);
if (privateData.feedbackAllowed) {
$checkbox[0].checked = true;
}
return $div;
};
// Pad Creation settings
var setHTML = function (e, html) {
e.innerHTML = html;
return e;
};
create['creation-owned'] = function () {
if (!common.isLoggedIn()) { return; }
var owned = h('div.cp-settings-creation-owned.cp-sidebarlayout-element', [
h('label', [
Messages.creation_ownedTitle
]),
setHTML(h('p.cp-sidebarlayout-description'),
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,
}),
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,
checked: 'checked'
}),
h('label', { 'for': 'cp-creation-owned-false' }, Messages.creation_ownedFalse),
h('span.fa.fa-check', {title: Messages.saved}),
h('span.fa.fa-spinner.fa-pulse'),
]);
var $owned = $(owned);
var $ok = $owned.find('.fa-check');
var $spinner = $owned.find('.fa-spinner');
$owned.find('input').change(function () {
$spinner.show();
$ok.hide();
var val = parseInt($owned.find('[name="cp-creation-owned"]:checked').val());
common.setAttribute(['general', 'creation', 'owned'], val, function (e) {
if (e) { return void console.error(e); }
$spinner.hide();
$ok.show();
});
});
common.getAttribute(['general', 'creation', 'owned'], function (e, val) {
if (val) {
$owned.find('#cp-creation-owned-true').attr('checked', true);
}
});
return $owned;
};
create['creation-expire'] = function () {
if (!common.isLoggedIn()) { return; }
var expire = h('div.cp-settings-creation-expire.cp-sidebarlayout-element', [
h('label', [
Messages.creation_expireTitle
]),
setHTML(h('p.cp-sidebarlayout-description'),
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)
])
])
]),
h('span.fa.fa-check', {title: Messages.saved}),
h('span.fa.fa-spinner.fa-pulse'),
]);
var $expire = $(expire);
var $ok = $expire.find('.fa-check');
var $spinner = $expire.find('.fa-spinner');
var getValue = function () {
if(!parseInt($expire.find('[name="cp-creation-expire"]:checked').val())) { return 0; }
var unit = 0;
switch ($expire.find('#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;
}
return ($expire.find('#cp-creation-expire-val').val() || 0) * unit;
};
$expire.find('input, select').change(function () {
$spinner.show();
$ok.hide();
common.setAttribute(['general', 'creation', 'expire'], getValue(), function (e) {
if (e) { return void console.error(e); }
$spinner.hide();
$ok.show();
});
});
common.getAttribute(['general', 'creation', 'expire'], function (e, val) {
UIElements.setExpirationValue(val, $expire);
});
return $expire;
};
create['creation-skip'] = function () {
if (!common.isLoggedIn()) { return; }
var skip = h('div.cp-settings-creation-skip.cp-sidebarlayout-element', [
h('label', [
Messages.settings_creationSkip
]),
setHTML(h('p.cp-sidebarlayout-description'), Messages.settings_creationSkipHint),
h('input#cp-creation-skip-true.cp-creation-skip-value', {
type: 'radio',
name: 'cp-creation-skip',
value: 1,
}),
h('label', { 'for': 'cp-creation-skip-true' }, Messages.settings_creationSkipTrue),
h('input#cp-creation-skip-false.cp-creation-skip-value', {
type: 'radio',
name: 'cp-creation-skip',
value: 0,
checked: 'checked'
}),
h('label', { 'for': 'cp-creation-skip-false' }, Messages.settings_creationSkipFalse),
h('span.fa.fa-check', {title: Messages.saved}),
h('span.fa.fa-spinner.fa-pulse'),
]);
var $div = $(skip);
var $ok = $div.find('.fa-check');
var $spinner = $div.find('.fa-spinner');
$div.find('input').change(function () {
$spinner.show();
$ok.hide();
var val = parseInt($div.find('[name="cp-creation-skip"]:checked').val());
// If we don't skip the pad creation screen, we dont' need settings to hide the templates
// modal
if (!val) {
$('.cp-settings-creation-template').addClass('cp-settings-creation-skipped');
} else {
$('.cp-settings-creation-template').removeClass('cp-settings-creation-skipped');
}
common.setAttribute(['general', 'creation', 'skip'], val, function (e) {
if (e) { return void console.error(e); }
$spinner.hide();
$ok.show();
});
});
common.getAttribute(['general', 'creation', 'skip'], function (e, val) {
if (val) {
$div.find('#cp-creation-skip-true').attr('checked', true);
return;
}
// If we don't skip the pad creation screen, we dont' need settings to hide the templates
// modal
$('.cp-settings-creation-template').addClass('cp-settings-creation-skipped');
});
return $div;
};
create['creation-template'] = function () {
var skip = h('div.cp-settings-creation-template.cp-sidebarlayout-element', [
h('label', [
Messages.settings_templateSkip
]),
setHTML(h('p.cp-sidebarlayout-description'), Messages.settings_templateSkipHint),
h('input#cp-creation-template-true.cp-creation-template-value', {
type: 'radio',
name: 'cp-creation-template',
value: 1,
}),
h('label', { 'for': 'cp-creation-template-true' }, Messages.settings_creationSkipTrue),
h('input#cp-creation-template-false.cp-creation-template-value', {
type: 'radio',
name: 'cp-creation-template',
value: 0,
checked: 'checked'
}),
h('label', { 'for': 'cp-creation-template-false' }, Messages.settings_creationSkipFalse),
h('span.fa.fa-check', {title: Messages.saved}),
h('span.fa.fa-spinner.fa-pulse'),
]);
var $div = $(skip);
var $ok = $div.find('.fa-check');
var $spinner = $div.find('.fa-spinner');
$div.find('input').change(function () {
$spinner.show();
$ok.hide();
var val = parseInt($div.find('[name="cp-creation-template"]:checked').val());
common.setAttribute(['general', 'creation', 'noTemplate'], val, function (e) {
if (e) { return void console.error(e); }
$spinner.hide();
$ok.show();
});
});
common.getAttribute(['general', 'creation', 'noTemplate'], function (e, val) {
if (val) {
$div.find('#cp-creation-template-true').attr('checked', true);
}
});
return $div;
};
// Drive settings
create['drive-backup'] = function () {
var $div = $('<div>', {'class': 'cp-settings-drive-backup cp-sidebarlayout-element'});
var accountName = privateData.accountName;
var displayName = metadataMgr.getUserData().name || '';
@ -350,8 +580,38 @@ define([
return $div;
};
var createResetDrive = function () {
var $div = $('<div>', {'class': 'cp-settings-reset-drive cp-sidebarlayout-element'});
create['drive-import-local'] = function () {
if (!common.isLoggedIn()) { return; }
var $div = $('<div>', {'class': 'cp-settings-drive-import-local cp-sidebarlayout-element'});
$('<label>', {'for' : 'cp-settings-import-local-pads'})
.text(Messages.settings_import).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.text(Messages.settings_importTitle).appendTo($div);
var $button = $('<button>', {
'id': 'cp-settings-import-local-pads',
'class': 'btn btn-primary'
}).text(Messages.settings_import).appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved}).hide().appendTo($div);
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'}).hide().appendTo($div);
$button.click(function () {
UI.confirm(Messages.settings_importConfirm, function (yes) {
if (!yes) { return; }
$spinner.show();
$ok.hide();
sframeChan.query('Q_SETTINGS_IMPORT_LOCAL', null, function () {
$spinner.hide();
$ok.show();
UI.alert(Messages.settings_importDone);
});
}, undefined, true);
});
return $div;
};
create['drive-reset'] = function () {
var $div = $('<div>', {'class': 'cp-settings-drive-reset cp-sidebarlayout-element'});
$('<label>').text(Messages.settings_resetNewTitle).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.text(Messages.settings_reset).appendTo($div);
@ -374,124 +634,122 @@ define([
return $div;
};
var createUserFeedbackToggle = function () {
var $div = $('<div>', { 'class': 'cp-settings-userfeedback cp-sidebarlayout-element'});
// Rich text pads settings
$('<span>', {'class': 'label'}).text(Messages.settings_userFeedbackTitle).appendTo($div);
var $label = $('<label>', { 'for': 'cp-settings-userfeedback', 'class': 'noTitle' })
.text(Messages.settings_userFeedback);
create['pad-width'] = function () {
var $div = $('<div>', {
'class': 'cp-settings-pad-width cp-sidebarlayout-element'
});
$('<span>', {'class': 'label'}).text(Messages.settings_padWidth).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.append(Messages.settings_userFeedbackHint1)
.append(Messages.settings_userFeedbackHint2).appendTo($div);
.text(Messages.settings_padWidthHint).appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
var $checkbox = $('<input>', {
'type': 'checkbox',
id: 'cp-settings-userfeedback'
var $label = $('<label>', { 'for': 'cp-settings-padwidth', 'class': 'noTitle' })
.text(Messages.settings_padWidthLabel);
var $input = $('<input>', {
type: 'checkbox',
id: 'cp-settings-padwidth'
}).on('change', function () {
$spinner.show();
$ok.hide();
var val = $checkbox.is(':checked') || false;
common.setAttribute(['general', 'allowUserFeedback'], val, function () {
var val = $input.is(':checked');
common.setAttribute(['pad', 'width'], val, function () {
$spinner.hide();
$ok.show();
});
});
$checkbox.appendTo($div);
}).appendTo($div);
$label.appendTo($div);
$ok.hide().appendTo($div);
$spinner.hide().appendTo($div);
if (privateData.feedbackAllowed) {
$checkbox[0].checked = true;
common.getAttribute(['pad', 'width'], function (e, val) {
if (e) { return void console.error(e); }
if (val) {
$input.attr('checked', 'checked');
}
});
return $div;
};
var createUsageButton = function () {
common.createUsageBar(function (err, $bar) {
if (err) { return void console.error(err); }
APP.$usage.html('').append($bar);
}, true);
};
// Code settings
var createLogoutEverywhere = function () {
var $div = $('<div>', { 'class': 'cp-settings-logout-everywhere cp-sidebarlayout-element'});
$('<label>', { 'for': 'cp-settings-logout-everywhere'})
.text(Messages.settings_logoutEverywhereTitle).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.text(Messages.settings_logoutEverywhere).appendTo($div);
var $button = $('<button>', {
id: 'cp-settings-logout-everywhere',
'class': 'btn btn-primary'
}).text(Messages.settings_logoutEverywhereButton)
.appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved}).hide().appendTo($div);
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'}).hide().appendTo($div);
create['code-indent-unit'] = function () {
var $div = $('<div>', {
'class': 'cp-settings-code-indent-unit cp-sidebarlayout-element'
});
$('<label>').text(Messages.settings_codeIndentation).appendTo($div);
$button.click(function () {
var $inputBlock = $('<div>', {
'class': 'cp-sidebarlayout-input-block',
}).appendTo($div);
UI.confirm(Messages.settings_logoutEverywhereConfirm, function (yes) {
if (!yes) { return; }
$spinner.show();
$ok.hide();
var $input = $('<input>', {
'min': 1,
'max': 8,
type: 'number',
}).on('change', function () {
var val = parseInt($input.val());
if (typeof(val) !== 'number') { return; }
common.setAttribute(['codemirror', 'indentUnit'], val);
}).appendTo($inputBlock);
sframeChan.query('Q_SETTINGS_LOGOUT', null, function () {
$spinner.hide();
$ok.show();
window.setTimeout(function () {
$ok.fadeOut(1500);
}, 2500);
});
});
common.getAttribute(['codemirror', 'indentUnit'], function (e, val) {
if (e) { return void console.error(e); }
if (typeof(val) !== 'number') {
$input.val(2);
} else {
$input.val(val);
}
});
return $div;
};
var createImportLocalPads = function () {
if (!common.isLoggedIn()) { return; }
var $div = $('<div>', {'class': 'cp-settings-import-local-pads cp-sidebarlayout-element'});
$('<label>', {'for' : 'cp-settings-import-local-pads'})
.text(Messages.settings_import).appendTo($div);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.text(Messages.settings_importTitle).appendTo($div);
var $button = $('<button>', {
'id': 'cp-settings-import-local-pads',
'class': 'btn btn-primary'
}).text(Messages.settings_import).appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved}).hide().appendTo($div);
var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'}).hide().appendTo($div);
create['code-indent-type'] = function () {
var key = 'indentWithTabs';
$button.click(function () {
UI.confirm(Messages.settings_importConfirm, function (yes) {
if (!yes) { return; }
$spinner.show();
$ok.hide();
sframeChan.query('Q_SETTINGS_IMPORT_LOCAL', null, function () {
$spinner.hide();
$ok.show();
UI.alert(Messages.settings_importDone);
});
}, undefined, true);
var $div = $('<div>', {
'class': 'cp-settings-code-indent-type cp-sidebarlayout-element'
});
$('<label>').text(Messages.settings_codeUseTabs).appendTo($div);
return $div;
};
var $inputBlock = $('<div>', {
'class': 'cp-sidebarlayout-input-block',
}).css('flex-flow', 'column')
.appendTo($div);
var createLanguageSelector = function () {
var $div = $('<div>', {'class': 'cp-settings-language-selector cp-sidebarlayout-element'});
$('<label>').text(Messages.language).appendTo($div);
var $b = common.createLanguageSelector($div);
$b.find('button').addClass('btn btn-secondary');
var $input = $('<input>', {
type: 'checkbox',
}).on('change', function () {
var val = $input.is(':checked');
if (typeof(val) !== 'boolean') { return; }
common.setAttribute(['codemirror', key], val);
}).appendTo($inputBlock);
/*proxy.on('change', ['settings', 'codemirror', key], function (o, n) {
$input[0].checked = !!n;
});*/
common.getAttribute(['codemirror', key], function (e, val) {
if (e) { return void console.error(e); }
$input[0].checked = !!val;
});
return $div;
};
// Settings app
var createUsageButton = function () {
common.createUsageBar(function (err, $bar) {
if (err) { return void console.error(err); }
APP.$usage.html('').append($bar);
}, true);
};
var hideCategories = function () {
APP.$rightside.find('> div').hide();
@ -514,6 +772,7 @@ define([
if (key === 'drive') { $category.append($('<span>', {'class': 'fa fa-hdd-o'})); }
if (key === 'code') { $category.append($('<span>', {'class': 'fa fa-file-code-o' })); }
if (key === 'pad') { $category.append($('<span>', {'class': 'fa fa-file-word-o' })); }
if (key === 'creation') { $category.append($('<span>', {'class': 'fa fa-plus-circle' })); }
if (key === active) {
$category.addClass('cp-leftside-active');
@ -561,22 +820,10 @@ define([
// Content
var $rightside = APP.$rightside;
$rightside.append(createInfoBlock());
$rightside.append(createDisplayNameInput());
$rightside.append(createLanguageSelector());
$rightside.append(createIndentUnitSelector());
$rightside.append(createIndentTypeSelector());
if (common.isLoggedIn()) {
$rightside.append(createLogoutEverywhere());
for (var f in create) {
if (typeof create[f] !== "function") { continue; }
$rightside.append(create[f]());
}
$rightside.append(createResetTips());
$rightside.append(createThumbnails());
$rightside.append(createBackupDrive());
$rightside.append(createImportLocalPads());
$rightside.append(createResetDrive());
$rightside.append(createUserFeedbackToggle());
$rightside.append(createPadWidthSelector());
// TODO RPC
//obj.proxy.on('change', [], refresh);

Loading…
Cancel
Save