({element, blur})
| 44 | axes: ["x", "y"], |
| 45 | count: 0, |
| 46 | add({element, blur}) { |
| 47 | const id = `motion-blur-${this.count++}`; |
| 48 | const svg = createSVG("svg", { |
| 49 | style: "position: absolute; width: 0; height: 0" |
| 50 | }); |
| 51 | const filter = createSVG("filter", this.axes.reduce((attributes, axis) => { |
| 52 | const offset = blur[axis] * 2; |
| 53 | attributes[axis] = `-${offset}%`; |
| 54 | attributes[axis == "x" ? "width" : "height"] = `${100 + offset * 2}%`; |
| 55 | return attributes; |
| 56 | },{ |
| 57 | id, |
| 58 | "color-interpolation-filters": "sRGB" |
| 59 | })); |
| 60 | const gaussian = createSVG("feGaussianBlur", { |
| 61 | in: "SourceGraphic" |
| 62 | }); |
| 63 | filter.append(gaussian); |
| 64 | svg.append(filter); |
| 65 | element.style.filter = `url("#${id}")`; |
| 66 | document.body.prepend(svg); |
| 67 | return gaussian; |
| 68 | } |
| 69 | }; |
| 70 | |
| 71 | const getDeviation = (blur, {easing}, curve) => { |
nothing calls this directly
no test coverage detected