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

Merge branch 'staging' of github.com:xwiki-labs/cryptpad into staging

Browse Source
This commit is contained in:
ansuz
2017-07-12 10:46:15 +02:00
parent f4bca0f9c0 7f5c301734
commit c0cb5c4263
22 changed files with 545 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
www/code/inner.js
View File

@@ -6,6 +6,7 @@ define([
'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
'less!/code/code.less',
'less!/customize/src/less/toolbar.less',
'less!/customize/src/less/cryptpad.less',
'css!cm/lib/codemirror.css',
'css!cm/addon/dialog/dialog.css',
'css!cm/addon/fold/foldgutter.css',

15
www/code/main.js
View File

@@ -364,6 +364,21 @@ define([
return;
}
UserList.getLastName(toolbar.$userNameButton, isNew);
var fmConfig = {
dropArea: $iframe.find('.CodeMirror'),
body: $iframe.find('body'),
onUploaded: function (ev, data) {
//var cursor = editor.getCursor();
//var cleanName = data.name.replace(/[\[\]]/g, '');
//var text = '!['+cleanName+']('+data.url+')';
var parsed = Cryptpad.parsePadUrl(data.url);
var hexFileName = Cryptpad.base64ToHex(parsed.hashData.channel);
var src = '/blob/' + hexFileName.slice(0,2) + '/' + hexFileName;
var mt = '<media-tag src="' + src + '" data-crypto-key="cryptpad:' + parsed.hashData.key + '"></media-tag>';
editor.replaceSelection(mt);
}
};
APP.FM = Cryptpad.createFileManager(fmConfig);
};
config.onRemote = function () {

2
www/common/cryptpad-common.js
View File

@@ -1657,7 +1657,7 @@ define([
content: Messages.user_rename
});
}
if (account) {
if (account && parsed && (!parsed.type || parsed.type !== 'profile')) {
options.push({
tag: 'a',
attributes: {'class': 'profile'},

14
www/common/diffMarked.js
View File

@@ -143,7 +143,17 @@ define([
DiffMd.apply = function (newHtml, $content) {
var id = $content.attr('id');
if (!id) { throw new Error("The element must have a valid id"); }
var $div = $('<div>', {id: id}).append(newHtml);
var pattern = /(<media-tag src="([^"]*)" data-crypto-key="([^"]*)">)<\/media-tag>/g;
var newHtmlFixed = newHtml.replace(pattern, function (all, tag, src) {
var mt = tag;
if (mediaMap[src]) {
mediaMap[src].forEach(function (n) {
mt += n.outerHTML;
});
}
return mt + '</media-tag>';
});
var $div = $('<div>', {id: id}).append(newHtmlFixed);
var Dom = domFromHTML($('<div>').append($div).html());
var oldDom = domFromHTML($content[0].outerHTML);
var patch = makeDiff(oldDom, Dom, id);
@@ -154,9 +164,11 @@ define([
var $mts = $content.find('media-tag:not(:has(*))');
$mts.each(function (i, el) {
MediaTag(el);
console.log(el.outerHTML);
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
console.log(el.outerHTML);
var list_values = [].slice.call(el.children);
mediaMap[el.getAttribute('src')] = list_values;
}

18
www/common/toolbar2.js
View File

@@ -600,6 +600,21 @@ define([
return $titleContainer;
};
var createPageTitle = function (toolbar, config) {
if (config.title || !config.pageTitle) { return; }
var $titleContainer = $('<span>', {
id: 'toolbarTitle',
'class': TITLE_CLS
}).appendTo(toolbar.$top);
var $hoverable = $('<span>', {'class': 'hoverable'}).appendTo($titleContainer);
// Buttons
$('<span>', {
'class': 'title pageTitle'
}).appendTo($hoverable).text(config.pageTitle);
};
var createLinkToMain = function (toolbar) {
var $linkContainer = $('<span>', {
'class': "cryptpad-link"
@@ -823,7 +838,6 @@ define([
console.error(err);
return;
}
updateDisplayName(toolbar, config);
Cryptpad.changeDisplayName(newName, true);
});
});
@@ -831,6 +845,7 @@ define([
});
Cryptpad.onDisplayNameChanged(function () {
Cryptpad.findCancelButton().click();
updateDisplayName(toolbar, config);
});
updateDisplayName(toolbar, config);
@@ -1020,6 +1035,7 @@ define([
tb['share'] = createShare;
tb['fileshare'] = createFileShare;
tb['title'] = createTitle;
tb['pageTitle'] = createPageTitle;
tb['lag'] = createLag;
tb['spinner'] = createSpinner;
tb['state'] = createState;

151
www/drive/file.less
View File

@@ -37,7 +37,7 @@ html, body {
padding: 0;
margin: 0;
position: relative;
font-size: 16px;
font-size: @main-font-size;
overflow: auto;
}
@@ -72,7 +72,7 @@ img.icon {
width: 100%;
max-width: unset;
border-bottom: 1px solid @toolbar-border-col;
.category2 {
.category {
margin-top: 0.5em;
}
}
@@ -93,8 +93,6 @@ div:focus {
}
.fa {
/*min-width: 17px;*/
margin-right: 3px;
font-family: FontAwesome;
}
@@ -111,17 +109,13 @@ li {
user-select: none;
}
.folder, .file {
margin-right: 5px;
}
.contextMenu {
display: none;
position: absolute;
z-index: 500;
li {
padding: 0;
font-size: 16px;
font-size: @main-font-size;
a {
cursor: pointer;
}
@@ -164,6 +158,7 @@ span {
#tree {
font-size: @main-font-size;
//border-right: 1px solid #ccc;
box-sizing: border-box;
background: @tree-bg;
@@ -187,48 +182,76 @@ span {
margin-bottom: 3px;
margin-left: -2px;
}
li {
padding: 0 0 0 5px;
.docTree {
margin-top: 20px;
padding: 0 0 0 20px;
cursor: auto;
&.collapsed ul {
display: none;
}
input {
width: ~"calc(100% - 30px)";
}
& > span.element-row {
min-width: ~"calc(100% + 5px)";
display: inline-block;
cursor: pointer;
margin-left: -5px;
padding-left: 5px;
}
& > span.element-row:not(.selected):not(.active):hover {
background-color: @drive-hover;
&li, li {
padding: 0;
&.collapsed ul {
display: none;
}
input {
width: ~"calc(100% - 30px)";
}
& > span.element-row {
overflow: hidden;
text-overflow: ellipsis;
//min-width: ~"calc(100% + 5px)";
.leftsideCategory();
width: ~"calc(100% + 5px)";
margin: 0;
margin-bottom: -6px;
display: inline-block;
cursor: pointer;
margin-left: -5px;
padding-left: 5px;
}
& > span.element-row:not(.selected):not(.active):hover {
//background-color: @drive-hover;
}
}
}
span.element {
cursor: pointer;
}
.active {
/*.active {
&:not(.selected):not(.droppable) {
background-color: darken(@drive-hover, 15%);
}
}
.category2 {
margin-top: 2em;
}*/
.category {
margin: 0;
margin-top: 15px;
.root {
&> .fa {
min-width: 30px;
cursor: pointer;
}
}
li {
padding: 0;
.element-row {
display: block;
padding-left: 20px;
.leftsideCategory();
margin: 0;
.fa {
width: 25px;
}
}
}
}
.category:last-child {
margin-bottom: 20px;
}
#allfilesTree {
margin-top: 0;
}
.limit-container {
margin-top: 0;
}
#searchContainer {
margin-bottom: 20px;
text-align: center;
padding: 0;
position: relative;
@@ -243,7 +266,7 @@ span {
border: 0;
border-right: 1px solid lighten(@toolbar-drive-bg, 16%);
//border-right: 0;
height: 32px;
height: @toolbar-line-height;
padding: 0 5px;
padding-left: 45px;
&:focus {
@@ -262,9 +285,9 @@ span {
font-size: 14px;
position: absolute;
left: -20px;
top: 9px;
width: auto;
height: 11px;
top: 10px;
width: 11px !important;
height: 11px !important;
padding: 0;
margin: 0;
background: white;
@@ -277,7 +300,7 @@ span {
}
// Expand/collapse lines
ul {
.docTree ul {
margin: 0px 0px 0px 10px;
list-style: none;
padding-left: 10px;
@@ -286,13 +309,13 @@ span {
&:before {
position: absolute;
left: -15px;
top: -0.25em;
top: -11px;
content: '';
display: block;
border-left: 1px solid @tree-lines-col;
height: 1em;
height: ~"calc(1em + 11px)";
border-bottom: 1px solid @tree-lines-col;
width: 17.5px;
width: 15px;
}
&:after {
position: absolute;
@@ -317,27 +340,6 @@ span {
}
}
}
.limit-container {
display: inline-flex;
flex-flow: column-reverse;
width: 100%;
margin-top: 20px;
.upgrade {
padding: 0;
line-height: 25px;
height: 25px;
margin: 0 3px;
border-radius: 0;
}
.cryptpad-limit-bar {
width: ~"calc(100% - 6px)";
height: 25px;
line-height: 25px;
.usage {
height: 100%;
}
}
}
}
/* CONTENT */
@@ -347,7 +349,8 @@ span {
flex: 1;
// Needed to avoid the folder's path to overflows
// https://stackoverflow.com/questions/38223879/white-space-nowrap-breaks-flexbox-layout
min-width: 0;}
min-width: 0;
}
#content {
box-sizing: border-box;
background: @content-bg;
@@ -535,8 +538,10 @@ span {
padding: 0 5px;
display: table-cell;
}
}
li {
&:not(.header) {
height: @toolbar-line-height;
line-height: @toolbar-line-height;
}
&.header {
cursor: default;
color: @table-header-fg;
@@ -611,7 +616,7 @@ span {
//flex-flow: row;
z-index: 100;
box-sizing: border-box;
height: 32px;
height: @toolbar-line-height;
padding: 0;
display: flex;
flex-flow: row;
@@ -640,20 +645,20 @@ span {
margin: 0;
}
button {
height: 32px;
height: @toolbar-line-height;
padding: 0 10px;
border: none;
border-radius: 0;
box-sizing: border-box;
background: transparent;
font-size: 17px;
font-size: @main-font-size;
color: @toolbar-drive-color;
transition: all 0.15s;
.drawer {
display: none;
}
.fa, span {
font-size: 17px;
font-size: @main-font-size;
}
&:hover {
background: @toolbar-drive-bg;
@@ -686,7 +691,7 @@ span {
}
.buttonTitle {
display: inline-flex;
height: 32px;
height: @toolbar-line-height;
align-items: center;
span:not(.fa) {
line-height: 23px;
@@ -718,8 +723,8 @@ span {
.path {
flex: 1;
width: 100%;
height: 32px;
line-height: 32px;
height: @toolbar-line-height;
line-height: @toolbar-line-height;
cursor: default;
width: auto;
overflow: hidden;
@@ -729,9 +734,9 @@ span {
text-align: left;
.element {
display: inline-block;
height: 32px;
line-height: 32px;
font-size: 17px;
height: @toolbar-line-height;
line-height: @toolbar-line-height;
font-size: @main-font-size;
padding: 0 5px;
border: 0;
background: darken(@toolbar-drive-bg, 10%);

25
www/drive/main.js
View File

@@ -161,7 +161,7 @@ define([
//var $upIcon = $('<span>', {"class": "fa fa-arrow-circle-up"});
var $unsortedIcon = $('<span>', {"class": "fa fa-files-o"});
var $templateIcon = $('<span>', {"class": "fa fa-cubes"});
var $trashIcon = $('<span>', {"class": "fa fa-trash"});
var $trashIcon = $('<span>', {"class": "fa fa-trash-o"});
var $trashEmptyIcon = $('<span>', {"class": "fa fa-trash-o"});
//var $collapseIcon = $('<span>', {"class": "fa fa-minus-square-o expcol"});
var $expandIcon = $('<span>', {"class": "fa fa-plus-square-o expcol"});
@@ -1650,8 +1650,10 @@ define([
// and they don't hav a hierarchical structure (folder/subfolders)
var displayHrefArray = function ($container, rootName, draggable) {
var unsorted = files[rootName];
var $fileHeader = getFileListHeader(false);
$container.append($fileHeader);
if (unsorted.length) {
var $fileHeader = getFileListHeader(false);
$container.append($fileHeader);
}
var keys = unsorted;
var sortBy = Cryptpad.getLSAttribute(SORT_FILE_BY);
sortBy = sortBy === "" ? sortBy = 'name' : sortBy;
@@ -2011,7 +2013,9 @@ define([
}
$elementRow.data('path', path);
addDragAndDropHandlers($elementRow, path, true, droppable);
if (active) { $elementRow.addClass('active'); }
if (active) {
$elementRow.addClass('active');
}
return $element;
};
@@ -2031,7 +2035,7 @@ define([
var $rootElement = createTreeElement(ROOT_NAME, $rootIcon.clone(), [ROOT], false, true, false, isRootOpened);
$rootElement.addClass('root');
$rootElement.find('>.element-row').contextmenu(openDirectoryContextMenu);
$('<ul>').append($rootElement).appendTo($container);
$('<ul>', {'class': 'docTree'}).append($rootElement).appendTo($container);
$container = $rootElement;
} else if (filesOp.isFolderEmpty(root)) { return; }
@@ -2061,7 +2065,7 @@ define([
var isOpened = filesOp.comparePath(path, currentPath);
var $element = createTreeElement(TEMPLATE_NAME, $icon, [TEMPLATE], false, true, false, isOpened);
$element.addClass('root');
var $list = $('<ul>', { id: 'templateTree', 'class': 'category2' }).append($element);
var $list = $('<ul>', { id: 'templateTree', 'class': 'category' }).append($element);
$container.append($list);
};
@@ -2070,7 +2074,7 @@ define([
var isOpened = filesOp.comparePath(path, currentPath);
var $allfilesElement = createTreeElement(FILES_DATA_NAME, $icon, [FILES_DATA], false, false, false, isOpened);
$allfilesElement.addClass('root');
var $allfilesList = $('<ul>', { id: 'allfilesTree', 'class': 'category2' }).append($allfilesElement);
var $allfilesList = $('<ul>', { id: 'allfilesTree', 'class': 'category' }).append($allfilesElement);
$container.append($allfilesList);
};
@@ -2080,7 +2084,7 @@ define([
var $trashElement = createTreeElement(TRASH_NAME, $icon, [TRASH], false, true, false, isOpened);
$trashElement.addClass('root');
$trashElement.find('>.element-row').contextmenu(openTrashTreeContextMenu);
var $trashList = $('<ul>', { id: 'trashTree', 'class': 'category2' }).append($trashElement);
var $trashList = $('<ul>', { id: 'trashTree', 'class': 'category' }).append($trashElement);
$container.append($trashList);
};
@@ -2719,7 +2723,7 @@ define([
var userList = APP.userList = info.userList;
var config = {
displayed: ['useradmin', 'spinner', 'lag', 'state', 'limit', 'newpad'],
displayed: ['useradmin', 'spinner', 'lag', 'state', 'limit', 'newpad', 'pageTitle'],
userList: {
list: userList,
userNetfluxId: info.myID
@@ -2729,7 +2733,8 @@ define([
ifrw: window,
realtime: info.realtime,
network: info.network,
$container: APP.$bar
$container: APP.$bar,
pageTitle: Messages.type.drive
};
var toolbar = APP.toolbar = Toolbar.create(config);

11
www/file/main.js
View File

@@ -67,9 +67,15 @@ define([
displayed: displayed,
ifrw: ifrw,
common: Cryptpad,
hideDisplayName: true,
$container: $bar
//hideDisplayName: true,
$container: $bar,
};
if (uploadMode) {
displayed.push('pageTitle');
configTb.pageTitle = Messages.upload_title;
}
var toolbar = APP.toolbar = Toolbar.create(configTb);
toolbar.$rightside.html(''); // Remove the drawer if we don't use it to hide the toolbar
@@ -83,6 +89,7 @@ define([
if (e) { return void console.error(e); }
var title = document.title = metadata.name;
Title.updateTitle(title || Title.defaultTitle);
toolbar.addElement(['pageTitle'], {pageTitle: title});
var displayFile = function (ev, sizeMb) {
var $mt = $dlview.find('media-tag');

2
www/friends/main.less
View File

@@ -67,7 +67,7 @@ body {
}
#friendList .friend, #messaging .header {
.avatar(50px);
.avatar(30px);
&.avatar {
display: flex;
}

2
www/profile/main.less
View File

@@ -30,7 +30,7 @@
height: 300px;
width: 300px;
border: 1px solid black;
border-radius: 10px;
border-radius: 150px;
overflow: hidden;
position: relative;
.delete {

195
www/settings/main.js
View File

@@ -3,14 +3,15 @@ define([
'/common/cryptpad-common.js',
'/common/cryptget.js',
'/common/mergeDrive.js',
'/common/toolbar2.js',
'/bower_components/file-saver/FileSaver.min.js',
'/customize/header.js',
'less!/customize/src/less/cryptpad.less',
'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
'less!/customize/src/less/toolbar.less',
'less!/settings/main.less',
], function ($, Cryptpad, Crypt, Merge) {
], function ($, Cryptpad, Crypt, Merge, Toolbar) {
var saveAs = window.saveAs;
var USERNAME_KEY = 'cryptpad.username';
@@ -34,36 +35,45 @@ define([
});
};
// Title block
var createTitle = function () {
return $('<h1>').text(Messages.settings_title);
var categories = {
'account': [
'infoBlock',
'displayName',
'languageSelector',
'logoutEverywhere',
'resetTips',
'userFeedback'
],
'drive': [
'backupDrive',
'importLocalPads',
'resetDrive'
]
};
var createInfoBlock = function (store) {
var obj = store.proxy;
var $div = $('<div>', {'class': 'infoBlock'});
var $account = $('<div>', {'class': 'element'}).appendTo($div);
var accountName = obj.login_name || localStorage[Cryptpad.userNameKey];
var $label = $('<span>', {'class': 'label'}).text(Messages.user_accountName + ':');
var $label = $('<span>', {'class': 'label'}).text(Messages.user_accountName);
var $name = $('<span>').text(accountName || '');
if (!accountName) {
$label.text('');
$name.text(Messages.settings_anonymous);
}
$div.append($label).append($name);
$account.append($label).append($name);
var publicKey = obj.edPublic;
if (publicKey) {
var $key = $('<div>', {'class': 'element'}).appendTo($div);
var userHref = Cryptpad.getUserHrefFromKeys(accountName, publicKey);
var $pubLabel = $('<span>', {'class': 'label'})
.text(Messages.settings_publicSigningKey + ':');
.text(Messages.settings_publicSigningKey);
var $pubKey = $('<input>', {type: 'text', readonly: true})
.css({
width: '28em'
})
.val(userHref);
$div.append('<br>').append($pubLabel).append($pubKey);
$key.append($pubLabel).append($pubKey);
}
return $div;
@@ -72,14 +82,14 @@ define([
// Create the block containing the display name field
var createDisplayNameInput = function (store) {
var obj = store.proxy;
var $div = $('<div>', {'class': 'displayName'});
var $div = $('<div>', {'class': 'displayName element'});
$('<label>', {'for' : 'displayName'}).text(Messages.user_displayName).appendTo($div);
$('<br>').appendTo($div);
var $inputBlock = $('<div>', {'class': 'inputBlock'}).appendTo($div);
var $input = $('<input>', {
'type': 'text',
'id': 'displayName',
'placeholder': Messages.anonymous}).appendTo($div);
var $save = $('<button>', {'class': 'btn btn-primary'}).text(Messages.settings_save).appendTo($div);
'placeholder': Messages.anonymous}).appendTo($inputBlock);
var $save = $('<button>', {'class': 'btn btn-primary'}).text(Messages.settings_save).appendTo($inputBlock);
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);
@@ -91,6 +101,7 @@ define([
displayName = $input.val();
if (displayName === obj[USERNAME_KEY]) { return; }
obj[USERNAME_KEY] = displayName;
Cryptpad.changeDisplayName(displayName);
$spinner.show();
Cryptpad.whenRealtimeSyncs(store.info.realtime, function () {
$spinner.hide();
@@ -115,11 +126,12 @@ define([
return $div;
};
var createResetTips = function () {
var $div = $('<div>', {'class': 'resetTips'});
var $div = $('<div>', {'class': 'resetTips element'});
$('<label>', {'for' : 'resetTips'}).text(Messages.settings_resetTips).appendTo($div);
$('<br>').appendTo($div);
var $button = $('<button>', {'id': 'resetTips', 'class': 'btn btn-primary'})
$('<span>', {'class': 'description'})
.text(Messages.settings_resetTipsButton).appendTo($div);
var $button = $('<button>', {'id': 'resetTips', 'class': 'btn btn-primary'})
.text(Messages.settings_resetTipsAction).appendTo($div);
$button.click(function () {
Object.keys(localStorage).forEach(function (k) {
@@ -134,7 +146,7 @@ define([
};
var createBackupDrive = function (store) {
var obj = store.proxy;
var $div = $('<div>', {'class': 'backupDrive'});
var $div = $('<div>', {'class': 'backupDrive element'});
var exportFile = function () {
var sjson = JSON.stringify(obj);
@@ -155,27 +167,29 @@ define([
});
};
$('<label>', {'for' : 'exportDrive'}).text(Messages.settings_backupTitle).appendTo($div);
$('<br>').appendTo($div);
$('<label>', {'for' : 'exportDrive'}).text(Messages.settings_backupCategory).appendTo($div);
$('<span>', {'class': 'description'})
.text(Messages.settings_backupTitle).appendTo($div);
/* add an export button */
var $export = Cryptpad.createButton('export', true, {}, exportFile);
$export.addClass('btn').addClass('btn-success').append(Messages.settings_backup);
$export.attr('class', 'btn btn-success').text(Messages.settings_backup);
$div.append($export);
/* add an import button */
var $import = Cryptpad.createButton('import', true, {}, importFile);
$import.addClass('btn').addClass('btn-warning').append(Messages.settings_restore);
$import.attr('class', 'btn btn-success').text(Messages.settings_restore);
$div.append($import);
return $div;
};
var createResetDrive = function (obj) {
var $div = $('<div>', {'class': 'resetDrive'});
$('<label>', {'for' : 'resetDrive'}).text(Messages.settings_resetTitle).appendTo($div);
$('<br>').appendTo($div);
var $button = $('<button>', {'id': 'resetDrive', 'class': 'btn btn-danger'})
var $div = $('<div>', {'class': 'resetDrive element'});
$('<label>', {'for' : 'resetDrive'}).text(Messages.settings_resetNewTitle).appendTo($div);
$('<span>', {'class': 'description'})
.text(Messages.settings_reset).appendTo($div);
var $button = $('<button>', {'id': 'resetDrive', 'class': 'btn btn-danger'})
.text(Messages.settings_resetButton).appendTo($div);
$button.click(function () {
Cryptpad.prompt(Messages.settings_resetPrompt, "", function (val) {
@@ -192,14 +206,16 @@ define([
};
var createUserFeedbackToggle = function (obj) {
var $div = $('<div>', { 'class': 'userFeedback', });
var $label = $('<label>', { 'for': 'userFeedback'})
var $div = $('<div>', { 'class': 'userFeedback element'});
$('<span>', {'class': 'label'}).text(Messages.settings_userFeedbackTitle).appendTo($div);
var $label = $('<label>', { 'for': 'userFeedback', 'class': 'noTitle' })
.text(Messages.settings_userFeedback);
$div.html('<hr />' + Messages.settings_userFeedbackHint1 + '<br />' +
Messages.settings_userFeedbackHint2).appendTo($div);
$('<br>').appendTo($div);
$('<span>', {'class': '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'});
@@ -229,25 +245,21 @@ define([
};
var createUsageButton = function () {
var $div = $('<div>', { 'class': 'pinned-usage' })
.text(Messages.settings_usageTitle)
.append('<br>');
Cryptpad.createUsageBar(function (err, $bar) {
$div.find('.limit-container').remove();
$div.append($bar);
if (err) { return void console.error(err); }
APP.$usage.html('').append($bar);
}, true);
return $div;
};
var createLogoutEverywhere = function (obj) {
var proxy = obj.proxy;
var $div = $('<div>', { 'class': 'logoutEverywhere', });
var $div = $('<div>', { 'class': 'logoutEverywhere element'});
$('<label>', { 'for': 'logoutEverywhere'})
.text(Messages.settings_logoutEverywhereTitle).appendTo($div);
$('<br>').appendTo($div);
$('<span>', {'class': 'description'})
.text(Messages.settings_logoutEverywhere).appendTo($div);
var $button = $('<button>', { id: 'logoutEverywhere', 'class': 'btn btn-primary' })
.text(Messages.settings_logoutEverywhere)
.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);
@@ -279,9 +291,10 @@ define([
var createImportLocalPads = function (obj) {
if (!Cryptpad.isLoggedIn()) { return; }
var $div = $('<div>', {'class': 'importLocalPads'});
$('<label>', {'for' : 'importLocalPads'}).text(Messages.settings_importTitle).appendTo($div);
$('<br>').appendTo($div);
var $div = $('<div>', {'class': 'importLocalPads element'});
$('<label>', {'for' : 'importLocalPads'}).text(Messages.settings_import).appendTo($div);
$('<span>', {'class': 'description'})
.text(Messages.settings_importTitle).appendTo($div);
var $button = $('<button>', {'id': 'importLocalPads', 'class': 'btn btn-primary'})
.text(Messages.settings_import).appendTo($div);
var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved}).hide().appendTo($div);
@@ -304,31 +317,90 @@ define([
};
var createLanguageSelector = function () {
var $div = $('<div>', {'class': 'importLocalPads'});
var $div = $('<div>', {'class': 'languageSelector element'});
$('<label>').text(Messages.language).appendTo($div);
$('<br>').appendTo($div);
var $b = Cryptpad.createLanguageSelector().appendTo($div);
$b.find('button').addClass('btn btn-secondary');
return $div;
};
var hideCategories = function () {
APP.$rightside.find('> div').hide();
};
var showCategories = function (cat) {
hideCategories();
cat.forEach(function (c) {
APP.$rightside.find('.'+c).show();
});
};
var createLeftside = function () {
var $categories = $('<div>', {'class': 'categories'}).appendTo(APP.$leftside);
APP.$usage = $('<div>', {'class': 'usage'}).appendTo(APP.$leftside);
var active = 'account';
Object.keys(categories).forEach(function (key) {
var $category = $('<div>', {'class': 'category'}).appendTo($categories);
if (key === 'account') { $category.append($('<span>', {'class': 'fa fa-user-o'})); }
if (key === 'drive') { $category.append($('<span>', {'class': 'fa fa-hdd-o'})); }
if (key === active) {
$category.addClass('active');
}
$category.click(function () {
active = key;
$categories.find('.active').removeClass('active');
$category.addClass('active');
showCategories(categories[key]);
});
$category.append(Messages['settings_cat_'+key]);
});
showCategories(categories[active]);
};
var createToolbar = function () {
var displayed = ['useradmin', 'newpad', 'limit', 'upgrade', 'pageTitle'];
var configTb = {
displayed: displayed,
ifrw: window,
common: Cryptpad,
$container: APP.$toolbar,
pageTitle: Messages.settings_title
};
var toolbar = APP.toolbar = Toolbar.create(configTb);
toolbar.$rightside.html(''); // Remove the drawer if we don't use it to hide the toolbar
};
var andThen = function (obj) {
APP.$container.append(createTitle());
APP.$container.append(createInfoBlock(obj));
APP.$container.append(createDisplayNameInput(obj));
APP.$container.append(createLanguageSelector());
APP.$leftside = $('<div>', {id: 'leftSide'}).appendTo(APP.$container);
var $rightside = APP.$rightside = $('<div>', {id: 'rightSide'}).appendTo(APP.$container);
createToolbar();
//$rightside.append(createTitle());
$rightside.append(createInfoBlock(obj));
$rightside.append(createDisplayNameInput(obj));
$rightside.append(createLanguageSelector());
if (Cryptpad.isLoggedIn()) {
APP.$container.append(createLogoutEverywhere(obj));
$rightside.append(createLogoutEverywhere(obj));
}
APP.$container.append(createResetTips());
APP.$container.append(createUsageButton(obj));
APP.$container.append(createBackupDrive(obj));
APP.$container.append(createImportLocalPads(obj));
APP.$container.append(createResetDrive(obj));
APP.$container.append(createUserFeedbackToggle(obj));
$rightside.append(createResetTips());
$rightside.append(createBackupDrive(obj));
$rightside.append(createImportLocalPads(obj));
$rightside.append(createResetDrive(obj));
$rightside.append(createUserFeedbackToggle(obj));
obj.proxy.on('change', [], refresh);
obj.proxy.on('remove', [], refresh);
Cryptpad.onDisplayNameChanged(refresh);
createLeftside();
createUsageButton();
Cryptpad.removeLoadingScreen();
};
$(function () {
@@ -342,6 +414,7 @@ define([
$main.removeClass('hidden');
APP.$container = $('#container');
APP.$toolbar = $('#toolbar');
Cryptpad.ready(function () {
//if (!Cryptpad.getUserHash()) { return redirectToMain(); }

116
www/settings/main.less
View File

@@ -1,31 +1,99 @@
@import '/customize/src/less/variables.less';
@import '/customize/src/less/mixins.less';
@border: 1px solid #555;
@leftside-bg: #eee;
@leftside-color: #000;
@rightside-color: #000;
@description-color: #777;
@button-width: 400px;
@button-bg: #3066e5;
@button-alt-bg: #fff;
@button-red-bg: #e54e4e;
.cp {
input[type="text"] {
padding-left: 10px;
}
#mainBlock {
z-index: 1;
width: 1000px;
max-width: 90%;
margin: auto;
#container {
.infoBlock {
padding: 15px;
border: @border;
background: @dark-base;
.label {
#container {
font-size: 16px;
display: flex;
flex: 1;
min-height: 0;
#leftSide {
color: @leftside-color;
width: 250px;
background: @leftside-bg;
display: flex;
flex-flow: column;
.categories {
flex: 1;
.category {
.leftsideCategory();
}
}
}
#rightSide {
flex: 1;
padding: 5px 20px;
color: @rightside-color;
overflow: auto;
.element {
label:not(.noTitle), .label {
display: block;
font-weight: bold;
text-decoration: underline;
margin-bottom: 0;
}
.description {
display: block;
color: @description-color;
margin-bottom: 5px;
}
margin-bottom: 20px;
}
[type="text"], button {
vertical-align: middle;
height: 40px;
box-sizing: border-box;
}
.userFeedback {
input {
vertical-align: middle;
margin-right: 5px;
}
}
.displayName {
input, button {
vertical-align: middle;
.languageSelector {
button.btn {
width: @button-width;
background-color: @button-alt-bg;
border-color: #adadad;
color: black;
&:hover {
background-color: darken(@button-alt-bg, 15%);
}
}
}
.infoBlock {
[type="text"] {
width: @button-width;
}
}
.inputBlock {
display: inline-flex;
width: @button-width;
input {
flex: 1;
border-radius: 0.25em 0 0 0.25em;
border: 1px solid #adadad;
border-right: 0px;
}
button {
border-radius: 0 0.25em 0.25em 0;
//border: 1px solid #adadad;
border-left: 0px;
}
}
.backupDrive {
@@ -36,6 +104,22 @@
margin-right: 5px;
}
}
button.btn {
background-color: @button-bg;
border-color: darken(@button-bg, 10%);
color: white;
&:hover {
background-color: darken(@button-bg, 10%);
}
&.btn-danger {
background-color: @button-red-bg;
border-color: darken(@button-red-bg, 10%);
color: white;
&:hover {
background-color: darken(@button-red-bg, 10%);
}
}
}
&>div {
margin: 10px 0;
}

25
www/slide/main.js
View File

@@ -230,11 +230,15 @@ define([
var $span = $('<span>', {'class': 'element'}).appendTo($container);
var $inner = $('<span>').text(name);
$span.append($inner).click(function () {
var cleanName = name.replace(/[\[\]]/g, '');
var text = '!['+cleanName+']('+data.href+')';
editor.replaceSelection(text);
var parsed = Cryptpad.parsePadUrl(data.href);
var hexFileName = Cryptpad.base64ToHex(parsed.hashData.channel);
var src = '/blob/' + hexFileName.slice(0,2) + '/' + hexFileName;
var mt = '<media-tag src="' + src + '" data-crypto-key="cryptpad:' + parsed.hashData.key + '"></media-tag>';
editor.replaceSelection(mt);
//var cleanName = name.replace(/[\[\]]/g, '');
//var text = '!['+cleanName+']('+data.href+')';
//editor.replaceSelection(text);
$block.hide();
console.log(data.href);
});
});
};
@@ -622,12 +626,13 @@ define([
body: $iframe.find('body'),
onUploaded: function (ev, data) {
//var cursor = editor.getCursor();
var cleanName = data.name.replace(/[\[\]]/g, '');
var text = '!['+cleanName+']('+data.url+')';
/*if (data.mediatag) {
text = '!'+text;
}*/
editor.replaceSelection(text);
//var cleanName = data.name.replace(/[\[\]]/g, '');
//var text = '!['+cleanName+']('+data.url+')';
var parsed = Cryptpad.parsePadUrl(data.url);
var hexFileName = Cryptpad.base64ToHex(parsed.hashData.channel);
var src = '/blob/' + hexFileName.slice(0,2) + '/' + hexFileName;
var mt = '<media-tag src="' + src + '" data-crypto-key="cryptpad:' + parsed.hashData.key + '"></media-tag>';
editor.replaceSelection(mt);
}
};
APP.FM = Cryptpad.createFileManager(fmConfig);

27
www/slide/slide.less
View File

@@ -279,7 +279,7 @@ div#modal #content, #print {
* {
.size(2.75);
* {
font-size: 100%;
font-size: 1em;
line-height: 1em;
}
}
@@ -396,23 +396,26 @@ div#modal #content, #print {
}
p {
display: flex;
flex-flow: column;
padding: 0;
margin: 0;
min-height:0;
flex: 1;
//display: flex;
//flex-flow: row wrap;
padding: 0;
margin: 0;
min-height:0;
min-width:0;
//flex: 1;
}
media-tag {
min-height: 0;
flex: 1;
display: block;
text-align: center;
min-height: 0;
flex: 1;
display: flex;
flex-flow: column;
text-align: center;
}
media-tag img {
max-height: 100% !important;
flex: 1;
max-height: 100% !important;
}
media-tag iframe {