mirror of
https://github.com/cryptpad/cryptpad.git
synced 2026-09-14 11:05:41 +05:00
timeline UI - wip
This commit is contained in:
parent
17c5db220e
commit
6e15d4fdcb
@ -168,7 +168,7 @@
|
||||
.cp-history-timeline-container {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
background-color: @history_lineBg;
|
||||
background-color: @history_userBg2;
|
||||
height: 39px;
|
||||
.cp-oohistory-bar-el {
|
||||
background-color: @history_userBg2;
|
||||
@ -262,8 +262,22 @@
|
||||
}
|
||||
}
|
||||
|
||||
.cp-history-oo-timeline-pos {
|
||||
width: 2px;
|
||||
border: 2px solid @cryptpad_text_col;
|
||||
height: 37px;
|
||||
//background: @pos-color;
|
||||
// position: absolute;
|
||||
&:before {
|
||||
top: -17px;
|
||||
font-size: 24px;
|
||||
position: absolute;
|
||||
// left: ~"calc(50% - 6px)";
|
||||
}
|
||||
}
|
||||
|
||||
.cp-history-timeline-pos {
|
||||
//width: 2px;
|
||||
width: 2px;
|
||||
border: 2px solid @cryptpad_text_col;
|
||||
height: 37px;
|
||||
//background: @pos-color;
|
||||
|
||||
@ -80,6 +80,7 @@ define([
|
||||
lastKnownHash: fromHash,
|
||||
toHash: toHash,
|
||||
}, function (err, data) {
|
||||
|
||||
if (err) { return void console.error(err); }
|
||||
if (!Array.isArray(data.messages)) { return void console.error('Not an array!'); }
|
||||
|
||||
@ -87,6 +88,7 @@ define([
|
||||
var messages = (data.messages || []).slice(initialCp || config.docType() === 'spreadsheet' ? 0 : 1);
|
||||
if (config.debug) { console.log(data.messages); }
|
||||
id = typeof(id) !== "undefined" ? id : getId();
|
||||
|
||||
fillOO(messages);
|
||||
loading = false;
|
||||
|
||||
@ -191,33 +193,47 @@ define([
|
||||
snapshots
|
||||
]);
|
||||
|
||||
if (!ooMessages[id]) { return; }
|
||||
if (!ooMessages[id] && !initial) { return; }
|
||||
var msgs = ooMessages[id];
|
||||
var p;
|
||||
var messageIndex = forward ? msgIndex+1 : msgIndex;
|
||||
|
||||
if (!Object.keys(hashes).length) {
|
||||
p = 100-100*((messageIndex ) / (-msgs.length));
|
||||
for (var i = 1; i < msgs.length; i++) {
|
||||
var patchWidth;
|
||||
var patchDiv;
|
||||
for (var i = 0; i < msgs.length; i++) {
|
||||
var msg = msgs[i]
|
||||
var patchWidth = (1/msgs.length)*100
|
||||
var patchDiv = h('div.cp-history-patch', {
|
||||
patchWidth = (1/msgs.length)*100
|
||||
patchDiv = h('div.cp-history-patch', {
|
||||
style: 'width:'+patchWidth+'%; height: 100%',
|
||||
title: new Date(msg.time).toLocaleString(),
|
||||
data: [id, msgs.indexOf(msg)]
|
||||
})
|
||||
console.log("PATCH",msgs.indexOf(patch), i, msgs.length-1)
|
||||
if (msgs[msgs.indexOf(patch)-1] === msg && !initial && patch && msgs[msgs.indexOf(patch)-1]) {
|
||||
$(patchDiv).addClass('cp-history-oo-timeline-pos')
|
||||
} else if (msgs.indexOf(patch) === -1 && i === msgs.length-1) {
|
||||
$(patchDiv).addClass('cp-history-oo-timeline-pos')
|
||||
}
|
||||
snapshotsEl.push(patchDiv);
|
||||
}
|
||||
|
||||
var emptyPatchDiv = h('div.cp-history-patch', {
|
||||
style: 'width:'+patchWidth+'%; height: 100%',
|
||||
title: new Date().toLocaleString(),
|
||||
data: [0, 0]
|
||||
})
|
||||
if (msgs[0] === patch) {
|
||||
$(emptyPatchDiv).addClass('cp-history-oo-timeline-pos')
|
||||
}
|
||||
snapshotsEl.unshift(emptyPatchDiv);
|
||||
} else {
|
||||
console.log("hashes,", hashes, id, ooMessages[id], hashes, Object.keys(hashes)[Object.keys(hashes).length-2])
|
||||
console.log("hashes,", hashes, id, ooMessages[id], hashes, Object.keys(hashes)[Object.keys(hashes).length-2])
|
||||
|
||||
if (id === parseInt(Object.keys(hashes)[Object.keys(hashes).length-2])) {
|
||||
p = 100-100*((messageIndex ) / (-msgs.length));
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
} else {
|
||||
spanWidth = (nextCp/(nextCp+currentCp))*100
|
||||
@ -240,7 +256,7 @@ define([
|
||||
// p = 100*(segments);
|
||||
|
||||
// if (id === 0) { p = 0; }
|
||||
|
||||
|
||||
// var percentage = ((position/msgs.length)*100);
|
||||
// var timelinePosition = (percentage/100)*(100/hashLength);
|
||||
// p += timelinePosition;
|
||||
@ -264,23 +280,29 @@ define([
|
||||
else { $time.text(''); }
|
||||
update();
|
||||
|
||||
$('.cp-history-patch').on('click', function(e) {
|
||||
var patchData = $(e.target).attr('data').split(',')
|
||||
msgs = ooMessages[id]
|
||||
if (parseInt(patchData[0]) === -1) {
|
||||
var q = msgs.slice(0, patchData[1])
|
||||
config.onPatchBack({}, q)
|
||||
} else {
|
||||
config.onPatchBack(hashes[patchData[0]], msgs[patchData[1]])
|
||||
}
|
||||
|
||||
})
|
||||
$('.cp-history-patch').on('click', function(e) {
|
||||
var patchData = $(e.target).attr('data').split(',')
|
||||
var cpNo = parseInt(patchData[0])
|
||||
var patchNo = parseInt(patchData[1])
|
||||
msgs = ooMessages[id]
|
||||
if (cpNo === -1) {
|
||||
var q = msgs.slice(0, patchNo+1)
|
||||
config.onPatchBack({}, q)
|
||||
patch = msgs[patchNo+1]
|
||||
} else if (cpNo === 0 && patchNo === 0) {
|
||||
config.onPatchBack({})
|
||||
patch = msgs[0]
|
||||
} else {
|
||||
config.onPatchBack(hashes[patchData[0]], msgs[patchData[1]])
|
||||
patch = msgs[patchData[1]]
|
||||
}
|
||||
position = msgs.indexOf(patch)+2
|
||||
showVersion(false, position)
|
||||
})
|
||||
|
||||
loadingFalse();
|
||||
};
|
||||
|
||||
|
||||
|
||||
var loadingFalse = function () {
|
||||
setTimeout(function () {
|
||||
$('iframe').blur();
|
||||
@ -637,10 +659,13 @@ define([
|
||||
|
||||
display();
|
||||
|
||||
showVersion(true);
|
||||
|
||||
setTimeout(() => {
|
||||
showVersion(true);;
|
||||
}, "1000");
|
||||
|
||||
|
||||
|
||||
|
||||
//return void loadMoreOOHistory();
|
||||
};
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user