|
|
@ -45,34 +45,93 @@ define([
|
|
|
|
var inner = ifrw.$('iframe')[0].contentDocument.body;
|
|
|
|
var inner = ifrw.$('iframe')[0].contentDocument.body;
|
|
|
|
window.inner = inner;
|
|
|
|
window.inner = inner;
|
|
|
|
|
|
|
|
|
|
|
|
var $textarea = $('#feedback');
|
|
|
|
var $textarea = $('#feedback'),
|
|
|
|
|
|
|
|
$problem = $('#problemo');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var debug = function (info) {
|
|
|
|
|
|
|
|
$problem.text(JSON.stringify(info,null,2));
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
var vdom1 = Convert.dom.to.vdom(inner);
|
|
|
|
var vdom1 = Convert.dom.to.vdom(inner);
|
|
|
|
|
|
|
|
|
|
|
|
var applyHjson = function (shjson) {
|
|
|
|
var cursor = {
|
|
|
|
|
|
|
|
startEl: null,
|
|
|
|
|
|
|
|
startOffset: 0,
|
|
|
|
|
|
|
|
endEl: null,
|
|
|
|
|
|
|
|
endOffset: 0
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var getCursor = function () {
|
|
|
|
// where is your cursor?
|
|
|
|
// where is your cursor?
|
|
|
|
// TODO optimize this if it works
|
|
|
|
// TODO optimize this if it works
|
|
|
|
/*
|
|
|
|
|
|
|
|
var sel = editor.getSelection(); // { rev, document, root, isLocked, _ }
|
|
|
|
var sel = editor.getSelection(); // { rev, document, root, isLocked, _ }
|
|
|
|
|
|
|
|
|
|
|
|
var element = sel.getStartElement();
|
|
|
|
var element = sel.getStartElement();
|
|
|
|
var ranges = sel.getRanges(); // [0] // {startContainer, startOffset, endContainer, endOffset, collapsed, document, root}
|
|
|
|
var ranges = sel.getRanges();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!ranges.length) { return; }
|
|
|
|
|
|
|
|
var range = ranges[0]; // {startContainer, startOffset, endContainer, endOffset, collapsed, document, root}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
cursor.startEl = range.startContainer;
|
|
|
|
|
|
|
|
cursor.startOffset = range.startOffset;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
cursor.endEl = range.endContainer;
|
|
|
|
|
|
|
|
cursor.endOffset = range.endOffset;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
debug(cursor);
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
window.rangeElements = {};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var setCursor = function () {
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
|
|
|
var sel = editor.getSelection(); // { rev, document, root, isLocked, _ }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// correct the cursor after doing dom stuff
|
|
|
|
|
|
|
|
// sel.selectElement(element);
|
|
|
|
|
|
|
|
var ranges = sel.getRanges();
|
|
|
|
|
|
|
|
if (!ranges.length) { return; }
|
|
|
|
|
|
|
|
var range = ranges[0]; // {startContainer, startOffset, endContainer, endOffset, collapsed, document, root}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
range.setStart(cursor.startEl, cursor.startOffset);
|
|
|
|
|
|
|
|
range.setEnd(cursor.endEl, cursor.endOffset);
|
|
|
|
|
|
|
|
sel.selectRanges([range]);
|
|
|
|
|
|
|
|
/* FIXME TODO
|
|
|
|
|
|
|
|
This fails because the element that we're operating on
|
|
|
|
|
|
|
|
can stop existing because vdom determines that we should
|
|
|
|
|
|
|
|
get rid of it. if it doesn't exist anymore, we should
|
|
|
|
|
|
|
|
walk up the tree or something. Or just not try to
|
|
|
|
|
|
|
|
relocate the cursor. Default behaviour might be ok.
|
|
|
|
|
|
|
|
DONT FIGHT THE DOM
|
|
|
|
*/
|
|
|
|
*/
|
|
|
|
|
|
|
|
} catch (err) {
|
|
|
|
|
|
|
|
console.log("junk cursor:");
|
|
|
|
|
|
|
|
console.log(cursor);
|
|
|
|
|
|
|
|
debug(cursor);
|
|
|
|
|
|
|
|
console.error(err);
|
|
|
|
|
|
|
|
console.error(err.stack);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var applyHjson = function (shjson) {
|
|
|
|
|
|
|
|
// before integrating external changes, check in your own
|
|
|
|
|
|
|
|
vdom1 = Convert.dom.to.vdom(inner);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// remember where the cursor is
|
|
|
|
|
|
|
|
getCursor()
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// the authoritative document is hyperjson, parse it
|
|
|
|
var authDoc = JSON.parse(shjson);
|
|
|
|
var authDoc = JSON.parse(shjson);
|
|
|
|
|
|
|
|
// use the authdoc to construct a second vdom
|
|
|
|
var vdom2 = Convert.hjson.to.vdom(authDoc);
|
|
|
|
var vdom2 = Convert.hjson.to.vdom(authDoc);
|
|
|
|
|
|
|
|
// diff it against your version
|
|
|
|
var patches = Vdom.diff(vdom1, vdom2);
|
|
|
|
var patches = Vdom.diff(vdom1, vdom2);
|
|
|
|
Vdom.patch(inner, patches);
|
|
|
|
|
|
|
|
// try resyncing the dom?
|
|
|
|
|
|
|
|
vdom1 = Convert.dom.to.vdom(inner);
|
|
|
|
|
|
|
|
// vdom1 = vdom2;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
// apply the resulting patches
|
|
|
|
// correct the cursor after doing dom stuff
|
|
|
|
Vdom.patch(inner, patches);
|
|
|
|
sel.selectElement(element);
|
|
|
|
|
|
|
|
ranges[0].setStart(element.getFirst(), ranges[0].startOffset); //
|
|
|
|
|
|
|
|
ranges[0].setEnd(element.getFirst(), ranges[0].endOffset);
|
|
|
|
|
|
|
|
sel.selectRanges([ranges[0]]);
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// put the cursor back where you left it
|
|
|
|
|
|
|
|
setCursor();
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
window.rti = realtimeInput.start($textarea[0], // synced element
|
|
|
|
window.rti = realtimeInput.start($textarea[0], // synced element
|
|
|
@ -116,6 +175,10 @@ define([
|
|
|
|
*/
|
|
|
|
*/
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$(inner).on('keyup', function () {
|
|
|
|
|
|
|
|
getCursor();
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$textarea.val(JSON.stringify(Convert.dom.to.hjson(inner)));
|
|
|
|
$textarea.val(JSON.stringify(Convert.dom.to.hjson(inner)));
|
|
|
|
|
|
|
|
|
|
|
|
editor.on('change', function () {
|
|
|
|
editor.on('change', function () {
|
|
|
@ -132,6 +195,7 @@ define([
|
|
|
|
|
|
|
|
|
|
|
|
$textarea.val(JSON.stringify(hjson));
|
|
|
|
$textarea.val(JSON.stringify(hjson));
|
|
|
|
rti.bumpSharejs();
|
|
|
|
rti.bumpSharejs();
|
|
|
|
|
|
|
|
getCursor()
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
};
|
|
|
|
};
|
|
|
|