From c52617e49a17b276f305e09b25f8bc01b0d74026 Mon Sep 17 00:00:00 2001 From: ph1p Date: Wed, 6 Feb 2019 17:51:06 +0100 Subject: [PATCH 1/3] Add valid svg attributes and allow empty attributes Some lines have changes due to removed whitespaces at the end. --- src/index.js | 294 ++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 289 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index 7caf091c..5cafa97b 100644 --- a/src/index.js +++ b/src/index.js @@ -25,6 +25,290 @@ const defaultTweenSettings = { const validTransforms = ['translateX', 'translateY', 'translateZ', 'rotate', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'perspective']; +const validSvgAttributes = [ + 'accent-height', + 'accumulate', + 'additive', + 'alignment-baseline', + 'allowReorder', + 'alphabetic', + 'amplitude', + 'arabic-form', + 'ascent', + 'attributeName', + 'attributeType', + 'autoReverse', + 'azimuth', + 'BSection', + 'baseFrequency', + 'baseline-shift', + 'baseProfile', + 'bbox', + 'begin', + 'bias', + 'by', + 'CSection', + 'calcMode', + 'cap-height', + 'class', + 'clip', + 'clipPathUnits', + 'clip-path', + 'clip-rule', + 'color', + 'color-interpolation', + 'color-interpolation-filters', + 'color-profile', + 'color-rendering', + 'contentScriptType', + 'contentStyleType', + 'cursor', + 'cx', + 'cy', + 'DSection', + 'd', + 'decelerate', + 'descent', + 'diffuseConstant', + 'direction', + 'display', + 'divisor', + 'dominant-baseline', + 'dur', + 'dx', + 'dy', + 'ESection', + 'edgeMode', + 'elevation', + 'enable-background', + 'end', + 'exponent', + 'externalResourcesRequired', + 'FSection', + 'fill', + 'fill-opacity', + 'fill-rule', + 'filter', + 'filterRes', + 'filterUnits', + 'flood-color', + 'flood-opacity', + 'font-family', + 'font-size', + 'font-size-adjust', + 'font-stretch', + 'font-style', + 'font-variant', + 'font-weight', + 'format', + 'from', + 'fr', + 'fx', + 'fy', + 'GSection', + 'g1', + 'g2', + 'glyph-name', + 'glyph-orientation-horizontal', + 'glyph-orientation-vertical', + 'glyphRef', + 'gradientTransform', + 'gradientUnits', + 'HSection', + 'hanging', + 'height', + 'href', + 'hreflang', + 'horiz-adv-x', + 'horiz-origin-x', + 'ISection', + 'id', + 'ideographic', + 'image-rendering', + 'in', + 'in2', + 'intercept', + 'KSection', + 'k', + 'k1', + 'k2', + 'k3', + 'k4', + 'kernelMatrix', + 'kernelUnitLength', + 'kerning', + 'keyPoints', + 'keySplines', + 'keyTimes', + 'LSection', + 'lang', + 'lengthAdjust', + 'letter-spacing', + 'lighting-color', + 'limitingConeAngle', + 'local', + 'MSection', + 'marker-end', + 'marker-mid', + 'marker-start', + 'markerHeight', + 'markerUnits', + 'markerWidth', + 'mask', + 'maskContentUnits', + 'maskUnits', + 'mathematical', + 'max', + 'media', + 'method', + 'min', + 'mode', + 'NSection', + 'name', + 'numOctaves', + 'OSection', + 'offset', + 'opacity', + 'operator', + 'order', + 'orient', + 'orientation', + 'origin', + 'overflow', + 'overline-position', + 'overline-thickness', + 'PSection', + 'panose-1', + 'paint-order', + 'path', + 'pathLength', + 'patternContentUnits', + 'patternTransform', + 'patternUnits', + 'ping', + 'pointer-events', + 'points', + 'pointsAtX', + 'pointsAtY', + 'pointsAtZ', + 'preserveAlpha', + 'preserveAspectRatio', + 'primitiveUnits', + 'RSection', + 'r', + 'radius', + 'referrerPolicy', + 'refX', + 'refY', + 'rel', + 'rendering-intent', + 'repeatCount', + 'repeatDur', + 'requiredExtensions', + 'requiredFeatures', + 'restart', + 'result', + 'rotate', + 'rx', + 'ry', + 'SSection', + 'scale', + 'seed', + 'shape-rendering', + 'slope', + 'spacing', + 'specularConstant', + 'specularExponent', + 'speed', + 'spreadMethod', + 'startOffset', + 'stdDeviation', + 'stemh', + 'stemv', + 'stitchTiles', + 'stop-color', + 'stop-opacity', + 'strikethrough-position', + 'strikethrough-thickness', + 'string', + 'stroke', + 'stroke-dasharray', + 'stroke-dashoffset', + 'stroke-linecap', + 'stroke-linejoin', + 'stroke-miterlimit', + 'stroke-opacity', + 'stroke-width', + 'style', + 'surfaceScale', + 'systemLanguage', + 'TSection', + 'tabindex', + 'tableValues', + 'target', + 'targetX', + 'targetY', + 'text-anchor', + 'text-decoration', + 'text-rendering', + 'textLength', + 'to', + 'transform', + 'type', + 'USection', + 'u1', + 'u2', + 'underline-position', + 'underline-thickness', + 'unicode', + 'unicode-bidi', + 'unicode-range', + 'units-per-em', + 'VSection', + 'v-alphabetic', + 'v-hanging', + 'v-ideographic', + 'v-mathematical', + 'values', + 'vector-effect', + 'version', + 'vert-adv-y', + 'vert-origin-x', + 'vert-origin-y', + 'viewBox', + 'viewTarget', + 'visibility', + 'WSection', + 'width', + 'widths', + 'word-spacing', + 'writing-mode', + 'XSection', + 'x', + 'x-height', + 'x1', + 'x2', + 'xChannelSelector', + 'xlink:actuate', + 'xlink:arcrole', + 'xlink:href', + 'xlink:role', + 'xlink:show', + 'xlink:title', + 'xlink:type', + 'xml:base', + 'xml:lang', + 'xml:space', + 'YSection', + 'y', + 'y1', + 'y2', + 'yChannelSelector', + 'ZSection', + 'z', + 'zoomAndPan' +]; + // Caching const cache = { @@ -126,7 +410,7 @@ function elastic(amplitude = 1, period = .5) { const a = minMax(amplitude, 1, 10); const p = minMax(period, .1, 2); return t => { - return (t === 0 || t === 1) ? t : + return (t === 0 || t === 1) ? t : -a * Math.pow(2, 10 * (t - 1)) * Math.sin((((t - 1) - (p / (Math.PI * 2) * Math.asin(1 / a))) * (Math.PI * 2)) / p); } } @@ -262,7 +546,7 @@ const penner = (() => { ] } - let eases = { + let eases = { linear: [0.250, 0.250, 0.750, 0.750] } @@ -452,7 +736,7 @@ function getCSSValue(el, prop, unit) { } function getAnimationType(el, prop) { - if (is.dom(el) && !is.inp(el) && (getAttribute(el, prop) || (is.svg(el) && el[prop]))) return 'attribute'; + if (is.dom(el) && !is.inp(el) && (getAttribute(el, prop) || (is.svg(el) && arrayContains(validSvgAttributes, prop)))) return 'attribute'; if (is.dom(el) && arrayContains(validTransforms, prop)) return 'transform'; if (is.dom(el) && (prop !== 'transform' && getCSSValue(el, prop))) return 'css'; if (el[prop] != null) return 'object'; @@ -523,7 +807,7 @@ function getRectLength(el) { function getLineLength(el) { return getDistance( - {x: getAttribute(el, 'x1'), y: getAttribute(el, 'y1')}, + {x: getAttribute(el, 'x1'), y: getAttribute(el, 'y1')}, {x: getAttribute(el, 'x2'), y: getAttribute(el, 'y2')} ); } @@ -858,7 +1142,7 @@ let pausedInstances = []; let raf; const engine = (() => { - function play() { + function play() { raf = requestAnimationFrame(step); } function step(t) { From 59b150cbfac0fc40e6ea2e75041ddcfe2e9ce14c Mon Sep 17 00:00:00 2001 From: ph1p Date: Fri, 24 Jul 2020 17:57:53 +0200 Subject: [PATCH 2/3] Remove deprecated and string based svg attributes --- src/index.js | 162 --------------------------------------------------- 1 file changed, 162 deletions(-) diff --git a/src/index.js b/src/index.js index e0247621..32794f40 100644 --- a/src/index.js +++ b/src/index.js @@ -26,70 +26,32 @@ const defaultTweenSettings = { const validTransforms = ['translateX', 'translateY', 'translateZ', 'rotate', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'perspective', 'matrix', 'matrix3d']; const validSvgAttributes = [ - 'accent-height', - 'accumulate', - 'additive', - 'alignment-baseline', - 'allowReorder', - 'alphabetic', 'amplitude', - 'arabic-form', - 'ascent', - 'attributeName', - 'attributeType', - 'autoReverse', 'azimuth', - 'BSection', 'baseFrequency', 'baseline-shift', - 'baseProfile', - 'bbox', 'begin', 'bias', 'by', - 'CSection', 'calcMode', - 'cap-height', - 'class', - 'clip', - 'clipPathUnits', - 'clip-path', - 'clip-rule', 'color', - 'color-interpolation', - 'color-interpolation-filters', - 'color-profile', - 'color-rendering', - 'contentScriptType', - 'contentStyleType', - 'cursor', 'cx', 'cy', - 'DSection', 'd', - 'decelerate', - 'descent', 'diffuseConstant', - 'direction', 'display', 'divisor', - 'dominant-baseline', 'dur', 'dx', 'dy', - 'ESection', 'edgeMode', 'elevation', - 'enable-background', 'end', 'exponent', - 'externalResourcesRequired', - 'FSection', 'fill', 'fill-opacity', 'fill-rule', 'filter', - 'filterRes', 'filterUnits', 'flood-color', 'flood-opacity', @@ -100,213 +62,89 @@ const validSvgAttributes = [ 'font-style', 'font-variant', 'font-weight', - 'format', 'from', 'fr', 'fx', 'fy', - 'GSection', - 'g1', - 'g2', - 'glyph-name', - 'glyph-orientation-horizontal', - 'glyph-orientation-vertical', - 'glyphRef', 'gradientTransform', - 'gradientUnits', - 'HSection', - 'hanging', 'height', - 'href', - 'hreflang', - 'horiz-adv-x', - 'horiz-origin-x', - 'ISection', - 'id', - 'ideographic', - 'image-rendering', - 'in', - 'in2', 'intercept', - 'KSection', - 'k', 'k1', 'k2', 'k3', 'k4', 'kernelMatrix', - 'kernelUnitLength', - 'kerning', 'keyPoints', 'keySplines', 'keyTimes', - 'LSection', - 'lang', - 'lengthAdjust', 'letter-spacing', 'lighting-color', 'limitingConeAngle', - 'local', - 'MSection', - 'marker-end', - 'marker-mid', - 'marker-start', 'markerHeight', - 'markerUnits', 'markerWidth', - 'mask', - 'maskContentUnits', - 'maskUnits', - 'mathematical', 'max', - 'media', - 'method', 'min', - 'mode', - 'NSection', - 'name', 'numOctaves', - 'OSection', - 'offset', 'opacity', - 'operator', 'order', 'orient', - 'orientation', - 'origin', 'overflow', 'overline-position', 'overline-thickness', - 'PSection', - 'panose-1', - 'paint-order', 'path', 'pathLength', - 'patternContentUnits', - 'patternTransform', - 'patternUnits', - 'ping', - 'pointer-events', 'points', 'pointsAtX', 'pointsAtY', 'pointsAtZ', - 'preserveAlpha', - 'preserveAspectRatio', - 'primitiveUnits', - 'RSection', 'r', 'radius', - 'referrerPolicy', - 'refX', - 'refY', - 'rel', - 'rendering-intent', - 'repeatCount', 'repeatDur', - 'requiredExtensions', - 'requiredFeatures', - 'restart', - 'result', 'rotate', 'rx', 'ry', - 'SSection', 'scale', 'seed', - 'shape-rendering', - 'slope', 'spacing', 'specularConstant', 'specularExponent', - 'speed', 'spreadMethod', 'startOffset', 'stdDeviation', - 'stemh', - 'stemv', - 'stitchTiles', 'stop-color', 'stop-opacity', 'strikethrough-position', 'strikethrough-thickness', - 'string', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', - 'stroke-linecap', - 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', - 'style', 'surfaceScale', - 'systemLanguage', - 'TSection', - 'tabindex', 'tableValues', 'target', 'targetX', 'targetY', 'text-anchor', - 'text-decoration', - 'text-rendering', 'textLength', 'to', 'transform', - 'type', - 'USection', - 'u1', - 'u2', 'underline-position', 'underline-thickness', - 'unicode', - 'unicode-bidi', - 'unicode-range', - 'units-per-em', - 'VSection', - 'v-alphabetic', - 'v-hanging', - 'v-ideographic', - 'v-mathematical', 'values', - 'vector-effect', - 'version', - 'vert-adv-y', - 'vert-origin-x', - 'vert-origin-y', 'viewBox', - 'viewTarget', - 'visibility', - 'WSection', 'width', - 'widths', 'word-spacing', - 'writing-mode', - 'XSection', 'x', - 'x-height', 'x1', 'x2', 'xChannelSelector', - 'xlink:actuate', - 'xlink:arcrole', - 'xlink:href', - 'xlink:role', - 'xlink:show', - 'xlink:title', - 'xlink:type', - 'xml:base', - 'xml:lang', - 'xml:space', - 'YSection', 'y', 'y1', 'y2', 'yChannelSelector', - 'ZSection', 'z', - 'zoomAndPan' ]; // Caching From b94748eae0fadcfb86a9de40c791e2abbdc6e838 Mon Sep 17 00:00:00 2001 From: ph1p Date: Fri, 24 Jul 2020 17:59:27 +0200 Subject: [PATCH 3/3] Remove more attributes --- src/index.js | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/index.js b/src/index.js index 32794f40..8d4ddf63 100644 --- a/src/index.js +++ b/src/index.js @@ -50,17 +50,11 @@ const validSvgAttributes = [ 'exponent', 'fill', 'fill-opacity', - 'fill-rule', - 'filter', - 'filterUnits', 'flood-color', 'flood-opacity', - 'font-family', 'font-size', 'font-size-adjust', 'font-stretch', - 'font-style', - 'font-variant', 'font-weight', 'from', 'fr',