Merge branch 'staging' of github.com:xwiki-labs/cryptpad into staging
ansuz
commit
45f180955b
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
|
|
@ -577,7 +577,7 @@ noscript {
|
|||
line-height: 24px;
|
||||
vertical-align: middle;
|
||||
.usage {
|
||||
height: 24px;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
background: blue;
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -32,6 +32,9 @@
|
|||
z-index: 1000;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 1em;
|
||||
|
||||
&.left {
|
||||
right: 0;
|
||||
|
|
@ -45,7 +48,7 @@
|
|||
color: black;
|
||||
padding: 5px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
|
|
@ -53,6 +56,16 @@
|
|||
user-select: none;
|
||||
float: none;
|
||||
text-align: left;
|
||||
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 1em;
|
||||
|
||||
|
||||
.fa {
|
||||
width: 20px;
|
||||
text-align: center;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #f1f1f1;
|
||||
|
|
@ -77,7 +90,13 @@
|
|||
margin: 0;
|
||||
white-space: normal;
|
||||
text-align: left;
|
||||
color: black;
|
||||
font-size: 14px;
|
||||
* {
|
||||
font-size: 14px;
|
||||
}
|
||||
h2 {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
background-color: #EEEEEE;
|
||||
|
|
|
|||
|
|
@ -28,16 +28,38 @@
|
|||
#cke_1_contents {
|
||||
margin-top: -1px;
|
||||
display: flex;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.padColor { color: @toolbar-pad-bg; }
|
||||
.codeColor { color: @toolbar-code-bg; }
|
||||
.slideColor { color: @toolbar-slide-bg; }
|
||||
.pollColor { color: @toolbar-poll-bg; }
|
||||
.fileColor { color: @toolbar-file-bg; }
|
||||
.whiteboardColor { color: @toolbar-whiteboard-bg; }
|
||||
.driveColor { color: @toolbar-drive-bg; }
|
||||
.defaultColor { color: @toolbar-default-bg; }
|
||||
|
||||
.userlist-drawer {
|
||||
font: normal normal normal 14px Arial,Helvetica,Tahoma,Verdana,Sans-Serif;
|
||||
min-width: 175px;
|
||||
width: 175px;
|
||||
display: block;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
.close {
|
||||
position: absolute;
|
||||
margin-top: -11px;
|
||||
margin-left: 149px;
|
||||
font-size: 15px;
|
||||
opacity: 0.5;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
color: inherit;
|
||||
font-size: 1.2em;
|
||||
|
|
@ -96,24 +118,20 @@ body {
|
|||
}
|
||||
.cryptpad-toolbar-leftside, .cryptpad-toolbar-rightside, .drawer-content {
|
||||
background-color: lighten(@bgcolor, 8%);
|
||||
button:hover {
|
||||
button:hover, button.active {
|
||||
background-color: @bgcolor;
|
||||
}
|
||||
}
|
||||
.hoverable:hover {
|
||||
.editable {
|
||||
.editable, .pencilIcon {
|
||||
cursor: text;
|
||||
border: 1px solid darken(@bgcolor, 15%);
|
||||
background: darken(@bgcolor, 10%);
|
||||
transition: all 0.15s;
|
||||
color: @color;
|
||||
}
|
||||
.pencilIcon {
|
||||
border: 1px solid darken(@bgcolor, 15%);
|
||||
background: darken(@bgcolor, 10%);
|
||||
color: @color;
|
||||
&:hover {
|
||||
background: darken(@bgcolor, 5%);
|
||||
}
|
||||
.editable {
|
||||
cursor: text;
|
||||
}
|
||||
}
|
||||
.saveIcon {
|
||||
|
|
@ -129,7 +147,7 @@ body {
|
|||
background: darken(@bgcolor, 10%);
|
||||
color: @color;
|
||||
}
|
||||
.dropdown-bar-content {
|
||||
/*.dropdown-bar-content {
|
||||
background: darken(@bgcolor, 5%);
|
||||
border: 1px solid @color;
|
||||
color: @color;
|
||||
|
|
@ -155,7 +173,7 @@ body {
|
|||
background-color: @bgcolor;
|
||||
}
|
||||
}
|
||||
}
|
||||
}*/
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -229,9 +247,6 @@ body {
|
|||
margin: 0;
|
||||
background: transparent;
|
||||
}
|
||||
.dropdown-bar-content {
|
||||
line-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.separator {
|
||||
|
|
@ -248,6 +263,7 @@ body {
|
|||
}
|
||||
|
||||
button {
|
||||
transition: all 0.15s;
|
||||
.unselectable();
|
||||
&#shareButton, &.buttonSuccess {
|
||||
// Bootstrap 4 colors
|
||||
|
|
@ -297,14 +313,9 @@ body {
|
|||
}
|
||||
}
|
||||
.cryptpad-toolbar-rightside button, .cryptpad-toolbar-leftside button {
|
||||
//background-color: #fff;
|
||||
//border-color: #ccc;
|
||||
background: transparent;
|
||||
&:hover {
|
||||
//color: #292b2c;
|
||||
background-color: rgba(50,50,50,0.3);
|
||||
//background-color: #e6e6e6;
|
||||
border-color: #adadad;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -603,7 +614,7 @@ body {
|
|||
display: inline-flex;
|
||||
align-items: center;
|
||||
line-height: @toolbar-top-height;
|
||||
margin: 0 20px;
|
||||
margin: 0 10px;
|
||||
.title, .pencilIcon, .saveIcon {
|
||||
font-size: 25px;
|
||||
vertical-align: middle;
|
||||
|
|
@ -671,6 +682,8 @@ body {
|
|||
}
|
||||
order: 2;
|
||||
text-align: center;
|
||||
font-size: 32px;
|
||||
margin-left: 10px;
|
||||
&> button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -696,10 +709,6 @@ body {
|
|||
color: inherit;
|
||||
}
|
||||
}
|
||||
.dropdown-bar-content {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
}
|
||||
}
|
||||
.cryptpad-link {
|
||||
display: inline-flex;
|
||||
|
|
@ -728,6 +737,7 @@ body {
|
|||
display: inline-block;
|
||||
order: 5;
|
||||
line-height: @toolbar-top-height;
|
||||
color: white;
|
||||
&> * {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
|
|
@ -739,13 +749,15 @@ body {
|
|||
cursor: pointer;
|
||||
}
|
||||
.cryptpad-user-dropdown {
|
||||
margin-left: 20px;
|
||||
z-index: 10000;
|
||||
//margin-left: 20px;
|
||||
height: 64px;
|
||||
width: 64px;
|
||||
padding: 0px;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
background-color: rgba(0,0,0,0.3);
|
||||
transition: all 0.15s;
|
||||
&:hover {
|
||||
background-color: rgba(0,0,0,0.4);
|
||||
}
|
||||
|
|
@ -838,6 +850,9 @@ body {
|
|||
display: flex;
|
||||
flex-flow: column;
|
||||
z-index:1000;
|
||||
.fa {
|
||||
font-size: 17px;
|
||||
}
|
||||
&> span {
|
||||
box-sizing: border-box;
|
||||
width: 150px;
|
||||
|
|
|
|||
|
|
@ -241,7 +241,7 @@ define(function () {
|
|||
out.fm_templateName = "Modèles";
|
||||
out.fm_searchName = "Recherche";
|
||||
out.fm_searchPlaceholder = "Rechercher...";
|
||||
out.fm_newButton = "Ajouter à ce dossier";
|
||||
out.fm_newButton = "Nouveau";
|
||||
out.fm_newButtonTitle = "Créer un nouveau pad ou un dossier, importer un fichier dans le dossier courant";
|
||||
out.fm_newFolder = "Nouveau dossier";
|
||||
out.fm_newFile = "Nouveau pad";
|
||||
|
|
|
|||
|
|
@ -244,7 +244,7 @@ define(function () {
|
|||
out.fm_templateName = "Templates";
|
||||
out.fm_searchName = "Search";
|
||||
out.fm_searchPlaceholder = "Search...";
|
||||
out.fm_newButton = "Add to this folder";
|
||||
out.fm_newButton = "New";
|
||||
out.fm_newButtonTitle = "Create a new pad or folder, import a file in the current folder";
|
||||
out.fm_newFolder = "New folder";
|
||||
out.fm_newFile = "New pad";
|
||||
|
|
|
|||
|
|
@ -263,5 +263,28 @@ define([
|
|||
};
|
||||
};
|
||||
|
||||
var $fileIcon = $('<span>', {"class": "fa fa-file-text-o file icon"});
|
||||
var $fileAppIcon = $('<span>', {"class": "fa fa-file-text-o file icon fileColor"});
|
||||
var $padIcon = $('<span>', {"class": "fa fa-file-word-o file icon padColor"});
|
||||
var $codeIcon = $('<span>', {"class": "fa fa-file-code-o file icon codeColor"});
|
||||
var $slideIcon = $('<span>', {"class": "fa fa-file-powerpoint-o file icon slideColor"});
|
||||
var $pollIcon = $('<span>', {"class": "fa fa-calendar file icon pollColor"});
|
||||
var $whiteboardIcon = $('<span>', {"class": "fa fa-paint-brush whiteboardColor"});
|
||||
UI.getIcon = function (type) {
|
||||
var $icon;
|
||||
|
||||
switch(type) {
|
||||
case 'pad': $icon = $padIcon.clone(); break;
|
||||
case 'file': $icon = $fileAppIcon.clone(); break;
|
||||
case 'code': $icon = $codeIcon.clone(); break;
|
||||
case 'slide': $icon = $slideIcon.clone(); break;
|
||||
case 'poll': $icon = $pollIcon.clone(); break;
|
||||
case 'whiteboard': $icon = $whiteboardIcon.clone(); break;
|
||||
default: $icon = $fileIcon.clone();
|
||||
}
|
||||
|
||||
return $icon;
|
||||
};
|
||||
|
||||
return UI;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -12,12 +12,13 @@ define([
|
|||
'/common/common-metadata.js',
|
||||
'/common/common-codemirror.js',
|
||||
'/common/common-file.js',
|
||||
'/file/file-crypto.js',
|
||||
|
||||
'/common/clipboard.js',
|
||||
'/common/pinpad.js',
|
||||
'/customize/application_config.js'
|
||||
], function ($, Config, Messages, Store, Util, Hash, UI, History, UserList, Title, Metadata,
|
||||
CodeMirror, Files, Clipboard, Pinpad, AppConfig) {
|
||||
CodeMirror, Files, FileCrypto, Clipboard, Pinpad, AppConfig) {
|
||||
|
||||
/* This file exposes functionality which is specific to Cryptpad, but not to
|
||||
any particular pad type. This includes functions for committing metadata
|
||||
|
|
@ -65,6 +66,7 @@ define([
|
|||
common.errorLoadingScreen = UI.errorLoadingScreen;
|
||||
common.notify = UI.notify;
|
||||
common.unnotify = UI.unnotify;
|
||||
common.getIcon = UI.getIcon;
|
||||
|
||||
// import common utilities for export
|
||||
common.find = Util.find;
|
||||
|
|
@ -850,8 +852,9 @@ define([
|
|||
common.createUsageBar = function (cb) {
|
||||
// getPinnedUsage updates common.account.usage, and other values
|
||||
// so we can just use those and only check for errors
|
||||
var $container = $('<span>', {'class':'limit-container'});
|
||||
var todo = function (err) {
|
||||
var $container = $('<span>', {'class':'limit-container'});
|
||||
$container.html('');
|
||||
if (err) {
|
||||
return void window.setTimeout(function () {
|
||||
common.getPinnedUsage(todo);
|
||||
|
|
@ -867,8 +870,7 @@ define([
|
|||
|
||||
var $limit = $('<span>', {'class': 'cryptpad-limit-bar'}).appendTo($container);
|
||||
var quota = usage/limit;
|
||||
var width = Math.floor(Math.min(quota, 1)*$limit.width()); // the bar is 200px width
|
||||
var $usage = $('<span>', {'class': 'usage'}).css('width', width+'px');
|
||||
var $usage = $('<span>', {'class': 'usage'}).css('width', quota*100+'%');
|
||||
|
||||
var makeDonateButton = function () {
|
||||
$('<a>', {
|
||||
|
|
@ -921,9 +923,9 @@ define([
|
|||
window.setTimeout(function () {
|
||||
common.getPinnedUsage(todo);
|
||||
}, LIMIT_REFRESH_RATE);
|
||||
cb(err, $container);
|
||||
};
|
||||
common.getPinnedUsage(todo);
|
||||
cb(null, $container);
|
||||
};
|
||||
|
||||
var prepareFeedback = common.prepareFeedback = function (key) {
|
||||
|
|
@ -975,9 +977,14 @@ define([
|
|||
var ev = {
|
||||
target: data.target
|
||||
};
|
||||
if (data.filter && !data.filter(file)) {
|
||||
common.log('TODO: invalid avatar (type or size)');
|
||||
return;
|
||||
}
|
||||
data.FM.handleFile(file, ev);
|
||||
if (callback) { callback(); }
|
||||
});
|
||||
if (data.accept) { $input.attr('accept', data.accept); }
|
||||
button.click(function () { $input.click(); });
|
||||
break;
|
||||
case 'template':
|
||||
|
|
@ -1099,8 +1106,7 @@ define([
|
|||
}
|
||||
button = $('<button>', {
|
||||
title: Messages.historyButton,
|
||||
'class': "fa fa-history",
|
||||
style: 'font:'+size+' FontAwesome'
|
||||
'class': "fa fa-history history",
|
||||
});
|
||||
if (data.histConfig) {
|
||||
button
|
||||
|
|
@ -1130,6 +1136,70 @@ define([
|
|||
return button;
|
||||
};
|
||||
|
||||
common.avatarAllowedTypes = [
|
||||
'image/png',
|
||||
'image/jpeg',
|
||||
'image/jpg',
|
||||
'image/gif',
|
||||
];
|
||||
common.displayAvatar = function ($container, href) {
|
||||
var MutationObserver = window.MutationObserver;
|
||||
$container.html('');
|
||||
if (href) {
|
||||
var parsed = common.parsePadUrl(href);
|
||||
var secret = common.getSecrets('file', parsed.hash);
|
||||
if (secret.keys && secret.channel) {
|
||||
var cryptKey = secret.keys && secret.keys.fileKeyStr;
|
||||
var hexFileName = common.base64ToHex(secret.channel);
|
||||
var src = common.getBlobPathFromHex(hexFileName);
|
||||
common.getFileSize(href, function (e, data) {
|
||||
if (e) { return void console.error(e); }
|
||||
if (typeof data !== "number") { return; }
|
||||
if (common.bytesToMegabytes(data) > 0.5) { return; }
|
||||
var $img = $('<media-tag>').appendTo($container);
|
||||
$img.attr('src', src);
|
||||
$img.attr('data-crypto-key', 'cryptpad:' + cryptKey);
|
||||
require(['/common/media-tag.js'], function (MediaTag) {
|
||||
MediaTag.CryptoFilter.setAllowedMediaTypes(common.avatarAllowedTypes);
|
||||
MediaTag($img[0]);
|
||||
var observer = new MutationObserver(function(mutations) {
|
||||
mutations.forEach(function(mutation) {
|
||||
if (mutation.type === 'childList' && mutation.addedNodes.length) {
|
||||
console.log(mutation);
|
||||
if (mutation.addedNodes.length > 1 ||
|
||||
mutation.addedNodes[0].nodeName !== 'IMG') {
|
||||
$img.remove();
|
||||
return;
|
||||
//TODO display default avatar
|
||||
}
|
||||
var $image = $img.find('img');
|
||||
var onLoad = function () {
|
||||
var w = $image.width();
|
||||
var h = $image.height();
|
||||
if (w>h) {
|
||||
$image.css('max-height', '100%');
|
||||
$img.css('flex-direction', 'row');
|
||||
return;
|
||||
}
|
||||
$image.css('max-width', '100%');
|
||||
$img.css('flex-direction', 'column');
|
||||
};
|
||||
if ($image[0].complete) { onLoad(); }
|
||||
$image.on('load', onLoad);
|
||||
}
|
||||
});
|
||||
});
|
||||
observer.observe($img[0], {
|
||||
attributes: false,
|
||||
childList: true,
|
||||
characterData: false
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Create a button with a dropdown menu
|
||||
// input is a config object with parameters:
|
||||
// - container (optional): the dropdown container (span)
|
||||
|
|
|
|||
|
|
@ -156,7 +156,6 @@ define([
|
|||
MediaTag(el);
|
||||
var observer = new MutationObserver(function(mutations) {
|
||||
mutations.forEach(function(mutation) {
|
||||
console.log(mutation);
|
||||
if (mutation.type === 'childList') {
|
||||
var list_values = [].slice.call(el.children);
|
||||
mediaMap[el.getAttribute('src')] = list_values;
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@ define([
|
|||
$('<span>', {'class': STATE_CLS}).hide().appendTo($userContainer);
|
||||
$('<span>', {'class': LAG_CLS}).hide().appendTo($userContainer);
|
||||
$('<span>', {'class': LIMIT_CLS}).hide().appendTo($userContainer);
|
||||
//$('<span>', {'class': NEWPAD_CLS + ' dropdown-bar'}).hide().appendTo($userContainer);
|
||||
$('<span>', {'class': NEWPAD_CLS + ' dropdown-bar'}).hide().appendTo($userContainer);
|
||||
$('<span>', {'class': USERADMIN_CLS + ' dropdown-bar'}).hide().appendTo($userContainer);
|
||||
|
||||
$toolbar.append($topContainer)
|
||||
|
|
@ -177,9 +177,8 @@ define([
|
|||
var numberOfViewUsers = numberOfUsers - userList.length;
|
||||
|
||||
// Update the userlist
|
||||
var $usersTitle = $('<h2>').text(Messages.users);
|
||||
var $editUsers = $userlistContent;
|
||||
$editUsers.html('').append($usersTitle);
|
||||
var $editUsers = $userlistContent.find('.' + USERLIST_CLS).html('');
|
||||
|
||||
|
||||
var $editUsersList = $('<div>', {'class': 'userlist-others'});
|
||||
|
||||
|
|
@ -248,7 +247,10 @@ define([
|
|||
throw new Error("You must provide a `userList` object to display the userlist");
|
||||
}
|
||||
var $content = $('<div>', {'class': 'userlist-drawer'});
|
||||
var $closeIcon = $('<span>', {"class": "fa fa-window-close close"}).appendTo($content);
|
||||
$('<h2>').text(Messages.users).appendTo($content);
|
||||
$('<p>', {'class': USERLIST_CLS}).appendTo($content);
|
||||
|
||||
toolbar.userlistContent = $content;
|
||||
|
||||
var $container = $('<span>', {id: 'userButtons'});
|
||||
|
|
@ -263,15 +265,41 @@ define([
|
|||
config.$contentContainer.prepend($content);
|
||||
}
|
||||
|
||||
var $ck = config.$container.find('.cke_toolbox_main');
|
||||
var hide = function () {
|
||||
$content.hide();
|
||||
$button.removeClass('active');
|
||||
$ck.css({
|
||||
'display': '',
|
||||
'padding-left': '',
|
||||
'margin-bottom': ''
|
||||
});
|
||||
};
|
||||
var show = function () {
|
||||
$content.show();
|
||||
$button.addClass('active');
|
||||
$ck.css({
|
||||
'display': 'inline-block',
|
||||
'padding-left': '175px',
|
||||
'margin-bottom': '-3px'
|
||||
});
|
||||
$content.css('margin-top', (-$ck.height())+'px');
|
||||
};
|
||||
|
||||
$closeIcon.click(hide);
|
||||
$button.click(function () {
|
||||
$content.toggle();
|
||||
var visible = $content.is(':visible');
|
||||
if (visible) { hide(); }
|
||||
else { show(); }
|
||||
visible = !visible;
|
||||
Cryptpad.setAttribute('userlist-drawer', visible);
|
||||
Cryptpad.feedback(visible?'USERLIST_SHOW': 'USERLIST_HIDE');
|
||||
});
|
||||
|
||||
|
||||
Cryptpad.getAttribute('userlist-drawer', function (err, val) {
|
||||
if (val === false) { $content.hide(); }
|
||||
if (val === false) { return void hide(); }
|
||||
show();
|
||||
});
|
||||
|
||||
return $container;
|
||||
|
|
@ -658,9 +686,10 @@ define([
|
|||
};
|
||||
|
||||
var createNewPad = function (toolbar) {
|
||||
var $newPad = $('<span>', {
|
||||
/*var $newPad = $('<span>', {
|
||||
'class': NEWPAD_CLS + " dropdown-bar"
|
||||
}).appendTo(toolbar.$top);
|
||||
}).appendTo(toolbar.$top);*/
|
||||
var $newPad = toolbar.$top.find('.'+NEWPAD_CLS).show();
|
||||
|
||||
var pads_options = [];
|
||||
Config.availablePadTypes.forEach(function (p) {
|
||||
|
|
@ -673,19 +702,20 @@ define([
|
|||
'target': '_blank',
|
||||
'href': '/' + p + '/',
|
||||
},
|
||||
content: Messages.type[p]
|
||||
content: $('<div>').append(Cryptpad.getIcon(p)).html() + Messages.type[p]
|
||||
});
|
||||
});
|
||||
var dropdownConfig = {
|
||||
text: '', // Button initial text
|
||||
options: pads_options, // Entries displayed in the menu
|
||||
container: $newPad,
|
||||
left: true,
|
||||
feedback: /drive/.test(window.location.pathname)?
|
||||
'DRIVE_NEWPAD': 'NEWPAD',
|
||||
};
|
||||
var $newPadBlock = Cryptpad.createDropdown(dropdownConfig);
|
||||
$newPadBlock.find('button').attr('title', Messages.newButtonTitle);
|
||||
$newPadBlock.find('button').addClass('fa fa-plus');
|
||||
$newPadBlock.find('button').addClass('fa fa-th');
|
||||
return $newPadBlock;
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -171,8 +171,16 @@ span {
|
|||
white-space: nowrap;
|
||||
max-width: 500px;
|
||||
min-width: 200px;
|
||||
padding: 10px 0px;
|
||||
padding: 0px;
|
||||
color: @tree-fg;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
max-height: 100%;
|
||||
.categories-container {
|
||||
flex: 1;
|
||||
max-width: 500px;
|
||||
overflow: auto;
|
||||
}
|
||||
img.icon {
|
||||
margin-bottom: 3px;
|
||||
margin-left: -2px;
|
||||
|
|
@ -218,10 +226,20 @@ span {
|
|||
margin-top: 0;
|
||||
}
|
||||
#searchContainer {
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
padding: 5px 0;
|
||||
padding: 0;
|
||||
input {
|
||||
width: 80%;
|
||||
outline-width: 0px;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
border: 1px solid #ccc;
|
||||
border-right: 0;
|
||||
height: 32px;
|
||||
padding: 0 5px;
|
||||
&:focus {
|
||||
outline-width: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.fa.expcol {
|
||||
|
|
@ -284,7 +302,27 @@ 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 */
|
||||
|
|
@ -545,17 +583,15 @@ span {
|
|||
/* Toolbar */
|
||||
|
||||
#driveToolbar {
|
||||
background: @toolbar-bg;
|
||||
color: @toolbar-fg;
|
||||
background: lighten(@toolbar-drive-bg, 8%);
|
||||
color: @toolbar-drive-color;
|
||||
//height: 30px;
|
||||
//display: flex;
|
||||
//flex-flow: row;
|
||||
border-top: 1px solid @toolbar-border-col;
|
||||
border-bottom: ;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
|
||||
z-index: 100;
|
||||
box-sizing: content-box;
|
||||
padding: 0 6px;
|
||||
box-sizing: border-box;
|
||||
height: 32px;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
|
||||
|
|
@ -564,8 +600,71 @@ span {
|
|||
height: 100%;
|
||||
}
|
||||
|
||||
.history {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.rightside, .leftside {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
.fa {
|
||||
margin: 0;
|
||||
}
|
||||
button {
|
||||
height: 100%;
|
||||
padding: 0 10px;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
box-sizing: border-box;
|
||||
background: transparent;
|
||||
font-size: 17px;
|
||||
color: @toolbar-drive-color;
|
||||
transition: all 0.15s;
|
||||
.fa, span {
|
||||
font-size: 17px;
|
||||
}
|
||||
&:hover {
|
||||
background: @toolbar-drive-bg;
|
||||
}
|
||||
&.active {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.rightside {
|
||||
float: right;
|
||||
& > * {
|
||||
float: right;
|
||||
}
|
||||
#contextButtonsContainer {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
}
|
||||
padding-left: 10px;
|
||||
}
|
||||
.leftside {
|
||||
& > span {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
button {
|
||||
padding: 0 10px;
|
||||
.fa {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.buttonTitle {
|
||||
display: inline-flex;
|
||||
height: 32px;
|
||||
align-items: center;
|
||||
span:not(.fa) {
|
||||
line-height: 23px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
height: 24px;
|
||||
font: @toolbar-button-font;
|
||||
span {
|
||||
font: @toolbar-button-font;
|
||||
|
|
@ -573,15 +672,6 @@ span {
|
|||
.fa, &.fa {
|
||||
font-family: FontAwesome;
|
||||
}
|
||||
&.element {
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
&.new {
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
/* The container <div> - needed to position the dropdown content */
|
||||
.dropdown-bar {
|
||||
|
|
@ -590,10 +680,10 @@ span {
|
|||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
.right {
|
||||
/*.right {
|
||||
float: right;
|
||||
/* Right-side buttons */
|
||||
button {
|
||||
/* button {
|
||||
display: inline-block;
|
||||
&.active {
|
||||
display: none;
|
||||
|
|
@ -602,28 +692,16 @@ span {
|
|||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}*/
|
||||
.dropdown-bar-content {
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.leftside {
|
||||
width: auto;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: inline-block;
|
||||
}
|
||||
.rightside {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
}
|
||||
.path {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
cursor: default;
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
|
|
@ -632,26 +710,21 @@ span {
|
|||
max-width: 100%;
|
||||
text-align: left;
|
||||
.element {
|
||||
font-size: 17px;
|
||||
padding: 5px;
|
||||
border: 1px solid @toolbar-bg;
|
||||
border-radius: 2px;
|
||||
border: 0;
|
||||
background: darken(@toolbar-drive-bg, 10%);
|
||||
color: @toolbar-drive-color;
|
||||
box-sizing: border-box;
|
||||
transition: all 0.15s;
|
||||
&.clickable {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: @toolbar-path-bg;
|
||||
border: 1px solid @toolbar-path-border;
|
||||
background: darken(@toolbar-drive-bg, 15%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
#contextButtonsContainer {
|
||||
float: right;
|
||||
margin: 2px;
|
||||
button {
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
define([
|
||||
'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
|
||||
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
|
||||
'css!/drive/file.css',
|
||||
'less!/drive/file.less',
|
||||
'less!/customize/src/less/cryptpad.less',
|
||||
'less!/customize/src/less/toolbar.less',
|
||||
], function () {});
|
||||
|
|
|
|||
|
|
@ -158,13 +158,6 @@ define([
|
|||
//var $folderOpenedIcon = $('<span>', {"class": "fa fa-folder-open folder"});
|
||||
var $folderOpenedIcon = $('<img>', {src: "/customize/images/icons/folderOpen.svg", "class": "folder icon"});
|
||||
var $folderOpenedEmptyIcon = $folderOpenedIcon.clone();
|
||||
var $fileIcon = $('<span>', {"class": "fa fa-file-text-o file icon"});
|
||||
var $fileAppIcon = $('<span>', {"class": "fa fa-file-text-o file icon fileColor"});
|
||||
var $padIcon = $('<span>', {"class": "fa fa-file-word-o file icon padColor"});
|
||||
var $codeIcon = $('<span>', {"class": "fa fa-file-code-o file icon codeColor"});
|
||||
var $slideIcon = $('<span>', {"class": "fa fa-file-powerpoint-o file icon slideColor"});
|
||||
var $pollIcon = $('<span>', {"class": "fa fa-calendar file icon pollColor"});
|
||||
var $whiteboardIcon = $('<span>', {"class": "fa fa-paint-brush whiteboardColor"});
|
||||
//var $upIcon = $('<span>', {"class": "fa fa-arrow-circle-up"});
|
||||
var $unsortedIcon = $('<span>', {"class": "fa fa-files-o"});
|
||||
var $templateIcon = $('<span>', {"class": "fa fa-cubes"});
|
||||
|
|
@ -172,8 +165,8 @@ define([
|
|||
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"});
|
||||
var $listIcon = $('<span>', {"class": "fa fa-list"});
|
||||
var $gridIcon = $('<span>', {"class": "fa fa-th"});
|
||||
var $listIcon = $('<button>', {"class": "fa fa-list"});
|
||||
var $gridIcon = $('<button>', {"class": "fa fa-th-large"});
|
||||
var $sortAscIcon = $('<span>', {"class": "fa fa-angle-up sortasc"});
|
||||
var $sortDescIcon = $('<span>', {"class": "fa fa-angle-down sortdesc"});
|
||||
var $closeIcon = $('<span>', {"class": "fa fa-window-close"});
|
||||
|
|
@ -1141,7 +1134,7 @@ define([
|
|||
};
|
||||
|
||||
var getFileIcon = function (id) {
|
||||
var $icon = $fileIcon.clone();
|
||||
var $icon = Cryptpad.getIcon();
|
||||
|
||||
var data = filesOp.getFileData(id);
|
||||
if (!data) { return $icon; }
|
||||
|
|
@ -1149,15 +1142,16 @@ define([
|
|||
var href = data.href;
|
||||
if (!href) { return $icon; }
|
||||
|
||||
if (href.indexOf('/pad/') !== -1) { $icon = $padIcon.clone(); }
|
||||
else if (href.indexOf('/code/') !== -1) { $icon = $codeIcon.clone(); }
|
||||
else if (href.indexOf('/slide/') !== -1) { $icon = $slideIcon.clone(); }
|
||||
else if (href.indexOf('/poll/') !== -1) { $icon = $pollIcon.clone(); }
|
||||
else if (href.indexOf('/whiteboard/') !== -1) { $icon = $whiteboardIcon.clone(); }
|
||||
else if (href.indexOf('/file/') !== -1) { $icon = $fileAppIcon.clone(); }
|
||||
if (href.indexOf('/pad/') !== -1) { $icon = Cryptpad.getIcon('pad'); }
|
||||
else if (href.indexOf('/code/') !== -1) { $icon = Cryptpad.getIcon('code'); }
|
||||
else if (href.indexOf('/slide/') !== -1) { $icon = Cryptpad.getIcon('slide'); }
|
||||
else if (href.indexOf('/poll/') !== -1) { $icon = Cryptpad.getIcon('poll'); }
|
||||
else if (href.indexOf('/whiteboard/') !== -1) { $icon = Cryptpad.getIcon('whiteboard'); }
|
||||
else if (href.indexOf('/file/') !== -1) { $icon = Cryptpad.getIcon('file'); }
|
||||
|
||||
return $icon;
|
||||
};
|
||||
var getIcon = Cryptpad.getIcon;
|
||||
|
||||
// Create the "li" element corresponding to the file/folder located in "path"
|
||||
var createElement = function (path, elPath, root, isFolder) {
|
||||
|
|
@ -1285,7 +1279,10 @@ define([
|
|||
}
|
||||
|
||||
if (idx === 0) { name = getPrettyName(p); }
|
||||
else { $title.append(' > '); }
|
||||
else {
|
||||
var $span2 = $('<span>', {'class': 'element'}).text(' > ');
|
||||
$title.append($span2);
|
||||
}
|
||||
|
||||
$span.text(name).appendTo($title);
|
||||
});
|
||||
|
|
@ -1335,17 +1332,13 @@ define([
|
|||
};
|
||||
|
||||
// Create the button allowing the user to switch from list to icons modes
|
||||
var createViewModeButton = function () {
|
||||
var $block = $('<div>', {
|
||||
var createViewModeButton = function ($container) {
|
||||
/*var $block = $('<div>', {
|
||||
'class': 'dropdown-bar right changeViewModeContainer'
|
||||
});
|
||||
});*/
|
||||
|
||||
var $listButton = $('<button>', {
|
||||
'class': 'element btn btn-secondary'
|
||||
}).append($listIcon.clone());
|
||||
var $gridButton = $('<button>', {
|
||||
'class': 'element btn btn-secondary'
|
||||
}).append($gridIcon.clone());
|
||||
var $listButton = $listIcon.clone().addClass('element');
|
||||
var $gridButton = $gridIcon.clone().addClass('element');
|
||||
|
||||
$listButton.click(function () {
|
||||
$gridButton.removeClass('active');
|
||||
|
|
@ -1369,11 +1362,10 @@ define([
|
|||
} else {
|
||||
$gridButton.addClass('active');
|
||||
}
|
||||
$block.append($listButton).append($gridButton);
|
||||
return $block;
|
||||
$container.append($listButton).append($gridButton);
|
||||
};
|
||||
|
||||
var createNewButton = function (isInRoot) {
|
||||
var createNewButton = function (isInRoot, $container) {
|
||||
if (!APP.editable) { return; }
|
||||
if (!APP.loggedIn) { return; } // Anonymous users can use the + menu in the toolbar
|
||||
|
||||
|
|
@ -1383,13 +1375,13 @@ define([
|
|||
options.push({
|
||||
tag: 'a',
|
||||
attributes: {'class': 'newFolder'},
|
||||
content: Messages.fm_folder
|
||||
content: $('<div>').append($folderIcon.clone()).html() + Messages.fm_folder
|
||||
});
|
||||
options.push({tag: 'hr'});
|
||||
options.push({
|
||||
tag: 'a',
|
||||
attributes: {'class': 'uploadFile'},
|
||||
content: Messages.uploadButton
|
||||
content: $('<div>').append(getIcon('file')).html() + Messages.uploadButton
|
||||
});
|
||||
options.push({tag: 'hr'});
|
||||
}
|
||||
|
|
@ -1407,21 +1399,21 @@ define([
|
|||
options.push({
|
||||
tag: 'a',
|
||||
attributes: attributes,
|
||||
content: Messages.type[type]
|
||||
content: $('<div>').append(getIcon(type)).html() + Messages.type[type]
|
||||
});
|
||||
});
|
||||
var $plusIcon = $('<div>').append($('<span>', {'class': 'fa fa-plus'}));
|
||||
|
||||
|
||||
var dropdownConfig = {
|
||||
text: $plusIcon.html() + Messages.fm_newButton,
|
||||
text: $plusIcon.html() + '<span>'+Messages.fm_newButton+'</span>',
|
||||
options: options,
|
||||
feedback: 'DRIVE_NEWPAD_LOCALFOLDER',
|
||||
};
|
||||
var $block = Cryptpad.createDropdown(dropdownConfig);
|
||||
|
||||
// Custom style:
|
||||
$block.find('button').addClass('btn').addClass('btn-primary').addClass('new');
|
||||
$block.find('button').addClass('new');
|
||||
$block.find('button').attr('title', Messages.fm_newButtonTitle);
|
||||
|
||||
// Handlers
|
||||
|
|
@ -1459,7 +1451,7 @@ define([
|
|||
window.open('/' + type + '/');
|
||||
});
|
||||
|
||||
return $block;
|
||||
$container.append($block);
|
||||
};
|
||||
|
||||
var hideNewButton = function () {
|
||||
|
|
@ -1636,7 +1628,8 @@ define([
|
|||
$toolbar.html('');
|
||||
$('<div>', {'class': 'leftside'}).appendTo($toolbar);
|
||||
$('<div>', {'class': 'path unselectable'}).appendTo($toolbar);
|
||||
$('<div>', {'class': 'rightside'}).appendTo($toolbar);
|
||||
var $rightside = $('<div>', {'class': 'rightside'}).appendTo($toolbar);
|
||||
if (APP.$hist) { $rightside.append(APP.$hist); }
|
||||
return $toolbar;
|
||||
};
|
||||
|
||||
|
|
@ -1857,12 +1850,12 @@ define([
|
|||
if (mode) {
|
||||
$dirContent.addClass(getViewModeClass());
|
||||
}
|
||||
createViewModeButton().appendTo($toolbar.find('.rightside'));
|
||||
createViewModeButton($toolbar.find('.rightside'));
|
||||
}
|
||||
var $list = $('<ul>').appendTo($dirContent);
|
||||
|
||||
// NewButton can be undefined if we're in read only mode
|
||||
$toolbar.find('.leftside').append(createNewButton(isInRoot));
|
||||
createNewButton(isInRoot, $toolbar.find('.leftside'));
|
||||
|
||||
createTitle(path).appendTo($toolbar.find('.path'));
|
||||
|
||||
|
|
@ -2127,10 +2120,15 @@ define([
|
|||
var s = $tree.scrollTop() || 0;
|
||||
$tree.html('');
|
||||
if (displayedCategories.indexOf(SEARCH) !== -1) { createSearch($tree); }
|
||||
if (displayedCategories.indexOf(ROOT) !== -1) { createTree($tree, [ROOT]); }
|
||||
if (displayedCategories.indexOf(TEMPLATE) !== -1) { createTemplate($tree, [TEMPLATE]); }
|
||||
if (displayedCategories.indexOf(FILES_DATA) !== -1) { createAllFiles($tree, [FILES_DATA]); }
|
||||
if (displayedCategories.indexOf(TRASH) !== -1) { createTrash($tree, [TRASH]); }
|
||||
var $div = $('<div>', {'class': 'categories-container'}).appendTo($tree);
|
||||
if (displayedCategories.indexOf(ROOT) !== -1) { createTree($div, [ROOT]); }
|
||||
if (displayedCategories.indexOf(TEMPLATE) !== -1) { createTemplate($div, [TEMPLATE]); }
|
||||
if (displayedCategories.indexOf(FILES_DATA) !== -1) { createAllFiles($div, [FILES_DATA]); }
|
||||
if (displayedCategories.indexOf(TRASH) !== -1) { createTrash($div, [TRASH]); }
|
||||
|
||||
//$tree.append($('<div>', {'class': 'filler'}));
|
||||
$tree.append(APP.$limit);
|
||||
|
||||
$tree.scrollTop(s);
|
||||
};
|
||||
|
||||
|
|
@ -2721,7 +2719,6 @@ define([
|
|||
|
||||
var $rightside = toolbar.$rightside;
|
||||
$rightside.html(''); // Remove the drawer if we don't use it to hide the toolbar
|
||||
var $leftside = toolbar.$leftside;
|
||||
var $userBlock = toolbar.$userAdmin;
|
||||
APP.$displayName = APP.$bar.find('.' + Toolbar.constants.username);
|
||||
|
||||
|
|
@ -2736,8 +2733,7 @@ define([
|
|||
/* add the usage */
|
||||
Cryptpad.createUsageBar(function (err, $limitContainer) {
|
||||
if (err) { return void logError(err); }
|
||||
$leftside.html('');
|
||||
$leftside.append($limitContainer);
|
||||
APP.$limit = $limitContainer;
|
||||
}, true);
|
||||
|
||||
/* add a history button */
|
||||
|
|
@ -2755,8 +2751,9 @@ define([
|
|||
$toolbar: APP.$bar,
|
||||
href: window.location.origin + window.location.pathname + '#' + APP.hash
|
||||
};
|
||||
var $hist = Cryptpad.createButton('history', true, {histConfig: histConfig});
|
||||
if (APP.loggedIn) { $rightside.append($hist); }
|
||||
APP.$hist = Cryptpad.createButton('history', true, {histConfig: histConfig});
|
||||
APP.$hist.addClass('element');
|
||||
//if (APP.loggedIn) { $rightside.append($hist); } TODO
|
||||
|
||||
if (!readOnly && !APP.loggedIn) {
|
||||
var $backupButton = Cryptpad.createButton('', true).removeClass('fa').removeClass('fa-question').addClass('cryptpad-backup');
|
||||
|
|
|
|||
|
|
@ -196,51 +196,105 @@ define([
|
|||
cb();
|
||||
};
|
||||
var rt = APP.lm.realtime;
|
||||
var placeholder = "URL"; //TODO
|
||||
var placeholder = "URL"; //XXX
|
||||
createEditableInput($block, LINK_ID, placeholder, getValue, setValue, rt);
|
||||
};
|
||||
|
||||
var addAvatar = function ($container) {
|
||||
var $block = $('<div>', {id: AVATAR_ID}).appendTo($container);
|
||||
var $span = $('<span>').appendTo($block);
|
||||
if (APP.lm.proxy.avatar) {
|
||||
//var file = APP.lm.proxy.avatar;
|
||||
var $img = $('<media-tag>').appendTo($span);
|
||||
$img.attr('src', '/blob/45/45170bcd64aae1726b0b0e06c4360181a08bad9596640863');
|
||||
$img.attr('data-crypto-key', 'cryptpad:5vs/ciPzSAyHeP6XRwxpFZt/cjkRC+EE2CRw+/xfcVI=');
|
||||
require(['/common/media-tag.js'], function (MediaTag) {
|
||||
var allowedMediaTypes = [
|
||||
'image/png',
|
||||
'image/jpeg',
|
||||
'image/jpg',
|
||||
'image/gif',
|
||||
];
|
||||
MediaTag.CryptoFilter.setAllowedMediaTypes(allowedMediaTypes);
|
||||
MediaTag($img[0]);
|
||||
});
|
||||
}
|
||||
if (APP.readOnly) { return; }
|
||||
var allowedMediaTypes = Cryptpad.avatarAllowedTypes;
|
||||
var displayAvatar = function () {
|
||||
$span.html('');
|
||||
if (!APP.lm.proxy.avatar) {
|
||||
$('<img>', {
|
||||
src: '/customize/images/avatar.png',
|
||||
title: 'Avatar', // XXX
|
||||
alt: 'Avatar'
|
||||
}).appendTo($span);
|
||||
return;
|
||||
}
|
||||
Cryptpad.displayAvatar($span, APP.lm.proxy.avatar);
|
||||
|
||||
//var $button = $('<button>', {'class': 'btn btn-success'}).text('TODO: change avatar');
|
||||
//$block.append($button);
|
||||
if (APP.readOnly) { return; }
|
||||
|
||||
var $delButton = $('<button>', {'class': 'delete btn btn-danger fa fa-times'}); //XXX
|
||||
$span.append($delButton);
|
||||
$delButton.click(function () {
|
||||
console.log('clicked');
|
||||
var oldChanId = Cryptpad.hrefToHexChannelId(APP.lm.proxy.avatar);
|
||||
Cryptpad.unpinPads([oldChanId], function (e) {
|
||||
if (e) { Cryptpad.log(e); }
|
||||
console.log('unpinned');
|
||||
delete APP.lm.proxy.avatar;
|
||||
delete Cryptpad.getProxy().profile.avatar;
|
||||
Cryptpad.whenRealtimeSyncs(APP.lm.realtime, function () {
|
||||
console.log('synced1');
|
||||
var driveRt = Cryptpad.getStore().getProxy().info.realtime;
|
||||
Cryptpad.whenRealtimeSyncs(driveRt, function () {
|
||||
console.log('synced2');
|
||||
displayAvatar();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
displayAvatar();
|
||||
if (APP.readOnly) { return; }
|
||||
|
||||
var fmConfig = {
|
||||
noHandlers: true,
|
||||
noStore: true,
|
||||
body: $('body'),
|
||||
onUploaded: function (ev, data) {
|
||||
console.log(data);
|
||||
var chanId = Cryptpad.hrefToHexChannelId(data.url);
|
||||
var profile = Cryptpad.getProxy().profile;
|
||||
var old = profile.avatar;
|
||||
var todo = function () {
|
||||
Cryptpad.pinPads([chanId], function (e) {
|
||||
if (e) { return void Cryptpad.log(e); }
|
||||
APP.lm.proxy.avatar = data.url;
|
||||
Cryptpad.getProxy().profile.avatar = data.url;
|
||||
Cryptpad.whenRealtimeSyncs(APP.lm.realtime, function () {
|
||||
var driveRt = Cryptpad.getStore().getProxy().info.realtime;
|
||||
Cryptpad.whenRealtimeSyncs(driveRt, function () {
|
||||
displayAvatar();
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
if (old) {
|
||||
var oldChanId = Cryptpad.hrefToHexChannelId(old);
|
||||
Cryptpad.unpinPads([oldChanId], function (e) {
|
||||
if (e) { Cryptpad.log(e); }
|
||||
todo();
|
||||
});
|
||||
return;
|
||||
}
|
||||
todo();
|
||||
}
|
||||
};
|
||||
APP.FM = Cryptpad.createFileManager(fmConfig);
|
||||
var data = {FM: APP.FM};
|
||||
$block.append(Cryptpad.createButton('upload', false, data));
|
||||
var data = {
|
||||
FM: APP.FM,
|
||||
filter: function (file) {
|
||||
var sizeMB = Cryptpad.bytesToMegabytes(file.size);
|
||||
var type = file.type;
|
||||
return sizeMB <= 0.5 && allowedMediaTypes.indexOf(type) !== -1;
|
||||
},
|
||||
accept: ".gif,.jpg,.jpeg,.png"
|
||||
};
|
||||
var $upButton = Cryptpad.createButton('upload', false, data);
|
||||
$upButton.text(" Upload a new avatar");
|
||||
$upButton.prepend($('<span>', {'class': 'fa fa-upload'}));
|
||||
$block.append($upButton);
|
||||
};
|
||||
|
||||
var addDescription = function ($container) {
|
||||
var $block = $('<div>', {id: DESCRIPTION_ID}).appendTo($container);
|
||||
|
||||
if (APP.readOnly) {
|
||||
if (!APP.lm.proxy.description.trim()) { return void $block.hide(); }
|
||||
var $div = $('<div>', {'class': 'rendered'}).appendTo($block);
|
||||
var val = Marked(APP.lm.proxy.description);
|
||||
$div.html(val);
|
||||
|
|
@ -274,13 +328,10 @@ define([
|
|||
|
||||
var addPublicKey = function ($container) {
|
||||
var $block = $('<div>', {id: PUBKEY_ID});
|
||||
var pubKey = Cryptpad.getProxy().edPublic;
|
||||
$block.text(pubKey);
|
||||
$container.append($block);
|
||||
};
|
||||
|
||||
var onReady = function () {
|
||||
// TODO: on reconnect, this is called multiple times...
|
||||
APP.$container.find('#'+CREATE_ID).remove();
|
||||
|
||||
if (!APP.initialized) {
|
||||
|
|
@ -332,13 +383,32 @@ define([
|
|||
var secret = Cryptpad.getSecrets();
|
||||
obj.profile = {};
|
||||
var channel = Cryptpad.createChannelId();
|
||||
obj.profile.edit = Cryptpad.getEditHashFromKeys(channel, secret.keys);
|
||||
obj.profile.view = Cryptpad.getViewHashFromKeys(channel, secret.keys);
|
||||
obj.profile.name = APP.rt.proxy[Cryptpad.displayNameKey] || '';
|
||||
andThen(obj.profile.edit);
|
||||
Cryptpad.pinPads([channel], function (e) {
|
||||
if (e) {
|
||||
if (e === 'E_OVER_LIMIT') {
|
||||
Cryptpad.alert(Messages.pinLimitNotPinned, null, true);
|
||||
}
|
||||
return void Cryptpad.log('Error while creating your profile: ' + e); // XXX
|
||||
}
|
||||
obj.profile.edit = Cryptpad.getEditHashFromKeys(channel, secret.keys);
|
||||
obj.profile.view = Cryptpad.getViewHashFromKeys(channel, secret.keys);
|
||||
obj.profile.name = APP.rt.proxy[Cryptpad.displayNameKey] || '';
|
||||
andThen(obj.profile.edit);
|
||||
});
|
||||
};
|
||||
|
||||
// TODO: if not logged in, display a register button here?
|
||||
if (!Cryptpad.isLoggedIn()) { // XXX
|
||||
var $p = $('<p>').text('TODO: You have to register to create a profile');
|
||||
var $a = $('<a>', {
|
||||
href: '/register/'
|
||||
});
|
||||
$('<button>', {
|
||||
'class': 'btn btn-success',
|
||||
}).text(Messages.login_register).appendTo($a);
|
||||
$p.append($('<br>')).append($a);
|
||||
APP.$container.append($p);
|
||||
return;
|
||||
}
|
||||
var $create = $('<div>', {id: CREATE_ID});
|
||||
var $button = $('<button>', {'class': 'btn btn-success'});
|
||||
$button.text('TODO: create a profile?').click(todo).appendTo($create); // XXX
|
||||
|
|
|
|||
|
|
@ -23,25 +23,43 @@
|
|||
width: 300px;
|
||||
//height: 350px;
|
||||
margin: 10px;
|
||||
margin-right: 20px;
|
||||
text-align: center;
|
||||
&> span {
|
||||
display: inline-block;
|
||||
line-height: 300px;
|
||||
text-align: center;
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
border: 1px solid black;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.delete {
|
||||
right: 0;
|
||||
position: absolute;
|
||||
opacity: 0.7;
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
img {
|
||||
max-width: 300px;
|
||||
max-height: 300px;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
vertical-align: top;
|
||||
}
|
||||
media-tag {
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
img {
|
||||
vertical-align: top;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
max-width: none;
|
||||
max-height: none;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
button {
|
||||
|
|
@ -83,6 +101,7 @@
|
|||
position: relative;
|
||||
font-size: 16px;
|
||||
border: 1px solid #DDD;
|
||||
margin-bottom: 20px;
|
||||
.rendered {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue