diff --git a/src/ui/View.js b/src/ui/View.js index 48035c8b..29c9c573 100644 --- a/src/ui/View.js +++ b/src/ui/View.js @@ -35,36 +35,19 @@ var View = this.View = Base.extend(/** @lends View# */{ this._index = this._scope.views.push(this) - 1; // Handle canvas argument var size; - -/*#*/ if (options.server) { - if (canvas && canvas instanceof Canvas) { - this._canvas = canvas; - size = Size.create(canvas.width, canvas.height); - } else { - // 2nd argument onwards could be view size, otherwise use default: - size = Size.read(arguments, 1); - if (size.isZero()) - size = new Size(1024, 768); - this._canvas = CanvasProvider.getCanvas(size); - } - - // Generate an id for this view / canvas if it does not have one - this._id = this._canvas.id; - if (this._id == null) - this._canvas.id = this._id = 'canvas-' + View._id++; -/*#*/ } // options.server - -/*#*/ if (options.browser) { - if (canvas && canvas instanceof HTMLCanvasElement) { + if (typeof canvas === 'string') + canvas = document.getElementById(canvas); + if (canvas instanceof HTMLCanvasElement) { this._canvas = canvas; // If the canvas has the resize attribute, resize the it to fill the // window and resize it again whenever the user resizes the window. if (PaperScript.hasAttribute(canvas, 'resize')) { // Subtract canvas' viewport offset from the total size, to // stretch it in - var offset = DomElement.getOffset(canvas, false, true), + var offset = DomElement.getOffset(canvas, true), that = this; - size = DomElement.getViewportSize(canvas).subtract(offset); + size = DomElement.getViewportBounds(canvas) + .getSize().subtract(offset); canvas.width = size.width; canvas.height = size.height; DomEvent.add(window, { @@ -72,11 +55,11 @@ var View = this.View = Base.extend(/** @lends View# */{ // Only update canvas offset if it's not invisible, as // otherwise the offset would be wrong. if (!DomElement.isInvisible(canvas)) - offset = DomElement.getOffset(canvas, false, true); + offset = DomElement.getOffset(canvas, true); // Set the size now, which internally calls onResize // and redraws the view - that.setViewSize(DomElement.getViewportSize(canvas) - .subtract(offset)); + that.setViewSize(DomElement.getViewportBounds(canvas) + .getSize().subtract(offset)); } }); } else { @@ -108,8 +91,6 @@ var View = this.View = Base.extend(/** @lends View# */{ this._id = this._canvas.getAttribute('id'); if (this._id == null) this._canvas.setAttribute('id', this._id = 'canvas-' + View._id++); -/*#*/ } // options.browser - // Link this id to our view View._views[this._id] = this; this._viewSize = LinkedSize.create(this, 'setViewSize', @@ -117,15 +98,11 @@ var View = this.View = Base.extend(/** @lends View# */{ this._context = this._canvas.getContext('2d'); this._matrix = new Matrix(); this._zoom = 1; - -/*#*/ if (options.browser) { this._events = this._createEvents(); DomEvent.add(this._canvas, this._events); // Make sure the first view is focused for keyboard input straight away if (!View._focused) View._focused = this; -/*#*/ } // options.browser - // As soon as a new view is added we need to mark the redraw as not // motified, so the next call loops through all the views again. this._scope._redrawNotified = false; @@ -364,7 +341,6 @@ var View = this.View = Base.extend(/** @lends View# */{ delete this._onFrameCallback; return; } -/*#*/ if (options.browser) { var that = this, requested = false, before, @@ -398,83 +374,8 @@ var View = this.View = Base.extend(/** @lends View# */{ // of onFrame calls. if (!requested) this._onFrameCallback(); -/*#*/ } // options.browser }, - // TODO: support exporting of jpg - exportFrames: function(param) { -/*#*/ if (options.server) { - param = Base.merge({ - fps: 30, - prefix: 'frame-', - amount: 1 - }, param); - if (!param.directory) - throw new Error('Missing param.directory'); - - var view = this, - count = 0, - fs = require('fs'), - frameDuration = 1 / param.fps, - lastTime = startTime = Date.now(); - - // Start exporting frames by exporting the first frame: - exportFrame(param); - - // Utility function that converts a number to a string with - // x amount of padded 0 digits: - function toPaddedString(number, length) { - var str = number.toString(10); - for (var i = 0, l = length - str.length; i < l; i++) { - str = '0' + str; - } - return str; - } - - function exportFrame(param) { - count++; - if (view.onFrame) { - var then = new Date(); - view.onFrame({ - delta: frameDuration, - time: frameDuration * count, - count: count - }); - console.log(new Date() - then, ' onFrame'); - } - view.draw(); - var filename = param.prefix + toPaddedString(count, 6) + '.png', - uri = param.directory + '/' + filename, - out = fs.createWriteStream(uri), - stream = view._canvas.createPNGStream(); - // Pipe the png stream to the write stream: - stream.pipe(out); - // When the file has been closed, export the next fame: - out.on('close', function() { - var now = Date.now(); - if (param.onProgress) { - param.onProgress({ - count: count, - amount: param.amount, - percentage: Math.round(count / param.amount * 10000) / 100, - time: now - startTime, - delta: now - lastTime - }); - } - lastTime = now; - if (count < param.amount) { - exportFrame(param); - } else { - // Call onComplete handler when finished: - if (param.onComplete) { - param.onComplete(); - } - } - }); - } -/*#*/ } // options.server - }, - /** * Handler function that is called whenever a view is resized. * @@ -493,13 +394,7 @@ var View = this.View = Base.extend(/** @lends View# */{ * @type Function */ onResize: null -}, { - statics: { - _views: {}, - _id: 0 - } }, new function() { // Injection scope for mouse handlers -/*#*/ if (options.browser) { var tool, timer, curPoint, @@ -626,6 +521,8 @@ var View = this.View = Base.extend(/** @lends View# */{ }, statics: { + _views: {}, + _id: 0, /** * Loops through all scopes and their views and sets the focus on @@ -634,5 +531,4 @@ var View = this.View = Base.extend(/** @lends View# */{ updateFocus: updateFocus } }; -/*#*/ } // options.browser });