infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

Snapshot modal UI

Browse Source
pull/1/head
yflory 4 years ago
parent 2003725304
commit 959d016937
6 changed files with 134 additions and 23 deletions
Show Stats Download Patch File Download Diff File

9
customize.dist/src/less2/include/forms.less
Unescape Escape View File

@ -161,6 +161,15 @@
}
}
&.btn-light {
border-color: @cryptpad_text_col;
color: @cryptpad_text_col;
background-color: transparent;
&:hover, &:hover, &:focus {
background-color: fade(@cryptpad_text_col, 25%);
}
}
&.cancel, &.btn-cancel {
border-color: @colortheme_alertify-cancel-border;
color: @colortheme_alertify-cancel-border;

60
customize.dist/src/less2/include/modals-ui-elements.less
Unescape Escape View File

@ -112,6 +112,66 @@
margin-left: 10px;
}
.cp-snapshots-modal {
h6 {
margin-bottom: 0;
}
& > input:last-child {
margin-bottom: 0 !important;
}
}
.cp-snapshots-container {
@snapshot_spacing: 10px;
display: flex;
flex-flow: column;
color: @cryptpad_text_col;
margin-bottom: @snapshot_spacing;
max-height: 245px;
overflow: auto;
.cp-snapshot-element {
display: flex;
align-items: center;
padding: 5px 0;
& > i {
margin-left: @snapshot_spacing;
text-align: center;
}
.cp-snapshot-title {
margin-left: @snapshot_spacing;
display: flex;
flex-flow: column;
flex: 1;
min-width: 0;
span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.cp-snapshot-time {
font-size: 12px;
}
}
.cp-snapshot-buttons {
margin-left: @snapshot_spacing;
display: none;
align-items: flex-start;
margin-bottom: -3px;
.cp-button-confirm {
margin-right: @snapshot_spacing;
}
button {
margin-right: @snapshot_spacing;
}
}
&:hover {
.cp-snapshot-buttons {
display: flex;
}
background-color: #DDD;
}
}
}
// mediatag preview
#cp-mediatag-preview-modal {
.cp-modal {

1
www/common/common-interface.js
Unescape Escape View File

@ -707,6 +707,7 @@ define([
var i = 1;
var todo = function () {
if (i = 10) { return; }
var p = 100 * ((TIMEOUT - (i * INTERVAL)) / TIMEOUT);
if (i++ * INTERVAL >= TIMEOUT) {
done(false);

63
www/common/common-ui-elements.js
Unescape Escape View File

@ -881,7 +881,7 @@ define([
if (typeof(data.load) !== "function" || typeof(data.make) !== "function") {
return;
}
UIElements.openSnapshotsModal(common, data.load, data.make);
UIElements.openSnapshotsModal(common, data.load, data.make, data.remove);
});
break;
default:
@ -3312,12 +3312,14 @@ define([
Messages.snapshots_button = "Snapshots";
Messages.snapshots_new = "New snapshot"; // XXX
Messages.snapshots_placeholder = "Snapshot title"; // XXX
Messages.snapshots_open = "Open";
UIElements.openSnapshotsModal = function (common, load, make) {
Messages.snapshots_open = "View";
Messages.snapshots_delete = "Delete";
UIElements.openSnapshotsModal = function (common, load, make, remove) {
var metadataMgr = common.getMetadataMgr();
var md = metadataMgr.getMetadata();
var snapshots = md.snapshots || {};
var modal;
var readOnly = common.getMetadataMgr().getPrivateData().readOnly;
var list = Object.keys(snapshots).sort(function (h1, h2) {
var s1 = snapshots[h1];
@ -3325,15 +3327,43 @@ define([
return s1.time - s2.time;
}).map(function (hash) {
var s = snapshots[hash];
var button = h('button.btn.btn-secondary', Messages.snapshots_open);
$(button).click(function () {
var openButton = h('button.cp-snapshot-view.btn.btn-light', [
h('i.fa.fa-eye'),
h('span', Messages.snapshots_open)
]);
$(openButton).click(function () {
load(hash, s);
if (modal && modal.closeModal) { modal.closeModal(); }
if (modal && modal.closeModal) {
modal.closeModal();
UIElements.openSnapshotsModal(common, load, make, remove);
}
});
var deleteButton = h('button.cp-snapshot-delete.btn.btn-light', [
h('i.fa.fa-trash'),
h('span', Messages.snapshots_delete)
]);
UI.confirmButton(deleteButton, {
classes: 'btn-danger'
}, function () {
remove(hash, s);
if (modal && modal.closeModal) {
modal.closeModal();
UIElements.openSnapshotsModal(common, load, make, remove);
}
});
return h('span.cp-snapshot-element', [
h('i.fa.fa-camera'),
h('span.cp-snapshot-title', s.title),
button
h('span.cp-snapshot-title', [
h('span', s.title),
h('span.cp-snapshot-time', new Date(s.time).toLocaleString())
]),
h('span.cp-snapshot-buttons', [
readOnly ? undefined : deleteButton,
openButton,
])
]);
});
@ -3341,11 +3371,11 @@ define([
placeholder: Messages.snapshots_placeholder
});
var $input = $(input);
var content = h('div', [
h('h4', Messages.snapshots_button),
var content = h('div.cp-snapshots-modal', [
h('h5', Messages.snapshots_button),
h('div.cp-snapshots-container', list),
h('h5', Messages.snapshots_new),
input
readOnly ? undefined : h('h6', Messages.snapshots_new),
readOnly ? undefined : input
]);
var buttons = [{
@ -3353,9 +3383,11 @@ define([
name: Messages.filePicker_close,
onClick: function () {},
keys: [27],
}, {
}];
if (!readOnly) {
buttons.push({
className: 'primary',
icon: 'fa-camera',
iconClass: '.fa.fa-camera',
name: Messages.snapshots_new,
onClick: function () {
var val = $input.val();
@ -3363,7 +3395,8 @@ define([
make(val);
},
keys: [],
}];
});
}
modal = UI.openCustomModal(UI.dialog.customModal(content, {buttons: buttons }));
setTimeout(function () {

8
www/common/sframe-app-framework.js
Unescape Escape View File

@ -130,6 +130,13 @@ define([
return;
};
var deleteSnapshot = function (hash) {
var md = Util.clone(cpNfInner.metadataMgr.getMetadata());
var snapshots = md.snapshots = md.snapshots || {};
delete snapshots[hash];
cpNfInner.metadataMgr.updateMetadata(md);
onLocal();
};
var makeSnapshot = function (title) {
var sframeChan = common.getSframeChannel();
sframeChan.query("Q_GET_LAST_HASH", null, function (err, obj) {
@ -813,6 +820,7 @@ define([
toolbar.$drawer.append($hist);
var $snapshot = common.createButton('snapshots', true, {
remove: deleteSnapshot,
make: makeSnapshot,
load: loadSnapshot
});

2
www/common/sframe-common-history.js
Unescape Escape View File

@ -615,7 +615,7 @@ define([
keys: [27],
}, {
className: 'primary',
icon: 'fa-camera',
iconClass: '.fa.fa-camera',
name: Messages.snapshots_new,
onClick: function () {
var val = $input.val();

Write Preview
Loading…
Cancel
Save