sanitize markdown before rendering to prevent XSS

draw rainbox borders on element redraws in vdom method.
This lets us see what being redrawn, as the vdom.diff method
is breaking a few things.
pull/1/head
ansuz 9 years ago
parent 13f5371199
commit 2e3b424a1a

@ -22,6 +22,10 @@ define([
var $textarea = $('textarea'),
$target = $('#target');
Marked.setOptions({
sanitize: true
});
var draw = function (content) {
// draw stuff
$target.html(Marked(content));

@ -13,6 +13,10 @@ define([
var Vdom = Convert.core.vdom,
Hyperjson = Convert.core.hyperjson,
Hyperscript = Convert.core.hyperscript;
window.Vdom = Vdom;
window.Hyperjson = Hyperjson;
window.Hyperscript = Hyperscript;
$(window).on('hashchange', function() {
window.location.reload();
@ -27,11 +31,16 @@ define([
var $textarea = $('textarea'),
$target = $('#target');
/*
var draw = function (content) {
// draw stuff
$target.html(Marked(content));
}; */
var stripScripts = function (md) {
return md.replace(/<[\s\S]*?script[\s\S]*?>[\s\S]*?<\/script[\s\S]*?>/ig, "");
};
window.$textarea = $textarea;
// set markdwon rendering options
Marked.setOptions({
sanitize: true
});
window.draw = (function () {
var target = $target[0],
@ -41,23 +50,69 @@ define([
var Previous = Convert.dom.to.vdom(inner);
return function (md) {
var rendered = Marked(md);
// strip scripts or people get xss
var rendered = stripScripts(Marked(md||""));
// make a dom
var R = $('<div id="inner">'+rendered+'</div>')[0];
var New = Convert.dom.to.vdom(R);
var patches = Vdom.diff(Previous, New);
Vdom.patch(inner, patches);
Previous = New;
return patches;
};
}());
window.colour = (function () {
var r = 0.6,
n = 24,
i = 0,
t = [],
rgb = [0,2,4];
while(i<n)t.push(i++);
var colours = t.map(function (c, I) {
return '#'+ rgb.map(function (j) {
var x = ((Math.sin(r*(I+22)+j)*127+128) *0x01<<0)
.toString(16);
return x.length<2?"0"+x:x;
}).join("");
});
var J = 0;
return function () {
var j = J++;
if (colours[j]) {
return colours[j];
}
J = 0;
return colours[0];
};
}());
var redrawTimeout;
var $inner = $('#inner');
window.makeRainbow = false
var makeRainbows = function () {
$inner
.find('*:not(.untouched)')
.css({
'border': '5px solid '+colour(),
margin: '5px'
})
.addClass('untouched');
};
var lazyDraw = function (md) {
redrawTimeout && clearTimeout(redrawTimeout);
redrawTimeout = setTimeout(function () {
draw(md);
makeRainbox && makeRainbows();
}, 450);
};
var rts = $textarea.toArray().map(function (e, i) {
var rt = Realtime.start(e, // window
Config.websocketURL, // websocketUrl
@ -66,10 +121,7 @@ define([
key.cryptKey,
null,
function (){
redrawTimeout && clearTimeout(redrawTimeout);
setTimeout(function () {
draw($textarea.val());
}, 500);
lazyDraw($textarea.val());
}); // cryptKey
return rt;
})[0];
@ -78,7 +130,9 @@ define([
window.rts = rts;
$textarea.on('change keyup keydown', function () {
//console.log("pewpew");
draw($textarea.val());
redrawTimeout && clearTimeout(redrawTimeout);
redrawTimeout = setTimeout(function () {
lazyDraw($textarea.val());
}, 500);
});
});

Loading…
Cancel
Save