12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182 |
- 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;
|