Use less2 in secure iframes

This commit is contained in:
yflory
2017-09-04 15:09:54 +02:00
parent f12f4bb925
commit 86e23ac19f
52 changed files with 1677 additions and 1574 deletions

View File

@@ -0,0 +1,55 @@
@import (once) '../../customize/src/less2/include/colortheme.less';
@import (once) '../../customize/src/less2/include/modal.less';
@import (once) '../../customize/src/less2/include/icon-colors.less';
@import (once) '../../customize/src/less2/include/fileupload.less';
.iconColors_main();
.fileupload_main();
#cp-filepicker-dialog {
display: none;
.cp-modal {
.cp-filepicker-content {
display: flex;
flex-wrap: wrap;
justify-content: center;
overflow-y: auto;
}
.cp-filepicker-content-element {
@darker: darken(@colortheme_modal-fg, 30%);
width: 200px;
min-width: 200px;
height: 1em;
padding: 0.5em;
margin: 5px;
box-sizing: content-box;
text-align: left;
line-height: 1em;
cursor: pointer;
background-color: #111;
color: @darker;
transition: all 0.1s;
&:hover {
color: @colortheme_modal-fg;
}
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
align-items: center;
.fa {
cursor: pointer;
margin-right: 0.5em;
}
}
}
}

View File

@@ -19,7 +19,7 @@
}
</style>
</head>
<body style="background: transparent;">
<body class="cp-app-filepicker" style="background: transparent;">
</body>
</html>

View File

@@ -9,9 +9,7 @@ define([
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
'less!/customize/src/less/cryptpad.less',
'less!/customize/src/less/toolbar.less',
'less!/common/file-dialog.less',
'less!/customize/src/less2/main.less',
], function (
$,
Crypto,
@@ -46,6 +44,7 @@ define([
});
};
// File uploader
var fmConfig = {
body: $('body'),
noHandlers: true,
@@ -54,17 +53,75 @@ define([
}
};
APP.FM = common.createFileManager(fmConfig);
var cfg = {
$body: $body,
common: common,
onSelect: function (url) {
onFilePicked({url: url});
},
data: {
FM: APP.FM
}
// Create file picker
var onSelect = function (url) {
onFilePicked({url: url});
};
common.createFileDialog(cfg);
var data = {
FM: APP.FM
};
var createFileDialog = function (cfg) {
var sframeChan = common.getSframeChannel();
var updateContainer;
var hideFileDialog = function () {
sframeChan.event('EV_FILE_PICKER_CLOSE');
};
// Create modal
var $blockContainer = Cryptpad.createModal({
id: 'cp-filepicker-dialog',
$body: $body,
onClose: hideFileDialog
}).show();
// Set the fixed content
var $block = $blockContainer.find('.cp-modal');
var $description = $('<p>').text(Messages.filePicker_description);
$block.append($description);
var $filter = $('<p>', {'class': 'cp-modal-form'}).appendTo($block);
var to;
$('<input>', {
type: 'text',
'class': 'cp-filepicker-filter',
'placeholder': Messages.filePicker_filter
}).appendTo($filter).on('keypress', function () {
if (to) { window.clearTimeout(to); }
to = window.setTimeout(updateContainer, 300);
});
$filter.append(common.createButton('upload', false, data, function () {
hideFileDialog();
}));
var $container = $('<span>', {'class': 'cp-filepicker-content'}).appendTo($block);
// Update the files list when needed
updateContainer = function () {
$container.html('');
var filter = $filter.find('.cp-filepicker-filter').val().trim();
var todo = function (err, list) {
if (err) { return void console.error(err); }
Object.keys(list).forEach(function (id) {
var data = list[id];
var name = data.title || '?';
if (filter && name.toLowerCase().indexOf(filter.toLowerCase()) === -1) {
return;
}
var $span = $('<span>', {
'class': 'cp-filepicker-content-element',
'title': name,
}).appendTo($container);
$span.append(Cryptpad.getFileIcon(data));
$span.append(name);
$span.click(function () {
if (typeof onSelect === "function") { onSelect(data.href); }
hideFileDialog();
});
});
};
common.getFilesList(todo);
};
updateContainer();
sframeChan.on('EV_FILE_PICKER_REFRESH', updateContainer);
};
createFileDialog();
Cryptpad.removeLoadingScreen();
};