| function CVImageElement(data, globalData, comp){ |
| this.failed = false; |
| this.img = new Image(); |
| this.img.crossOrigin = 'anonymous'; |
| this.assetData = globalData.getAssetData(data.refId); |
| this.initElement(data,globalData,comp); |
| this.globalData.addPendingElement(); |
| } |
| extendPrototype([BaseElement, TransformElement, CVBaseElement, HierarchyElement, FrameElement, RenderableElement], CVImageElement); |
| |
| CVImageElement.prototype.initElement = SVGShapeElement.prototype.initElement; |
| CVImageElement.prototype.prepareFrame = IImageElement.prototype.prepareFrame; |
| |
| CVImageElement.prototype.imageLoaded = function() { |
| this.globalData.elementLoaded(); |
| if(this.assetData.w !== this.img.width || this.assetData.h !== this.img.height){ |
| var canvas = createTag('canvas'); |
| canvas.width = this.assetData.w; |
| canvas.height = this.assetData.h; |
| var ctx = canvas.getContext('2d'); |
| |
| var imgW = this.img.width; |
| var imgH = this.img.height; |
| var imgRel = imgW / imgH; |
| var canvasRel = this.assetData.w/this.assetData.h; |
| var widthCrop, heightCrop; |
| if(imgRel>canvasRel){ |
| heightCrop = imgH; |
| widthCrop = heightCrop*canvasRel; |
| } else { |
| widthCrop = imgW; |
| heightCrop = widthCrop/canvasRel; |
| } |
| ctx.drawImage(this.img,(imgW-widthCrop)/2,(imgH-heightCrop)/2,widthCrop,heightCrop,0,0,this.assetData.w,this.assetData.h); |
| this.img = canvas; |
| } |
| }; |
| |
| CVImageElement.prototype.imageFailed = function() { |
| this.failed = true; |
| this.globalData.elementLoaded(); |
| }; |
| |
| CVImageElement.prototype.createContent = function(){ |
| var img = this.img; |
| img.addEventListener('load', this.imageLoaded.bind(this), false); |
| img.addEventListener('error', this.imageFailed.bind(this), false); |
| var assetPath = this.globalData.getAssetsPath(this.assetData); |
| img.src = assetPath; |
| |
| }; |
| |
| CVImageElement.prototype.renderInnerContent = function(parentMatrix){ |
| if (this.failed) { |
| return; |
| } |
| this.canvasContext.drawImage(this.img, 0, 0); |
| }; |
| |
| CVImageElement.prototype.destroy = function(){ |
| this.img = null; |
| }; |