diff --git a/core/Scene.js b/core/Scene.js index f8f97285..041975a3 100644 --- a/core/Scene.js +++ b/core/Scene.js @@ -71,7 +71,6 @@ function Scene (selector, updater) { .message(selector); // the scene graph has a total size this.show(); // the context begins shown (it's already present in the dom) - } // Scene inherits from node @@ -122,7 +121,6 @@ Scene.prototype.onReceive = function onReceive (event, payload) { // and the context would receive its size the same way that any render size // component receives its size. if (event === 'CONTEXT_RESIZE') { - if (payload.length < 2) throw new Error( 'CONTEXT_RESIZE\'s payload needs to be at least a pair' + @@ -134,8 +132,8 @@ Scene.prototype.onReceive = function onReceive (event, payload) { payload[1], payload[2] ? payload[2] : 0); + this._updater.message('WITH').message(this._selector).message('READY'); } }; module.exports = Scene; - diff --git a/dom-renderers/DOMRenderer.js b/dom-renderers/DOMRenderer.js index af0bda2b..9e0823cd 100644 --- a/dom-renderers/DOMRenderer.js +++ b/dom-renderers/DOMRenderer.js @@ -84,8 +84,6 @@ function DOMRenderer (element, selector, compositor) { this.perspectiveTransform = new Float32Array([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]); this._VPtransform = new Float32Array([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]); - - this._size = [null, null]; } @@ -197,24 +195,6 @@ function _getPath(ev) { return path; } - -/** - * Determines the size of the context by querying the DOM for `offsetWidth` and - * `offsetHeight`. - * - * @method - * - * @return {Array} Offset size. - */ -DOMRenderer.prototype.getSize = function getSize() { - this._size[0] = this._root.element.offsetWidth; - this._size[1] = this._root.element.offsetHeight; - return this._size; -}; - -DOMRenderer.prototype._getSize = DOMRenderer.prototype.getSize; - - /** * Executes the retrieved draw commands. Draw commands only refer to the * cross-browser normalized `transform` property. diff --git a/renderers/Context.js b/renderers/Context.js index 1000099b..af4a861c 100644 --- a/renderers/Context.js +++ b/renderers/Context.js @@ -58,12 +58,12 @@ function Context(selector, compositor) { // Create DOM element to be used as root for all famous DOM // rendering and append element to the root element. - var DOMLayerEl = document.createElement('div'); - this._rootEl.appendChild(DOMLayerEl); + this._domLayerEl = document.createElement('div'); + this._rootEl.appendChild(this._domLayerEl); // Instantiate renderers - this.DOMRenderer = new DOMRenderer(DOMLayerEl, selector, compositor); + this.DOMRenderer = new DOMRenderer(this._domLayerEl, selector, compositor); this.WebGLRenderer = null; this.canvas = null; @@ -83,6 +83,8 @@ function Context(selector, compositor) { this._meshTransform = []; this._meshSize = [0, 0, 0]; + + this._initDOM = false; } /** @@ -92,7 +94,7 @@ function Context(selector, compositor) { * @return {Context} this */ Context.prototype.updateSize = function () { - var newSize = this.DOMRenderer.getSize(); + var newSize = this.getRootSize(); this._compositor.sendResize(this._selector, newSize); var width = newSize[0]; @@ -129,14 +131,17 @@ Context.prototype.draw = function draw() { }; /** - * Gets the size of the parent element of the DOMRenderer for this context. + * Determines the root element's offset size. * * @method * * @return {undefined} undefined */ Context.prototype.getRootSize = function getRootSize() { - return this.DOMRenderer.getSize(); + return [ + this._rootEl.offsetWidth, + this._rootEl.offsetHeight, + ]; }; /** @@ -169,6 +174,11 @@ Context.prototype.initWebGL = function initWebGL() { * @return {Number} iterator indicating progress through the command queue. */ Context.prototype.receive = function receive(path, commands, iterator) { + if (this._initDOM) { + this._rootEl.style.display = 'block'; + this._initDOM = false; + } + var localIterator = iterator; var command = commands[++localIterator]; @@ -365,7 +375,12 @@ Context.prototype.receive = function receive(path, commands, iterator) { this._renderState.viewDirty = true; break; - case 'WITH': return localIterator - 1; + case 'READY': + this._initDOM = true; + break; + + case 'WITH': + return localIterator - 1; } command = commands[++localIterator];