From f94c06abc0addcf8c1a7861265524aa6af29b341 Mon Sep 17 00:00:00 2001 From: ansuz Date: Mon, 20 Jun 2016 18:39:30 +0200 Subject: [PATCH] drop a bunch of stuff and use diff dom and hyperjson --- www/render/main.js | 49 ++++++++++++---------------------------------- 1 file changed, 12 insertions(+), 37 deletions(-) diff --git a/www/render/main.js b/www/render/main.js index d6b03eea8..360775d17 100644 --- a/www/render/main.js +++ b/www/render/main.js @@ -3,16 +3,14 @@ define([ '/bower_components/chainpad-netflux/chainpad-netflux.js', '/bower_components/chainpad-crypto/crypto.js', '/bower_components/marked/marked.min.js', - '/common/convert.js', - '/common/rainbow.js', + '/bower_components/hyperjson/hyperjson.js', + //'/common/convert.js', '/bower_components/jquery/dist/jquery.min.js', + '/bower_components/diff-dom/diffDOM.js', '/customize/pad.js' -], function (Config, Realtime, Crypto, Marked, Convert, Rainbow) { +], function (Config, Realtime, Crypto, Marked, Hyperjson) { var $ = window.jQuery; - - var Vdom = Convert.core.vdom, - Hyperjson = Convert.core.hyperjson, - Hyperscript = Convert.core.hyperscript; + var DiffDom = window.diffDOM; var key; var channel = ''; @@ -27,20 +25,15 @@ define([ // set markdown rendering options :: strip html to prevent XSS Marked.setOptions({ - sanitize: true + //sanitize: true }); - var module = window.APP = { - Vdom: Vdom, - Hyperjson: Hyperjson, - Hyperscript: Hyperscript - }; + var module = window.APP = { }; var $target = module.$target = $('#target'); var config = { websocketURL: Config.websocketURL, - userName: Crypto.rand64(8), channel: channel, cryptKey: key, crypto: Crypto @@ -51,41 +44,26 @@ define([ inner = $target.find('#inner')[0]; if (!target) { throw new Error(); } + var DD = new DiffDom({}); - var Previous = Convert.dom.to.vdom(inner); return function (md) { var rendered = Marked(md||""); // make a dom - var R = $('
'+rendered+'
')[0]; - var New = Convert.dom.to.vdom(R); - var patches = Vdom.diff(Previous, New); - Vdom.patch(inner, patches); + var New = $('
'+rendered+'
')[0]; + + var patches = (DD).diff(inner, New); + DD.apply(inner, patches); Previous = New; return patches; }; }()); - var colour = module.colour = Rainbow(); - var $inner = $('#inner'); - - window.makeRainbow = false; - var makeRainbows = function () { - $inner - .find('*:not(.untouched)') - .css({ - 'border': '5px solid '+colour(), - margin: '5px' - }) - .addClass('untouched'); - }; - var redrawTimeout; var lazyDraw = function (md) { if (redrawTimeout) { clearTimeout(redrawTimeout); } redrawTimeout = setTimeout(function () { draw(md); - if (window.makeRainbow) { makeRainbows(); } }, 450); }; @@ -98,12 +76,9 @@ define([ // when your editor is ready var onReady = config.onReady = function (info) { - //if (info.userList) { console.log("Userlist: [%s]", info.userList.join(',')); } console.log("Realtime is ready!"); - var userDoc = module.realtime.getUserDoc(); lazyDraw(userDoc); - initializing = false; };