{"version":3,"file":"script.js","mappings":"yBAAA,IAAI,EAA+BA,GAAGC,QCYtC,EAZc,SAAC,GAA6B,IAA3BC,EAA2B,EAA3BA,WAAYC,EAAe,EAAfA,SACpBC,EAAqBF,EAArBE,SAAUC,EAAWH,EAAXG,OAElB,OAAO,kCAAOC,wBAAyB,CACtCC,OAAQ,8BACQJ,EADR,0CAEG,QAAUE,GAAU,OAASA,GAAU,QAAUA,EAAS,QAAUA,EAFvE,+BAGM,QAAUD,EAAW,iBAAmB,eAH9C,kBAKNI,QAAQ,OAAQ,SCQpB,EAbkB,SAAC,GAAmB,IAAjBN,EAAiB,EAAjBA,WACZO,EAAoBP,EAApBO,SAAUC,EAAUR,EAAVQ,MAEZC,GAAeC,EAAAA,EAAAA,QAAO,MAQ5B,OANAC,EAAAA,EAAAA,YAAU,YCTQ,SAACC,EAAUC,EAAQN,EAAUC,GAK/C,SAASM,IACR,IAAK,IAAIC,EAAI,EAAGA,EAAIP,EAAMQ,OAAQD,IAAK,CAUtC,IATA,MAAgDP,EAAMO,GAA9CE,EAAR,EAAQA,UAAWC,EAAnB,EAAmBA,YAAaC,EAAhC,EAAgCA,YAE5BC,EAAO,IAAIR,EAASS,KAAK,CAC5BJ,UAAAA,EACAC,YAAAA,EACAC,YAAAA,EACAG,QAAQ,IAGAC,EAAI,EAAGA,GAAKhB,EAAW,EAAGgB,IAClCH,EAAKI,IAAI,IAAIZ,EAASa,MAAMb,EAASc,KAAKC,KAAKC,MAAQrB,EAAWgB,EAdlD,KAgBjBH,EAAKI,IAAI,CAACZ,EAASc,KAAKC,KAAKC,MAAQ,EAAGhB,EAASc,KAAKC,KAAKxB,OAAS,GAAI,EAAE,EAAGS,EAASc,KAAKC,KAAKxB,OAAS,IAEzGK,EAAMO,GAAGR,SAAWa,EAAKb,UApB3BK,EAASiB,MAAMhB,GAuBfC,IAEAF,EAASc,KAAKI,SAAW,WACxBhB,KAGDF,EAASc,KAAKK,QAAU,SAAAC,GACvB,IAAK,IAAIjB,EAAI,EAAGA,GAAKP,EAAM,GAAGD,SAASS,OAAS,EAAGD,IAClD,IAAK,IAAIQ,EAAI,EAAGA,EAAIf,EAAMQ,OAAQO,IAAK,CACtC,MAA6Cf,EAAMe,GAA3CU,EAAR,EAAQA,MAAOC,EAAf,EAAeA,MAAOhC,EAAtB,EAAsBA,SAChBiC,EADN,EAAgC5B,SACPQ,GAEnBqB,EAAQC,KAAKC,IAAIN,EAAEO,KAAON,EAAQlB,EAAImB,GAE5CC,EAAQK,MAAMC,EAAY,GAARL,EAnCF,GAmC4BlC,EAExCa,EAAI,GAAKA,EAAIP,EAAM,GAAGD,SAASS,OAAS,GAC3CmB,EAAQO,WD7BXC,CAFiB,IAAIC,MAAMC,WAENpC,EAAaqC,QAASvC,EAAUC,KACnD,CAACC,EAAcF,EAAUC,IAErB,mCAAQuC,UAAU,eAAeC,QAAM,EAACC,IAAKxC,KERrDyC,SAASC,iBAAiB,oBAAoB,WACxBD,SAASE,iBAAiB,2BAClCC,SAAQ,SAAAC,GACpB,IAAMtD,EAAauD,KAAKC,MAAMF,EAAUG,QAAQzD,aAEhD0D,EAAAA,EAAAA,QAAO,kDACN,yBAAC,EAAD,CAAO1D,WAAYA,EAAYC,SAAUD,EAAW2D,MAEpD,yBAAC,EAAD,CAAW3D,WAAYA,KACnBsD,GAELA,SAAAA,EAAWM,gBAAgB,yB","sources":["webpack://separator/external var [\"wp\",\"element\"]","webpack://separator/./src/Style.js","webpack://separator/./src/Separator.js","webpack://separator/./src/Const/functions.js","webpack://separator/./src/script.js"],"sourcesContent":["var __WEBPACK_NAMESPACE_OBJECT__ = wp.element;","const Style = ({ attributes, clientId }) => {\r\n\tconst { position, height } = attributes;\r\n\r\n\treturn <style dangerouslySetInnerHTML={{\r\n\t\t__html: `\r\n\t\t#sepSeparator-${clientId} .sepSeparator{\r\n\t\t\theight: ${'0px' === height || '0%' === height || '0em' === height ? '300px' : height};\r\n\t\t\ttransform: ${'top' === position ? 'rotate(180deg)' : 'rotate(0deg)'};\r\n\t\t}\r\n\t\t`.replace(/\\s+/g, ' ')\r\n\t}} />;\r\n}\r\nexport default Style;","import { useEffect, useRef } from '@wordpress/element';\r\n\r\nimport { canvasWave } from './Const/functions';\r\n\r\nconst Separator = ({ attributes }) => {\r\n\tconst { segments, waves } = attributes;\r\n\r\n\tconst sepSeparator = useRef(null);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst sepPaper = new paper.PaperScope();\r\n\r\n\t\tcanvasWave(sepPaper, sepSeparator.current, segments, waves);\r\n\t}, [sepSeparator, segments, waves]);\r\n\r\n\treturn <canvas className='sepSeparator' resize ref={sepSeparator}></canvas>\r\n}\r\nexport default Separator;","const canvasWave = (thePaper, canvas, segments, waves) => {\r\n\tthePaper.setup(canvas);\r\n\r\n\tconst waveHeight = 35;\r\n\r\n\tfunction createSegments() {\r\n\t\tfor (let i = 0; i < waves.length; i++) {\r\n\t\t\tconst { fillColor, strokeWidth, strokeColor } = waves[i];\r\n\r\n\t\t\tlet path = new thePaper.Path({\r\n\t\t\t\tfillColor,\r\n\t\t\t\tstrokeWidth,\r\n\t\t\t\tstrokeColor,\r\n\t\t\t\tclosed: true\r\n\t\t\t});\r\n\r\n\t\t\tfor (let j = 0; j <= segments + 1; j++) {\r\n\t\t\t\tpath.add(new thePaper.Point(thePaper.view.size.width / segments * j, waveHeight));\r\n\t\t\t}\r\n\t\t\tpath.add([thePaper.view.size.width + 5, thePaper.view.size.height + 5], [-5, thePaper.view.size.height + 5]);\r\n\r\n\t\t\twaves[i].segments = path.segments;\r\n\t\t}\r\n\t}\r\n\tcreateSegments();\r\n\r\n\tthePaper.view.onResize = () => {\r\n\t\tcreateSegments();\r\n\t}\r\n\r\n\tthePaper.view.onFrame = e => {\r\n\t\tfor (let i = 0; i <= waves[0].segments.length - 3; i++) {\r\n\t\t\tfor (let j = 0; j < waves.length; j++) {\r\n\t\t\t\tconst { speed, shape, position, segments } = waves[j];\r\n\t\t\t\tconst segment = segments[i];\r\n\r\n\t\t\t\tconst sinus = Math.sin(e.time * speed + i / shape);\r\n\r\n\t\t\t\tsegment.point.y = sinus * 34 + waveHeight + position;\r\n\r\n\t\t\t\tif (i > 0 && i < waves[0].segments.length - 3) {\r\n\t\t\t\t\tsegment.smooth();\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\nexport { canvasWave };","import { render } from '@wordpress/element';\r\n\r\nimport './style.scss';\r\nimport Style from './Style';\r\nimport Separator from './Separator';\r\n\r\n// Separator\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n\tconst allSeparator = document.querySelectorAll('.wp-block-sep-separator');\r\n\tallSeparator.forEach(separator => {\r\n\t\tconst attributes = JSON.parse(separator.dataset.attributes);\r\n\r\n\t\trender(<>\r\n\t\t\t<Style attributes={attributes} clientId={attributes.cId} />\r\n\r\n\t\t\t<Separator attributes={attributes} />\r\n\t\t</>, separator);\r\n\r\n\t\tseparator?.removeAttribute('data-attributes');\r\n\t});\r\n});"],"names":["wp","element","attributes","clientId","position","height","dangerouslySetInnerHTML","__html","replace","segments","waves","sepSeparator","useRef","useEffect","thePaper","canvas","createSegments","i","length","fillColor","strokeWidth","strokeColor","path","Path","closed","j","add","Point","view","size","width","setup","onResize","onFrame","e","speed","shape","segment","sinus","Math","sin","time","point","y","smooth","canvasWave","paper","PaperScope","current","className","resize","ref","document","addEventListener","querySelectorAll","forEach","separator","JSON","parse","dataset","render","cId","removeAttribute"],"sourceRoot":""}