glre 0.12.0 → 0.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/events.ts CHANGED
@@ -1,68 +1,105 @@
1
1
  import { event } from 'reev'
2
2
  import { createProgram, createShader, createTexture, concat } from './utils'
3
- import type { GL } from './types'
3
+ import type { GL, GLEvent } from './types'
4
4
 
5
- export const glEvent = (self: GL) =>
6
- event({
7
- // run if canvas is mounted
8
- mount(e) {
9
- // @TODO abbreviate to import uniform
10
- // self.uniformHeader.map(([key, header]) => self.frag = concat(self.frag, header, key))
11
- // self.uniformHeader.map(([key, header]) => self.frag = concat(self.vert, header, key))
12
- // self.attributeHeader.map(([key, header]) => self.vert = concat(self.vert, header, key))
13
- if (self.int) self.frag = concat(self.frag, `precision ${self.int} int;`)
14
- if (self.float) self.frag = concat(self.frag, `precision ${self.float} float;`)
15
- if (self.sampler2D) self.frag = concat(self.frag, `precision ${self.sampler2D} sampler2D;`)
16
- if (self.samplerCube) self.frag = concat(self.frag, `precision ${self.samplerCube} samplerCube;`)
17
- const el = (self.el = document.getElementById(self.id)) // @ts-ignore
18
- const gl = (self.gl = el?.getContext('webgl'))
19
- const frag = createShader(gl, self.frag, gl?.FRAGMENT_SHADER)
20
- const vert = createShader(gl, self.vert, gl?.VERTEX_SHADER)
21
- self.pg = createProgram(gl, vert, frag) // !!!
22
- window.addEventListener('resize', e.on('resize'))
23
- window.addEventListener('mousemove', e.on('mousemove'))
24
- e('resize')
25
- let iTime = performance.now(), iPrevTime = 0, iDeltaTime = 0;
26
- self.setFrame(() => {
27
- iPrevTime = iTime
28
- iTime = performance.now() / 1000
29
- iDeltaTime = iTime - iPrevTime
30
- self.setUniform({ iTime, iPrevTime, iDeltaTime })
31
- return true;
32
- })
33
- self.frame()
34
- },
35
- // run if canvas is cleaned
36
- clean(e) {
37
- window.removeEventListener('resize', e.on('resize'))
38
- window.removeEventListener('mousemove', e.on('mousemove'))
39
- self.frame.cancel()
40
- },
41
- // user mousemove event
42
- mousemove(_e, { clientX, clientY }) {
43
- const [w, h] = self.size
44
- self.mouse[0] = (clientX - w / 2) / (w / 2)
45
- self.mouse[1] = -(clientY - h / 2) / (h / 2)
46
- self.setUniform('iMouse', self.mouse)
47
- },
48
- // user mousemove event
49
- resize(_e, _resizeEvent, width = 0, height = 0) {
50
- self.size[0] = self.el.width = width || window.innerWidth
51
- self.size[1] = self.el.height = height || window.innerHeight
52
- self.setUniform('iResolution', self.size)
53
- },
54
- // load image event
55
- load(_e, _loadEvent, image) {
56
- self.setFrame(() => {
57
- const activeUnit = self.activeUnit(image.alt)
58
- const location = self.location(image.alt)
59
- const texture = createTexture(self.gl, image)
60
- self.setFrame(() => {
61
- self.gl.uniform1i(location, activeUnit)
62
- self.gl.activeTexture(self.gl['TEXTURE' + activeUnit])
63
- self.gl.bindTexture(self.gl.TEXTURE_2D, texture)
64
- return true
65
- })
66
- })
67
- }
68
- } as any)
5
+ export const glEvent = (self: GL) => {
6
+ const e = event<GLEvent>()
7
+ return e({
8
+ // run if canvas is mounted
9
+ mount() {
10
+ if (self.int)
11
+ self.frag = concat(
12
+ self.frag,
13
+ `precision ${self.int} int;`
14
+ )
15
+ if (self.float)
16
+ self.frag = concat(
17
+ self.frag,
18
+ `precision ${self.float} float;`
19
+ )
20
+ if (self.sampler2D)
21
+ self.frag = concat(
22
+ self.frag,
23
+ `precision ${self.sampler2D} sampler2D;`
24
+ )
25
+ if (self.samplerCube)
26
+ self.frag = concat(
27
+ self.frag,
28
+ `precision ${self.samplerCube} samplerCube;`
29
+ )
30
+ const el = (self.el = document.getElementById(self.id))
31
+ const gl = (self.gl = (el as any)?.getContext('webgl'))
32
+ const frag = createShader(
33
+ gl,
34
+ self.frag,
35
+ gl.FRAGMENT_SHADER
36
+ )
37
+ const vert = createShader(
38
+ gl,
39
+ self.vert,
40
+ gl.VERTEX_SHADER
41
+ )
42
+ self.pg = createProgram(gl, vert, frag)
43
+ window.addEventListener('resize', e.resize)
44
+ window.addEventListener('mousemove', e.mousemove)
45
+ e.resize()
46
+ let iTime = performance.now(),
47
+ iPrevTime = 0,
48
+ iDeltaTime = 0
49
+ self.setFrame(() => {
50
+ iPrevTime = iTime
51
+ iTime = performance.now() / 1000
52
+ iDeltaTime = iTime - iPrevTime
53
+ self.setUniform({
54
+ iTime,
55
+ iPrevTime,
56
+ iDeltaTime,
57
+ })
58
+ return true
59
+ })
60
+ self.frame()
61
+ },
62
+ // run if canvas is cleaned
63
+ clean() {
64
+ window.removeEventListener('resize', e.resize)
65
+ window.removeEventListener('mousemove', e.mousemove)
66
+ self.frame.cancel()
67
+ },
68
+ // user mousemove event
69
+ mousemove({ clientX, clientY }) {
70
+ const [w, h] = self.size
71
+ self.mouse[0] = (clientX - w / 2) / (w / 2)
72
+ self.mouse[1] = -(clientY - h / 2) / (h / 2)
73
+ self.setUniform('iMouse', self.mouse)
74
+ },
75
+ // user mousemove event
76
+ resize(
77
+ _resizeEvent,
78
+ width = window.innerWidth,
79
+ height = window.innerHeight
80
+ ) {
81
+ self.size[0] = self.el.width = width
82
+ self.size[1] = self.el.height = height
83
+ self.setUniform('iResolution', self.size)
84
+ },
85
+ // load image event
86
+ load(_loadEvent, image) {
87
+ self.setFrame(() => {
88
+ const activeUnit = self.activeUnit(image.alt)
89
+ const location = self.location(image.alt)
90
+ const texture = createTexture(self.gl, image)
91
+ self.setFrame(() => {
92
+ self.gl.uniform1i(location, activeUnit)
93
+ self.gl.activeTexture(
94
+ self.gl['TEXTURE' + activeUnit]
95
+ )
96
+ self.gl.bindTexture(
97
+ self.gl.TEXTURE_2D,
98
+ texture
99
+ )
100
+ return true
101
+ })
102
+ })
103
+ },
104
+ } as any)
105
+ }
package/index.cjs.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("refr"),r=require("reev");function n(e,r){for(var n=e[0],t=0,o=r.length;t<o;t+=1)n+=r[t]+e[t+1];return n}function t(e){return Array.isArray(e)&&"string"==typeof e[0]}function o(e,r){return e=e.replace(/\s+/g,""),r=r.replace(/\s+/g,""),-1!==e.indexOf(r)}function i(e,r,n){return void 0===n&&(n=""),""!==n&&!o(e,n)||o(e,r)?e:r+e}function a(e,r){void 0===r&&(r=!1);var n="number"==typeof e?0:e.length;return n?r?["uniformMatrix"+(n=Math.sqrt(n)<<0)+"fv","mat"+n]:["uniform"+n+"fv","vec"+n]:["uniform1f","float"]}function u(e,r,n){var t=e.createShader(n);if(e.shaderSource(t,r),e.compileShader(t),e.getShaderParameter(t,e.COMPILE_STATUS))return t;console.warn(e.getShaderInfoLog(t))}function f(e,r,n,t,o){e.bindBuffer(e.ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,n),e.bufferData(e.ARRAY_BUFFER,new Float32Array(r),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),n}}(e,t)),e.enableVertexAttribArray(n),e.vertexAttribPointer(n,r,e.FLOAT,!1,0,0),o&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,n),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(r),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),n}}(e,o))}var l=function(e){return r.event({mount:function(r){e.int&&(e.frag=i(e.frag,"precision "+e.int+" int;")),e.float&&(e.frag=i(e.frag,"precision "+e.float+" float;")),e.sampler2D&&(e.frag=i(e.frag,"precision "+e.sampler2D+" sampler2D;")),e.samplerCube&&(e.frag=i(e.frag,"precision "+e.samplerCube+" samplerCube;"));var n=e.el=document.getElementById(e.id),t=e.gl=null==n?void 0:n.getContext("webgl"),o=u(t,e.frag,null==t?void 0:t.FRAGMENT_SHADER),a=u(t,e.vert,null==t?void 0:t.VERTEX_SHADER);e.pg=function(e,r,n){var t=e.createProgram();return e.attachShader(t,r),e.attachShader(t,n),e.linkProgram(t),e.getProgramParameter(t,e.LINK_STATUS)?(e.useProgram(t),t):(console.log(e.getProgramInfoLog(t)),null)}(t,a,o),window.addEventListener("resize",r.on("resize")),window.addEventListener("mousemove",r.on("mousemove")),r("resize");var f=performance.now(),l=0,c=0;e.setFrame((function(){return l=f,f=performance.now()/1e3,c=f-l,e.setUniform({iTime:f,iPrevTime:l,iDeltaTime:c}),!0})),e.frame()},clean:function(r){window.removeEventListener("resize",r.on("resize")),window.removeEventListener("mousemove",r.on("mousemove")),e.frame.cancel()},mousemove:function(r,n){var t=n.clientX,o=n.clientY,i=e.size,a=i[0],u=i[1];e.mouse[0]=(t-a/2)/(a/2),e.mouse[1]=-(o-u/2)/(u/2),e.setUniform("iMouse",e.mouse)},resize:function(r,n,t,o){void 0===t&&(t=0),void 0===o&&(o=0),e.size[0]=e.el.width=t||window.innerWidth,e.size[1]=e.el.height=o||window.innerHeight,e.setUniform("iResolution",e.size)},load:function(r,n,t){e.setFrame((function(){var r=e.activeUnit(t.alt),n=e.location(t.alt),o=function(e,r){var n=e.createTexture();return e.bindTexture(e.TEXTURE_2D,n),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,r),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),n}(e.gl,t);e.setFrame((function(){return e.gl.uniform1i(n,r),e.gl.activeTexture(e.gl["TEXTURE"+r]),e.gl.bindTexture(e.gl.TEXTURE_2D,o),!0}))}))}})},c=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],s="\n attribute vec4 a_position;\n void main() {\n gl_Position = a_position;\n }\n",v="\n uniform vec2 resolution;\n void main() {\n gl_FragColor = vec4(fract(gl_FragCoord.xy / resolution), 0, 1);\n }\n",m=function(o){var i=function e(r){for(var o=arguments.length,i=new Array(o>1?o-1:0),a=1;a<o;a++)i[a-1]=arguments[a];return t(r)&&(r=n(r,i)),"string"==typeof r&&(e.frag=r),"function"==typeof r&&e.frame.mount(r),e};i.id="myCanvas",i.frag=v,i.vert=s,i.size=[0,0],i.mouse=[0,0],i.count=6,i.uniformHeader=[],i.attributeHeader=[];var u=i.event=l(i),m=i.frame=e.frame();i.lastActiveUnit=0,i.activeUnit=r.nested((function(){return i.lastActiveUnit++})),i.vertexStride=r.nested((function(e,r,n){var t=n?Math.max.apply(Math,n)+1:i.count,o=r.length/t<<0;return i.attributeHeader.push([e,"vertex vec"+o+" "+e+";"]),o})),i.uniformType=r.nested((function(e,r,n){var t=a(r,n),o=t[0],u=t[1];return i.uniformHeader.push([e,"uniform "+u+" "+e+";"]),o})),i.location=r.nested((function(e,r){var n,t;return void 0===r&&(r=!1),r?null==(n=i.gl)?void 0:n.getAttribLocation(i.pg,e):null==(t=i.gl)?void 0:t.getUniformLocation(i.pg,e)})),i.setDpr=function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];return void u.apply(void 0,["resize",{}].concat(r))||i},i.setSize=function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];return void u.apply(void 0,["resize",{}].concat(r))||i},i.setFrame=function(e){return void m.mount(e)||i},i.setMount=function(e){return void u.mount({mount:e})||i},i.setClean=function(e){return void u.mount({clean:e})||i},i.setConfig=r.durable((function(e,r){i[e]=r}),i),i.setUniform=r.durable((function(e,r,n){void 0===n&&(n=!1);var t=i.uniformType(e,r,n);i.setFrame((function(){n?i.gl[t](i.location(e),!1,r):i.gl[t](i.location(e),r)}))}),i),i.setAttribute=r.durable((function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),t=1;t<r;t++)n[t-1]=arguments[t];var o=i.vertexStride.apply(i,[e].concat(n));i.setFrame((function(){f.apply(void 0,[i.gl,o,i.location(e,!0)].concat(n))}))}),i),i.setTexture=r.durable((function(e,r){var n=new Image;n.addEventListener("load",(function(e){return u("load",e,n)}),!1),Object.assign(n,{src:r,alt:e,crossOrigin:"anonymous"})}),i),i.mount=u.on("mount"),i.clean=u.on("clean"),i.clear=function(e){return i.gl.clear(i.gl[e||"COLOR_BUFFER_BIT"])},i.viewport=function(e){var r;return(r=i.gl).viewport.apply(r,[0,0].concat(e||i.size))},i.drawArrays=function(e){return void 0===e&&(e="TRIANGLES"),i.gl.drawArrays(i.gl[e],0,i.count)},i.drawElements=function(e,r){return void 0===e&&(e="TRIANGLES"),void 0===r&&(r="UNSIGNED_SHORT"),i.gl.drawElements(i.gl[e],i.count,i.gl[r],0)};for(var d=arguments.length,g=new Array(d>1?d-1:0),E=1;E<d;E++)g[E-1]=arguments[E];return t(o)&&(o=n(o,g)),"string"==typeof o&&(i.frag=o),"object"==typeof o&&i.setConfig(o),6===i.count&&i.setAttribute({a_position:c}),i};m.default=null,exports.default=m,exports.gl=m;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("refr"),r=require("reev");function n(e,r){for(var n=e[0],t=0,i=r.length;t<i;t+=1)n+=r[t]+e[t+1];return n}function t(e){return Array.isArray(e)&&"string"==typeof e[0]}function i(e,r,n){return void 0===n&&(n=""),""!==n&&!e.includes(n)||function(e,r){return e=e.replace(/\s+/g,""),r=r.replace(/\s+/g,""),e.includes(r)}(e,r)?e:r+e}function o(e,r){void 0===r&&(r=!1);var n="number"==typeof e?0:e.length;return n?r?["uniformMatrix"+(n=Math.sqrt(n)<<0)+"fv","mat"+n]:["uniform"+n+"fv","vec"+n]:["uniform1f","float"]}function a(e,r,n){var t=e.createShader(n);if(e.shaderSource(t,r),e.compileShader(t),e.getShaderParameter(t,e.COMPILE_STATUS))return t;console.warn(e.getShaderInfoLog(t))}function u(e,r,n,t,i){e.bindBuffer(e.ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,n),e.bufferData(e.ARRAY_BUFFER,new Float32Array(r),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),n}}(e,t)),e.enableVertexAttribArray(n),e.vertexAttribPointer(n,r,e.FLOAT,!1,0,0),i&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,n),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(r),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),n}}(e,i))}var f=function(e){var n=r.event();return n({mount:function(){e.int&&(e.frag=i(e.frag,"precision "+e.int+" int;")),e.float&&(e.frag=i(e.frag,"precision "+e.float+" float;")),e.sampler2D&&(e.frag=i(e.frag,"precision "+e.sampler2D+" sampler2D;")),e.samplerCube&&(e.frag=i(e.frag,"precision "+e.samplerCube+" samplerCube;"));var r=e.el=document.getElementById(e.id),t=e.gl=null==r?void 0:r.getContext("webgl"),o=a(t,e.frag,t.FRAGMENT_SHADER),u=a(t,e.vert,t.VERTEX_SHADER);e.pg=function(e,r,n){var t=e.createProgram();return e.attachShader(t,r),e.attachShader(t,n),e.linkProgram(t),e.getProgramParameter(t,e.LINK_STATUS)?(e.useProgram(t),t):(console.log(e.getProgramInfoLog(t)),null)}(t,u,o),window.addEventListener("resize",n.resize),window.addEventListener("mousemove",n.mousemove),n.resize();var f=performance.now(),l=0,c=0;e.setFrame((function(){return l=f,f=performance.now()/1e3,c=f-l,e.setUniform({iTime:f,iPrevTime:l,iDeltaTime:c}),!0})),e.frame()},clean:function(){window.removeEventListener("resize",n.resize),window.removeEventListener("mousemove",n.mousemove),e.frame.cancel()},mousemove:function(r){var n=r.clientX,t=r.clientY,i=e.size,o=i[0],a=i[1];e.mouse[0]=(n-o/2)/(o/2),e.mouse[1]=-(t-a/2)/(a/2),e.setUniform("iMouse",e.mouse)},resize:function(r,n,t){void 0===n&&(n=window.innerWidth),void 0===t&&(t=window.innerHeight),e.size[0]=e.el.width=n,e.size[1]=e.el.height=t,e.setUniform("iResolution",e.size)},load:function(r,n){e.setFrame((function(){var r=e.activeUnit(n.alt),t=e.location(n.alt),i=function(e,r){var n=e.createTexture();return e.bindTexture(e.TEXTURE_2D,n),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,r),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),n}(e.gl,n);e.setFrame((function(){return e.gl.uniform1i(t,r),e.gl.activeTexture(e.gl["TEXTURE"+r]),e.gl.bindTexture(e.gl.TEXTURE_2D,i),!0}))}))}})},l=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],c="\n attribute vec4 a_position;\n void main() {\n gl_Position = a_position;\n }\n",s="\n uniform vec2 resolution;\n void main() {\n gl_FragColor = vec4(fract(gl_FragCoord.xy / resolution), 0, 1);\n }\n",m=function(i){var a=function e(r){for(var i=arguments.length,o=new Array(i>1?i-1:0),a=1;a<i;a++)o[a-1]=arguments[a];return t(r)&&(r=n(r,o)),"string"==typeof r&&(e.frag=r),"function"==typeof r&&e.frame.mount(r),e};a.id="myCanvas",a.frag=s,a.vert=c,a.size=[0,0],a.mouse=[0,0],a.count=6,a.uniformHeader=[],a.attributeHeader=[];var m=a.event=f(a),v=a.frame=e.frame();a.lastActiveUnit=0,a.activeUnit=r.nested((function(){return a.lastActiveUnit++})),a.vertexStride=r.nested((function(e,r,n){var t=n?Math.max.apply(Math,n)+1:a.count,i=r.length/t<<0;return a.attributeHeader.push([e,"vertex vec"+i+" "+e+";"]),i})),a.uniformType=r.nested((function(e,r,n){var t=o(r,n),i=t[0],u=t[1];return a.uniformHeader.push([e,"uniform "+u+" "+e+";"]),i})),a.location=r.nested((function(e,r){var n,t;return void 0===r&&(r=!1),r?null==(n=a.gl)?void 0:n.getAttribLocation(a.pg,e):null==(t=a.gl)?void 0:t.getUniformLocation(a.pg,e)})),a.setDpr=function(){return void m.resize()||a},a.setSize=function(){return void m.resize()||a},a.setFrame=function(e){return void v.mount(e)||a},a.setMount=function(e){return void m({mount:e})||a},a.setClean=function(e){return void m({clean:e})||a},a.setConfig=r.durable((function(e,r){a[e]=r}),a),a.setUniform=r.durable((function(e,r,n){void 0===n&&(n=!1);var t=a.uniformType(e,r,n);a.setFrame((function(){n?a.gl[t](a.location(e),!1,r):a.gl[t](a.location(e),r)}))}),a),a.setAttribute=r.durable((function(e,r,n){var t=a.vertexStride(e,r,n);a.setFrame((function(){u(a.gl,t,a.location(e,!0),r,n)}))}),a),a.setTexture=r.durable((function(e,r){var n=new Image;n.addEventListener("load",(function(e){return m.load(e,n)}),!1),Object.assign(n,{src:r,alt:e,crossOrigin:"anonymous"})}),a),a.mount=function(){return m.mount.apply(m,arguments)},a.clean=function(){return m.clean.apply(m,arguments)},a.clear=function(e){return a.gl.clear(a.gl[e||"COLOR_BUFFER_BIT"])},a.viewport=function(e){var r;return(r=a.gl).viewport.apply(r,[0,0].concat(e||a.size))},a.drawArrays=function(e){return void 0===e&&(e="TRIANGLES"),a.gl.drawArrays(a.gl[e],0,a.count)},a.drawElements=function(e,r){return void 0===e&&(e="TRIANGLES"),void 0===r&&(r="UNSIGNED_SHORT"),a.gl.drawElements(a.gl[e],a.count,a.gl[r],0)};for(var d=arguments.length,g=new Array(d>1?d-1:0),E=1;E<d;E++)g[E-1]=arguments[E];return t(i)&&(i=n(i,g)),"string"==typeof i&&(a.frag=i),"object"==typeof i&&a.setConfig(i),6===a.count&&a.setAttribute({a_position:l}),a};m.default=null,exports.default=m,exports.gl=m;
package/index.develop.js CHANGED
@@ -1 +1 @@
1
- !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("refr"),require("reev")):"function"==typeof define&&define.amd?define(["exports","refr","reev"],n):n(((e="undefined"!=typeof globalThis?globalThis:e||self).index=e.index||{},e.index.ts={}),e.refr,e.reev)}(this,(function(e,n,r){"use strict";function t(e,n){for(var r=e[0],t=0,o=n.length;t<o;t+=1)r+=n[t]+e[t+1];return r}function o(e){return Array.isArray(e)&&"string"==typeof e[0]}function i(e,n){return e=e.replace(/\s+/g,""),n=n.replace(/\s+/g,""),-1!==e.indexOf(n)}function a(e,n,r){return void 0===r&&(r=""),""!==r&&!i(e,r)||i(e,n)?e:n+e}function u(e,n){void 0===n&&(n=!1);var r="number"==typeof e?0:e.length;return r?n?["uniformMatrix"+(r=Math.sqrt(r)<<0)+"fv","mat"+r]:["uniform"+r+"fv","vec"+r]:["uniform1f","float"]}function f(e,n,r){var t=e.createShader(r);if(e.shaderSource(t,n),e.compileShader(t),e.getShaderParameter(t,e.COMPILE_STATUS))return t;console.warn(e.getShaderInfoLog(t))}function l(e,n,r,t,o){e.bindBuffer(e.ARRAY_BUFFER,function(e,n){if(n){var r=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,r),e.bufferData(e.ARRAY_BUFFER,new Float32Array(n),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),r}}(e,t)),e.enableVertexAttribArray(r),e.vertexAttribPointer(r,n,e.FLOAT,!1,0,0),o&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,function(e,n){if(n){var r=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,r),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(n),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),r}}(e,o))}var c=function(e){return r.event({mount:function(n){e.int&&(e.frag=a(e.frag,"precision "+e.int+" int;")),e.float&&(e.frag=a(e.frag,"precision "+e.float+" float;")),e.sampler2D&&(e.frag=a(e.frag,"precision "+e.sampler2D+" sampler2D;")),e.samplerCube&&(e.frag=a(e.frag,"precision "+e.samplerCube+" samplerCube;"));var r=e.el=document.getElementById(e.id),t=e.gl=null==r?void 0:r.getContext("webgl"),o=f(t,e.frag,null==t?void 0:t.FRAGMENT_SHADER),i=f(t,e.vert,null==t?void 0:t.VERTEX_SHADER);e.pg=function(e,n,r){var t=e.createProgram();return e.attachShader(t,n),e.attachShader(t,r),e.linkProgram(t),e.getProgramParameter(t,e.LINK_STATUS)?(e.useProgram(t),t):(console.log(e.getProgramInfoLog(t)),null)}(t,i,o),window.addEventListener("resize",n.on("resize")),window.addEventListener("mousemove",n.on("mousemove")),n("resize");var u=performance.now(),l=0,c=0;e.setFrame((function(){return l=u,u=performance.now()/1e3,c=u-l,e.setUniform({iTime:u,iPrevTime:l,iDeltaTime:c}),!0})),e.frame()},clean:function(n){window.removeEventListener("resize",n.on("resize")),window.removeEventListener("mousemove",n.on("mousemove")),e.frame.cancel()},mousemove:function(n,r){var t=r.clientX,o=r.clientY,i=e.size,a=i[0],u=i[1];e.mouse[0]=(t-a/2)/(a/2),e.mouse[1]=-(o-u/2)/(u/2),e.setUniform("iMouse",e.mouse)},resize:function(n,r,t,o){void 0===t&&(t=0),void 0===o&&(o=0),e.size[0]=e.el.width=t||window.innerWidth,e.size[1]=e.el.height=o||window.innerHeight,e.setUniform("iResolution",e.size)},load:function(n,r,t){e.setFrame((function(){var n=e.activeUnit(t.alt),r=e.location(t.alt),o=function(e,n){var r=e.createTexture();return e.bindTexture(e.TEXTURE_2D,r),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,n),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),r}(e.gl,t);e.setFrame((function(){return e.gl.uniform1i(r,n),e.gl.activeTexture(e.gl["TEXTURE"+n]),e.gl.bindTexture(e.gl.TEXTURE_2D,o),!0}))}))}})},s=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],d="\n attribute vec4 a_position;\n void main() {\n gl_Position = a_position;\n }\n",v="\n uniform vec2 resolution;\n void main() {\n gl_FragColor = vec4(fract(gl_FragCoord.xy / resolution), 0, 1);\n }\n",m=function(e){var i=function e(n){for(var r=arguments.length,i=new Array(r>1?r-1:0),a=1;a<r;a++)i[a-1]=arguments[a];return o(n)&&(n=t(n,i)),"string"==typeof n&&(e.frag=n),"function"==typeof n&&e.frame.mount(n),e};i.id="myCanvas",i.frag=v,i.vert=d,i.size=[0,0],i.mouse=[0,0],i.count=6,i.uniformHeader=[],i.attributeHeader=[];var a=i.event=c(i),f=i.frame=n.frame();i.lastActiveUnit=0,i.activeUnit=r.nested((function(){return i.lastActiveUnit++})),i.vertexStride=r.nested((function(e,n,r){var t=r?Math.max.apply(Math,r)+1:i.count,o=n.length/t<<0;return i.attributeHeader.push([e,"vertex vec"+o+" "+e+";"]),o})),i.uniformType=r.nested((function(e,n,r){var t=u(n,r),o=t[0],a=t[1];return i.uniformHeader.push([e,"uniform "+a+" "+e+";"]),o})),i.location=r.nested((function(e,n){var r,t;return void 0===n&&(n=!1),n?null==(r=i.gl)?void 0:r.getAttribLocation(i.pg,e):null==(t=i.gl)?void 0:t.getUniformLocation(i.pg,e)})),i.setDpr=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return void a.apply(void 0,["resize",{}].concat(n))||i},i.setSize=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return void a.apply(void 0,["resize",{}].concat(n))||i},i.setFrame=function(e){return void f.mount(e)||i},i.setMount=function(e){return void a.mount({mount:e})||i},i.setClean=function(e){return void a.mount({clean:e})||i},i.setConfig=r.durable((function(e,n){i[e]=n}),i),i.setUniform=r.durable((function(e,n,r){void 0===r&&(r=!1);var t=i.uniformType(e,n,r);i.setFrame((function(){r?i.gl[t](i.location(e),!1,n):i.gl[t](i.location(e),n)}))}),i),i.setAttribute=r.durable((function(e){for(var n=arguments.length,r=new Array(n>1?n-1:0),t=1;t<n;t++)r[t-1]=arguments[t];var o=i.vertexStride.apply(i,[e].concat(r));i.setFrame((function(){l.apply(void 0,[i.gl,o,i.location(e,!0)].concat(r))}))}),i),i.setTexture=r.durable((function(e,n){var r=new Image;r.addEventListener("load",(function(e){return a("load",e,r)}),!1),Object.assign(r,{src:n,alt:e,crossOrigin:"anonymous"})}),i),i.mount=a.on("mount"),i.clean=a.on("clean"),i.clear=function(e){return i.gl.clear(i.gl[e||"COLOR_BUFFER_BIT"])},i.viewport=function(e){var n;return(n=i.gl).viewport.apply(n,[0,0].concat(e||i.size))},i.drawArrays=function(e){return void 0===e&&(e="TRIANGLES"),i.gl.drawArrays(i.gl[e],0,i.count)},i.drawElements=function(e,n){return void 0===e&&(e="TRIANGLES"),void 0===n&&(n="UNSIGNED_SHORT"),i.gl.drawElements(i.gl[e],i.count,i.gl[n],0)};for(var m=arguments.length,g=new Array(m>1?m-1:0),E=1;E<m;E++)g[E-1]=arguments[E];return o(e)&&(e=t(e,g)),"string"==typeof e&&(i.frag=e),"object"==typeof e&&i.setConfig(e),6===i.count&&i.setAttribute({a_position:s}),i};m.default=null,e.default=m,e.gl=m,Object.defineProperty(e,"__esModule",{value:!0})}));
1
+ !function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("refr"),require("reev")):"function"==typeof define&&define.amd?define(["exports","refr","reev"],r):r(((e="undefined"!=typeof globalThis?globalThis:e||self).index=e.index||{},e.index.ts={}),e.refr,e.reev)}(this,(function(e,r,n){"use strict";function t(e,r){for(var n=e[0],t=0,i=r.length;t<i;t+=1)n+=r[t]+e[t+1];return n}function i(e){return Array.isArray(e)&&"string"==typeof e[0]}function o(e,r,n){return void 0===n&&(n=""),""!==n&&!e.includes(n)||function(e,r){return e=e.replace(/\s+/g,""),r=r.replace(/\s+/g,""),e.includes(r)}(e,r)?e:r+e}function a(e,r){void 0===r&&(r=!1);var n="number"==typeof e?0:e.length;return n?r?["uniformMatrix"+(n=Math.sqrt(n)<<0)+"fv","mat"+n]:["uniform"+n+"fv","vec"+n]:["uniform1f","float"]}function u(e,r,n){var t=e.createShader(n);if(e.shaderSource(t,r),e.compileShader(t),e.getShaderParameter(t,e.COMPILE_STATUS))return t;console.warn(e.getShaderInfoLog(t))}function f(e,r,n,t,i){e.bindBuffer(e.ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,n),e.bufferData(e.ARRAY_BUFFER,new Float32Array(r),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),n}}(e,t)),e.enableVertexAttribArray(n),e.vertexAttribPointer(n,r,e.FLOAT,!1,0,0),i&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,n),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(r),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),n}}(e,i))}var l=function(e){var r=n.event();return r({mount:function(){e.int&&(e.frag=o(e.frag,"precision "+e.int+" int;")),e.float&&(e.frag=o(e.frag,"precision "+e.float+" float;")),e.sampler2D&&(e.frag=o(e.frag,"precision "+e.sampler2D+" sampler2D;")),e.samplerCube&&(e.frag=o(e.frag,"precision "+e.samplerCube+" samplerCube;"));var n=e.el=document.getElementById(e.id),t=e.gl=null==n?void 0:n.getContext("webgl"),i=u(t,e.frag,t.FRAGMENT_SHADER),a=u(t,e.vert,t.VERTEX_SHADER);e.pg=function(e,r,n){var t=e.createProgram();return e.attachShader(t,r),e.attachShader(t,n),e.linkProgram(t),e.getProgramParameter(t,e.LINK_STATUS)?(e.useProgram(t),t):(console.log(e.getProgramInfoLog(t)),null)}(t,a,i),window.addEventListener("resize",r.resize),window.addEventListener("mousemove",r.mousemove),r.resize();var f=performance.now(),l=0,c=0;e.setFrame((function(){return l=f,f=performance.now()/1e3,c=f-l,e.setUniform({iTime:f,iPrevTime:l,iDeltaTime:c}),!0})),e.frame()},clean:function(){window.removeEventListener("resize",r.resize),window.removeEventListener("mousemove",r.mousemove),e.frame.cancel()},mousemove:function(r){var n=r.clientX,t=r.clientY,i=e.size,o=i[0],a=i[1];e.mouse[0]=(n-o/2)/(o/2),e.mouse[1]=-(t-a/2)/(a/2),e.setUniform("iMouse",e.mouse)},resize:function(r,n,t){void 0===n&&(n=window.innerWidth),void 0===t&&(t=window.innerHeight),e.size[0]=e.el.width=n,e.size[1]=e.el.height=t,e.setUniform("iResolution",e.size)},load:function(r,n){e.setFrame((function(){var r=e.activeUnit(n.alt),t=e.location(n.alt),i=function(e,r){var n=e.createTexture();return e.bindTexture(e.TEXTURE_2D,n),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,r),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),n}(e.gl,n);e.setFrame((function(){return e.gl.uniform1i(t,r),e.gl.activeTexture(e.gl["TEXTURE"+r]),e.gl.bindTexture(e.gl.TEXTURE_2D,i),!0}))}))}})},c=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],s="\n attribute vec4 a_position;\n void main() {\n gl_Position = a_position;\n }\n",d="\n uniform vec2 resolution;\n void main() {\n gl_FragColor = vec4(fract(gl_FragCoord.xy / resolution), 0, 1);\n }\n",m=function(e){var o=function e(r){for(var n=arguments.length,o=new Array(n>1?n-1:0),a=1;a<n;a++)o[a-1]=arguments[a];return i(r)&&(r=t(r,o)),"string"==typeof r&&(e.frag=r),"function"==typeof r&&e.frame.mount(r),e};o.id="myCanvas",o.frag=d,o.vert=s,o.size=[0,0],o.mouse=[0,0],o.count=6,o.uniformHeader=[],o.attributeHeader=[];var u=o.event=l(o),m=o.frame=r.frame();o.lastActiveUnit=0,o.activeUnit=n.nested((function(){return o.lastActiveUnit++})),o.vertexStride=n.nested((function(e,r,n){var t=n?Math.max.apply(Math,n)+1:o.count,i=r.length/t<<0;return o.attributeHeader.push([e,"vertex vec"+i+" "+e+";"]),i})),o.uniformType=n.nested((function(e,r,n){var t=a(r,n),i=t[0],u=t[1];return o.uniformHeader.push([e,"uniform "+u+" "+e+";"]),i})),o.location=n.nested((function(e,r){var n,t;return void 0===r&&(r=!1),r?null==(n=o.gl)?void 0:n.getAttribLocation(o.pg,e):null==(t=o.gl)?void 0:t.getUniformLocation(o.pg,e)})),o.setDpr=function(){return void u.resize()||o},o.setSize=function(){return void u.resize()||o},o.setFrame=function(e){return void m.mount(e)||o},o.setMount=function(e){return void u({mount:e})||o},o.setClean=function(e){return void u({clean:e})||o},o.setConfig=n.durable((function(e,r){o[e]=r}),o),o.setUniform=n.durable((function(e,r,n){void 0===n&&(n=!1);var t=o.uniformType(e,r,n);o.setFrame((function(){n?o.gl[t](o.location(e),!1,r):o.gl[t](o.location(e),r)}))}),o),o.setAttribute=n.durable((function(e,r,n){var t=o.vertexStride(e,r,n);o.setFrame((function(){f(o.gl,t,o.location(e,!0),r,n)}))}),o),o.setTexture=n.durable((function(e,r){var n=new Image;n.addEventListener("load",(function(e){return u.load(e,n)}),!1),Object.assign(n,{src:r,alt:e,crossOrigin:"anonymous"})}),o),o.mount=function(){return u.mount.apply(u,arguments)},o.clean=function(){return u.clean.apply(u,arguments)},o.clear=function(e){return o.gl.clear(o.gl[e||"COLOR_BUFFER_BIT"])},o.viewport=function(e){var r;return(r=o.gl).viewport.apply(r,[0,0].concat(e||o.size))},o.drawArrays=function(e){return void 0===e&&(e="TRIANGLES"),o.gl.drawArrays(o.gl[e],0,o.count)},o.drawElements=function(e,r){return void 0===e&&(e="TRIANGLES"),void 0===r&&(r="UNSIGNED_SHORT"),o.gl.drawElements(o.gl[e],o.count,o.gl[r],0)};for(var v=arguments.length,g=new Array(v>1?v-1:0),E=1;E<v;E++)g[E-1]=arguments[E];return i(e)&&(e=t(e,g)),"string"==typeof e&&(o.frag=e),"object"==typeof e&&o.setConfig(e),6===o.count&&o.setAttribute({a_position:c}),o};m.default=null,e.default=m,e.gl=m,Object.defineProperty(e,"__esModule",{value:!0})}));
package/index.js CHANGED
@@ -1 +1 @@
1
- import{frame as e}from"refr";import{event as r,nested as n,durable as t}from"reev";function o(e,r){for(var n=e[0],t=0,o=r.length;t<o;t+=1)n+=r[t]+e[t+1];return n}function i(e){return Array.isArray(e)&&"string"==typeof e[0]}function a(e,r){return e=e.replace(/\s+/g,""),r=r.replace(/\s+/g,""),-1!==e.indexOf(r)}function u(e,r,n){return void 0===n&&(n=""),""!==n&&!a(e,n)||a(e,r)?e:r+e}function f(e,r){void 0===r&&(r=!1);var n="number"==typeof e?0:e.length;return n?r?["uniformMatrix"+(n=Math.sqrt(n)<<0)+"fv","mat"+n]:["uniform"+n+"fv","vec"+n]:["uniform1f","float"]}function l(e,r,n){var t=e.createShader(n);if(e.shaderSource(t,r),e.compileShader(t),e.getShaderParameter(t,e.COMPILE_STATUS))return t;console.warn(e.getShaderInfoLog(t))}function c(e,r,n,t,o){e.bindBuffer(e.ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,n),e.bufferData(e.ARRAY_BUFFER,new Float32Array(r),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),n}}(e,t)),e.enableVertexAttribArray(n),e.vertexAttribPointer(n,r,e.FLOAT,!1,0,0),o&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,n),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(r),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),n}}(e,o))}var s=function(e){return r({mount:function(r){e.int&&(e.frag=u(e.frag,"precision "+e.int+" int;")),e.float&&(e.frag=u(e.frag,"precision "+e.float+" float;")),e.sampler2D&&(e.frag=u(e.frag,"precision "+e.sampler2D+" sampler2D;")),e.samplerCube&&(e.frag=u(e.frag,"precision "+e.samplerCube+" samplerCube;"));var n=e.el=document.getElementById(e.id),t=e.gl=null==n?void 0:n.getContext("webgl"),o=l(t,e.frag,null==t?void 0:t.FRAGMENT_SHADER),i=l(t,e.vert,null==t?void 0:t.VERTEX_SHADER);e.pg=function(e,r,n){var t=e.createProgram();return e.attachShader(t,r),e.attachShader(t,n),e.linkProgram(t),e.getProgramParameter(t,e.LINK_STATUS)?(e.useProgram(t),t):(console.log(e.getProgramInfoLog(t)),null)}(t,i,o),window.addEventListener("resize",r.on("resize")),window.addEventListener("mousemove",r.on("mousemove")),r("resize");var a=performance.now(),f=0,c=0;e.setFrame((function(){return f=a,a=performance.now()/1e3,c=a-f,e.setUniform({iTime:a,iPrevTime:f,iDeltaTime:c}),!0})),e.frame()},clean:function(r){window.removeEventListener("resize",r.on("resize")),window.removeEventListener("mousemove",r.on("mousemove")),e.frame.cancel()},mousemove:function(r,n){var t=n.clientX,o=n.clientY,i=e.size,a=i[0],u=i[1];e.mouse[0]=(t-a/2)/(a/2),e.mouse[1]=-(o-u/2)/(u/2),e.setUniform("iMouse",e.mouse)},resize:function(r,n,t,o){void 0===t&&(t=0),void 0===o&&(o=0),e.size[0]=e.el.width=t||window.innerWidth,e.size[1]=e.el.height=o||window.innerHeight,e.setUniform("iResolution",e.size)},load:function(r,n,t){e.setFrame((function(){var r=e.activeUnit(t.alt),n=e.location(t.alt),o=function(e,r){var n=e.createTexture();return e.bindTexture(e.TEXTURE_2D,n),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,r),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),n}(e.gl,t);e.setFrame((function(){return e.gl.uniform1i(n,r),e.gl.activeTexture(e.gl["TEXTURE"+r]),e.gl.bindTexture(e.gl.TEXTURE_2D,o),!0}))}))}})},m=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],v="\n attribute vec4 a_position;\n void main() {\n gl_Position = a_position;\n }\n",g="\n uniform vec2 resolution;\n void main() {\n gl_FragColor = vec4(fract(gl_FragCoord.xy / resolution), 0, 1);\n }\n",E=function(r){var a=function e(r){for(var n=arguments.length,t=new Array(n>1?n-1:0),a=1;a<n;a++)t[a-1]=arguments[a];return i(r)&&(r=o(r,t)),"string"==typeof r&&(e.frag=r),"function"==typeof r&&e.frame.mount(r),e};a.id="myCanvas",a.frag=g,a.vert=v,a.size=[0,0],a.mouse=[0,0],a.count=6,a.uniformHeader=[],a.attributeHeader=[];var u=a.event=s(a),l=a.frame=e();a.lastActiveUnit=0,a.activeUnit=n((function(){return a.lastActiveUnit++})),a.vertexStride=n((function(e,r,n){var t=n?Math.max.apply(Math,n)+1:a.count,o=r.length/t<<0;return a.attributeHeader.push([e,"vertex vec"+o+" "+e+";"]),o})),a.uniformType=n((function(e,r,n){var t=f(r,n),o=t[0],i=t[1];return a.uniformHeader.push([e,"uniform "+i+" "+e+";"]),o})),a.location=n((function(e,r){var n,t;return void 0===r&&(r=!1),r?null==(n=a.gl)?void 0:n.getAttribLocation(a.pg,e):null==(t=a.gl)?void 0:t.getUniformLocation(a.pg,e)})),a.setDpr=function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];return void u.apply(void 0,["resize",{}].concat(r))||a},a.setSize=function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];return void u.apply(void 0,["resize",{}].concat(r))||a},a.setFrame=function(e){return void l.mount(e)||a},a.setMount=function(e){return void u.mount({mount:e})||a},a.setClean=function(e){return void u.mount({clean:e})||a},a.setConfig=t((function(e,r){a[e]=r}),a),a.setUniform=t((function(e,r,n){void 0===n&&(n=!1);var t=a.uniformType(e,r,n);a.setFrame((function(){n?a.gl[t](a.location(e),!1,r):a.gl[t](a.location(e),r)}))}),a),a.setAttribute=t((function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),t=1;t<r;t++)n[t-1]=arguments[t];var o=a.vertexStride.apply(a,[e].concat(n));a.setFrame((function(){c.apply(void 0,[a.gl,o,a.location(e,!0)].concat(n))}))}),a),a.setTexture=t((function(e,r){var n=new Image;n.addEventListener("load",(function(e){return u("load",e,n)}),!1),Object.assign(n,{src:r,alt:e,crossOrigin:"anonymous"})}),a),a.mount=u.on("mount"),a.clean=u.on("clean"),a.clear=function(e){return a.gl.clear(a.gl[e||"COLOR_BUFFER_BIT"])},a.viewport=function(e){var r;return(r=a.gl).viewport.apply(r,[0,0].concat(e||a.size))},a.drawArrays=function(e){return void 0===e&&(e="TRIANGLES"),a.gl.drawArrays(a.gl[e],0,a.count)},a.drawElements=function(e,r){return void 0===e&&(e="TRIANGLES"),void 0===r&&(r="UNSIGNED_SHORT"),a.gl.drawElements(a.gl[e],a.count,a.gl[r],0)};for(var E=arguments.length,d=new Array(E>1?E-1:0),T=1;T<E;T++)d[T-1]=arguments[T];return i(r)&&(r=o(r,d)),"string"==typeof r&&(a.frag=r),"object"==typeof r&&a.setConfig(r),6===a.count&&a.setAttribute({a_position:m}),a};E.default=null;export{E as default,E as gl};
1
+ import{frame as e}from"refr";import{event as r,nested as n,durable as t}from"reev";function i(e,r){for(var n=e[0],t=0,i=r.length;t<i;t+=1)n+=r[t]+e[t+1];return n}function o(e){return Array.isArray(e)&&"string"==typeof e[0]}function a(e,r,n){return void 0===n&&(n=""),""!==n&&!e.includes(n)||function(e,r){return e=e.replace(/\s+/g,""),r=r.replace(/\s+/g,""),e.includes(r)}(e,r)?e:r+e}function u(e,r){void 0===r&&(r=!1);var n="number"==typeof e?0:e.length;return n?r?["uniformMatrix"+(n=Math.sqrt(n)<<0)+"fv","mat"+n]:["uniform"+n+"fv","vec"+n]:["uniform1f","float"]}function f(e,r,n){var t=e.createShader(n);if(e.shaderSource(t,r),e.compileShader(t),e.getShaderParameter(t,e.COMPILE_STATUS))return t;console.warn(e.getShaderInfoLog(t))}function c(e,r,n,t,i){e.bindBuffer(e.ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,n),e.bufferData(e.ARRAY_BUFFER,new Float32Array(r),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),n}}(e,t)),e.enableVertexAttribArray(n),e.vertexAttribPointer(n,r,e.FLOAT,!1,0,0),i&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,function(e,r){if(r){var n=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,n),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(r),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),n}}(e,i))}var l=function(e){var n=r();return n({mount:function(){e.int&&(e.frag=a(e.frag,"precision "+e.int+" int;")),e.float&&(e.frag=a(e.frag,"precision "+e.float+" float;")),e.sampler2D&&(e.frag=a(e.frag,"precision "+e.sampler2D+" sampler2D;")),e.samplerCube&&(e.frag=a(e.frag,"precision "+e.samplerCube+" samplerCube;"));var r=e.el=document.getElementById(e.id),t=e.gl=null==r?void 0:r.getContext("webgl"),i=f(t,e.frag,t.FRAGMENT_SHADER),o=f(t,e.vert,t.VERTEX_SHADER);e.pg=function(e,r,n){var t=e.createProgram();return e.attachShader(t,r),e.attachShader(t,n),e.linkProgram(t),e.getProgramParameter(t,e.LINK_STATUS)?(e.useProgram(t),t):(console.log(e.getProgramInfoLog(t)),null)}(t,o,i),window.addEventListener("resize",n.resize),window.addEventListener("mousemove",n.mousemove),n.resize();var u=performance.now(),c=0,l=0;e.setFrame((function(){return c=u,u=performance.now()/1e3,l=u-c,e.setUniform({iTime:u,iPrevTime:c,iDeltaTime:l}),!0})),e.frame()},clean:function(){window.removeEventListener("resize",n.resize),window.removeEventListener("mousemove",n.mousemove),e.frame.cancel()},mousemove:function(r){var n=r.clientX,t=r.clientY,i=e.size,o=i[0],a=i[1];e.mouse[0]=(n-o/2)/(o/2),e.mouse[1]=-(t-a/2)/(a/2),e.setUniform("iMouse",e.mouse)},resize:function(r,n,t){void 0===n&&(n=window.innerWidth),void 0===t&&(t=window.innerHeight),e.size[0]=e.el.width=n,e.size[1]=e.el.height=t,e.setUniform("iResolution",e.size)},load:function(r,n){e.setFrame((function(){var r=e.activeUnit(n.alt),t=e.location(n.alt),i=function(e,r){var n=e.createTexture();return e.bindTexture(e.TEXTURE_2D,n),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,r),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),n}(e.gl,n);e.setFrame((function(){return e.gl.uniform1i(t,r),e.gl.activeTexture(e.gl["TEXTURE"+r]),e.gl.bindTexture(e.gl.TEXTURE_2D,i),!0}))}))}})},s=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],m="\n attribute vec4 a_position;\n void main() {\n gl_Position = a_position;\n }\n",v="\n uniform vec2 resolution;\n void main() {\n gl_FragColor = vec4(fract(gl_FragCoord.xy / resolution), 0, 1);\n }\n",g=function(r){var a=function e(r){for(var n=arguments.length,t=new Array(n>1?n-1:0),a=1;a<n;a++)t[a-1]=arguments[a];return o(r)&&(r=i(r,t)),"string"==typeof r&&(e.frag=r),"function"==typeof r&&e.frame.mount(r),e};a.id="myCanvas",a.frag=v,a.vert=m,a.size=[0,0],a.mouse=[0,0],a.count=6,a.uniformHeader=[],a.attributeHeader=[];var f=a.event=l(a),g=a.frame=e();a.lastActiveUnit=0,a.activeUnit=n((function(){return a.lastActiveUnit++})),a.vertexStride=n((function(e,r,n){var t=n?Math.max.apply(Math,n)+1:a.count,i=r.length/t<<0;return a.attributeHeader.push([e,"vertex vec"+i+" "+e+";"]),i})),a.uniformType=n((function(e,r,n){var t=u(r,n),i=t[0],o=t[1];return a.uniformHeader.push([e,"uniform "+o+" "+e+";"]),i})),a.location=n((function(e,r){var n,t;return void 0===r&&(r=!1),r?null==(n=a.gl)?void 0:n.getAttribLocation(a.pg,e):null==(t=a.gl)?void 0:t.getUniformLocation(a.pg,e)})),a.setDpr=function(){return void f.resize()||a},a.setSize=function(){return void f.resize()||a},a.setFrame=function(e){return void g.mount(e)||a},a.setMount=function(e){return void f({mount:e})||a},a.setClean=function(e){return void f({clean:e})||a},a.setConfig=t((function(e,r){a[e]=r}),a),a.setUniform=t((function(e,r,n){void 0===n&&(n=!1);var t=a.uniformType(e,r,n);a.setFrame((function(){n?a.gl[t](a.location(e),!1,r):a.gl[t](a.location(e),r)}))}),a),a.setAttribute=t((function(e,r,n){var t=a.vertexStride(e,r,n);a.setFrame((function(){c(a.gl,t,a.location(e,!0),r,n)}))}),a),a.setTexture=t((function(e,r){var n=new Image;n.addEventListener("load",(function(e){return f.load(e,n)}),!1),Object.assign(n,{src:r,alt:e,crossOrigin:"anonymous"})}),a),a.mount=function(){return f.mount.apply(f,arguments)},a.clean=function(){return f.clean.apply(f,arguments)},a.clear=function(e){return a.gl.clear(a.gl[e||"COLOR_BUFFER_BIT"])},a.viewport=function(e){var r;return(r=a.gl).viewport.apply(r,[0,0].concat(e||a.size))},a.drawArrays=function(e){return void 0===e&&(e="TRIANGLES"),a.gl.drawArrays(a.gl[e],0,a.count)},a.drawElements=function(e,r){return void 0===e&&(e="TRIANGLES"),void 0===r&&(r="UNSIGNED_SHORT"),a.gl.drawElements(a.gl[e],a.count,a.gl[r],0)};for(var E=arguments.length,d=new Array(E>1?E-1:0),T=1;T<E;T++)d[T-1]=arguments[T];return o(r)&&(r=i(r,d)),"string"==typeof r&&(a.frag=r),"object"==typeof r&&a.setConfig(r),6===a.count&&a.setAttribute({a_position:s}),a};g.default=null;export{g as default,g as gl};
package/index.ts CHANGED
@@ -1,10 +1,15 @@
1
1
  import { frame } from 'refr'
2
2
  import { glEvent } from './events'
3
3
  import { durable, nested } from 'reev'
4
- import { createAttribute, interleave, isTemplateLiteral, switchUniformType } from './utils'
4
+ import {
5
+ createAttribute,
6
+ interleave,
7
+ isTemplateLiteral,
8
+ switchUniformType,
9
+ } from './utils'
5
10
  import type { GL } from './types'
6
11
 
7
- const a_position = [-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1];
12
+ const a_position = [-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]
8
13
 
9
14
  const _defaultVertexShader = `
10
15
  attribute vec4 a_position;
@@ -20,7 +25,7 @@ const _defaultFragmentShader = `
20
25
  }
21
26
  `
22
27
 
23
- export const gl = (initArg?: Partial<GL>, ...initArgs: any[]) => {
28
+ export const gl = (initArg?: string | Partial<GL>, ...initArgs: any[]) => {
24
29
  const self = ((arg: any, ...args: any[]) => {
25
30
  if (isTemplateLiteral(arg)) arg = interleave(arg, args)
26
31
  if (typeof arg === 'string') self.frag = arg
@@ -30,8 +35,8 @@ export const gl = (initArg?: Partial<GL>, ...initArgs: any[]) => {
30
35
 
31
36
  // default state
32
37
  self.id = 'myCanvas' // @TODO feat: create hashid
33
- self.frag = _defaultFragmentShader;
34
- self.vert = _defaultVertexShader;
38
+ self.frag = _defaultFragmentShader
39
+ self.vert = _defaultVertexShader
35
40
  // self.float = "mediump" // @TODO check bugs
36
41
  self.size = [0, 0]
37
42
  self.mouse = [0, 0]
@@ -40,12 +45,12 @@ export const gl = (initArg?: Partial<GL>, ...initArgs: any[]) => {
40
45
  self.attributeHeader = []
41
46
 
42
47
  // core state
43
- const ev = (self.event = glEvent(self))
44
- const fr = (self.frame = frame())
48
+ const e = (self.event = glEvent(self))
49
+ const f = (self.frame = frame())
45
50
  self.lastActiveUnit = 0
46
51
  self.activeUnit = nested(() => self.lastActiveUnit++)
47
52
  self.vertexStride = nested((key, value, iboValue) => {
48
- const count = iboValue ? Math.max(...iboValue) + 1 : self.count;
53
+ const count = iboValue ? Math.max(...iboValue) + 1 : self.count
49
54
  const stride = (value.length / count) << 0
50
55
  self.attributeHeader.push([key, `vertex vec${stride} ${key};`])
51
56
  return stride
@@ -64,14 +69,12 @@ export const gl = (initArg?: Partial<GL>, ...initArgs: any[]) => {
64
69
  })
65
70
 
66
71
  // setter
67
- self.setDpr = (...args) => void ev('resize', {}, ...args) || self
68
- self.setSize = (...args) => void ev('resize', {}, ...args) || self
69
- self.setFrame = (frame) => void fr.mount(frame) || self
70
- self.setMount = (mount) => void ev.mount({ mount }) || self
71
- self.setClean = (clean) => void ev.mount({ clean }) || self
72
+ self.setDpr = () => void e.resize() || self
73
+ self.setSize = () => void e.resize() || self
74
+ self.setFrame = (frame) => void f.mount(frame) || self
75
+ self.setMount = (mount) => void e({ mount }) || self
76
+ self.setClean = (clean) => void e({ clean }) || self
72
77
  self.setConfig = durable((key, value) => void (self[key] = value), self)
73
-
74
- // uniform
75
78
  self.setUniform = durable((key, value, isMatrix = false) => {
76
79
  const type = self.uniformType(key, value, isMatrix)
77
80
  self.setFrame(() => {
@@ -80,41 +83,54 @@ export const gl = (initArg?: Partial<GL>, ...initArgs: any[]) => {
80
83
  else self.gl[type](self.location(key), value)
81
84
  })
82
85
  }, self)
83
-
84
- // attribute
85
- self.setAttribute = durable((key, ...args) => {
86
- const stride = self.vertexStride(key, ...args)
86
+ self.setAttribute = durable((key, value, iboValue) => {
87
+ const stride = self.vertexStride(key, value, iboValue)
87
88
  self.setFrame(() => {
88
- createAttribute(self.gl, stride, self.location(key, true), ...args)
89
+ createAttribute(
90
+ self.gl,
91
+ stride,
92
+ self.location(key, true),
93
+ value,
94
+ iboValue
95
+ )
89
96
  })
90
97
  }, self)
91
98
 
92
99
  // texture
93
100
  self.setTexture = durable((key, src) => {
94
101
  const image = new Image()
95
- image.addEventListener("load", (e) => ev("load", e, image), false)
96
- Object.assign(image, { src, alt: key, crossOrigin: 'anonymous' })
102
+ image.addEventListener('load', (_) => e.load(_, image), false)
103
+ Object.assign(image, {
104
+ src,
105
+ alt: key,
106
+ crossOrigin: 'anonymous',
107
+ })
97
108
  }, self)
98
109
 
99
110
  // shorthands
100
- self.mount = ev.on("mount")
101
- self.clean = ev.on("clean")
102
- self.clear = (key) => self.gl.clear(self.gl[key || "COLOR_BUFFER_BIT"])
111
+ self.mount = (...args) => e.mount(...args)
112
+ self.clean = (...args) => e.clean(...args)
113
+ self.clear = (key) => self.gl.clear(self.gl[key || 'COLOR_BUFFER_BIT'])
103
114
  self.viewport = (size) => self.gl.viewport(0, 0, ...(size || self.size))
104
115
  self.drawArrays = (mode = 'TRIANGLES') =>
105
116
  self.gl.drawArrays(self.gl[mode], 0, self.count)
106
117
  self.drawElements = (mode = 'TRIANGLES', type = 'UNSIGNED_SHORT') =>
107
- self.gl.drawElements(self.gl[mode], self.count, self.gl[type], 0)
118
+ self.gl.drawElements(
119
+ self.gl[mode],
120
+ self.count,
121
+ self.gl[type],
122
+ 0
123
+ )
108
124
 
109
125
  // init config
110
126
  if (isTemplateLiteral(initArg)) initArg = interleave(initArg, initArgs)
111
- if (typeof initArg === "string") self.frag = initArg
112
- if (typeof initArg === "object") self.setConfig(initArg)
127
+ if (typeof initArg === 'string') self.frag = initArg
128
+ if (typeof initArg === 'object') self.setConfig(initArg)
113
129
  if (self.count === 6) self.setAttribute({ a_position })
114
130
 
115
- return self;
131
+ return self
116
132
  }
117
133
 
118
134
  gl.default = null as unknown as GL
119
135
 
120
- export default gl
136
+ export default gl
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "glre",
3
3
  "author": "tseijp",
4
4
  "license": "MIT",
5
- "version": "0.12.0",
5
+ "version": "0.13.1",
6
6
  "module": "index.js",
7
7
  "types": "index.ts",
8
8
  "main": "index.cjs.js",
@@ -13,7 +13,7 @@
13
13
  "access": "public"
14
14
  },
15
15
  "dependencies": {
16
- "reev": "0.3.0",
16
+ "reev": "0.9.0",
17
17
  "refr": "0.2.0"
18
18
  },
19
19
  "keywords": [
package/react.ts CHANGED
@@ -8,14 +8,14 @@ export function useGL(config?: Partial<GL>, target?: GL) {
8
8
  return (gl.default = gl(target))
9
9
  }, [target])
10
10
  useEffect(() => void self.setConfig(config), [self, config])
11
- useEffect(() => void self.event('mount'), [self])
12
- useEffect(() => () => self.event('clean'), [self])
11
+ useEffect(() => void self.event.mount(), [self])
12
+ useEffect(() => () => self.event.clean(), [self])
13
13
  return self
14
14
  }
15
15
 
16
16
  export function useTexture(props, self?: GL) {
17
17
  if (!self) self = gl.default
18
- useEffect(() => self.setTexture(props), [props, self])
18
+ useEffect(() => void self?.setTexture(props), [props, self])
19
19
  }
20
20
 
21
21
  export function useAttribute(props, self?: GL) {
@@ -31,10 +31,10 @@ export function useUniform(props, self?: GL) {
31
31
  export function useFrame(fun, self?: GL) {
32
32
  if (!self) self = gl.default
33
33
  const ref = useMutable(fun)
34
- useEffect(() => void self.setFrame(ref), [ref, self])
34
+ useEffect(() => void self?.setFrame(ref), [ref, self])
35
35
  }
36
36
 
37
37
  export function useMutable(fun) {
38
38
  const ref = useRef(fun)
39
39
  return useCallback(() => ref.current(), [])
40
- }
40
+ }
package/solid.ts CHANGED
@@ -22,4 +22,4 @@ export function setTexture(props, self?: GL) {
22
22
  export function setAttribute(props, self?: GL) {
23
23
  if (!self) self = gl.default
24
24
  return self.setAttribute(props)
25
- }
25
+ }
package/types.ts CHANGED
@@ -2,7 +2,7 @@
2
2
  * ref: https://stackoverflow.com/questions/52489261/typescript-can-i-define-an-n-length-tuple-type
3
3
  */
4
4
  import type { Frame, Fun } from 'refr'
5
- import type { Nested, Event } from 'reev'
5
+ import type { Nested, EventState } from 'reev/types'
6
6
 
7
7
  export type Uniform = number | number[]
8
8
 
@@ -12,6 +12,14 @@ export type Attributes = Record<string, Attribute>
12
12
 
13
13
  export type Uniforms = Record<string, Uniform>
14
14
 
15
+ export interface GLEvent {
16
+ mount(): void
17
+ clean(): void
18
+ mousemove(e: Event): void
19
+ resize(e?: Event): void
20
+ load(e?: Event, image?: HTMLImageElement): void
21
+ }
22
+
15
23
  export interface GL {
16
24
  (fun: Fun): GL
17
25
  (shader: string): GL
@@ -38,12 +46,13 @@ export interface GL {
38
46
  gl: any
39
47
  pg: any
40
48
  el: any
41
- event: Event
49
+ event: EventState<GLEvent>
42
50
  frame: Frame
43
51
  stride: Nested<number> // @TODO Nested<(key: string, value: number: number[], ibo: number[]) => number>
44
52
  location: Nested<any>
45
53
  activeUnit: Nested<number>
46
54
  uniformType: Nested<string>
55
+ vertexStride: Nested<number>
47
56
  default: GL
48
57
  /**
49
58
  * setter
@@ -54,28 +63,13 @@ export interface GL {
54
63
  setMount(frame: Fun): GL
55
64
  setClean(frame: Fun): GL
56
65
  setUniform(key: string, value: Uniform): GL
66
+ setUniform(target: { [key: string]: Uniform }): GL
57
67
  setTexture(key: string, value: string): GL
68
+ setTexture(target: { [key: string]: string }): GL
58
69
  setAttribute(key: string, value: Attribute, iboValue?: Attribute): GL
59
- setConfig<K extends keyof Partial<GL>>(key: K, value: GLConfig[K]): GL
60
- // setUniform: Durable<(
61
- // key: string,
62
- // value: Uniform,
63
- // isMatrix: boolean
64
- // ) => GL>,
65
- // setTexture: Durable<(
66
- // key: string,
67
- // value: string,
68
- // activeUnit: number
69
- // ) => GL>,
70
- // setAttribute: Durable<(
71
- // key: string,
72
- // value: Attribute,
73
- // iboValue: Attribute
74
- // ) => GL>,
75
- // setConfig: Durable<<K extends keyof GLConfig>(
76
- // key: K,
77
- // value: GLConfig[K]
78
- // ) => GL>,
70
+ setAttribute(target: { [key: string]: Attribute }): GL
71
+ setConfig(key?: keyof GL, value?: GL[keyof GL]): GL
72
+ setConfig(target?: Partial<GL>): GL
79
73
  mount(): void
80
74
  clean(): void
81
75
  clear(key?: GLClearMode): void
@@ -84,10 +78,7 @@ export interface GL {
84
78
  drawElements(key?: GLDrawMode): void
85
79
  }
86
80
 
87
- export type PrecisionMode =
88
- | 'highp'
89
- | 'mediump'
90
- | 'lowp'
81
+ export type PrecisionMode = 'highp' | 'mediump' | 'lowp'
91
82
 
92
83
  export type GLClearMode =
93
84
  | 'COLOR_BUFFER_BIT'
@@ -103,7 +94,4 @@ export type GLDrawMode =
103
94
  | 'TRIANGLE_FAN'
104
95
  | 'TRIANGLES'
105
96
 
106
- export type GLDrawType =
107
- | 'UNSIGNED_BYTE'
108
- | 'UNSIGNED_SHORT'
109
- | 'UNSIGNED_INT'
97
+ export type GLDrawType = 'UNSIGNED_BYTE' | 'UNSIGNED_SHORT' | 'UNSIGNED_INT'
package/utils.ts CHANGED
@@ -12,15 +12,15 @@ export function isTemplateLiteral(strings: unknown): strings is string[] {
12
12
  return Array.isArray(strings) && typeof strings[0] === "string"
13
13
  }
14
14
 
15
- export function include(source: string, target: string) {
15
+ export function includes(source: string, target: string) {
16
16
  source = source.replace(/\s+/g, '')
17
17
  target = target.replace(/\s+/g, '')
18
- return source.indexOf(target) !== -1
18
+ return source.includes(target)
19
19
  }
20
20
 
21
21
  export function concat(source: string, target: string, key = "") {
22
- if (key === "" || include(source, key))
23
- if (!include(source, target))
22
+ if (key === "" || source.includes(key))
23
+ if (!includes(source, target))
24
24
  return target + source
25
25
  return source
26
26
  }