// Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved. // // Licensed under the Apache License, Version 2.0 (the "License"); // you may not use this file except in compliance with the License. // You may obtain a copy of the License at // // http://www.apache.org/licenses/LICENSE-2.0 // // Unless required by applicable law or agreed to in writing, software // distributed under the License is distributed on an "AS IS" BASIS, // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. import eve from './eve.js' import { Snap, SnapElement } from './svg.js' import { $ } from './utils.js' import { parseColor } from './lib/color.js' let rgurl = /^\s*url\((.+)\)/, Str = String Snap.filter = {} eve.on('snap.util.getattr.filter', function () { eve.stop() let p = $(this.node, 'filter') if (p) { let match = Str(p).match(rgurl) return match && Snap.select(match[1]) } }) eve.on('snap.util.attr.filter', function (value) { if (value instanceof SnapElement && value.type == 'filter') { eve.stop() let id = value.node.id if (!id) { $(value.node, { id: value.id }) id = value.id } $(this.node, { filter: Snap.url(id) }) } if (!value || value == 'none') { eve.stop() this.node.removeAttribute('filter') } }) /*\ * Snap.filter.blur [ method ] ** * Returns an SVG markup string for the blur filter ** - x (number) amount of horizontal blur, in pixels - y (number) #optional amount of vertical blur, in pixels = (string) filter representation > Usage | let f = paper.filter(Snap.filter.blur(5, 10)), | c = paper.circle(10, 10, 10).attr({ | filter: f | }); \*/ Snap.filter.blur = function (x, y) { if (x == null) { x = 2 } let def = y == null ? x : [x, y] return `` } Snap.filter.blur.toString = function () { return this() } /*\ * Snap.filter.shadow [ method ] ** * Returns an SVG markup string for the shadow filter ** - dx (number) #optional horizontal shift of the shadow, in pixels - dy (number) #optional vertical shift of the shadow, in pixels - blur (number) #optional amount of blur - color (string) #optional color of the shadow - opacity (number) #optional `0..1` opacity of the shadow * or - dx (number) #optional horizontal shift of the shadow, in pixels - dy (number) #optional vertical shift of the shadow, in pixels - color (string) #optional color of the shadow - opacity (number) #optional `0..1` opacity of the shadow * which makes blur default to `4`. Or - dx (number) #optional horizontal shift of the shadow, in pixels - dy (number) #optional vertical shift of the shadow, in pixels - opacity (number) #optional `0..1` opacity of the shadow = (string) filter representation > Usage | let f = paper.filter(Snap.filter.shadow(0, 2, .3)), | c = paper.circle(10, 10, 10).attr({ | filter: f | }); \*/ Snap.filter.shadow = function (dx, dy, blur, color, opacity) { if (opacity == null) { if (color == null) { opacity = blur blur = 4 color = '#000' } else { opacity = color color = blur blur = 4 } } if (blur == null) { blur = 4 } if (opacity == null) { opacity = 1 } if (dx == null) { dx = 0 dy = 2 } if (dy == null) { dy = dx } color = parseColor(color) return `` } Snap.filter.shadow.toString = function () { return this() } /*\ * Snap.filter.grayscale [ method ] ** * Returns an SVG markup string for the grayscale filter ** - amount (number) amount of filter (`0..1`) = (string) filter representation \*/ Snap.filter.grayscale = function (amount) { if (amount == null) { amount = 1 } let a = 0.2126 + 0.7874 * (1 - amount) let b = 0.7152 - 0.7152 * (1 - amount) let c = 0.0722 - 0.0722 * (1 - amount) let d = 0.2126 - 0.2126 * (1 - amount) let e = 0.7152 + 0.2848 * (1 - amount) let f = 0.0722 - 0.0722 * (1 - amount) let g = 0.2126 - 0.2126 * (1 - amount) let h = 0.0722 + 0.9278 * (1 - amount) return `` } Snap.filter.grayscale.toString = function () { return this() } /*\ * Snap.filter.sepia [ method ] ** * Returns an SVG markup string for the sepia filter ** - amount (number) amount of filter (`0..1`) = (string) filter representation \*/ Snap.filter.sepia = function (amount) { if (amount == null) { amount = 1 } let a = 0.393 + 0.607 * (1 - amount) let b = 0.769 - 0.769 * (1 - amount) let c = 0.189 - 0.189 * (1 - amount) let d = 0.349 - 0.349 * (1 - amount) let e = 0.686 + 0.314 * (1 - amount) let f = 0.168 - 0.168 * (1 - amount) let g = 0.272 - 0.272 * (1 - amount) let h = 0.534 - 0.534 * (1 - amount) let i = 0.131 + 0.869 * (1 - amount) return `` } Snap.filter.sepia.toString = function () { return this() } /*\ * Snap.filter.saturate [ method ] ** * Returns an SVG markup string for the saturate filter ** - amount (number) amount of filter (`0..1`) = (string) filter representation \*/ Snap.filter.saturate = function (amount) { if (amount == null) { amount = 1 } return `` } Snap.filter.saturate.toString = function () { return this() } /*\ * Snap.filter.hueRotate [ method ] ** * Returns an SVG markup string for the hue-rotate filter ** - angle (number) angle of rotation = (string) filter representation \*/ Snap.filter.hueRotate = function (angle) { angle = angle || 0 return `` } Snap.filter.hueRotate.toString = function () { return this() } /*\ * Snap.filter.invert [ method ] ** * Returns an SVG markup string for the invert filter ** - amount (number) amount of filter (`0..1`) = (string) filter representation \*/ Snap.filter.invert = function (amount) { if (amount == null) { amount = 1 } // return `` } Snap.filter.invert.toString = function () { return this() } /*\ * Snap.filter.brightness [ method ] ** * Returns an SVG markup string for the brightness filter ** - amount (number) amount of filter (`0..1`) = (string) filter representation \*/ Snap.filter.brightness = function (amount) { if (amount == null) { amount = 1 } return `` } Snap.filter.brightness.toString = function () { return this() } /*\ * Snap.filter.contrast [ method ] ** * Returns an SVG markup string for the contrast filter ** - amount (number) amount of filter (`0..1`) = (string) filter representation \*/ Snap.filter.contrast = function (amount) { if (amount == null) { amount = 1 } let amount2 = 0.5 - amount / 2 return `` } Snap.filter.contrast.toString = function () { return this() }