diff --git a/res/app/components/stf/screen/imagepool.js b/res/app/components/stf/screen/imagepool.js new file mode 100644 index 00000000..793ca5dc --- /dev/null +++ b/res/app/components/stf/screen/imagepool.js @@ -0,0 +1,23 @@ +function ImagePool(size) { + this.size = size + this.images = [] + this.counter = 0 +} + +ImagePool.prototype.next = function() { + if (this.images.length < this.size) { + var image = new Image() + this.images.push(image) + return image + } + else { + if (this.counter >= this.size) { + // Reset for unlikely but theoretically possible overflow. + this.counter = 0 + } + + return this.images[this.counter++ % this.size] + } +} + +module.exports = ImagePool diff --git a/res/app/components/stf/screen/screen-directive.js b/res/app/components/stf/screen/screen-directive.js index e475fa44..a2f5d676 100644 --- a/res/app/components/stf/screen/screen-directive.js +++ b/res/app/components/stf/screen/screen-directive.js @@ -1,5 +1,6 @@ var _ = require('lodash') var rotator = require('./rotator') +var ImagePool = require('./imagepool') module.exports = function DeviceScreenDirective( $document @@ -208,6 +209,7 @@ module.exports = function DeviceScreenDirective( , cachedImageHeight = 0 , cssRotation = 0 , alwaysUpright = false + , imagePool = new ImagePool(6) function applyQuirks(banner) { element[0].classList.toggle( @@ -288,7 +290,7 @@ module.exports = function DeviceScreenDirective( type: 'image/jpeg' }) - var img = new Image() + var img = imagePool.next() img.onload = function() { updateImageArea(this)