Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
fxsvg - npm Package Compare versions
Comparing version 0.0.8 to 0.0.9
@@ -1,1 +0,1 @@ | ||
| !function(t){var e={};function r(n){if(e[n])return e[n].exports;var a=e[n]={i:n,l:!1,exports:{}};return t[n].call(a.exports,a,a.exports,r),a.l=!0,a.exports}r.m=t,r.c=e,r.d=function(t,e,n){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var a in t)r.d(n,a,function(e){return t[e]}.bind(null,a));return n},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=0)}([function(t,e,r){"use strict";r.r(e);const n=({type:t,SVG_TRANSFORM_ROTATE:e})=>t===e,a=(t,{angle:e})=>n(t)?(t.setRotate(t.angle+e,0,0),t):t,o=({type:t,SVG_TRANSFORM_TRANSLATE:e})=>t===e,i=(t,{tx:e=0,ty:r=0})=>{if(!o(t))return t;const{e:n,f:a}=t.matrix;return t.setTranslate(n+e,a+r),t},s=t=>{const e=t.consolidate();return e?(t.initialize(e),t):t},m=({transform:{baseVal:t}})=>t;let l;const c=t=>(l=t,l),f=()=>(l||c(document.createElementNS("http://www.w3.org/2000/svg","svg")),l),x=(t=f())=>t.createSVGTransform(),u=(t=f())=>({angle:e=0,cx:r=0,cy:n=0}={})=>{const a=x(t);return a.setRotate(e,r,n),a},y=(t=f())=>({tx:e=0,ty:r=0}={})=>{const n=x(t);return n.setTranslate(e,r),n},g=(t=f())=>(e,{angle:r=0,cx:n=0,cy:a=0}={})=>{m(e).insertItemBefore(y(t)({tx:-n,ty:-a}),0);const o=m(e).insertItemBefore(u(t)({angle:r}),0);return m(e).insertItemBefore(y(t)({tx:n,ty:a}),0),o},p=(t=f())=>e=>{const r=m(e),a=r.getItem(0),i=r.getItem(1),s=r.getItem(2);if(!o(a)||!n(i)||!o(s)||1!==a.matrix.a||0!==a.matrix.b||0!==a.matrix.c||1!==a.matrix.d||1!==s.matrix.a||0!==s.matrix.b||0!==s.matrix.c||1!==s.matrix.d||a.matrix.e+s.matrix.e!==0||a.matrix.f+s.matrix.f!==0)return e;for(let t=0;t<3;t++)r.removeItem(0);return r.insertItemBefore(u(t)({angle:i.angle,cx:a.matrix.e,cy:a.matrix.f}),0),e},T=(t,{angle:e})=>n(t)?(t.setRotate(e,0,0),t):t,d=(t=f())=>(e,{tx:r=0,ty:n=0}={})=>m(e).insertItemBefore(y(t)({tx:r,ty:n}),0),_=(t=f())=>(e,{x_name:r="x",y_name:n="y"}={})=>{const a=m(e),i=a.getItem(0);if(!o(i))return e;const{e:s,f:l}=i.matrix;e.setAttributeNS(null,r,""+(parseFloat(e.getAttribute(r))+s)),e.setAttributeNS(null,n,""+(parseFloat(e.getAttribute(n))+l)),a.removeItem(0);for(const e of a){const r=y(t)({tx:s,ty:l}),n=y(t)({tx:-s,ty:-l}),a=r.matrix.multiply(e.matrix).multiply(n.matrix);e.setMatrix(a)}return e},S=(t,{tx:e,ty:r})=>o(t)?(t.setTranslate(null==e?t.matrix.e:e,null==r?t.matrix.f:r),t):t,b=(t=f())=>({x:e=0,y:r=0}={})=>{const n=t.createSVGPoint();return n.x=e,n.y=r,n},h=(t=f())=>e=>{e=e.trim(),t.innerHTML=e;const r=[...t.children];return t.innerHTML="",r},V=(t=f())=>e=>{const r=((t=f())=>e=>{const r=e.getBBox();return{top_left:b(t)({x:r.x,y:r.y}),top_right:b(t)({x:r.x+r.width,y:r.y}),bottom_left:b(t)({x:r.x,y:r.y+r.height}),bottom_right:b(t)({x:r.x+r.width,y:r.y+r.height})}})(t)(e),n=((t=f())=>(e,r)=>{let n=b(t)(r.top_left),a=b(t)(r.top_right),o=b(t)(r.bottom_left),i=b(t)(r.bottom_right);const s=m(e).consolidate();if(s){const{matrix:t}=s;n=n.matrixTransform(t),a=a.matrixTransform(t),o=o.matrixTransform(t),i=i.matrixTransform(t)}return{top_left:n,top_right:a,bottom_left:o,bottom_right:i}})(t)(e,r);return{original:r,transformed:n,bounding:((t=f())=>(e,r)=>{const n=[r.top_left,r.top_right,r.bottom_left,r.bottom_right],a=n.map(({x:t})=>t),o=n.map(({y:t})=>t),i=Math.min(...a),s=Math.max(...a),m=Math.min(...o),l=Math.max(...o);return{min:b(t)({x:i,y:m}),max:b(t)({x:s,y:l})}})(t)(e,n)}},G=(t=f())=>e=>{const r=[e.top_left,e.top_right,e.bottom_left,e.bottom_right],n=r.map(({x:t})=>t).reduce((t,e)=>t+e)/4,a=r.map(({y:t})=>t).reduce((t,e)=>t+e)/4;return b(t)({x:n,y:a})},R={appendRotateTransform:a,appendTranslateTransform:i,consolidateTransformList:s,controlRotateTransform:(t=f())=>(e,{angle:r=0,cx:n=0,cy:o=0}={})=>{const i=g(t)(e,{angle:r,cx:n,cy:o}),l={update:({angle:t})=>(T(i,{angle:t,cx:n,cy:o}),l),append:({angle:t})=>(a(i,{angle:t,cx:n,cy:o}),l),end:()=>(p(t)(e),s(m(e)),e)};return{$el:e,transform:i,controller:l}},controlTranslateTransform:(t=f())=>(e,{tx:r=0,ty:n=0,x_name:a,y_name:o}={})=>{const l=d(t)(e,{tx:r,ty:n}),c={update:({tx:t,ty:e})=>(S(l,{tx:t,ty:e}),c),append:({tx:t,ty:e})=>(i(l,{tx:t,ty:e}),c),end:()=>(a&&o&&_(t)(e,{x_name:a,y_name:o}),s(m(e)),e)};return{$el:e,controller:c,transform:l}},createSVGMatrix:(t=f())=>({a:e=1,b:r=0,c:n=0,d:a=1,e:o=0,f:i=0}={})=>{const s=t.createSVGMatrix();return s.a=e,s.b=r,s.c=n,s.d=a,s.e=o,s.f=i,s},createSVGPoint:b,createSVGRect:(t=f())=>({x:e=0,y:r=0,width:n=0,height:a=0}={})=>{const o=t.createSVGRect();return o.x=e,o.y=r,o.width=n,o.height=a,o},createSVGTransform:x,createSVGTransformMatrix:(t=f())=>e=>{const r=x(t);return r.setMatrix(e),r},createSVGTransformRotate:u,createSVGTransformScale:(t=f())=>({sx:e=1,sy:r=1}={})=>{const n=x(t);return n.setScale(e,r),n},createSVGTransformTranslate:y,el:(t=f())=>e=>h(t)(e)[0],els:h,getAnimTransformList:({transform:{animVal:t}})=>t,getBaseTransformList:m,getBoxPoints:V,getCenterPoint:(t=f())=>e=>{const{original:r,transformed:n}=V(t)(e);return{original:G(t)(r),transformed:G(t)(n)}},getSVG:f,setSVG:c,initRotateTransform:g,initTranslateTransform:d,isRotateSVGTransform:n,isScaleSVGTransform:({type:t,SVG_TRANSFORM_SCALE:e})=>t===e,isTranslateSVGTransform:o,mergeRotateTransform:p,mergeTranslateTransform:_,updateRotateTransform:T,updateTranslateTransform:S};window.$$=R}]); | ||
| !function(t){var r={};function e(n){if(r[n])return r[n].exports;var a=r[n]={i:n,l:!1,exports:{}};return t[n].call(a.exports,a,a.exports,e),a.l=!0,a.exports}e.m=t,e.c=r,e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:n})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,r){if(1&r&&(t=e(t)),8&r)return t;if(4&r&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(e.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&r&&"string"!=typeof t)for(var a in t)e.d(n,a,function(r){return t[r]}.bind(null,a));return n},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,r){return Object.prototype.hasOwnProperty.call(t,r)},e.p="",e(e.s=0)}([function(t,r,e){"use strict";e.r(r);const n=t=>{if(!(t instanceof SVGTransform))throw new Error("It's not a SVGTransform.");const{type:r,SVG_TRANSFORM_ROTATE:e}=t;return r===e},a=(t,{angle:r})=>{if(!n(t))return t;if(null==r)throw new Error("There is no angle.");return t.setRotate(t.angle+r,0,0),t},o=t=>{if(!(t instanceof SVGTransform))throw new Error("It's not a SVGTransform.");const{type:r,SVG_TRANSFORM_TRANSLATE:e}=t;return r===e},i=(t,{tx:r=0,ty:e=0})=>{if(!o(t))return t;const{e:n,f:a}=t.matrix;return t.setTranslate(n+r,a+e),t},s=t=>{const r=t.consolidate();return r?(t.initialize(r),t):t},m=({transform:{baseVal:t}})=>t;let f;const c=t=>(f=t,f),l=()=>(f||c(document.createElementNS("http://www.w3.org/2000/svg","svg")),f),u=(t=l())=>t.createSVGTransform(),x=(t=l())=>({angle:r=0,cx:e=0,cy:n=0}={})=>{const a=u(t);return a.setRotate(r,e,n),a},y=(t=l())=>({tx:r=0,ty:e=0}={})=>{const n=u(t);return n.setTranslate(r,e),n},g=(t=l())=>(r,{angle:e=0,cx:n=0,cy:a=0}={})=>{m(r).insertItemBefore(y(t)({tx:-n,ty:-a}),0);const o=m(r).insertItemBefore(x(t)({angle:e}),0);return m(r).insertItemBefore(y(t)({tx:n,ty:a}),0),o},T=(t=l())=>r=>{const e=m(r);if(e.numberOfItems<3)return r;const a=e.getItem(0),i=e.getItem(1),s=e.getItem(2);if(!o(a)||!n(i)||!o(s)||0!==i.matrix.e||0!==i.matrix.f||1!==a.matrix.a||0!==a.matrix.b||0!==a.matrix.c||1!==a.matrix.d||1!==s.matrix.a||0!==s.matrix.b||0!==s.matrix.c||1!==s.matrix.d||a.matrix.e+s.matrix.e!==0||a.matrix.f+s.matrix.f!==0)return r;for(let t=0;t<3;t++)e.removeItem(0);return e.insertItemBefore(x(t)({angle:i.angle,cx:a.matrix.e,cy:a.matrix.f}),0),r},p=(t,{angle:r,cx:e=0,cy:a=0}={})=>n(t)?(t.setRotate(null==r?t.angle:r,e,a),t):t,d=(t=l())=>(r,{tx:e=0,ty:n=0}={})=>m(r).insertItemBefore(y(t)({tx:e,ty:n}),0),S=(t=l())=>(r,{x_name:e="x",y_name:n="y"}={})=>{const a=m(r);if(a.numberOfItems<1)return r;const i=a.getItem(0);if(!o(i))return r;const{e:s,f:f}=i.matrix;r.setAttributeNS(null,e,""+(parseFloat(r.getAttribute(e))+s)),r.setAttributeNS(null,n,""+(parseFloat(r.getAttribute(n))+f)),a.removeItem(0);for(const r of a){const e=y(t)({tx:s,ty:f}),n=y(t)({tx:-s,ty:-f}),a=e.matrix.multiply(r.matrix).multiply(n.matrix);r.setMatrix(a)}return r},_=(t,{tx:r,ty:e})=>o(t)?(t.setTranslate(null==r?t.matrix.e:r,null==e?t.matrix.f:e),t):t,b=(t=l())=>({a:r=1,b:e=0,c:n=0,d:a=1,e:o=0,f:i=0}={})=>{const s=t.createSVGMatrix();return s.a=r,s.b=e,s.c=n,s.d=a,s.e=o,s.f=i,s},h=(t=l())=>({x:r=0,y:e=0}={})=>{const n=t.createSVGPoint();return n.x=r,n.y=e,n},V=(t=l())=>r=>{r=r.trim(),t.innerHTML=r;const e=[...t.children];return t.innerHTML="",e},G=(t=l())=>r=>{const e=((t=l())=>r=>{const e=r.getBBox();return{top_left:h(t)({x:e.x,y:e.y}),top_right:h(t)({x:e.x+e.width,y:e.y}),bottom_left:h(t)({x:e.x,y:e.y+e.height}),bottom_right:h(t)({x:e.x+e.width,y:e.y+e.height})}})(t)(r),n=((t=l())=>(r,e)=>{let n=h(t)(e.top_left),a=h(t)(e.top_right),o=h(t)(e.bottom_left),i=h(t)(e.bottom_right);const s=m(r).consolidate();if(s){const{matrix:t}=s;n=n.matrixTransform(t),a=a.matrixTransform(t),o=o.matrixTransform(t),i=i.matrixTransform(t)}return{top_left:n,top_right:a,bottom_left:o,bottom_right:i}})(t)(r,e);return{original:e,transformed:n,bounding:((t=l())=>(r,e)=>{const n=[e.top_left,e.top_right,e.bottom_left,e.bottom_right],a=n.map(({x:t})=>t),o=n.map(({y:t})=>t),i=Math.min(...a),s=Math.max(...a),m=Math.min(...o),f=Math.max(...o);return{min:h(t)({x:i,y:m}),max:h(t)({x:s,y:f})}})(t)(r,n)}},R=(t=l())=>r=>{const e=[r.top_left,r.top_right,r.bottom_left,r.bottom_right],n=e.map(({x:t})=>t).reduce((t,r)=>t+r)/4,a=e.map(({y:t})=>t).reduce((t,r)=>t+r)/4;return h(t)({x:n,y:a})},w={appendRotateTransform:a,appendTranslateTransform:i,consolidateTransformList:s,controlRotateTransform:(t=l())=>(r,{angle:e=0,cx:n=0,cy:o=0}={})=>{const i=g(t)(r,{angle:e,cx:n,cy:o}),f={update:({angle:t})=>(p(i,{angle:t,cx:0,cy:0}),f),append:({angle:t})=>(a(i,{angle:t,cx:0,cy:0}),f),end:()=>(T(t)(r),s(m(r)),r)};return{$el:r,transform:i,controller:f}},controlTranslateTransform:(t=l())=>(r,{tx:e=0,ty:n=0,x_name:a,y_name:o}={})=>{const f=d(t)(r,{tx:e,ty:n}),c={update:({tx:t,ty:r})=>(_(f,{tx:t,ty:r}),c),append:({tx:t,ty:r})=>(i(f,{tx:t,ty:r}),c),end:()=>(a&&o&&S(t)(r,{x_name:a,y_name:o}),s(m(r)),r)};return{$el:r,controller:c,transform:f}},createSVGMatrix:b,createSVGPoint:h,createSVGRect:(t=l())=>({x:r=0,y:e=0,width:n=0,height:a=0}={})=>{const o=t.createSVGRect();return o.x=r,o.y=e,o.width=n,o.height=a,o},createSVGTransform:u,createSVGTransformMatrix:(t=l())=>(r=b(t)())=>{const e=u(t);return e.setMatrix(r),e},createSVGTransformRotate:x,createSVGTransformScale:(t=l())=>({sx:r=1,sy:e=1}={})=>{const n=u(t);return n.setScale(r,e),n},createSVGTransformTranslate:y,el:(t=l())=>r=>V(t)(r)[0],els:V,getAnimTransformList:({transform:{animVal:t}})=>t,getBaseTransformList:m,getBoxPoints:G,getCenterPoint:(t=l())=>r=>{const{original:e,transformed:n}=G(t)(r);return{original:R(t)(e),transformed:R(t)(n)}},getSVG:l,setSVG:c,initRotateTransform:g,initTranslateTransform:d,isRotateSVGTransform:n,isScaleSVGTransform:t=>{if(!(t instanceof SVGTransform))throw new Error("It's not a SVGTransform.");const{type:r,SVG_TRANSFORM_SCALE:e}=t;return r===e},isTranslateSVGTransform:o,mergeRotateTransform:T,mergeTranslateTransform:S,updateRotateTransform:p,updateTranslateTransform:_};window.$$=w}]); |
| { | ||
| "name": "fxsvg", | ||
| "version": "0.0.8", | ||
| "version": "0.0.9", | ||
| "description": "Functional SVG Handling Library", | ||
@@ -12,4 +12,4 @@ "type": "module", | ||
| "scripts": { | ||
| "build": "node ./bin/build.cjs", | ||
| "test": "jest" | ||
| "test:browser": "node ./test/server.cjs", | ||
| "build": "node ./bin/build.cjs" | ||
| }, | ||
@@ -35,11 +35,9 @@ "repository": { | ||
| "devDependencies": { | ||
| "@babel/core": "^7.9.6", | ||
| "@babel/preset-env": "^7.9.6", | ||
| "babel-jest": "^26.0.1", | ||
| "jest": "^26.0.1", | ||
| "chai": "^4.2.0", | ||
| "express": "^4.17.1", | ||
| "mocha": "^7.2.0", | ||
| "prettier": "2.0.5", | ||
| "svgdom": "^0.1.8", | ||
| "webpack": "^4.43.0", | ||
| "webpack-cli": "^3.3.11" | ||
| "webpack-dev-middleware": "^3.7.2" | ||
| } | ||
| } |
@@ -277,1 +277,9 @@ # FxSVG | ||
| 쉽게 사용할 수 있는 `controller` 를 생성합니다. | ||
| ## Contributing | ||
| ### Test Code | ||
| 테스트 코드를 작성할 때 `mocha` 테스트 러너의 실행 함수는 모두 `function() {}` 으로 작성해주세요. | ||
| `mocha`의 `context`에 접근하기 위해서는 `this` 키워드를 사용해야 합니다. | ||
| 화살표 함수를 사용하면 `this` 키워드를 사용할 수 없어요! |
@@ -7,4 +7,9 @@ import { $$isRotateSVGTransform } from "../isRotateSVGTransform/isRotateSVGTransform.index.js"; | ||
| } | ||
| if (angle == null) { | ||
| throw new Error("There is no angle."); | ||
| } | ||
| transform.setRotate(transform.angle + angle, 0, 0); | ||
| return transform; | ||
| }; |
| # \$\$appendRotateTransform | ||
| - [source](./appendRotateTransform.index.js) | ||
| - [test](./appendRotateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `SVGTransform.SVG_TRANSFORM_ROTATE` 타입의 `SVGTransform` 의 `angle` 값을 수정합니다. |
@@ -1,2 +0,2 @@ | ||
| import {$$isTranslateSVGTransform} from "../isTranslateSVGTransform/isTranslateSVGTransform.index.js"; | ||
| import { $$isTranslateSVGTransform } from "../isTranslateSVGTransform/isTranslateSVGTransform.index.js"; | ||
@@ -3,0 +3,0 @@ export const $$appendTranslateTransform = (transform, { tx = 0, ty = 0 }) => { |
| # \$\$appendTranslateTransform | ||
| - [source](./appendTranslateTransform.index.js) | ||
| - [test](./appendTranslateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `SVGTransform.SVG_TRANSFORM_TRANSLATE` 타입의 `SVGTransform` 의 `tx`, `ty` 값을 수정합니다. |
| # \$\$consolidateTransformList | ||
| - [source](./consolidateTransformList.index.js) | ||
| - [test](./consolidateTransformList.spec.js) | ||
@@ -5,0 +6,0 @@ `SVGTransformList` 객체의 모든 `SVGTransform` 객체를 하나로 통합하여 `SVGTransformList` 객체를 새로 초기화합니다. |
@@ -17,7 +17,7 @@ import {$$appendRotateTransform} from "../appendRotateTransform/appendRotateTransform.index.js"; | ||
| controller.update = ({ angle }) => { | ||
| $$updateRotateTransform(transform, { angle, cx, cy }); | ||
| $$updateRotateTransform(transform, { angle, cx: 0, cy: 0 }); | ||
| return controller; | ||
| }; | ||
| controller.append = ({ angle }) => { | ||
| $$appendRotateTransform(transform, { angle, cx, cy }); | ||
| $$appendRotateTransform(transform, { angle, cx: 0, cy: 0 }); | ||
| return controller; | ||
@@ -24,0 +24,0 @@ }; |
| # \$\$controlRotateTransform | ||
| - [source](./controlRotateTransform.index.js) | ||
| - [test](./controlRotateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `$$initRotateTransform`, `$$updateRotateTransform`, `$$appendRotateTransform`, `$$mergeRotateTransform` 함수들을 |
| # \$\$controlTranslateTransform | ||
| - [source](./controlTranslateTransform.index.js) | ||
| - [test](./controlTranslateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `$$initTranslateTransform`, `$$updateTranslateTransform`, `$$appendTranslateTransform`, `$$mergeTranslateTransform` 함수들을 |
@@ -1,55 +0,79 @@ | ||
| import { createSVGWindow } from "svgdom"; | ||
| import { expect } from "chai"; | ||
| import { | ||
| makeAllCombinations, | ||
| makeRandomNumber, | ||
| } from "../../test/utils/index.js"; | ||
| import { $$createSVGMatrix } from "./createSVGMatrix.index.js"; | ||
| describe(`$$createSVGMatrix`, () => { | ||
| let $dummy_svg; | ||
| const expectSameMatrix = ( | ||
| m, | ||
| { a = 1, b = 0, c = 0, d = 1, e = 0, f = 0 } = {} | ||
| ) => { | ||
| expect(m.a).to.equal(a); | ||
| expect(m.b).to.equal(b); | ||
| expect(m.c).to.equal(c); | ||
| expect(m.d).to.equal(d); | ||
| expect(m.e).to.equal(e); | ||
| expect(m.f).to.equal(f); | ||
| }; | ||
| beforeEach(() => { | ||
| $dummy_svg = createSVGWindow().document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| ); | ||
| const makeCases = () => { | ||
| const makeSubCases = () => [ | ||
| ...makeAllCombinations(["a", "b", "c", "d", "e", "f"]).map((ks) => | ||
| ks | ||
| .map((k) => [k, makeRandomNumber()]) | ||
| .reduce((acc, [k, v]) => { | ||
| acc[k] = v; | ||
| return acc; | ||
| }, {}) | ||
| ), | ||
| {}, | ||
| ]; | ||
| return [ | ||
| { matrix: $$createSVGMatrix()() }, | ||
| ...makeSubCases().map((values) => ({ | ||
| values, | ||
| matrix: $$createSVGMatrix()(values), | ||
| })), | ||
| { | ||
| matrix: $$createSVGMatrix( | ||
| document.createElementNS("http://www.w3.org/2000/svg", "svg") | ||
| )(), | ||
| }, | ||
| ...makeSubCases().map((values) => ({ | ||
| values, | ||
| matrix: $$createSVGMatrix( | ||
| document.createElementNS("http://www.w3.org/2000/svg", "svg") | ||
| )(values), | ||
| })), | ||
| ]; | ||
| }; | ||
| describe(`$$createSVGMatrix`, function () { | ||
| it(`The return value is a SVGMatrix.`, function () { | ||
| const cases = makeCases(); | ||
| for (const { matrix } of cases) { | ||
| expect(matrix).to.instanceof(SVGMatrix); | ||
| } | ||
| }); | ||
| test(`will create SVGMatrix with given values`, () => { | ||
| const [a, b, c, d, e, f] = [...Array(6)].map(() => | ||
| Math.round(Math.random() * 1000) | ||
| ); | ||
| it(`The matrix will be a identity matrix if there is no arguments.`, function () { | ||
| const $svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); | ||
| const matrix = $$createSVGMatrix($dummy_svg)({ a, b, c, d, e, f }); | ||
| const m1 = $$createSVGMatrix()(); | ||
| expectSameMatrix(m1, { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0 }); | ||
| expect(matrix.a).toEqual(a); | ||
| expect(matrix.b).toEqual(b); | ||
| expect(matrix.c).toEqual(c); | ||
| expect(matrix.d).toEqual(d); | ||
| expect(matrix.e).toEqual(e); | ||
| expect(matrix.f).toEqual(f); | ||
| const m2 = $$createSVGMatrix($svg)(); | ||
| expectSameMatrix(m2, { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0 }); | ||
| }); | ||
| test(`will create SVGMatrix {a: 1, b: 0, c: 0, d: 1, e: 0, f: 0} if there is no given values`, () => { | ||
| const matrix = $$createSVGMatrix($dummy_svg)(); | ||
| expect(matrix.a).toEqual(1); | ||
| expect(matrix.b).toEqual(0); | ||
| expect(matrix.c).toEqual(0); | ||
| expect(matrix.d).toEqual(1); | ||
| expect(matrix.e).toEqual(0); | ||
| expect(matrix.f).toEqual(0); | ||
| it(` | ||
| Each value of the matrix will be same with the given value. | ||
| If there is omitted values, the values will be {a: 1, b: 0, c: 0, d: 1, e: 0, f: 0} individually by default. | ||
| `, function () { | ||
| const cases = makeCases(); | ||
| for (const { matrix, values } of cases) { | ||
| expectSameMatrix(matrix, values); | ||
| } | ||
| }); | ||
| test(` | ||
| will use default values if there is no given values | ||
| (a: 1, b: 0, c: 0, d: 1, e: 0, f: 0) | ||
| `, () => { | ||
| const [e, f] = [...Array(2)].map(() => Math.round(Math.random() * 1000)); | ||
| const matrix = $$createSVGMatrix($dummy_svg)({ e, f }); | ||
| expect(matrix.a).toEqual(1); | ||
| expect(matrix.b).toEqual(0); | ||
| expect(matrix.c).toEqual(0); | ||
| expect(matrix.d).toEqual(1); | ||
| expect(matrix.e).toEqual(e); | ||
| expect(matrix.f).toEqual(f); | ||
| }); | ||
| }); |
@@ -1,42 +0,55 @@ | ||
| import { createSVGWindow } from "svgdom"; | ||
| import { expect } from "chai"; | ||
| import { makeAllCombinations, makeRandomInt } from "../../test/utils/index.js"; | ||
| import { $$createSVGPoint } from "./createSVGPoint.index.js"; | ||
| describe(`$$createSVGPoint`, () => { | ||
| let $dummy_svg; | ||
| const makeCases = () => { | ||
| const makeSubCases = () => [ | ||
| {}, | ||
| ...makeAllCombinations(["x", "y"]).map((ks) => | ||
| ks | ||
| .map((k) => [k, makeRandomInt()]) | ||
| .reduce((acc, [k, v]) => { | ||
| acc[k] = v; | ||
| return acc; | ||
| }, {}) | ||
| ), | ||
| ]; | ||
| return [ | ||
| { point: $$createSVGPoint()() }, | ||
| ...makeSubCases().map((values) => ({ | ||
| values, | ||
| point: $$createSVGPoint()(values), | ||
| })), | ||
| { | ||
| point: $$createSVGPoint( | ||
| document.createElementNS("http://www.w3.org/2000/svg", "svg") | ||
| )(), | ||
| }, | ||
| ...makeSubCases().map((values) => ({ | ||
| values, | ||
| point: $$createSVGPoint( | ||
| document.createElementNS("http://www.w3.org/2000/svg", "svg") | ||
| )(values), | ||
| })), | ||
| ]; | ||
| }; | ||
| beforeEach(() => { | ||
| const window = createSVGWindow(); | ||
| $dummy_svg = window.document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| ); | ||
| describe(`$$createSVGPoint`, function () { | ||
| it(`The return value will be a SVGPoint.`, function () { | ||
| const cases = makeCases(); | ||
| for (const { point } of cases) { | ||
| expect(point).to.instanceof(SVGPoint); | ||
| } | ||
| }); | ||
| test(`will create SVGPoint with given coordinates`, () => { | ||
| const x = Math.round(Math.random() * 1000); | ||
| const y = Math.round(Math.random() * 1000); | ||
| const p = $$createSVGPoint($dummy_svg)({ x, y }); | ||
| expect(p.x).toEqual(x); | ||
| expect(p.y).toEqual(y); | ||
| it(` | ||
| The point's x, y value will be same with input value. | ||
| The omitted value will be 0. | ||
| `, function () { | ||
| const cases = makeCases(); | ||
| for (const { point, values: { x = 0, y = 0 } = {} } of cases) { | ||
| expect(point.x).to.equal(x); | ||
| expect(point.y).to.equal(y); | ||
| } | ||
| }); | ||
| test("will use 0 as default coordinates", () => { | ||
| const p = $$createSVGPoint($dummy_svg)(); | ||
| expect(p.x).toEqual(0); | ||
| expect(p.y).toEqual(0); | ||
| }); | ||
| test("will use 0 as default x coordinate", () => { | ||
| const p = $$createSVGPoint($dummy_svg)({ y: 10 }); | ||
| expect(p.x).toEqual(0); | ||
| }); | ||
| test("will use 0 as default y coordinate", () => { | ||
| const p = $$createSVGPoint($dummy_svg)({ x: 10 }); | ||
| expect(p.y).toEqual(0); | ||
| }); | ||
| }); |
@@ -8,2 +8,3 @@ # \$\$createSVGPoint | ||
| 입력받은 `x`, `y` 값을 설정합니다. | ||
| 소수점 값의 정확도 차이가 발생할 수 있습니다. | ||
@@ -10,0 +11,0 @@ [`<svg></svg>` 커링](../../svg_currying.md)이 적용된 함수입니다. |
@@ -1,88 +0,61 @@ | ||
| import { createSVGWindow } from "svgdom"; | ||
| import { expect } from "chai"; | ||
| import { makeAllCombinations, makeRandomInt } from "../../test/utils/index.js"; | ||
| import { $$createSVGRect } from "./createSVGRect.index.js"; | ||
| describe(`$$createSVGRect`, () => { | ||
| let $dummy_svg; | ||
| beforeEach(() => { | ||
| $dummy_svg = createSVGWindow().document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| const makeCases = () => { | ||
| const makeSubCases = () => | ||
| [[], ...makeAllCombinations(["x", "y", "width", "height"])].map((ks) => | ||
| ks | ||
| .map((k) => [k, makeRandomInt()]) | ||
| .reduce((acc, [k, v]) => { | ||
| acc[k] = v; | ||
| return acc; | ||
| }, {}) | ||
| ); | ||
| }); | ||
| test(`will create SVGRect with given coordinates and width, height`, () => { | ||
| const x = Math.round(Math.random() * 1000); | ||
| const y = Math.round(Math.random() * 1000); | ||
| const width = Math.round(Math.random() * 2000); | ||
| const height = Math.round(Math.random() * 2000); | ||
| return [ | ||
| { rect: $$createSVGRect()() }, | ||
| ...makeSubCases().map((values) => ({ | ||
| values, | ||
| rect: $$createSVGRect()(values), | ||
| })), | ||
| { | ||
| rect: $$createSVGRect( | ||
| document.createElementNS("http://www.w3.org/2000/svg", "svg") | ||
| )(), | ||
| }, | ||
| ...makeSubCases().map((values) => ({ | ||
| values, | ||
| rect: $$createSVGRect( | ||
| document.createElementNS("http://www.w3.org/2000/svg", "svg") | ||
| )(values), | ||
| })), | ||
| ]; | ||
| }; | ||
| const rect = $$createSVGRect($dummy_svg)({ x, y, width, height }); | ||
| describe(`$$createSVGRect`, function () { | ||
| it(`The return value will be a SVGRect.`, function () { | ||
| const cases = makeCases(); | ||
| expect(rect.x).toEqual(x); | ||
| expect(rect.y).toEqual(y); | ||
| expect(rect.width).toEqual(width); | ||
| expect(rect.height).toEqual(height); | ||
| for (const { rect } of cases) { | ||
| expect(rect).to.instanceof(SVGRect); | ||
| } | ||
| }); | ||
| test(`will use 0 as default coordinates and width, height`, () => { | ||
| const rect = $$createSVGRect($dummy_svg)(); | ||
| it(` | ||
| The SVGRect's each values are same with input values. | ||
| The omitted values will be 0. | ||
| `, function () { | ||
| const cases = makeCases(); | ||
| expect(rect.x).toEqual(0); | ||
| expect(rect.y).toEqual(0); | ||
| expect(rect.width).toEqual(0); | ||
| expect(rect.height).toEqual(0); | ||
| for (const { | ||
| rect, | ||
| values: { x = 0, y = 0, width = 0, height = 0 } = {}, | ||
| } of cases) { | ||
| expect(rect.x).to.equal(x); | ||
| expect(rect.y).to.equal(y); | ||
| expect(rect.width).to.equal(width); | ||
| expect(rect.height).to.equal(height); | ||
| } | ||
| }); | ||
| test(`will use 0 as default x coordinate`, () => { | ||
| const y = Math.round(Math.random() * 1000); | ||
| const width = Math.round(Math.random() * 2000); | ||
| const height = Math.round(Math.random() * 2000); | ||
| const rect = $$createSVGRect($dummy_svg)({ y, width, height }); | ||
| expect(rect.x).toEqual(0); | ||
| expect(rect.y).toEqual(y); | ||
| expect(rect.width).toEqual(width); | ||
| expect(rect.height).toEqual(height); | ||
| }); | ||
| test(`will use 0 as default y coordinate`, () => { | ||
| const x = Math.round(Math.random() * 1000); | ||
| const width = Math.round(Math.random() * 2000); | ||
| const height = Math.round(Math.random() * 2000); | ||
| const rect = $$createSVGRect($dummy_svg)({ x, width, height }); | ||
| expect(rect.x).toEqual(x); | ||
| expect(rect.y).toEqual(0); | ||
| expect(rect.width).toEqual(width); | ||
| expect(rect.height).toEqual(height); | ||
| }); | ||
| test(`will use 0 as default width`, () => { | ||
| const x = Math.round(Math.random() * 1000); | ||
| const y = Math.round(Math.random() * 1000); | ||
| const height = Math.round(Math.random() * 2000); | ||
| const rect = $$createSVGRect($dummy_svg)({ x, y, height }); | ||
| expect(rect.x).toEqual(x); | ||
| expect(rect.y).toEqual(y); | ||
| expect(rect.width).toEqual(0); | ||
| expect(rect.height).toEqual(height); | ||
| }); | ||
| test(`will use 0 as default height`, () => { | ||
| const x = Math.round(Math.random() * 1000); | ||
| const y = Math.round(Math.random() * 1000); | ||
| const width = Math.round(Math.random() * 2000); | ||
| const rect = $$createSVGRect($dummy_svg)({ x, y, width }); | ||
| expect(rect.x).toEqual(x); | ||
| expect(rect.y).toEqual(y); | ||
| expect(rect.width).toEqual(width); | ||
| expect(rect.height).toEqual(0); | ||
| }); | ||
| }); |
@@ -10,2 +10,4 @@ # \$\$createSVGRect | ||
| 입력한 `x`, `y`, `width`, `height` 값과 실제 적용된 값은 정확도 차이가 발생할 수 있습니다. | ||
| [`<svg></svg>` 커링](../../svg_currying.md)이 적용된 함수입니다. | ||
@@ -12,0 +14,0 @@ |
| # \$\$createSVGTransform | ||
| - [source](./createSVGTransform.index.js) | ||
| - [test](./createSVGTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `SVGTransform` 객체를 생성합니다. |
@@ -0,5 +1,8 @@ | ||
| import { $$createSVGMatrix } from "../createSVGMatrix/createSVGMatrix.index.js"; | ||
| import { $$createSVGTransform } from "../createSVGTransform/createSVGTransform.index.js"; | ||
| import { $$getSVG } from "../getSetSVG/getSetSVG.index.js"; | ||
| export const $$createSVGTransformMatrix = ($svg = $$getSVG()) => (matrix) => { | ||
| export const $$createSVGTransformMatrix = ($svg = $$getSVG()) => ( | ||
| matrix = $$createSVGMatrix($svg)() | ||
| ) => { | ||
| const transform = $$createSVGTransform($svg); | ||
@@ -6,0 +9,0 @@ transform.setMatrix(matrix); |
| # \$\$createSVGTransformMatrix | ||
| - [source](./createSVGTransformMatrix.index.js) | ||
| - [test](./createSVGTransformMatrix.spec.js) | ||
@@ -5,0 +6,0 @@ `type`이 `SVGTransform.SVG_TRANSFORM_MATRIX`인 `SVGTransform` 객체를 생성합니다. |
| # \$\$createSVGTransformRotate | ||
| - [source](./createSVGTransformRotate.index.js) | ||
| - [test](./createSVGTransformRotate.spec.js) | ||
@@ -5,0 +6,0 @@ `type`이 `SVGTransform.SVG_TRANSFORM_ROTATE`인 `SVGTransform` 객체를 생성합니다. |
| # \$\$createSVGTransformScale | ||
| - [source](./createSVGTransformScale.index.js) | ||
| - [test](./createSVGTransformScale.spec.js) | ||
@@ -9,2 +10,4 @@ `type`이 `SVGTransform.SVG_TRANSFORM_SCALE`인 `SVGTransform` 객체를 생성합니다. | ||
| 입력한 `sx`, `sy` 값과 실제 적용된 Transform 값은 정확도 차이가 발생할 수 있습니다. | ||
| [`<svg></svg>` 커링](../../svg_currying.md)이 적용된 함수입니다. | ||
@@ -11,0 +14,0 @@ |
| # \$\$createSVGTransformTranslate | ||
| - [source](./createSVGTransformTranslate.index.js) | ||
| - [test](./createSVGTransformTranslate.spec.js) | ||
@@ -8,2 +9,4 @@ `type`이 `SVGTransform.SVG_TRANSFORM_TRANSLATE`인 `SVGTransform` 객체를 생성합니다. | ||
| 입력한 `tx`, `ty` 값과 실제 Transform 에 적용된 값은 정확도 차이가 발생할 수 있습니다. | ||
| [`<svg></svg>` 커링](../../svg_currying.md)이 적용된 함수입니다. | ||
@@ -10,0 +13,0 @@ |
@@ -1,28 +0,25 @@ | ||
| import { createSVGWindow } from "svgdom"; | ||
| import { expect } from "chai"; | ||
| import { $$el } from "./el.index.js"; | ||
| describe(`$$el`, () => { | ||
| let $dummy_svg; | ||
| beforeEach(() => { | ||
| $dummy_svg = createSVGWindow().document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| ); | ||
| }); | ||
| test(`will return a "SVGElement" using the input SVG string`, () => { | ||
| describe(`$$el`, function () { | ||
| it(`The return value is a SVGElement representing the input SVG string.`, function () { | ||
| const str = `<circle cx="10" cy="20" r="30"></circle>`; | ||
| const $el = $$el($dummy_svg)(str); | ||
| const $els = [ | ||
| $$el()(str), | ||
| $$el(document.createElementNS("http://www.w3.org/2000/svg", "svg"))(str), | ||
| ]; | ||
| expect($el.nodeName.toLowerCase()).toEqual("circle"); | ||
| expect($el.getAttributeNS(null, "cx")).toEqual("10"); | ||
| expect($el.getAttributeNS(null, "cy")).toEqual("20"); | ||
| expect($el.getAttributeNS(null, "r")).toEqual("30"); | ||
| for (const $el of $els) { | ||
| expect($el).to.be.instanceof(SVGElement); | ||
| expect($el.nodeName.toLowerCase()).to.equal("circle"); | ||
| expect($el.getAttributeNS(null, "cx")).to.equal("10"); | ||
| expect($el.getAttributeNS(null, "cy")).to.equal("20"); | ||
| expect($el.getAttributeNS(null, "r")).to.equal("30"); | ||
| } | ||
| }); | ||
| test(` | ||
| will return the first "SVGElement" using the input SVG string | ||
| even there are multiple SVG Elements in SVG string | ||
| `, () => { | ||
| it(` | ||
| The return SVGElement will be the first element from the input SVG string. | ||
| All other elements will be ignored. | ||
| `, function () { | ||
| const str = ` | ||
@@ -32,7 +29,13 @@ <circle cx="10" cy="20" r="30"></circle> | ||
| `; | ||
| const $el = $$el($dummy_svg)(str); | ||
| const $els = [ | ||
| $$el()(str), | ||
| $$el(document.createElementNS("http://www.w3.org/2000/svg", "svg"))(str), | ||
| ]; | ||
| expect($el.nodeName.toLowerCase()).toEqual("circle"); | ||
| expect($el.nodeName.toLowerCase()).not.toEqual("rect"); | ||
| for (const $el of $els) { | ||
| expect($el).to.be.instanceof(SVGElement); | ||
| expect($el.nodeName.toLowerCase()).to.equal("circle"); | ||
| expect($el.nodeName.toLowerCase()).not.to.equal("rect"); | ||
| } | ||
| }); | ||
| }); |
@@ -1,16 +0,7 @@ | ||
| import { createSVGWindow } from "svgdom"; | ||
| import { expect } from "chai"; | ||
| import { $$els } from "./els.index.js"; | ||
| describe(`$$els`, () => { | ||
| let $dummy_svg; | ||
| beforeEach(() => { | ||
| $dummy_svg = createSVGWindow().document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| ); | ||
| }); | ||
| test(`will return a list of "SVGElement"s using the input SVG string`, () => { | ||
| const list = $$els($dummy_svg)(` | ||
| describe(`$$els`, function () { | ||
| it(`The return value is a list of "SVGElement"s using the input SVG string.`, function () { | ||
| const list = $$els()(` | ||
| <rect x="0" y="0" width="10" height="10"></rect> | ||
@@ -20,15 +11,17 @@ <circle cx="10" cy="10" r="30"></circle> | ||
| expect(list.length).toBe(2); | ||
| expect(list).to.have.lengthOf(2); | ||
| expect(list[0].nodeName.toLowerCase()).toEqual("rect"); | ||
| expect(list[0].getAttributeNS(null, "x")).toEqual("0"); | ||
| expect(list[0].getAttributeNS(null, "y")).toEqual("0"); | ||
| expect(list[0].getAttributeNS(null, "width")).toEqual("10"); | ||
| expect(list[0].getAttributeNS(null, "height")).toEqual("10"); | ||
| expect(list[0]).to.be.instanceof(SVGElement); | ||
| expect(list[0].nodeName.toLowerCase()).to.equal("rect"); | ||
| expect(list[0].getAttributeNS(null, "x")).to.equal("0"); | ||
| expect(list[0].getAttributeNS(null, "y")).to.equal("0"); | ||
| expect(list[0].getAttributeNS(null, "width")).to.equal("10"); | ||
| expect(list[0].getAttributeNS(null, "height")).to.equal("10"); | ||
| expect(list[1].nodeName.toLowerCase()).toEqual("circle"); | ||
| expect(list[1].getAttributeNS(null, "cx")).toEqual("10"); | ||
| expect(list[1].getAttributeNS(null, "cy")).toEqual("10"); | ||
| expect(list[1].getAttributeNS(null, "r")).toEqual("30"); | ||
| expect(list[1]).to.be.instanceof(SVGElement); | ||
| expect(list[1].nodeName.toLowerCase()).to.equal("circle"); | ||
| expect(list[1].getAttributeNS(null, "cx")).to.equal("10"); | ||
| expect(list[1].getAttributeNS(null, "cy")).to.equal("10"); | ||
| expect(list[1].getAttributeNS(null, "r")).to.equal("30"); | ||
| }); | ||
| }); |
| # \$\$getAnimTransformList | ||
| - [source](./getAnimTransformList.index.js) | ||
| - [test](./getAnimTransformList.spec.js) | ||
@@ -5,0 +6,0 @@ 입력받은 svg 객체의 `transform.animVal` 값을 반환합니다. |
| # \$\$getBaseTransformList | ||
| - [source](./getBaseTransformList.index.js) | ||
| - [test](./getBaseTransformList.spec.js) | ||
@@ -5,0 +6,0 @@ 입력받은 svg 객체의 `transform.baseVal` 값을 반환합니다. |
| # \$\$getBoxPoints | ||
| - [source](./getBoxPoints.index.js) | ||
| - [test](./getBoxPoints.spec.js) | ||
@@ -5,0 +6,0 @@ svg 객체의 영역에 해당하는 `SVGPoint`들을 반환합니다. 해당 svg 객체는 DOM 트리의 `<svg></svg>` 태그에 속해 있어야 합니다. |
| # \$\$getCenterPoint | ||
| - [source](./getCenterPoint.index.js) | ||
| - [test](./getCenterPoint.spec.js) | ||
@@ -5,0 +6,0 @@ svg 객체의 중심에 해당하는 `SVGPoint`를 반환합니다. 해당 svg 객체는 DOM 트리의 `<svg></svg>` 태그에 속해 있어야 합니다. |
@@ -1,44 +0,38 @@ | ||
| import { createSVGWindow } from "svgdom"; | ||
| import { expect } from "chai"; | ||
| import { $$getSVG, $$setSVG } from "./getSetSVG.index.js"; | ||
| describe(`$$setSVG + $$getSVG`, () => { | ||
| test(`$$setSVG will change return value of $$getSVG`, () => { | ||
| const $svg = createSVGWindow().document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| ); | ||
| describe(`$$setSVG + $$getSVG`, function () { | ||
| it(`$$setSVG will change return value of $$getSVG.`, function () { | ||
| const $svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); | ||
| $$setSVG($svg); | ||
| expect($$getSVG()).toBe($svg); | ||
| expect($$getSVG()).to.equal($svg); | ||
| }); | ||
| }); | ||
| describe(`$$setSVG`, () => { | ||
| test(`return the 1st argument`, () => { | ||
| const $svg = createSVGWindow().document.createElementNS( | ||
| "http://www.w3.org/2000/svg", | ||
| "svg" | ||
| ); | ||
| describe(`$$setSVG`, function () { | ||
| it(`The return value is the 1st argument.`, function () { | ||
| const $svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); | ||
| expect($$setSVG($svg)).toBe($svg); | ||
| expect($$setSVG($svg)).to.equal($svg); | ||
| }); | ||
| }); | ||
| describe(`$$getSVG`, () => { | ||
| beforeEach(() => { | ||
| describe(`$$getSVG`, function () { | ||
| beforeEach(function () { | ||
| $$setSVG(undefined); | ||
| }); | ||
| test(`will return SVGSVGElement`, () => { | ||
| it(`The return value is a SVGSVGElement.`, function () { | ||
| const $svg = $$getSVG(); | ||
| expect($svg.nodeName.toLowerCase()).toEqual("svg"); | ||
| expect($svg.nodeName.toLowerCase()).to.equal("svg"); | ||
| }); | ||
| test(`will always return same value`, () => { | ||
| it(`The return value will be always same.`, function () { | ||
| const $svg1 = $$getSVG(); | ||
| const $svg2 = $$getSVG(); | ||
| expect($svg1).toBe($svg2); | ||
| expect($svg1).to.equal($svg2); | ||
| }); | ||
| }); |
| # \$\$initRotateTransform | ||
| - [source](./initRotateTransform.index.js) | ||
| - [test](./initRotateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ svg 엘리먼트에 총 3개의 `SVGTransform`을 순서대로 추가합니다. |
| # \$\$initTranslateTransform | ||
| - [source](./initTranslateTransform.index.js) | ||
| - [test](./initTranslateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ svg 엘리먼트에 `SVGTransform.SVG_TRANSFORM_TRANSLATE` 타입의 `SVGTransform` 을 추가합니다. |
@@ -1,2 +0,8 @@ | ||
| export const $$isRotateSVGTransform = ({ type, SVG_TRANSFORM_ROTATE }) => | ||
| type === SVG_TRANSFORM_ROTATE; | ||
| export const $$isRotateSVGTransform = (transform) => { | ||
| if (!(transform instanceof SVGTransform)) { | ||
| throw new Error("It's not a SVGTransform."); | ||
| } | ||
| const { type, SVG_TRANSFORM_ROTATE } = transform; | ||
| return type === SVG_TRANSFORM_ROTATE; | ||
| }; |
| # \$\$isRotateSVGTransform | ||
| - [source](./isRotateSVGTransform.index.js) | ||
| - [test](./isRotateSVGTransform.spec.js) | ||
@@ -5,0 +6,0 @@ 해당 `SVGTransform`의 `type`이 `SVGTransform.SVG_TRANSFORM_ROTATE`인지 여부를 판단합니다. |
@@ -1,2 +0,8 @@ | ||
| export const $$isScaleSVGTransform = ({ type, SVG_TRANSFORM_SCALE }) => | ||
| type === SVG_TRANSFORM_SCALE; | ||
| export const $$isScaleSVGTransform = (transform) => { | ||
| if (!(transform instanceof SVGTransform)) { | ||
| throw new Error("It's not a SVGTransform."); | ||
| } | ||
| const { type, SVG_TRANSFORM_SCALE } = transform; | ||
| return type === SVG_TRANSFORM_SCALE; | ||
| }; |
| # \$\$isScaleSVGTransform | ||
| - [source](./isScaleSVGTransform.index.js) | ||
| - [test](./isScaleSVGTransform.spec.js) | ||
@@ -5,0 +6,0 @@ 해당 `SVGTransform`의 `type`이 `SVGTransform.SVG_TRANSFORM_SCALE`인지 여부를 판단합니다. |
@@ -1,2 +0,8 @@ | ||
| export const $$isTranslateSVGTransform = ({ type, SVG_TRANSFORM_TRANSLATE }) => | ||
| type === SVG_TRANSFORM_TRANSLATE; | ||
| export const $$isTranslateSVGTransform = (transform) => { | ||
| if (!(transform instanceof SVGTransform)) { | ||
| throw new Error("It's not a SVGTransform."); | ||
| } | ||
| const { type, SVG_TRANSFORM_TRANSLATE } = transform; | ||
| return type === SVG_TRANSFORM_TRANSLATE; | ||
| }; |
| # \$\$isTranslateSVGTransform | ||
| - [source](./isTranslateSVGTransform.index.js) | ||
| - [test](./isTranslateSVGTransform.spec.js) | ||
@@ -5,0 +6,0 @@ 해당 `SVGTransform`의 `type`이 `SVGTransform.SVG_TRANSFORM_TRANSLATE`인지 여부를 판단합니다. |
@@ -9,2 +9,5 @@ import { $$createSVGTransformRotate } from "../createSVGTransformRotate/createSVGTransformRotate.index.js"; | ||
| const base_tl = $$getBaseTransformList($el); | ||
| if (base_tl.numberOfItems < 3) { | ||
| return $el; | ||
| } | ||
@@ -18,2 +21,4 @@ const transform1 = base_tl.getItem(0); | ||
| !$$isTranslateSVGTransform(transform3) || | ||
| transform2.matrix.e !== 0 || | ||
| transform2.matrix.f !== 0 || | ||
| transform1.matrix.a !== 1 || | ||
@@ -20,0 +25,0 @@ transform1.matrix.b !== 0 || |
| # \$\$mergeRotateTransform | ||
| - [source](./mergeRotateTransform.index.js) | ||
| - [test](./mergeRotateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `$$initRotateTransform` 으로 적용된 3개의 `SVGTransform` 객체를 하나의 `SVGTransform` 으로 병합합니다. |
@@ -11,2 +11,5 @@ import { $$createSVGTransformTranslate } from "../createSVGTransformTranslate/createSVGTransformTranslate.index.js"; | ||
| const base_tl = $$getBaseTransformList($el); | ||
| if (base_tl.numberOfItems < 1) { | ||
| return $el; | ||
| } | ||
@@ -13,0 +16,0 @@ const last_transform = base_tl.getItem(0); |
| # \$\$mergeTranslateTransform | ||
| - [source](./mergeTranslateTransform.index.js) | ||
| - [test](./mergeTranslateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ svg 엘리먼트에 가장 마지막으로 적용된 `SVGTransform` 이 `SVGTransform.SVG_TRANSFORM_TRANSLATE` 타입인 경우 |
| # \$\$updateRotateTransform | ||
| - [source](./updateRotateTransform.index.js) | ||
| - [test](./updateRotateTransform.spec.js) | ||
@@ -5,0 +6,0 @@ `SVGTransform.SVG_TRANSFORM_ROTATE` 타입의 `SVGTransform` 의 `angle` 값을 수정합니다. |
| import { $$isRotateSVGTransform } from "../isRotateSVGTransform/isRotateSVGTransform.index.js"; | ||
| export const $$updateRotateTransform = (transform, { angle }) => { | ||
| export const $$updateRotateTransform = ( | ||
| transform, | ||
| { angle, cx = 0, cy = 0 } = {} | ||
| ) => { | ||
| if (!$$isRotateSVGTransform(transform)) { | ||
| return transform; | ||
| } | ||
| transform.setRotate(angle, 0, 0); | ||
| transform.setRotate(angle == null ? transform.angle : angle, cx, cy); | ||
| return transform; | ||
| }; |
| # \$\$updateTranslateTransform | ||
| - [source](./updateTranslateTransform.index.js) | ||
| - [test](./updateTranslateTransform.spec.js) | ||
@@ -10,2 +11,4 @@ `SVGTransform.SVG_TRANSFORM_TRANSLATE` 타입의 `SVGTransform` 의 `tx`, `ty` 값을 수정합니다. | ||
| 입력한 `tx`, `ty` 값과 실제 Transform 에 적용된 값은 정확도 차이가 발생할 수 있습니다. | ||
| ```javascript | ||
@@ -12,0 +15,0 @@ const t = $$createSVGTransformTranslate()({ tx: 10, ty: 20 }); |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by106.04%
155740
- Dev dependency count
- decreased by-25%
6
- Number of package files
- increased by32.86%
93
- Lines of code
- increased by279.1%
2794
- Number of lines in readme file
- increased by2.89%
285
No dependency changes