| import { |
| createElementID, |
| } from '../utils/common'; |
| import { |
| extendPrototype, |
| } from '../utils/functionExtensions'; |
| import createNS from '../utils/helpers/svg_elements'; |
| |
| import SVGCompElement from '../elements/svgElements/SVGCompElement'; |
| import SVGRendererBase from './SVGRendererBase'; |
| |
| function SVGRenderer(animationItem, config) { |
| this.animationItem = animationItem; |
| this.layers = null; |
| this.renderedFrame = -1; |
| this.svgElement = createNS('svg'); |
| var ariaLabel = ''; |
| if (config && config.title) { |
| var titleElement = createNS('title'); |
| var titleId = createElementID(); |
| titleElement.setAttribute('id', titleId); |
| titleElement.textContent = config.title; |
| this.svgElement.appendChild(titleElement); |
| ariaLabel += titleId; |
| } |
| if (config && config.description) { |
| var descElement = createNS('desc'); |
| var descId = createElementID(); |
| descElement.setAttribute('id', descId); |
| descElement.textContent = config.description; |
| this.svgElement.appendChild(descElement); |
| ariaLabel += ' ' + descId; |
| } |
| if (ariaLabel) { |
| this.svgElement.setAttribute('aria-labelledby', ariaLabel); |
| } |
| var defs = createNS('defs'); |
| this.svgElement.appendChild(defs); |
| var maskElement = createNS('g'); |
| this.svgElement.appendChild(maskElement); |
| this.layerElement = maskElement; |
| this.renderConfig = { |
| preserveAspectRatio: (config && config.preserveAspectRatio) || 'xMidYMid meet', |
| imagePreserveAspectRatio: (config && config.imagePreserveAspectRatio) || 'xMidYMid slice', |
| contentVisibility: (config && config.contentVisibility) || 'visible', |
| progressiveLoad: (config && config.progressiveLoad) || false, |
| hideOnTransparent: !((config && config.hideOnTransparent === false)), |
| viewBoxOnly: (config && config.viewBoxOnly) || false, |
| viewBoxSize: (config && config.viewBoxSize) || false, |
| className: (config && config.className) || '', |
| id: (config && config.id) || '', |
| focusable: config && config.focusable, |
| filterSize: { |
| width: (config && config.filterSize && config.filterSize.width) || '100%', |
| height: (config && config.filterSize && config.filterSize.height) || '100%', |
| x: (config && config.filterSize && config.filterSize.x) || '0%', |
| y: (config && config.filterSize && config.filterSize.y) || '0%', |
| }, |
| width: (config && config.width), |
| height: (config && config.height), |
| runExpressions: !config || config.runExpressions === undefined || config.runExpressions, |
| }; |
| |
| this.globalData = { |
| _mdf: false, |
| frameNum: -1, |
| defs: defs, |
| renderConfig: this.renderConfig, |
| }; |
| this.elements = []; |
| this.pendingElements = []; |
| this.destroyed = false; |
| this.rendererType = 'svg'; |
| } |
| |
| extendPrototype([SVGRendererBase], SVGRenderer); |
| |
| SVGRenderer.prototype.createComp = function (data) { |
| return new SVGCompElement(data, this.globalData, this); |
| }; |
| |
| export default SVGRenderer; |