From 5dcd1374044f0758cf475a62f30b80f32e3473e0 Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Wed, 5 Nov 2014 16:22:36 -0800 Subject: [PATCH] Allow the surface element to be passed in Also expose the tag name that is expected. This specifically allows React to render the top DOM node as part of it's batching. --- modes/canvas/surface.js | 6 ++++-- modes/svg/surface.js | 10 +++++++--- modes/vml/surface.js | 10 +++++++--- 3 files changed, 18 insertions(+), 8 deletions(-) diff --git a/modes/canvas/surface.js b/modes/canvas/surface.js index 17bb5ac..0664c57 100644 --- a/modes/canvas/surface.js +++ b/modes/canvas/surface.js @@ -20,8 +20,8 @@ var previousHit = null, previousHitSurface = null; var CanvasSurface = Class(Element, Container, { - initialize: function(width, height){ - var element = this.element = document.createElement('canvas'); + initialize: function(width, height, existingElement){ + var element = this.element = existingElement || document.createElement('canvas'); var context = this.context = element.getContext('2d'); this._valid = true; if (width != null && height != null) this.resize(width, height); @@ -137,4 +137,6 @@ var CanvasSurface = Class(Element, Container, { }); +CanvasSurface.tagName = 'canvas'; + module.exports = CanvasSurface; \ No newline at end of file diff --git a/modes/svg/surface.js b/modes/svg/surface.js index 9f8897d..1f8fc81 100644 --- a/modes/svg/surface.js +++ b/modes/svg/surface.js @@ -3,10 +3,10 @@ var Container = require('../../dom/container'); var Element = require('../../dom/native'); var DOM = require('./dom'); -module.exports = Class(Element, Container, { +var SVGSurface = Class(Element, Container, { - initialize: function SVGSurface(width, height){ - var element = this.element = DOM.createElement('svg'); + initialize: function SVGSurface(width, height, existingElement){ + var element = this.element = existingElement || DOM.createElement('svg'); element.setAttribute('xmlns', DOM.NS); element.setAttribute('version', 1.1); var defs = this.defs = DOM.createElement('defs'); @@ -24,3 +24,7 @@ module.exports = Class(Element, Container, { } }); + +SVGSurface.tagName = 'svg'; + +module.exports = SVGSurface; \ No newline at end of file diff --git a/modes/vml/surface.js b/modes/vml/surface.js index f8828d8..5df4055 100644 --- a/modes/vml/surface.js +++ b/modes/vml/surface.js @@ -5,10 +5,10 @@ var DOM = require('./dom'); var precision = 100; -module.exports = Class(Element, Container, { +var VMLSurface = Class(Element, Container, { - initialize: function VMLSurface(width, height){ - this.element = document.createElement('vml'); + initialize: function VMLSurface(width, height, existingElement){ + this.element = existingElement || document.createElement('vml'); this.containerElement = DOM.createElement('group'); this.element.appendChild(this.containerElement); if (width != null && height != null) this.resize(width, height); @@ -35,3 +35,7 @@ module.exports = Class(Element, Container, { } }); + +VMLSurface.tagName = 'vml'; + +module.exports = VMLSurface; \ No newline at end of file