109 lines
6.1 KiB
Plaintext
109 lines
6.1 KiB
Plaintext
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;
|