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

up to date

Browse Source
pull/1/head
ansuz 9 years ago
parent d2f6c63d8a
commit aa3880f442
2 changed files with 93 additions and 17 deletions
Show Stats Download Patch File Download Diff File

14
www/vdom/index.html
Unescape Escape View File

@ -26,16 +26,28 @@
top: 0px; top: 0px;
right: 0px; right: 0px;
border: 0px; border: 0px;
height: 100vh; height: 50vh;
width: 50vw; width: 50vw;
background-color: #222; background-color: #222;
color: #ccc; color: #ccc;
} }
#problemo {
position: fixed;
top: 50vh;
right: 0px;
height: 50vh;
width: 50vw;
background: #999;
color: #111;
border: none;
overflow-y: auto;
}
</style> </style>
</head> </head>
<body> <body>
<iframe id="pad-iframe" src="inner.html"></iframe> <iframe id="pad-iframe" src="inner.html"></iframe>
<textarea id="feedback"></textarea> <textarea id="feedback"></textarea>
<pre id="problemo"></pre>
</body> </body>
</html> </html>

96
www/vdom/main.js
Unescape Escape View File

@ -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()
}); });
}); });
}; };

Write Preview
Loading…
Cancel
Save