Ability to reduce the width of ckeditor

pull/1/head
yflory 7 years ago
parent 10aaa06781
commit f329d65bc8

@ -472,6 +472,7 @@ define(function () {
out.settings_cat_account = "Compte";
out.settings_cat_drive = "CryptDrive";
out.settings_cat_code = "Code";
out.settings_cat_pad = "Documents texte";
out.settings_title = "Préférences";
out.settings_save = "Sauver";
@ -528,6 +529,10 @@ define(function () {
out.settings_codeIndentation = "Indentation dans l'éditeur de code (nombre d'espaces)";
out.settings_codeUseTabs = "Utiliser des tabulations au lieu d'espaces";
out.settings_padWidth = "Largeur de l'éditeur de texte";
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.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. "+

@ -478,6 +478,7 @@ define(function () {
out.settings_cat_account = "Account";
out.settings_cat_drive = "CryptDrive";
out.settings_cat_code = "Code";
out.settings_cat_pad = "Rich text";
out.settings_title = "Settings";
out.settings_save = "Save";
@ -534,6 +535,10 @@ define(function () {
out.settings_codeIndentation = 'Code editor indentation (spaces)';
out.settings_codeUseTabs = "Indent using tabs (instead of spaces)";
out.settings_padWidth = "Editor's maximum width";
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.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. "+

@ -444,6 +444,13 @@ define([
}
};
window.APP.FM = framework._.sfCommon.createFileManager(fmConfig);
framework._.sfCommon.getAttribute(['pad', 'width'], function (err, data) {
if (data) {
var $iframe = $('html').find('iframe').contents();
$iframe.find('html').addClass('cke_body_width');
}
});
});
framework.onDefaultContentNeeded(function () {
@ -585,6 +592,12 @@ define([
}
// Used in ckeditor-config.js
Ckeditor.CRYPTPAD_URLARGS = ApiConfig.requireConf.urlArgs;
var newCss = '.cke_body_width { background: #666; height: 100%; }' +
'.cke_body_width body {' +
'max-width: 50em; padding: 10px 30px; margin: 0 auto; min-height: 100%;'+
'box-sizing: border-box;'+
'}';
Ckeditor.addCss(newCss);
Ckeditor.plugins.addExternal('mediatag','/pad/', 'mediatag-plugin.js');
module.ckeditor = editor = Ckeditor.replace('editor1', {
customConfig: '/customize/ckeditor-config.js',

@ -21,11 +21,9 @@
flex-flow: column;
#cp-sidebarlayout-container {
#cp-sidebarlayout-rightside {
.cp-settings-userfeedback, .cp-settings-thumbnails {
input[type="checkbox"] {
vertical-align: middle;
margin-right: 5px;
}
input[type="checkbox"] {
vertical-align: middle;
margin-right: 5px;
}
.cp-settings-language-selector {
button.btn {

@ -46,6 +46,9 @@ define([
'cp-settings-import-local-pads',
'cp-settings-reset-drive'
],
'pad': [
'cp-settings-pad-width',
],
'code': [
'cp-settings-indent-unit',
'cp-settings-indent-type'
@ -120,6 +123,7 @@ define([
return $div;
};
var createIndentUnitSelector = function () {
var $div = $('<div>', {
'class': 'cp-settings-indent-unit cp-sidebarlayout-element'
@ -183,6 +187,47 @@ define([
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);
$('<span>', {'class': 'cp-sidebarlayout-description'})
.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 $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 = $input.is(':checked');
common.setAttribute(['pad', 'width'], val, function () {
$spinner.hide();
$ok.show();
});
}).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 () {
var $div = $('<div>', {'class': 'cp-settings-resettips cp-sidebarlayout-element'});
$('<label>').text(Messages.settings_resetTips).appendTo($div);
@ -468,6 +513,7 @@ define([
if (key === 'account') { $category.append($('<span>', {'class': 'fa fa-user-o'})); }
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 === active) {
$category.addClass('cp-leftside-active');
@ -530,6 +576,7 @@ define([
$rightside.append(createImportLocalPads());
$rightside.append(createResetDrive());
$rightside.append(createUserFeedbackToggle());
$rightside.append(createPadWidthSelector());
// TODO RPC
//obj.proxy.on('change', [], refresh);

Loading…
Cancel
Save