import createNS from '../../../utils/helpers/svg_elements'; function SVGProLevelsFilter(filter, filterManager, elem, id) { this.filterManager = filterManager; var effectElements = this.filterManager.effectElements; var feComponentTransfer = createNS('feComponentTransfer'); // Red if (effectElements[10].p.k || effectElements[10].p.v !== 0 || effectElements[11].p.k || effectElements[11].p.v !== 1 || effectElements[12].p.k || effectElements[12].p.v !== 1 || effectElements[13].p.k || effectElements[13].p.v !== 0 || effectElements[14].p.k || effectElements[14].p.v !== 1) { this.feFuncR = this.createFeFunc('feFuncR', feComponentTransfer); } // Green if (effectElements[17].p.k || effectElements[17].p.v !== 0 || effectElements[18].p.k || effectElements[18].p.v !== 1 || effectElements[19].p.k || effectElements[19].p.v !== 1 || effectElements[20].p.k || effectElements[20].p.v !== 0 || effectElements[21].p.k || effectElements[21].p.v !== 1) { this.feFuncG = this.createFeFunc('feFuncG', feComponentTransfer); } // Blue if (effectElements[24].p.k || effectElements[24].p.v !== 0 || effectElements[25].p.k || effectElements[25].p.v !== 1 || effectElements[26].p.k || effectElements[26].p.v !== 1 || effectElements[27].p.k || effectElements[27].p.v !== 0 || effectElements[28].p.k || effectElements[28].p.v !== 1) { this.feFuncB = this.createFeFunc('feFuncB', feComponentTransfer); } // Alpha if (effectElements[31].p.k || effectElements[31].p.v !== 0 || effectElements[32].p.k || effectElements[32].p.v !== 1 || effectElements[33].p.k || effectElements[33].p.v !== 1 || effectElements[34].p.k || effectElements[34].p.v !== 0 || effectElements[35].p.k || effectElements[35].p.v !== 1) { this.feFuncA = this.createFeFunc('feFuncA', feComponentTransfer); } // RGB if (this.feFuncR || this.feFuncG || this.feFuncB || this.feFuncA) { feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB'); filter.appendChild(feComponentTransfer); } if (effectElements[3].p.k || effectElements[3].p.v !== 0 || effectElements[4].p.k || effectElements[4].p.v !== 1 || effectElements[5].p.k || effectElements[5].p.v !== 1 || effectElements[6].p.k || effectElements[6].p.v !== 0 || effectElements[7].p.k || effectElements[7].p.v !== 1) { feComponentTransfer = createNS('feComponentTransfer'); feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB'); feComponentTransfer.setAttribute('result', id); filter.appendChild(feComponentTransfer); this.feFuncRComposed = this.createFeFunc('feFuncR', feComponentTransfer); this.feFuncGComposed = this.createFeFunc('feFuncG', feComponentTransfer); this.feFuncBComposed = this.createFeFunc('feFuncB', feComponentTransfer); } } SVGProLevelsFilter.prototype.createFeFunc = function (type, feComponentTransfer) { var feFunc = createNS(type); feFunc.setAttribute('type', 'table'); feComponentTransfer.appendChild(feFunc); return feFunc; }; SVGProLevelsFilter.prototype.getTableValue = function (inputBlack, inputWhite, gamma, outputBlack, outputWhite) { var cnt = 0; var segments = 256; var perc; var min = Math.min(inputBlack, inputWhite); var max = Math.max(inputBlack, inputWhite); var table = Array.call(null, { length: segments }); var colorValue; var pos = 0; var outputDelta = outputWhite - outputBlack; var inputDelta = inputWhite - inputBlack; while (cnt <= 256) { perc = cnt / 256; if (perc <= min) { colorValue = inputDelta < 0 ? outputWhite : outputBlack; } else if (perc >= max) { colorValue = inputDelta < 0 ? outputBlack : outputWhite; } else { colorValue = (outputBlack + outputDelta * Math.pow((perc - inputBlack) / inputDelta, 1 / gamma)); } table[pos] = colorValue; pos += 1; cnt += 256 / (segments - 1); } return table.join(' '); }; SVGProLevelsFilter.prototype.renderFrame = function (forceRender) { if (forceRender || this.filterManager._mdf) { var val; var effectElements = this.filterManager.effectElements; if (this.feFuncRComposed && (forceRender || effectElements[3].p._mdf || effectElements[4].p._mdf || effectElements[5].p._mdf || effectElements[6].p._mdf || effectElements[7].p._mdf)) { val = this.getTableValue(effectElements[3].p.v, effectElements[4].p.v, effectElements[5].p.v, effectElements[6].p.v, effectElements[7].p.v); this.feFuncRComposed.setAttribute('tableValues', val); this.feFuncGComposed.setAttribute('tableValues', val); this.feFuncBComposed.setAttribute('tableValues', val); } if (this.feFuncR && (forceRender || effectElements[10].p._mdf || effectElements[11].p._mdf || effectElements[12].p._mdf || effectElements[13].p._mdf || effectElements[14].p._mdf)) { val = this.getTableValue(effectElements[10].p.v, effectElements[11].p.v, effectElements[12].p.v, effectElements[13].p.v, effectElements[14].p.v); this.feFuncR.setAttribute('tableValues', val); } if (this.feFuncG && (forceRender || effectElements[17].p._mdf || effectElements[18].p._mdf || effectElements[19].p._mdf || effectElements[20].p._mdf || effectElements[21].p._mdf)) { val = this.getTableValue(effectElements[17].p.v, effectElements[18].p.v, effectElements[19].p.v, effectElements[20].p.v, effectElements[21].p.v); this.feFuncG.setAttribute('tableValues', val); } if (this.feFuncB && (forceRender || effectElements[24].p._mdf || effectElements[25].p._mdf || effectElements[26].p._mdf || effectElements[27].p._mdf || effectElements[28].p._mdf)) { val = this.getTableValue(effectElements[24].p.v, effectElements[25].p.v, effectElements[26].p.v, effectElements[27].p.v, effectElements[28].p.v); this.feFuncB.setAttribute('tableValues', val); } if (this.feFuncA && (forceRender || effectElements[31].p._mdf || effectElements[32].p._mdf || effectElements[33].p._mdf || effectElements[34].p._mdf || effectElements[35].p._mdf)) { val = this.getTableValue(effectElements[31].p.v, effectElements[32].p.v, effectElements[33].p.v, effectElements[34].p.v, effectElements[35].p.v); this.feFuncA.setAttribute('tableValues', val); } } }; export default SVGProLevelsFilter;