Merge pull request #1596 from fmalita/gaussian-blur
Add SVG support for Gaussian Blur effects
diff --git a/player/index.html b/player/index.html
index 51952da..dc7d02c 100644
--- a/player/index.html
+++ b/player/index.html
@@ -102,6 +102,7 @@
<script src="js/elements/svgElements/SVGShapeElement.js"></script>
<script src="js/elements/svgElements/effects/SVGTintEffect.js" data-builds="full,svg,svg_light,html,html_light"></script>
<script src="js/elements/svgElements/effects/SVGFillFilter.js" data-builds="full,svg,svg_light,html,html_light"></script>
+ <script src="js/elements/svgElements/effects/SVGGaussianBlurEffect.js" data-builds="full,svg,svg_light,html,html_light"></script>
<script src="js/elements/svgElements/effects/SVGStrokeEffect.js" data-builds="full,svg,svg_light,html,html_light"></script>
<script src="js/elements/svgElements/effects/SVGTritoneFilter.js" data-builds="full,svg,svg_light,html,html_light"></script>
<script src="js/elements/svgElements/effects/SVGProLevelsFilter.js" data-builds="full,svg,svg_light,html,html_light"></script>
diff --git a/player/js/elements/svgElements/SVGEffects.js b/player/js/elements/svgElements/SVGEffects.js
index 4f4e2f9..b57ed06 100644
--- a/player/js/elements/svgElements/SVGEffects.js
+++ b/player/js/elements/svgElements/SVGEffects.js
@@ -27,6 +27,9 @@
}else if(elem.data.ef[i].ty === 28){
//count += 1;
filterManager = new SVGMatte3Effect(fil, elem.effectsManager.effectElements[i], elem);
+ }else if(elem.data.ef[i].ty === 29){
+ count += 1;
+ filterManager = new SVGGaussianBlurEffect(fil, elem.effectsManager.effectElements[i]);
}
if(filterManager) {
this.filters.push(filterManager);
diff --git a/player/js/elements/svgElements/effects/SVGGaussianBlurEffect.js b/player/js/elements/svgElements/effects/SVGGaussianBlurEffect.js
new file mode 100644
index 0000000..4b28f79
--- /dev/null
+++ b/player/js/elements/svgElements/effects/SVGGaussianBlurEffect.js
@@ -0,0 +1,39 @@
+function SVGGaussianBlurEffect(filter, filterManager){
+ // Outset the filter region by 100% on all sides to accommodate blur expansion.
+ filter.setAttribute('x','-100%');
+ filter.setAttribute('y','-100%');
+ filter.setAttribute('width','300%');
+ filter.setAttribute('height','300%');
+
+ this.filterManager = filterManager;
+ var feGaussianBlur = createNS('feGaussianBlur');
+ filter.appendChild(feGaussianBlur);
+ this.feGaussianBlur = feGaussianBlur;
+}
+
+SVGGaussianBlurEffect.prototype.renderFrame = function(forceRender){
+ if(forceRender || this.filterManager._mdf){
+ // Empirical value, matching AE's blur appearance.
+ var kBlurrinessToSigma = 0.3;
+ var sigma = this.filterManager.effectElements[0].p.v * kBlurrinessToSigma;
+
+ // Dimensions mapping:
+ //
+ // 1 -> horizontal & vertical
+ // 2 -> horizontal only
+ // 3 -> vertical only
+ //
+ var dimensions = this.filterManager.effectElements[1].p.v;
+ var sigmaX = (dimensions == 3) ? 0 : sigma;
+ var sigmaY = (dimensions == 2) ? 0 : sigma;
+
+ this.feGaussianBlur.setAttribute('stdDeviation', sigmaX + " " + sigmaY);
+
+ // Repeat edges mapping:
+ //
+ // 0 -> off -> duplicate
+ // 1 -> on -> wrap
+ var edgeMode = (this.filterManager.effectElements[2].p.v == 1) ? 'wrap' : 'duplicate';
+ this.feGaussianBlur.setAttribute('edgeMode', edgeMode);
+ }
+}
\ No newline at end of file
