oops-ui 0.0.11 → 0.0.13

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.
Files changed (30) hide show
  1. package/dist/BackgroundRipple/index.cjs +1 -1
  2. package/dist/BackgroundRipple/index.mjs +1 -1
  3. package/dist/index.cjs +1 -1
  4. package/dist/index.js +1 -0
  5. package/dist/index.mjs +1 -1
  6. package/dist/types/components/ripples/RipplesEle.d.ts +1 -1
  7. package/dist/types/customHooks/useRipples/defaultData.d.ts +2 -12
  8. package/dist/types/customHooks/useRipples/index.d.ts +1 -1
  9. package/dist/types/customHooks/useRipples/init/hideCssBackground.d.ts +9 -0
  10. package/dist/types/customHooks/useRipples/init/initEvent.d.ts +5 -0
  11. package/dist/types/customHooks/useRipples/init/initGL.d.ts +5 -0
  12. package/dist/types/customHooks/useRipples/init/initShaders.d.ts +7 -0
  13. package/dist/types/customHooks/useRipples/init/initTexture.d.ts +7 -0
  14. package/dist/types/customHooks/useRipples/init/loadImage.d.ts +13 -0
  15. package/dist/types/customHooks/useRipples/render/computeTextureBoundaries.d.ts +7 -0
  16. package/dist/types/customHooks/useRipples/render/drawQuad.d.ts +7 -0
  17. package/dist/types/customHooks/useRipples/render/dropAtPointer.d.ts +7 -0
  18. package/dist/types/customHooks/useRipples/render/render.d.ts +7 -0
  19. package/dist/types/customHooks/useRipples/render/step.d.ts +6 -0
  20. package/dist/types/customHooks/useRipples/render/swapBufferIndices.d.ts +2 -0
  21. package/dist/types/customHooks/useRipples/render/update.d.ts +2 -0
  22. package/dist/types/customHooks/useRipples/rippersData/renderData.d.ts +85 -0
  23. package/dist/types/customHooks/useRipples/rippersData/vertexSource.d.ts +28 -0
  24. package/dist/types/customHooks/useRipples/ripple.html.d.ts +3 -0
  25. package/dist/types/customHooks/useRipples/ripplesClass.d.ts +12 -17
  26. package/dist/types/customHooks/useRipples/tools.d.ts +1 -25
  27. package/dist/useRipples/index.cjs +1 -1
  28. package/dist/useRipples/index.mjs +1 -1
  29. package/package.json +1 -1
  30. package/dist/types/customHooks/useRipples/interface.d.ts +0 -159
@@ -1,4 +1,4 @@
1
- import { BackgroundRipplesProps, RipplesOptions } from './interface';
1
+ import { BackgroundRipplesProps, RipplesOptions } from './types';
2
2
  import { Ripples } from './ripplesClass';
3
3
  /**************************************
4
4
  *
@@ -0,0 +1,9 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************
3
+ * 隐藏背景
4
+ **************************/
5
+ export declare function hideCssBackground(this: Ripples): void;
6
+ /**************************
7
+ * 恢复背景样式
8
+ **************************/
9
+ export declare function restoreCssBackground(this: Ripples): void;
@@ -0,0 +1,5 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************
3
+ * 初始化事件
4
+ **************************/
5
+ export declare function setupPointerEvents(this: Ripples): void;
@@ -0,0 +1,5 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************
3
+ * 初始化 webGL
4
+ **************************/
5
+ export declare function initGL(this: Ripples): void;
@@ -0,0 +1,7 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 初始化着色器
5
+ *
6
+ **************************************/
7
+ export declare function initShaders(this: Ripples): void;
@@ -0,0 +1,7 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 初始化纹理
5
+ *
6
+ **************************************/
7
+ export declare function initTexture(this: Ripples): void;
@@ -0,0 +1,13 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 加载
5
+ *
6
+ **************************************/
7
+ export declare function loadImage(this: Ripples): void;
8
+ /**************************************
9
+ *
10
+ * 设置透明的纹理
11
+ *
12
+ **************************************/
13
+ export declare function setTransparentTexture(this: Ripples): void;
@@ -0,0 +1,7 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 计算纹理边界
5
+ *
6
+ **************************************/
7
+ export declare function computeTextureBoundaries(this: Ripples): void;
@@ -0,0 +1,7 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 绘制 GL 数据流
5
+ *
6
+ **************************************/
7
+ export declare function drawQuad(this: Ripples): void;
@@ -0,0 +1,7 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 触发的点
5
+ *
6
+ **************************************/
7
+ export declare function dropAtPointer(this: Ripples, pointer: MouseEvent | Touch, radius: number, strength: number): void;
@@ -0,0 +1,7 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************************
3
+ *
4
+ * 绘制
5
+ *
6
+ **************************************/
7
+ export declare function render(this: Ripples): void;
@@ -0,0 +1,6 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ /**************************
3
+ * 开启绘制
4
+ *
5
+ **************************/
6
+ export declare function step(this: Ripples): void;
@@ -0,0 +1,2 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ export declare function swapBufferIndices(this: Ripples): void;
@@ -0,0 +1,2 @@
1
+ import { Ripples } from '../ripplesClass';
2
+ export declare function update(this: Ripples): void;
@@ -0,0 +1,85 @@
1
+ import { Program, RipplesDefaultData, Textures } from '../types';
2
+ /**************************************
3
+ *
4
+ * 原始数据类
5
+ *
6
+ **************************************/
7
+ export declare class RipplesRenderData {
8
+ /** canvas 的显隐 */
9
+ visible: boolean;
10
+ /** 当前执行的状态 */
11
+ running: boolean;
12
+ /** 扰动系数 */
13
+ perturbance: number;
14
+ /** */
15
+ resolution: number;
16
+ /** 雨滴醉落的时间间隔 */
17
+ raindropsTimeInterval: number;
18
+ /** 渲染 id */
19
+ animationFrameId: number;
20
+ /** 渲染数据流
21
+ *
22
+ * 该值在 init 中进行初始化
23
+ */
24
+ quad: WebGLBuffer;
25
+ /**************************
26
+ * 上一次雨滴滴落的时间
27
+ *
28
+ * 该时间更新触发时机:
29
+ * - 2.2s 内没有事件触发
30
+ * - 鼠标交互更新
31
+ **************************/
32
+ lastRaindropsFallTime: number;
33
+ /** canvas 父级元素 */
34
+ parentElement: HTMLElement;
35
+ /** 背景页面的数据 */
36
+ backgroundInfo: {
37
+ width: number;
38
+ height: number;
39
+ };
40
+ /**************************
41
+ *
42
+ * 该值于初始化着色器时初始化
43
+ **************************/
44
+ dropProgram: Program;
45
+ /**************************
46
+ *
47
+ **************************/
48
+ updateProgram: Program;
49
+ /** 纹理 */
50
+ textures: Textures;
51
+ /** 背景纹理 */
52
+ backgroundTexture: WebGLTexture;
53
+ /** 纹理数据 */
54
+ textureDelta: Float32Array<ArrayBuffer>;
55
+ /** */
56
+ framebuffers: WebGLFramebuffer[];
57
+ /** */
58
+ bufferWriteIndex: number;
59
+ /** */
60
+ bufferReadIndex: number;
61
+ /** 原始行内样式 */
62
+ originalInlineCss: string;
63
+ /** 原始 background-image 数据 */
64
+ originalCssBackgroundImage: string;
65
+ /**************************
66
+ * 事件
67
+ **************************/
68
+ events: {
69
+ mousemove: (e: MouseEvent) => void;
70
+ mousedown: (e: MouseEvent) => void;
71
+ touchmove: (e: TouchEvent) => void;
72
+ touchstart: (e: TouchEvent) => void;
73
+ };
74
+ /** 触发倍效 */
75
+ accelerating: number;
76
+ constructor(defaultData: RipplesDefaultData);
77
+ }
78
+ /**************************************
79
+ *
80
+ * 渲染数仓
81
+ *
82
+ **************************************/
83
+ export declare const ripplesRenderDataWarehouse: {
84
+ [x: symbol]: RipplesRenderData;
85
+ };
@@ -0,0 +1,28 @@
1
+ /**************************
2
+ *
3
+ **************************/
4
+ export declare const vertexShader = "\n attribute vec2 vertex;\n varying vec2 coord;\n void main() {\n coord = vertex * 0.5 + 0.5;\n gl_Position = vec4(vertex, 0.0, 1.0);\n }";
5
+ /**************************************
6
+ *
7
+ *
8
+ *
9
+ **************************************/
10
+ export declare const updateProgramFragmentSource = "\n precision highp float;\n\n uniform sampler2D texture;\n uniform vec2 delta;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n \n vec2 dx = vec2(delta.x, 0.0);\n vec2 dy = vec2(0.0, delta.y);\n \n float average = (\n texture2D(texture, coord - dx).r +\n texture2D(texture, coord - dy).r +\n texture2D(texture, coord + dx).r +\n texture2D(texture, coord + dy).r\n ) * 0.25;\n \n info.g += (average - info.r) * 2.0;\n info.g *= 0.995;\n info.r += info.g;\n \n gl_FragColor = info;\n }\n ";
11
+ /**************************************
12
+ *
13
+ *
14
+ *
15
+ **************************************/
16
+ export declare const renderVertexSource = "\n precision highp float;\n\n attribute vec2 vertex;\n uniform vec2 topLeft;\n uniform vec2 bottomRight;\n uniform vec2 containerRatio;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n void main() {\n backgroundCoord = mix(topLeft, bottomRight, vertex * 0.5 + 0.5);\n backgroundCoord.y = 1.0 - backgroundCoord.y;\n ripplesCoord = vec2(vertex.x, -vertex.y) * containerRatio * 0.5 + 0.5;\n gl_Position = vec4(vertex.x, -vertex.y, 0.0, 1.0);\n }\n ";
17
+ /**************************************
18
+ *
19
+ *
20
+ *
21
+ **************************************/
22
+ export declare const renderProgramFragmentSource = "\n precision highp float;\n\n uniform sampler2D samplerBackground;\n uniform sampler2D samplerRipples;\n uniform vec2 delta;\n\n uniform float perturbance;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n\n void main() {\n float height = texture2D(samplerRipples, ripplesCoord).r;\n float heightX = texture2D(samplerRipples, vec2(ripplesCoord.x + delta.x, ripplesCoord.y)).r;\n float heightY = texture2D(samplerRipples, vec2(ripplesCoord.x, ripplesCoord.y + delta.y)).r;\n vec3 dx = vec3(delta.x, heightX - height, 0.0);\n vec3 dy = vec3(0.0, heightY - height, delta.y);\n vec2 offset = -normalize(cross(dy, dx)).xz;\n float specular = pow(max(0.0, dot(offset, normalize(vec2(-0.6, 1.0)))), 4.0);\n gl_FragColor = texture2D(samplerBackground, backgroundCoord + offset * perturbance) + specular;\n }";
23
+ /**************************************
24
+ *
25
+ * fragmentSource
26
+ *
27
+ **************************************/
28
+ export declare const dropProgramFragmentSource = "precision highp float;\n\n const float PI = 3.141592653589793;\n uniform sampler2D texture;\n uniform vec2 center;\n uniform float radius;\n uniform float strength;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n\n float drop = max(0.0, 1.0 - length(center * 0.5 + 0.5 - coord) / radius);\n drop = 0.5 - cos(drop * PI) * 0.5;\n info.r += drop * strength;\n gl_FragColor = info;\n }";
@@ -0,0 +1,3 @@
1
+ import { Ripples } from './ripplesClass';
2
+ import { RipplesOptions } from './types';
3
+ export declare function useRipples(element: HTMLElement, options: RipplesOptions): Ripples;
@@ -7,7 +7,7 @@
7
7
  * @Description ripples 水涟漪效果
8
8
  ****************************************************************************/
9
9
  import { RipplesData } from './rippersData';
10
- import { Program, RipplesOptions } from './interface';
10
+ import { Program, RipplesOptions } from './types';
11
11
  /**************************************
12
12
  *
13
13
  * ## 水波动涟漪的效果
@@ -17,33 +17,28 @@ import { Program, RipplesOptions } from './interface';
17
17
  **************************************/
18
18
  export declare class Ripples extends RipplesData {
19
19
  #private;
20
+ /**************************
21
+ * 唯一标识
22
+ *
23
+ * 用于处理 Ripples 在实例化后数据交叉污染问题
24
+ **************************/
25
+ sole: symbol;
20
26
  /**************************
21
27
  *
22
28
  * 默认值
23
29
  *
24
- * - resolution 分辨率,纹理的尺寸,该项目中该值为纹理的宽和高,缺省为 `360`
30
+ * - resolution 分辨率,纹理的尺寸,该项目中该值为纹理的宽和高,缺省为 `256`
25
31
  * - dropRadius 扩撒半径,缺省值为 `20`
26
32
  * - perturbance 扰动系数,缺省为 `0.03`
27
33
  * - interactive 光标交互,缺省为 `true` ,关闭须显示传入 `false` 值
28
34
  * - crossOrigin 原始样式
29
35
  * - imageUrl 原始背景图片地址
30
36
  * - playingState 当前的播放状态,缺省为 `true` ,设定为 `false` 时并不关闭,而是暂停
31
- * - accelerating 加速光标移动触发,缺省为 `3`
32
- * - raindropsTimeInterval 雨滴滴落的间隔,缺省为 `660`,可设置区间为 `10 ~ 12000`
37
+ * - accelerating 加速光标移动触发,缺省为 `1`
38
+ * - raindropsTimeInterval 雨滴滴落的间隔,缺省为 `3600`,可设置区间为 `10 ~ 12000`
33
39
  * - idleFluctuations 闲置波动,在光标交互不触发时,将触发模拟雨滴,缺省为 `true`
34
40
  **************************/
35
- defaults: {
36
- imageUrl: string;
37
- resolution: number;
38
- dropRadius: number;
39
- perturbance: number;
40
- interactive: boolean;
41
- crossOrigin: string;
42
- playingState: boolean;
43
- accelerating: number;
44
- raindropsTimeInterval: number;
45
- idleFluctuations: boolean;
46
- };
41
+ defaults: import("./types").RipplesDefaultData;
47
42
  /** 是否与鼠标互动 */
48
43
  interactive: boolean;
49
44
  /**************************
@@ -119,7 +114,7 @@ export declare class Ripples extends RipplesData {
119
114
  **************************/
120
115
  changePlayingState(): void;
121
116
  /**************************
122
- * 给初始化化量赋值
117
+ * 给初始化变量赋值
123
118
  **************************/
124
119
  set(property: keyof RipplesOptions, value: unknown): void;
125
120
  }
@@ -7,19 +7,7 @@
7
7
  * @Description 工具
8
8
  ****************************************************************************/
9
9
  import { Ripples } from './ripplesClass';
10
- import { Program } from './interface';
11
- /**************************************
12
- *
13
- * 转换背景的位置为特定的格式
14
- *
15
- **************************************/
16
- export declare function translateBackgroundPosition(value: string): string[];
17
- /**************************************
18
- *
19
- * 检测数据是否为 url 外联图像地址
20
- *
21
- **************************************/
22
- export declare function extractUrl(value: string): string | null;
10
+ import { Program } from './types';
23
11
  /**************************************
24
12
  *
25
13
  * 增加 WebGLProgram
@@ -33,18 +21,6 @@ export declare function createProgram(vertexSource: string, fragmentSource: stri
33
21
  *
34
22
  **************************************/
35
23
  export declare function bindTexture(this: Ripples, texture: WebGLTexture, unit?: number): void;
36
- /**************************************
37
- *
38
- * 是否是 base64 数据
39
- *
40
- **************************************/
41
- export declare function isDataUri(url: string): RegExpMatchArray | null;
42
- /**************************************
43
- *
44
- * 给定的字符串是否为百分数
45
- *
46
- **************************************/
47
- export declare function isPercentage(value: string): boolean;
48
24
  /**************************
49
25
  * 给 canvas 设置样式
50
26
  **************************/
@@ -1 +1 @@
1
- (()=>{"use strict";var e={953:e=>{e.exports=require("react")}},t={};function r(n){var i=t[n];if(void 0!==i)return i.exports;var o=t[n]={exports:{}};return e[n](o,o.exports,r),o.exports}r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};r.r(n),r.d(n,{useRipples:()=>ye});var i=r(953);const o=require("a-element-inline-style");function a(e){var t=/url\(["']?([^"']*)["']?\)/.exec(e);return null==t?null:t[1]}function s(e,t,r,n){function i(e,t){var n=r.createShader(e);if(r.shaderSource(n,t),r.compileShader(n),!r.getShaderParameter(n,r.COMPILE_STATUS))throw new Error("compile error: "+r.getShaderInfoLog(n));return n}var o,a={id:r.createProgram(),uniforms:{},locations:{}};if(r.attachShader(a.id,i(r.VERTEX_SHADER,e)),r.attachShader(a.id,i(r.FRAGMENT_SHADER,t)),r.linkProgram(a.id),!r.getProgramParameter(a.id,r.LINK_STATUS))throw new Error("link error: "+r.getProgramInfoLog(a.id));r.useProgram(a.id),r.enableVertexAttribArray(0);for(var s=e+t,l=/uniform (\w+) (\w+)/g;null!==(o=l.exec(s));){var u=o[2];a.locations[u]=r.getUniformLocation(a.id,u)}return a}function l(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=this.gl;r.activeTexture(r.TEXTURE0+(t||0)),r.bindTexture(r.TEXTURE_2D,e)}function u(e){return e.endsWith("%")}function c(){var e=this,t=function(){return e.initState=!1,null};if(!this.gl)return t();var r=this.gl,n=Object.fromEntries(["OES_texture_float","OES_texture_half_float","OES_texture_float_linear","OES_texture_half_float_linear"].reduce((function(e,t){var n=r.getExtension(t);return n&&e.push([t,n]),e}),[]));if(!n.OES_texture_float)return t();var i=[];function o(e,t,r){var i="OES_texture_"+e,o=i+"_linear",a=o in n;return{type:t,linearSupport:a,arrayType:r,extensions:a?[i,o]:[i]}}i.push(o("float",r.FLOAT,Float32Array)),n.OES_texture_half_float&&i.push(o("half_float",n.OES_texture_half_float.HALF_FLOAT_OES,null));var a=r.createTexture(),s=r.createFramebuffer();r.bindFramebuffer(r.FRAMEBUFFER,s),r.bindTexture(r.TEXTURE_2D,a),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE);for(var l=null,u=0;u<i.length;u++)if(r.texImage2D(r.TEXTURE_2D,0,r.RGBA,32,32,0,r.RGBA,i[u].type,null),r.framebufferTexture2D(r.FRAMEBUFFER,r.COLOR_ATTACHMENT0,r.TEXTURE_2D,a,0),r.checkFramebufferStatus(r.FRAMEBUFFER)===r.FRAMEBUFFER_COMPLETE){l=i[u];break}return l}function f(e){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f(e)}function h(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,m(n.key),n)}}function d(e,t,r){return t&&h(e.prototype,t),r&&h(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function p(e,t,r){return(t=m(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function m(e){var t=function(e){if("object"!=f(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=f(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==f(t)?t:t+""}var v="lmssee_ripper_element_style",g=d((function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),p(this,"styleElement",document.createElement("style")),p(this,"canvas",void 0),p(this,"gl",void 0),p(this,"config",void 0),p(this,"transparentPixels",function(){try{return new ImageData(32,32)}catch(e){return console.log(e&&""),document.createElement("canvas").getContext("2d").createImageData(32,32)}}()),p(this,"initState",!0),this.canvas=t;var r=t.getContext("webgl");if(null===r)return this.initState=!1,void(this.config=null);if(this.gl=r,null===document.querySelector("style#".concat(v))){var n=this.styleElement;n.id=v,n.innerHTML="\n .lmssee-ripples { \n position: relative; \n z-index: 0; \n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transform: translate(0,0);\n }\n ";var i=document.head;i.prepend?i.prepend(n):i.insertBefore(n,i.firstChild)}this.config=Reflect.apply(c,this,[])})),E={imageUrl:"",resolution:360,dropRadius:10,perturbance:.03,interactive:!0,crossOrigin:"",playingState:!0,accelerating:3,raindropsTimeInterval:660,idleFluctuations:!0};function b(e){return b="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},b(e)}function y(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function T(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?y(Object(r),!0).forEach((function(t){A(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):y(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function R(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,O(n.key),n)}}function w(e,t){if(t&&("object"==b(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function _(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(e){}return(_=function(){return!!e})()}function x(e){return x=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},x(e)}function P(e,t){return P=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},P(e,t)}function S(e,t,r){F(e,t),t.set(e,r)}function F(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function A(e,t,r){return(t=O(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(e){var t=function(e){if("object"!=b(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=b(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==b(t)?t:t+""}function D(e,t){return e.get(U(e,t))}function k(e,t,r){return e.set(U(e,t),r),r}function U(e,t,r){if("function"==typeof e?e===t:e.has(t))return arguments.length<3?t:r;throw new TypeError("Private element is not present on this object")}Object.freeze(E);var M=new WeakMap,C=new WeakMap,L=new WeakMap,I=new WeakMap,W=new WeakMap,X=new WeakMap,j=new WeakMap,B=new WeakMap,N=new WeakMap,G=new WeakMap,z=new WeakMap,H=new WeakMap,Y=new WeakMap,q=new WeakMap,K=new WeakMap,V=new WeakMap,J=new WeakMap,Q=new WeakMap,Z=new WeakMap,$=new WeakMap,ee=new WeakMap,te=new WeakMap,re=new WeakMap,ne=new WeakMap,ie=new WeakSet,oe=function(e){function t(e,r){var n,i,a;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),n=function(e,t,r){return t=x(t),w(e,_()?Reflect.construct(t,r||[],x(e).constructor):t.apply(e,r))}(this,t,[e]),F(i=n,a=ie),a.add(i),A(n,"defaults",E),A(n,"interactive",n.defaults.interactive),S(n,M,n.defaults.accelerating),S(n,C,n.defaults.resolution),S(n,L,n.defaults.perturbance),A(n,"dropRadius",void 0),A(n,"crossOrigin",""),A(n,"imageUrl",void 0),A(n,"idleFluctuations",!0),S(n,I,void 0),S(n,W,void 0),S(n,X,[]),S(n,j,[]),S(n,B,0),S(n,N,1),S(n,G,void 0),S(n,z,!1),S(n,H,!1),S(n,Y,!1),S(n,q,0),S(n,K,""),A(n,"imageSource",""),A(n,"renderProgram",void 0),S(n,V,void 0),S(n,J,void 0),S(n,Q,void 0),S(n,Z,void 0),S(n,$,void 0),S(n,ee,void 0),S(n,te,Date.now()),S(n,re,n.defaults.raindropsTimeInterval),S(n,ne,{mousemove:function(e){return console.log(e)},mousedown:function(e){return console.log(e)},touchmove:function(e){return console.log(e)},touchstart:function(e){return console.log(e)}}),Object.defineProperties(n,{defaults:{value:n.defaults,writable:!1,enumerable:!1,configurable:!1}}),r&&"boolean"!=typeof r.interactive&&delete r.interactive;var s=T(T({},n.defaults),r);if(n.interactive=s.interactive,n.resolution=s.resolution,n.perturbance=s.perturbance,n.dropRadius=s.dropRadius,n.crossOrigin=s.crossOrigin,n.imageUrl=s.imageUrl,n.idleFluctuations=s.idleFluctuations,!1===n.initState||null===e.parentElement||null===n.config||null===n.gl)return n.initState=!1,w(n);var l=n.gl,u=1/D(C,n);k(W,n,new Float32Array([u,u])),k(I,n,e.parentElement),function(e){var t=e.parentElement;e.width=t.clientWidth,e.height=t.clientHeight,(0,o.setStyle)(e,{position:"absolute",left:0,top:0,right:0,bottom:0,pointerEvents:"none"})}(e),n.config.extensions.forEach((function(e){return l.getExtension(e)})),n.updateSize=n.updateSize.bind(n),window.addEventListener("resize",n.updateSize);for(var c=n.config.arrayType,f=c?new c(D(C,n)*D(C,n)*4):null,h=n.config,d=0;d<2;d++){var p=l.createTexture(),m=l.createFramebuffer();l.bindFramebuffer(l.FRAMEBUFFER,m),l.bindTexture(l.TEXTURE_2D,p),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_MIN_FILTER,h.linearSupport?l.LINEAR:l.NEAREST),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_MAG_FILTER,h.linearSupport?l.LINEAR:l.NEAREST),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_WRAP_S,l.CLAMP_TO_EDGE),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_WRAP_T,l.CLAMP_TO_EDGE),l.texImage2D(l.TEXTURE_2D,0,l.RGBA,D(C,n),D(C,n),0,l.RGBA,h.type,f),l.framebufferTexture2D(l.FRAMEBUFFER,l.COLOR_ATTACHMENT0,l.TEXTURE_2D,p,0),D(X,n).push(p),D(j,n).push(m)}return k(G,n,l.createBuffer()),l.bindBuffer(l.ARRAY_BUFFER,D(G,n)),l.bufferData(l.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,1,1,-1,1]),l.STATIC_DRAW),U(ie,n,pe).call(n),U(ie,n,me).call(n),U(ie,n,ve).call(n),U(ie,n,se).call(n),l.clearColor(0,0,0,0),l.blendFunc(l.SRC_ALPHA,l.ONE_MINUS_SRC_ALPHA),k(z,n,!0),k(H,n,!0),k(Y,n,!0),U(ie,n,ae).call(n),k(q,n,requestAnimationFrame((function(){return U(ie,n,le).call(n)}))),n}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&P(e,t)}(t,e),r=t,n=[{key:"accelerating",set:function(e){e>100||e<2||k(M,this,e)}},{key:"resolution",set:function(e){e<100||e>550||k(C,this,e)}},{key:"perturbance",set:function(e){e<1e-4||e>1||k(L,this,e)}},{key:"playingState",set:function(e){k(H,this,!1!==e)}},{key:"initialized",get:function(){return D(Y,this)}},{key:"raindropsTimeInterval",set:function(e){e<10||e>12e3||k(re,this,e)}},{key:"raindropsFall",value:function(){var e=window.getComputedStyle(D(I,this)),t=function(e){return function(e=1,t=0){let r=Math.ceil(Number(t)),n=Math.floor(Number(e));return r>n&&([n,r]=[r,n]),Math.floor(Math.random()*(n-r+1)+r)}(parseInt(e))},r=e.width,n=e.height;this.drop(t(r),t(n),1.5*this.dropRadius,.14)}},{key:"drop",value:function(e,t,r,n){var i=this.gl,o=D(I,this).offsetWidth,a=D(I,this).offsetHeight,s=Math.max(o,a);r/=s;var u=new Float32Array([(2*e-o)/s,(a-2*t)/s]);i.viewport(0,0,D(C,this),D(C,this)),i.bindFramebuffer(i.FRAMEBUFFER,D(j,this)[D(B,this)]),Reflect.apply(l,this,[D(X,this)[D(N,this)]]),i.useProgram(D(Q,this).id),i.uniform2fv(D(Q,this).locations.center,u),i.uniform1f(D(Q,this).locations.radius,r),i.uniform1f(D(Q,this).locations.strength,n),U(ie,this,ue).call(this),U(ie,this,he).call(this)}},{key:"updateSize",value:function(){var e=D(I,this).offsetWidth,t=D(I,this).offsetHeight;e==this.canvas.width&&t==this.canvas.height||(this.canvas.width=e,this.canvas.height=t)}},{key:"destroy",value:function(){var e=this,t=D(I,this);t&&(Object.keys(D(ne,this)).forEach((function(r){return t.removeEventListener&&t.removeEventListener(r,D(ne,e)[r])})),t.removeAttribute&&t.removeAttribute("data-ripples")),this.styleElement&&this.styleElement.remove(),this.gl=null,this.gl&&(this.gl=null),window.removeEventListener("resize",this.updateSize),U(ie,this,Ee).call(this),D(q,this)&&window.cancelAnimationFrame(D(q,this))}},{key:"show",value:function(){k(z,this,!0),this.canvas.style.visibility="visible",U(ie,this,ge).call(this)}},{key:"hide",value:function(){k(z,this,!1),this.canvas.style.visibility="hidden",U(ie,this,Ee).call(this)}},{key:"pause",value:function(){k(H,this,!1)}},{key:"play",value:function(){k(H,this,!0)}},{key:"changePlayingState",value:function(){k(H,this,!D(H,this))}},{key:"set",value:function(e,t){"imageUrl"===e?(this.imageUrl=t,U(ie,this,se).call(this)):this[e]=t}}],n&&R(r.prototype,n),Object.defineProperty(r,"prototype",{writable:!1}),r;var r,n}(g);function ae(){var e=this,t=function(t){var r=arguments.length>1&&void 0!==arguments[1]&&arguments[1];D(z,e)&&D(H,e)&&e.interactive&&(k(te,e,Date.now()),U(ie,e,be).call(e,t,e.dropRadius*(r?1.5:1),r?.14:.01))};D(ne,this).mousemove=function(r){for(var n=D(M,e);n--;)t(r)},D(ne,this).touchmove=D(ne,this).touchstart=function(e){for(var r=e.touches,n=0;n<r.length;n++)t(r[n])},D(ne,this).mousedown=function(e){return t(e,!0)},Object.keys(D(ne,this)).forEach((function(t){return D(I,e)&&D(I,e).addEventListener(t,D(ne,e)[t],{passive:!0})}))}function se(){var e=this,t=this.gl,r=this.imageUrl||a(D(K,this))||a(window.getComputedStyle(D(I,this)).backgroundImage);if(r!==this.imageSource)if(this.imageSource=r,this.imageSource){var n=new Image;n.onload=function(){var r=function(e){return!(e&e-1)},i=r(n.width)&&r(n.height)?t.REPEAT:t.CLAMP_TO_EDGE;t.bindTexture(t.TEXTURE_2D,D(V,e)),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,i),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,i),t.texImage2D(t.TEXTURE_2D,0,t.RGBA,t.RGBA,t.UNSIGNED_BYTE,n),k(Z,e,n.width),k($,e,n.height),U(ie,e,ge).call(e)},n.onerror=function(){return U(ie,e,ve).call(e)},n.crossOrigin=this.imageSource.match(/^data:/)?null:this.crossOrigin,n.src=this.imageSource}else U(ie,this,ve).call(this)}function le(){var e=this;D(z,this)&&(U(ie,this,de).call(this),U(ie,this,fe).call(this),U(ie,this,ce).call(this),k(q,this,requestAnimationFrame((function(){return U(ie,e,le).call(e)}))))}function ue(){var e=this.gl;e.bindBuffer(e.ARRAY_BUFFER,D(G,this)),e.vertexAttribPointer(0,2,e.FLOAT,!1,0,0),e.drawArrays(e.TRIANGLE_FAN,0,4)}function ce(){var e=this.gl;e.bindFramebuffer(e.FRAMEBUFFER,null),e.viewport(0,0,this.canvas.width,this.canvas.height),e.enable(e.BLEND),e.clear(e.COLOR_BUFFER_BIT|e.DEPTH_BUFFER_BIT),e.useProgram(this.renderProgram.id),Reflect.apply(l,this,[D(V,this),0]),Reflect.apply(l,this,[D(X,this)[0],1]),e.uniform1f(this.renderProgram.locations.perturbance,D(L,this)),e.uniform2fv(this.renderProgram.locations.topLeft,this.renderProgram.uniforms.topLeft),e.uniform2fv(this.renderProgram.locations.bottomRight,this.renderProgram.uniforms.bottomRight),e.uniform2fv(this.renderProgram.locations.containerRatio,this.renderProgram.uniforms.containerRatio),e.uniform1i(this.renderProgram.locations.samplerBackground,0),e.uniform1i(this.renderProgram.locations.samplerRipples,1),U(ie,this,ue).call(this),e.disable(e.BLEND)}function fe(){if(this.idleFluctuations&&D(H,this)){var e=Date.now();e-D(te,this)>D(re,this)&&(k(te,this,e),this.raindropsFall())}var t=this.gl;t.viewport(0,0,D(C,this),D(C,this)),t.bindFramebuffer(t.FRAMEBUFFER,D(j,this)[D(B,this)]),Reflect.apply(l,this,[D(X,this)[D(N,this)]]),t.useProgram(D(J,this).id),U(ie,this,ue).call(this),U(ie,this,he).call(this)}function he(){k(B,this,1-D(B,this)),k(N,this,1-D(N,this))}function de(){var e,t,r,n=window.getComputedStyle(D(I,this)).backgroundSize,i=window.getComputedStyle(D(I,this)).backgroundAttachment,o=(e=window.getComputedStyle(D(I,this)).backgroundPosition,/\s+/.test(e)?e.replace(/center/,"50%").replace(/top|left/,"0%").replace(/bottom/,"100%").replace(/\s+/," ").split(" "):u(e)?[e,"50%"]:{center:["50%","50%"],top:["50%","0%"],bottom:["50%","100%"],left:["0%","50%"],right:["100%","50%"]}[e]),a="fixed"==i?{left:window.scrollX,top:window.scrollY,width:window.innerWidth,height:window.innerHeight}:{left:D(I,this).getBoundingClientRect().left,top:D(I,this).getBoundingClientRect().top,width:D(I,this).scrollWidth,height:D(I,this).scrollHeight};if("cover"==n){var s=Math.max(a.width/D(Z,this),a.height/D($,this));t=D(Z,this)*s,r=D($,this)*s}else if("contain"==n){var l=Math.min(a.width/D(Z,this),a.height/D($,this));t=D(Z,this)*l,r=D($,this)*l}else{var c=n.split(" ");t=c[0]||"",r=c[1]||t,u(t)?t=a.width*parseFloat(t)/100:"auto"!==t&&(t=parseFloat(t)),u(r)?r=a.height*parseFloat(r)/100:"auto"!==r&&(r=parseFloat(r)),"auto"==t&&"auto"==r?(t=D(Z,this),r=D($,this)):("auto"==t&&(t=D(Z,this)*(Number(r)/D($,this))),"auto"==r&&(r=D($,this)*(Number(t)/D(Z,this))))}var f=o&&o[0]||"0%",h=o&&o[1]||"0%";f=u(f)?(a.left+(a.width-Number(t))*parseFloat(f)/100).toString():(a.left+parseFloat(f)).toString(),h=u(h)?(a.top+(a.height-Number(r))*parseFloat(h)/100).toString():(a.top+parseFloat(h)).toString(),this.renderProgram.uniforms.topLeft=new Float32Array([(D(I,this).offsetLeft-Number(f))/Number(t),(D(I,this).offsetTop-Number(h))/Number(r)]),this.renderProgram.uniforms.bottomRight=new Float32Array([this.renderProgram.uniforms.topLeft[0]+D(I,this).clientWidth/Number(t),this.renderProgram.uniforms.topLeft[1]+D(I,this).clientHeight/Number(r)]);var d=Math.max(this.canvas.width,this.canvas.height);this.renderProgram.uniforms.containerRatio=new Float32Array([this.canvas.width/d,this.canvas.height/d])}function pe(){var e=this.gl,t="\n attribute vec2 vertex;\n varying vec2 coord;\n void main() {\n coord = vertex * 0.5 + 0.5;\n gl_Position = vec4(vertex, 0.0, 1.0);\n }";k(Q,this,s(t,"precision highp float;\n\n const float PI = 3.141592653589793;\n uniform sampler2D texture;\n uniform vec2 center;\n uniform float radius;\n uniform float strength;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n\n float drop = max(0.0, 1.0 - length(center * 0.5 + 0.5 - coord) / radius);\n drop = 0.5 - cos(drop * PI) * 0.5;\n info.r += drop * strength;\n gl_FragColor = info;\n }",e)),k(J,this,s(t,"precision highp float;\n\n uniform sampler2D texture;\n uniform vec2 delta;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n \n vec2 dx = vec2(delta.x, 0.0);\n vec2 dy = vec2(0.0, delta.y);\n \n float average = (\n texture2D(texture, coord - dx).r +\n texture2D(texture, coord - dy).r +\n texture2D(texture, coord + dx).r +\n texture2D(texture, coord + dy).r\n ) * 0.25;\n \n info.g += (average - info.r) * 2.0;\n info.g *= 0.995;\n info.r += info.g;\n \n gl_FragColor = info;\n }\n ",this.gl)),e.uniform2fv(D(J,this).locations.delta,D(W,this)),this.renderProgram=s("\n precision highp float;\n\n attribute vec2 vertex;\n uniform vec2 topLeft;\n uniform vec2 bottomRight;\n uniform vec2 containerRatio;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n void main() {\n backgroundCoord = mix(topLeft, bottomRight, vertex * 0.5 + 0.5);\n backgroundCoord.y = 1.0 - backgroundCoord.y;\n ripplesCoord = vec2(vertex.x, -vertex.y) * containerRatio * 0.5 + 0.5;\n gl_Position = vec4(vertex.x, -vertex.y, 0.0, 1.0);\n }\n ","\n precision highp float;\n\n uniform sampler2D samplerBackground;\n uniform sampler2D samplerRipples;\n uniform vec2 delta;\n\n uniform float perturbance;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n\n void main() {\n float height = texture2D(samplerRipples, ripplesCoord).r;\n float heightX = texture2D(samplerRipples, vec2(ripplesCoord.x + delta.x, ripplesCoord.y)).r;\n float heightY = texture2D(samplerRipples, vec2(ripplesCoord.x, ripplesCoord.y + delta.y)).r;\n vec3 dx = vec3(delta.x, heightX - height, 0.0);\n vec3 dy = vec3(0.0, heightY - height, delta.y);\n vec2 offset = -normalize(cross(dy, dx)).xz;\n float specular = pow(max(0.0, dot(offset, normalize(vec2(-0.6, 1.0)))), 4.0);\n gl_FragColor = texture2D(samplerBackground, backgroundCoord + offset * perturbance) + specular;\n }",e),e.uniform2fv(this.renderProgram.locations.delta,D(W,this))}function me(){var e=this.gl;k(V,this,e.createTexture()),e.bindTexture(e.TEXTURE_2D,D(V,this)),e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL,1),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR)}function ve(){var e=this.gl;e.bindTexture(e.TEXTURE_2D,D(V,this)),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,this.transparentPixels)}function ge(){var e=D(I,this).style.backgroundImage;"none"!=e&&(k(ee,this,e),k(K,this,window.getComputedStyle(D(I,this)).backgroundImage),D(I,this).style.backgroundImage="none")}function Ee(){D(I,this).style.backgroundImage=D(ee,this)||""}function be(e,t,r){var n=window.getComputedStyle(D(I,this)),i=parseInt(n.borderLeftWidth)||0,o=parseInt(n.borderTopWidth)||0,a=D(I,this).getBoundingClientRect(),s=e.clientX-a.left-i,l=e.clientY-a.top-o;this.drop(s,l,t,r)}function ye(e,t){var r=(0,i.useRef)(null);return(0,i.useEffect)((function(){return r.current=new oe(e.current,t&&t.option),function(){return r.current&&r.current.destroy()||void 0}}),[]),r}module.exports["oops-ui"]=n})();
1
+ (()=>{"use strict";var e={953:e=>{e.exports=require("react")}},t={};function r(n){var i=t[n];if(void 0!==i)return i.exports;var o=t[n]={exports:{}};return e[n](o,o.exports,r),o.exports}r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};r.r(n),r.d(n,{useRipples:()=>ee});var i=r(953);const o=require("a-element-inline-style");function a(e,t,r,n){function i(e,t){var n=r.createShader(e);if(r.shaderSource(n,t),r.compileShader(n),!r.getShaderParameter(n,r.COMPILE_STATUS))throw new Error("compile error: "+r.getShaderInfoLog(n));return n}var o,a={id:r.createProgram(),uniforms:{},locations:{}};if(r.attachShader(a.id,i(r.VERTEX_SHADER,e)),r.attachShader(a.id,i(r.FRAGMENT_SHADER,t)),r.linkProgram(a.id),!r.getProgramParameter(a.id,r.LINK_STATUS))throw new Error("link error: "+r.getProgramInfoLog(a.id));r.useProgram(a.id),r.enableVertexAttribArray(0);for(var l=e+t,s=/uniform (\w+) (\w+)/g;null!==(o=s.exec(l));){var u=o[2];a.locations[u]=r.getUniformLocation(a.id,u)}return a}function l(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=this.gl;r.activeTexture(r.TEXTURE0+(t||0)),r.bindTexture(r.TEXTURE_2D,e)}function s(){var e=this,t=function(){return e.initState=!1,null};if(!this.gl)return t();var r=this.gl,n=Object.fromEntries(["OES_texture_float","OES_texture_half_float","OES_texture_float_linear","OES_texture_half_float_linear"].reduce((function(e,t){var n=r.getExtension(t);return n&&e.push([t,n]),e}),[]));if(!n.OES_texture_float)return t();var i=[];function o(e,t,r){var i="OES_texture_"+e,o=i+"_linear",a=o in n;return{type:t,linearSupport:a,arrayType:r,extensions:a?[i,o]:[i]}}i.push(o("float",r.FLOAT,Float32Array)),n.OES_texture_half_float&&i.push(o("half_float",n.OES_texture_half_float.HALF_FLOAT_OES,null));var a=r.createTexture(),l=r.createFramebuffer();r.bindFramebuffer(r.FRAMEBUFFER,l),r.bindTexture(r.TEXTURE_2D,a),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE);for(var s=null,u=0;u<i.length;u++)if(r.texImage2D(r.TEXTURE_2D,0,r.RGBA,32,32,0,r.RGBA,i[u].type,null),r.framebufferTexture2D(r.FRAMEBUFFER,r.COLOR_ATTACHMENT0,r.TEXTURE_2D,a,0),r.checkFramebufferStatus(r.FRAMEBUFFER)===r.FRAMEBUFFER_COMPLETE){s=i[u];break}return s}function u(e){return u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},u(e)}function c(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,h(n.key),n)}}function f(e,t,r){return t&&c(e.prototype,t),r&&c(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function p(e,t,r){return(t=h(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function h(e){var t=function(e){if("object"!=u(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=u(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==u(t)?t:t+""}var d="lmssee_ripper_element_style",m=f((function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),p(this,"styleElement",document.createElement("style")),p(this,"canvas",void 0),p(this,"gl",void 0),p(this,"config",void 0),p(this,"transparentPixels",function(){try{return new ImageData(32,32)}catch(e){return console.log(e&&""),document.createElement("canvas").getContext("2d").createImageData(32,32)}}()),p(this,"initState",!0),this.canvas=t;var r=t.getContext("webgl");if(null===r)return this.initState=!1,void(this.config=null);if(this.gl=r,null===document.querySelector("style#".concat(d))){var n=this.styleElement;n.id=d,n.innerHTML="\n .lmssee-ripples { \n position: relative; \n z-index: 0; \n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transform: translate(0,0);\n }\n ";var i=document.head;i.prepend?i.prepend(n):i.insertBefore(n,i.firstChild)}this.config=Reflect.apply(s,this,[])})),g={imageUrl:"",resolution:256,dropRadius:10,perturbance:.03,interactive:!0,crossOrigin:"",playingState:!0,accelerating:1,raindropsTimeInterval:3600,idleFluctuations:!0};function v(e){return v="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},v(e)}function y(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,R(n.key),n)}}function b(e,t,r){return t&&y(e.prototype,t),r&&y(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function E(e,t,r){return(t=R(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function R(e){var t=function(e){if("object"!=v(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=v(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==v(t)?t:t+""}Object.freeze(g);var T=b((function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),E(this,"visible",!1),E(this,"running",!1),E(this,"perturbance",void 0),E(this,"resolution",void 0),E(this,"raindropsTimeInterval",void 0),E(this,"animationFrameId",0),E(this,"quad",null),E(this,"lastRaindropsFallTime",0),E(this,"parentElement",null),E(this,"backgroundInfo",{width:0,height:0}),E(this,"dropProgram",null),E(this,"updateProgram",null),E(this,"textures",[]),E(this,"backgroundTexture",[]),E(this,"textureDelta",null),E(this,"framebuffers",[]),E(this,"bufferWriteIndex",0),E(this,"bufferReadIndex",1),E(this,"originalInlineCss",""),E(this,"originalCssBackgroundImage",""),E(this,"events",{}),E(this,"accelerating",void 0),this.perturbance=t.perturbance,this.resolution=t.resolution,this.raindropsTimeInterval=t.raindropsTimeInterval,this.accelerating=t.accelerating})),x={};function _(){var e=this.gl,t=x[this.sole];e.bindBuffer(e.ARRAY_BUFFER,t.quad),e.vertexAttribPointer(0,2,e.FLOAT,!1,0,0),e.drawArrays(e.TRIANGLE_FAN,0,4)}function w(){var e=x[this.sole],t=e.bufferWriteIndex,r=e.bufferReadIndex;e.bufferWriteIndex=1-t,e.bufferReadIndex=1-r}function P(){var e=(x[this.sole]||{}).parentElement;if(e){var t=e.style.backgroundImage;if("none"!=t){var r=x[this.sole];r.originalInlineCss=t,r.originalCssBackgroundImage=window.getComputedStyle(e).backgroundImage,e.style.backgroundImage="none"}}}function S(){var e=x[this.sole],t=e.parentElement,r=e.originalInlineCss;t.style.backgroundImage=r||""}function F(){var e=this,t=this.gl,r=x[this.sole],n=r.parentElement,i=r.backgroundTexture,o=r.originalCssBackgroundImage,a=this.imageUrl||O(o)||O(window.getComputedStyle(n).backgroundImage);if(a!==this.imageSource)if(this.imageSource=a,this.imageSource){var l=new Image;l.onload=function(){var n=function(e){return!(e&e-1)},o=n(l.width)&&n(l.height)?t.REPEAT:t.CLAMP_TO_EDGE;t.bindTexture(t.TEXTURE_2D,i),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,o),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,o),t.texImage2D(t.TEXTURE_2D,0,t.RGBA,t.RGBA,t.UNSIGNED_BYTE,l),r.backgroundInfo={width:l.width,height:l.height},Reflect.apply(P,e,[])},l.onerror=function(){return Reflect.apply(A,e,[])},l.crossOrigin=this.imageSource.match(/^data:/)?null:this.crossOrigin,l.src=this.imageSource}else Reflect.apply(A,this,[])}function A(){var e=this.gl,t=x[this.sole].backgroundTexture;e.bindTexture(e.TEXTURE_2D,t),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,this.transparentPixels)}function O(e){var t=/url\(["']?([^"']*)["']?\)/.exec(e);return null==t?null:t[1]}function I(){var e,t,r,n=x[this.sole],i=n.parentElement,o=window.getComputedStyle(i).backgroundSize,a=window.getComputedStyle(i).backgroundAttachment,l=(e=window.getComputedStyle(i).backgroundPosition,/\s+/.test(e)?e.replace(/center/,"50%").replace(/top|left/,"0%").replace(/bottom/,"100%").replace(/\s+/," ").split(" "):D(e)?[e,"50%"]:{center:["50%","50%"],top:["50%","0%"],bottom:["50%","100%"],left:["0%","50%"],right:["100%","50%"]}[e]),s={left:0,top:0,width:0,height:0};if("fixed"==a)s.height=window.innerHeight,s.left=window.screenX,s.top=window.screenY,s.width=window.innerWidth;else{var u=i.getBoundingClientRect();s.left=u.left,s.top=u.top,s.width=i.scrollWidth,s.height=i.scrollHeight}var c=n.backgroundInfo||{width:100,height:100},f=c.width,p=c.height;if("cover"==o){var h=Math.max(s.width/f,s.height/p);t=f*h,r=p*h}else if("contain"==o){var d=Math.min(s.width/f,s.height/p);t=f*d,r=p*d}else{var m=o.split(" ");t=m[0]||"",r=m[1]||t,D(t)?t=s.width*parseFloat(t)/100:"auto"!==t&&(t=parseFloat(t)),D(r)?r=s.height*parseFloat(r)/100:"auto"!==r&&(r=parseFloat(r)),"auto"==t&&"auto"==r?(t=f,r=p):("auto"==t&&(t=f*(Number(r)/p)),"auto"==r&&(r=p*(Number(t)/f)))}var g=l&&l[0]||"0%",v=l&&l[1]||"0%";g=D(g)?(s.left+(s.width-Number(t))*parseFloat(g)/100).toString():(s.left+parseFloat(g)).toString(),v=D(v)?(s.top+(s.height-Number(r))*parseFloat(v)/100).toString():(s.top+parseFloat(v)).toString(),this.renderProgram.uniforms.topLeft=new Float32Array([(i.offsetLeft-Number(g))/t,(i.offsetTop-Number(v))/r]),this.renderProgram.uniforms.bottomRight=new Float32Array([this.renderProgram.uniforms.topLeft[0]+i.clientWidth/t,this.renderProgram.uniforms.topLeft[1]+i.clientHeight/r]);var y=Math.max(this.canvas.width,this.canvas.height);this.renderProgram.uniforms.containerRatio=new Float32Array([this.canvas.width/y,this.canvas.height/y])}function D(e){return e.endsWith("%")}function U(){var e=this.gl,t=x[this.sole],r=t.perturbance,n=t.textures,i=t.backgroundTexture;e.bindFramebuffer(e.FRAMEBUFFER,null),e.viewport(0,0,this.canvas.width,this.canvas.height),e.enable(e.BLEND),e.clear(e.COLOR_BUFFER_BIT|e.DEPTH_BUFFER_BIT),e.useProgram(this.renderProgram.id),Reflect.apply(l,this,[i,0]),Reflect.apply(l,this,[n[0],1]),e.uniform1f(this.renderProgram.locations.perturbance,r),e.uniform2fv(this.renderProgram.locations.topLeft,this.renderProgram.uniforms.topLeft),e.uniform2fv(this.renderProgram.locations.bottomRight,this.renderProgram.uniforms.bottomRight),e.uniform2fv(this.renderProgram.locations.containerRatio,this.renderProgram.uniforms.containerRatio),e.uniform1i(this.renderProgram.locations.samplerBackground,0),e.uniform1i(this.renderProgram.locations.samplerRipples,1),Reflect.apply(_,this,[]),e.disable(e.BLEND)}function k(){var e=this.gl,t=x[this.sole],r=t.resolution,n=t.updateProgram,i=t.textures,o=t.framebuffers,a=t.bufferWriteIndex,s=t.bufferReadIndex;e.viewport(0,0,r,r),e.bindFramebuffer(e.FRAMEBUFFER,o[a]),Reflect.apply(l,this,[i[s]]),e.useProgram(n.id),Reflect.apply(_,this,[]),Reflect.apply(w,this,[])}function C(){var e=this,t=x[this.sole],r=t.visible,n=t.raindropsTimeInterval,i=t.running,o=t.lastRaindropsFallTime;if(r){if(Reflect.apply(I,this,[]),this.idleFluctuations&&i){var a=Date.now();a-o>n&&(t.lastRaindropsFallTime=a,this.raindropsFall())}Reflect.apply(k,this,[]),Reflect.apply(U,this,[]),t.animationFrameId=requestAnimationFrame((function(){return Reflect.apply(C,e,[])}))}}function L(e,t,r){var n=x[this.sole].parentElement,i=window.getComputedStyle(n),o=parseInt(i.borderLeftWidth)||0,a=parseInt(i.borderTopWidth)||0,l=n.getBoundingClientRect(),s=e.clientX-l.left-o,u=e.clientY-l.top-a;this.drop(s,u,t,r)}function j(){var e=this,t=x[this.sole],r=t.visible,n=t.running,i=t.accelerating,o=t.parentElement,a=t.events,l=function(i){var o=arguments.length>1&&void 0!==arguments[1]&&arguments[1];r&&n&&e.interactive&&(t.lastRaindropsFallTime=Date.now(),Reflect.apply(L,e,[i,e.dropRadius*(o?1.5:1),o?.14:.01]))};a.mousemove=function(e){for(var t=i;t--;)l(e)},a.touchmove=a.touchstart=function(e){for(var t=e.touches,r=0;r<t.length;r++)l(t[r])},a.mousedown=function(e){return l(e,!0)},Object.keys(a).forEach((function(e){return o&&o.addEventListener(e,a[e],{passive:!0})}))}var B="\n attribute vec2 vertex;\n varying vec2 coord;\n void main() {\n coord = vertex * 0.5 + 0.5;\n gl_Position = vec4(vertex, 0.0, 1.0);\n }";function X(){var e=this.gl,t=x[this.sole],r=t.textureDelta;t.dropProgram=a(B,"precision highp float;\n\n const float PI = 3.141592653589793;\n uniform sampler2D texture;\n uniform vec2 center;\n uniform float radius;\n uniform float strength;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n\n float drop = max(0.0, 1.0 - length(center * 0.5 + 0.5 - coord) / radius);\n drop = 0.5 - cos(drop * PI) * 0.5;\n info.r += drop * strength;\n gl_FragColor = info;\n }",e);var n=t.updateProgram=a(B,"\n precision highp float;\n\n uniform sampler2D texture;\n uniform vec2 delta;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n \n vec2 dx = vec2(delta.x, 0.0);\n vec2 dy = vec2(0.0, delta.y);\n \n float average = (\n texture2D(texture, coord - dx).r +\n texture2D(texture, coord - dy).r +\n texture2D(texture, coord + dx).r +\n texture2D(texture, coord + dy).r\n ) * 0.25;\n \n info.g += (average - info.r) * 2.0;\n info.g *= 0.995;\n info.r += info.g;\n \n gl_FragColor = info;\n }\n ",this.gl);e.uniform2fv(n.locations.delta,r),this.renderProgram=a("\n precision highp float;\n\n attribute vec2 vertex;\n uniform vec2 topLeft;\n uniform vec2 bottomRight;\n uniform vec2 containerRatio;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n void main() {\n backgroundCoord = mix(topLeft, bottomRight, vertex * 0.5 + 0.5);\n backgroundCoord.y = 1.0 - backgroundCoord.y;\n ripplesCoord = vec2(vertex.x, -vertex.y) * containerRatio * 0.5 + 0.5;\n gl_Position = vec4(vertex.x, -vertex.y, 0.0, 1.0);\n }\n ","\n precision highp float;\n\n uniform sampler2D samplerBackground;\n uniform sampler2D samplerRipples;\n uniform vec2 delta;\n\n uniform float perturbance;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n\n void main() {\n float height = texture2D(samplerRipples, ripplesCoord).r;\n float heightX = texture2D(samplerRipples, vec2(ripplesCoord.x + delta.x, ripplesCoord.y)).r;\n float heightY = texture2D(samplerRipples, vec2(ripplesCoord.x, ripplesCoord.y + delta.y)).r;\n vec3 dx = vec3(delta.x, heightX - height, 0.0);\n vec3 dy = vec3(0.0, heightY - height, delta.y);\n vec2 offset = -normalize(cross(dy, dx)).xz;\n float specular = pow(max(0.0, dot(offset, normalize(vec2(-0.6, 1.0)))), 4.0);\n gl_FragColor = texture2D(samplerBackground, backgroundCoord + offset * perturbance) + specular;\n }",e),e.uniform2fv(this.renderProgram.locations.delta,r)}function M(){var e=this.gl,t=x[this.sole].backgroundTexture=e.createTexture();e.bindTexture(e.TEXTURE_2D,t),e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL,1),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR)}function N(){var e=this;if(this.config){var t=x[this.sole],r=t.resolution,n=t.textures,i=t.framebuffers,o=this.gl,a=1/r;t.textureDelta=new Float32Array([a,a]),this.config.extensions.forEach((function(e){return o.getExtension(e)})),this.updateSize=this.updateSize.bind(this),window.addEventListener("resize",this.updateSize);for(var l=this.config.arrayType,s=l?new l(r*r*4):null,u=this.config,c=0;c<2;c++){var f=o.createTexture(),p=o.createFramebuffer();o.bindFramebuffer(o.FRAMEBUFFER,p),o.bindTexture(o.TEXTURE_2D,f),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_MIN_FILTER,u.linearSupport?o.LINEAR:o.NEAREST),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_MAG_FILTER,u.linearSupport?o.LINEAR:o.NEAREST),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_WRAP_S,o.CLAMP_TO_EDGE),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_WRAP_T,o.CLAMP_TO_EDGE),o.texImage2D(o.TEXTURE_2D,0,o.RGBA,r,r,0,o.RGBA,u.type,s),o.framebufferTexture2D(o.FRAMEBUFFER,o.COLOR_ATTACHMENT0,o.TEXTURE_2D,f,0),n.push(f),i.push(p)}t.quad=o.createBuffer(),o.bindBuffer(o.ARRAY_BUFFER,t.quad),o.bufferData(o.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,1,1,-1,1]),o.STATIC_DRAW),Reflect.apply(X,this,[]),Reflect.apply(M,this,[]),Reflect.apply(A,this,[]),Reflect.apply(F,this,[]),o.clearColor(0,0,0,0),o.blendFunc(o.SRC_ALPHA,o.ONE_MINUS_SRC_ALPHA),t.visible=!0,t.running=!0,Reflect.apply(j,this,[]),t.animationFrameId=requestAnimationFrame((function(){return Reflect.apply(C,e,[])}))}}function W(e){return W="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},W(e)}function G(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function z(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?G(Object(r),!0).forEach((function(t){J(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):G(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function H(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,Q(n.key),n)}}function Y(e,t){if(t&&("object"==W(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function q(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(e){}return(q=function(){return!!e})()}function K(e){return K=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},K(e)}function V(e,t){return V=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},V(e,t)}function J(e,t,r){return(t=Q(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Q(e){var t=function(e){if("object"!=W(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=W(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==W(t)?t:t+""}var Z=new WeakMap,$=function(e){function t(e,r){var n,i,a,l;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),i=this,l=[e],a=K(a=t),J(n=Y(i,q()?Reflect.construct(a,l||[],K(i).constructor):a.apply(i,l)),"sole",Symbol("ripple")),J(n,"defaults",g),J(n,"interactive",n.defaults.interactive),J(n,"dropRadius",void 0),J(n,"crossOrigin",""),J(n,"imageUrl",void 0),J(n,"idleFluctuations",!0),function(e,t,r){(function(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")})(e,t),t.set(e,r)}(n,Z,!1),J(n,"imageSource",""),J(n,"renderProgram",void 0),console.log("初始化参数",r),x[n.sole]=new T(g),Object.defineProperties(n,{defaults:{value:n.defaults,writable:!1,enumerable:!1,configurable:!1}}),r&&"boolean"!=typeof r.interactive&&delete r.interactive;var s=z(z({},n.defaults),r);return n.accelerating=s.accelerating,n.dropRadius=s.dropRadius,n.resolution=s.resolution,n.interactive=s.interactive,n.perturbance=s.perturbance,n.crossOrigin=s.crossOrigin,n.imageUrl=s.imageUrl,n.idleFluctuations=s.idleFluctuations,n.playingState=s.playingState,n.raindropsTimeInterval=s.raindropsTimeInterval,!1===n.initState||null===e.parentElement||null===n.config||null===n.gl?(n.initState=!1,Y(n)):(x[n.sole].parentElement=e.parentElement,function(e){var t=e.parentElement;e.width=t.clientWidth,e.height=t.clientHeight,(0,o.setStyle)(e,{position:"absolute",left:0,top:0,right:0,bottom:0,zIndex:-1,pointerEvents:"none"})}(e),Reflect.apply(N,n,[]),n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&V(e,t)}(t,e),r=t,n=[{key:"accelerating",set:function(e){e>100||e<2||(x[this.sole].accelerating=e)}},{key:"resolution",set:function(e){e<100||e>550||(x[this.sole].resolution=e)}},{key:"perturbance",set:function(e){e<1e-4||e>1||(x[this.sole].perturbance=e)}},{key:"playingState",set:function(e){x[this.sole].running=!1!==e}},{key:"initialized",get:function(){return t=this,(e=Z).get(function(e,t,r){if("function"==typeof e?e===t:e.has(t))return arguments.length<3?t:r;throw new TypeError("Private element is not present on this object")}(e,t));var e,t}},{key:"raindropsTimeInterval",set:function(e){e<10||e>12e3||(x[this.sole].raindropsTimeInterval=e)}},{key:"raindropsFall",value:function(){var e=x[this.sole].parentElement,t=window.getComputedStyle(e),r=function(e){return function(e=1,t=0){let r=Math.ceil(Number(t)),n=Math.floor(Number(e));return r>n&&([n,r]=[r,n]),Math.floor(Math.random()*(n-r+1)+r)}(parseInt(e))},n=t.width,i=t.height;this.drop(r(n),r(i),this.dropRadius,.03)}},{key:"drop",value:function(e,t,r,n){var i=this.gl,o=x[this.sole],a=o.resolution,s=o.parentElement,u=o.dropProgram,c=o.textures,f=o.framebuffers,p=o.bufferWriteIndex,h=o.bufferReadIndex,d=s.offsetWidth,m=s.offsetHeight,g=Math.max(d,m);r/=g;var v=new Float32Array([(2*e-d)/g,(m-2*t)/g]);i.viewport(0,0,a,a),i.bindFramebuffer(i.FRAMEBUFFER,f[p]),Reflect.apply(l,this,[c[h]]),i.useProgram(u.id),i.uniform2fv(u.locations.center,v),i.uniform1f(u.locations.radius,r),i.uniform1f(u.locations.strength,n),Reflect.apply(_,this,[]),Reflect.apply(w,this,[])}},{key:"updateSize",value:function(){var e=x[this.sole].parentElement,t=e.offsetWidth,r=e.offsetHeight;t==this.canvas.width&&r==this.canvas.height||(this.canvas.width=t,this.canvas.height=r)}},{key:"destroy",value:function(){x[this.sole].animationFrameId&&window.cancelAnimationFrame(x[this.sole].animationFrameId);var e=x[this.sole],t=e.parentElement,r=e.events;t&&(Object.keys(r).forEach((function(e){return t.removeEventListener&&t.removeEventListener(e,r[e])})),t.removeAttribute&&t.removeAttribute("data-ripples")),this.styleElement&&this.styleElement.remove(),this.gl=null,Reflect.apply(S,this,[]);var n=x[this.sole];Object.keys(n).forEach((function(e){return n[e]=null})),x[this.sole]=null,this.gl&&(this.gl=null),window.removeEventListener("resize",this.updateSize)}},{key:"show",value:function(){x[this.sole].visible=!0,this.canvas.style.visibility="visible",Reflect.apply(P,this,[])}},{key:"hide",value:function(){x[this.sole].visible=!1,this.canvas.style.visibility="hidden",Reflect.apply(S,this,[])}},{key:"pause",value:function(){this.playingState=!1}},{key:"play",value:function(){this.playingState=!0}},{key:"changePlayingState",value:function(){this.playingState=!x[this.sole].running}},{key:"set",value:function(e,t){"imageUrl"===e?(this.imageUrl=t,Reflect.apply(F,this,[])):this[e]=t}}],n&&H(r.prototype,n),Object.defineProperty(r,"prototype",{writable:!1}),r;var r,n}(m);function ee(e,t){var r=(0,i.useRef)(null);return(0,i.useEffect)((function(){var n=e.current;return r.current=new $(n,t&&t.option),function(){return r.current&&r.current.destroy()||void 0}}),[]),r}module.exports["oops-ui"]=n})();
@@ -1 +1 @@
1
- import*as e from"react";import*as t from"a-element-inline-style";var r={649:(t,r,n)=>{var i,o;t.exports=(i={useEffect:()=>e.useEffect,useRef:()=>e.useRef},o={},n.d(o,i),o)}},n={};function i(e){var t=n[e];if(void 0!==t)return t.exports;var o=n[e]={exports:{}};return r[e](o,o.exports,i),o.exports}i.d=(e,t)=>{for(var r in t)i.o(t,r)&&!i.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var o={};i.d(o,{n:()=>_e});var a=i(649);const s=(l={setStyle:()=>t.setStyle},u={},i.d(u,l),u);var l,u;function c(e){var t=/url\(["']?([^"']*)["']?\)/.exec(e);return null==t?null:t[1]}function f(e,t,r,n){function i(e,t){var n=r.createShader(e);if(r.shaderSource(n,t),r.compileShader(n),!r.getShaderParameter(n,r.COMPILE_STATUS))throw new Error("compile error: "+r.getShaderInfoLog(n));return n}var o,a={id:r.createProgram(),uniforms:{},locations:{}};if(r.attachShader(a.id,i(r.VERTEX_SHADER,e)),r.attachShader(a.id,i(r.FRAGMENT_SHADER,t)),r.linkProgram(a.id),!r.getProgramParameter(a.id,r.LINK_STATUS))throw new Error("link error: "+r.getProgramInfoLog(a.id));r.useProgram(a.id),r.enableVertexAttribArray(0);for(var s=e+t,l=/uniform (\w+) (\w+)/g;null!==(o=l.exec(s));){var u=o[2];a.locations[u]=r.getUniformLocation(a.id,u)}return a}function h(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=this.gl;r.activeTexture(r.TEXTURE0+(t||0)),r.bindTexture(r.TEXTURE_2D,e)}function p(e){return e.endsWith("%")}function d(){var e=this,t=function(){return e.initState=!1,null};if(!this.gl)return t();var r=this.gl,n=Object.fromEntries(["OES_texture_float","OES_texture_half_float","OES_texture_float_linear","OES_texture_half_float_linear"].reduce((function(e,t){var n=r.getExtension(t);return n&&e.push([t,n]),e}),[]));if(!n.OES_texture_float)return t();var i=[];function o(e,t,r){var i="OES_texture_"+e,o=i+"_linear",a=o in n;return{type:t,linearSupport:a,arrayType:r,extensions:a?[i,o]:[i]}}i.push(o("float",r.FLOAT,Float32Array)),n.OES_texture_half_float&&i.push(o("half_float",n.OES_texture_half_float.HALF_FLOAT_OES,null));var a=r.createTexture(),s=r.createFramebuffer();r.bindFramebuffer(r.FRAMEBUFFER,s),r.bindTexture(r.TEXTURE_2D,a),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE);for(var l=null,u=0;u<i.length;u++)if(r.texImage2D(r.TEXTURE_2D,0,r.RGBA,32,32,0,r.RGBA,i[u].type,null),r.framebufferTexture2D(r.FRAMEBUFFER,r.COLOR_ATTACHMENT0,r.TEXTURE_2D,a,0),r.checkFramebufferStatus(r.FRAMEBUFFER)===r.FRAMEBUFFER_COMPLETE){l=i[u];break}return l}function m(e){return m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},m(e)}function v(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,y(n.key),n)}}function g(e,t,r){return t&&v(e.prototype,t),r&&v(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function E(e,t,r){return(t=y(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function y(e){var t=function(e){if("object"!=m(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=m(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==m(t)?t:t+""}var b="lmssee_ripper_element_style",T=g((function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),E(this,"styleElement",document.createElement("style")),E(this,"canvas",void 0),E(this,"gl",void 0),E(this,"config",void 0),E(this,"transparentPixels",function(){try{return new ImageData(32,32)}catch(e){return console.log(e&&""),document.createElement("canvas").getContext("2d").createImageData(32,32)}}()),E(this,"initState",!0),this.canvas=t;var r=t.getContext("webgl");if(null===r)return this.initState=!1,void(this.config=null);if(this.gl=r,null===document.querySelector("style#".concat(b))){var n=this.styleElement;n.id=b,n.innerHTML="\n .lmssee-ripples { \n position: relative; \n z-index: 0; \n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transform: translate(0,0);\n }\n ";var i=document.head;i.prepend?i.prepend(n):i.insertBefore(n,i.firstChild)}this.config=Reflect.apply(d,this,[])})),R={imageUrl:"",resolution:360,dropRadius:10,perturbance:.03,interactive:!0,crossOrigin:"",playingState:!0,accelerating:3,raindropsTimeInterval:660,idleFluctuations:!0};function w(e){return w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},w(e)}function _(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function x(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?_(Object(r),!0).forEach((function(t){U(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):_(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function P(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,M(n.key),n)}}function S(e,t){if(t&&("object"==w(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function F(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(e){}return(F=function(){return!!e})()}function A(e){return A=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},A(e)}function O(e,t){return O=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},O(e,t)}function D(e,t,r){k(e,t),t.set(e,r)}function k(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function U(e,t,r){return(t=M(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function M(e){var t=function(e){if("object"!=w(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=w(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==w(t)?t:t+""}function C(e,t){return e.get(I(e,t))}function L(e,t,r){return e.set(I(e,t),r),r}function I(e,t,r){if("function"==typeof e?e===t:e.has(t))return arguments.length<3?t:r;throw new TypeError("Private element is not present on this object")}Object.freeze(R);var W=new WeakMap,X=new WeakMap,B=new WeakMap,j=new WeakMap,N=new WeakMap,G=new WeakMap,z=new WeakMap,H=new WeakMap,Y=new WeakMap,q=new WeakMap,K=new WeakMap,V=new WeakMap,J=new WeakMap,Q=new WeakMap,Z=new WeakMap,$=new WeakMap,ee=new WeakMap,te=new WeakMap,re=new WeakMap,ne=new WeakMap,ie=new WeakMap,oe=new WeakMap,ae=new WeakMap,se=new WeakMap,le=new WeakSet,ue=function(){function e(t,r){var n,i,o;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),n=function(e,t,r){return t=A(t),S(e,F()?Reflect.construct(t,r||[],A(e).constructor):t.apply(e,r))}(this,e,[t]),k(i=n,o=le),o.add(i),U(n,"defaults",R),U(n,"interactive",n.defaults.interactive),D(n,W,n.defaults.accelerating),D(n,X,n.defaults.resolution),D(n,B,n.defaults.perturbance),U(n,"dropRadius",void 0),U(n,"crossOrigin",""),U(n,"imageUrl",void 0),U(n,"idleFluctuations",!0),D(n,j,void 0),D(n,N,void 0),D(n,G,[]),D(n,z,[]),D(n,H,0),D(n,Y,1),D(n,q,void 0),D(n,K,!1),D(n,V,!1),D(n,J,!1),D(n,Q,0),D(n,Z,""),U(n,"imageSource",""),U(n,"renderProgram",void 0),D(n,$,void 0),D(n,ee,void 0),D(n,te,void 0),D(n,re,void 0),D(n,ne,void 0),D(n,ie,void 0),D(n,oe,Date.now()),D(n,ae,n.defaults.raindropsTimeInterval),D(n,se,{mousemove:function(e){return console.log(e)},mousedown:function(e){return console.log(e)},touchmove:function(e){return console.log(e)},touchstart:function(e){return console.log(e)}}),Object.defineProperties(n,{defaults:{value:n.defaults,writable:!1,enumerable:!1,configurable:!1}}),r&&"boolean"!=typeof r.interactive&&delete r.interactive;var a=x(x({},n.defaults),r);if(n.interactive=a.interactive,n.resolution=a.resolution,n.perturbance=a.perturbance,n.dropRadius=a.dropRadius,n.crossOrigin=a.crossOrigin,n.imageUrl=a.imageUrl,n.idleFluctuations=a.idleFluctuations,!1===n.initState||null===t.parentElement||null===n.config||null===n.gl)return n.initState=!1,S(n);var l=n.gl,u=1/C(X,n);L(N,n,new Float32Array([u,u])),L(j,n,t.parentElement),function(e){var t=e.parentElement;e.width=t.clientWidth,e.height=t.clientHeight,(0,s.setStyle)(e,{position:"absolute",left:0,top:0,right:0,bottom:0,pointerEvents:"none"})}(t),n.config.extensions.forEach((function(e){return l.getExtension(e)})),n.updateSize=n.updateSize.bind(n),window.addEventListener("resize",n.updateSize);for(var c=n.config.arrayType,f=c?new c(C(X,n)*C(X,n)*4):null,h=n.config,p=0;p<2;p++){var d=l.createTexture(),m=l.createFramebuffer();l.bindFramebuffer(l.FRAMEBUFFER,m),l.bindTexture(l.TEXTURE_2D,d),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_MIN_FILTER,h.linearSupport?l.LINEAR:l.NEAREST),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_MAG_FILTER,h.linearSupport?l.LINEAR:l.NEAREST),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_WRAP_S,l.CLAMP_TO_EDGE),l.texParameteri(l.TEXTURE_2D,l.TEXTURE_WRAP_T,l.CLAMP_TO_EDGE),l.texImage2D(l.TEXTURE_2D,0,l.RGBA,C(X,n),C(X,n),0,l.RGBA,h.type,f),l.framebufferTexture2D(l.FRAMEBUFFER,l.COLOR_ATTACHMENT0,l.TEXTURE_2D,d,0),C(G,n).push(d),C(z,n).push(m)}return L(q,n,l.createBuffer()),l.bindBuffer(l.ARRAY_BUFFER,C(q,n)),l.bufferData(l.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,1,1,-1,1]),l.STATIC_DRAW),I(le,n,Ee).call(n),I(le,n,ye).call(n),I(le,n,be).call(n),I(le,n,fe).call(n),l.clearColor(0,0,0,0),l.blendFunc(l.SRC_ALPHA,l.ONE_MINUS_SRC_ALPHA),L(K,n,!0),L(V,n,!0),L(J,n,!0),I(le,n,ce).call(n),L(Q,n,requestAnimationFrame((function(){return I(le,n,he).call(n)}))),n}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&O(e,t)}(e,T),t=e,r=[{key:"accelerating",set:function(e){e>100||e<2||L(W,this,e)}},{key:"resolution",set:function(e){e<100||e>550||L(X,this,e)}},{key:"perturbance",set:function(e){e<1e-4||e>1||L(B,this,e)}},{key:"playingState",set:function(e){L(V,this,!1!==e)}},{key:"initialized",get:function(){return C(J,this)}},{key:"raindropsTimeInterval",set:function(e){e<10||e>12e3||L(ae,this,e)}},{key:"raindropsFall",value:function(){var e=window.getComputedStyle(C(j,this)),t=function(e){return function(e=1,t=0){let r=Math.ceil(Number(t)),n=Math.floor(Number(e));return r>n&&([n,r]=[r,n]),Math.floor(Math.random()*(n-r+1)+r)}(parseInt(e))},r=e.width,n=e.height;this.drop(t(r),t(n),1.5*this.dropRadius,.14)}},{key:"drop",value:function(e,t,r,n){var i=this.gl,o=C(j,this).offsetWidth,a=C(j,this).offsetHeight,s=Math.max(o,a);r/=s;var l=new Float32Array([(2*e-o)/s,(a-2*t)/s]);i.viewport(0,0,C(X,this),C(X,this)),i.bindFramebuffer(i.FRAMEBUFFER,C(z,this)[C(H,this)]),Reflect.apply(h,this,[C(G,this)[C(Y,this)]]),i.useProgram(C(te,this).id),i.uniform2fv(C(te,this).locations.center,l),i.uniform1f(C(te,this).locations.radius,r),i.uniform1f(C(te,this).locations.strength,n),I(le,this,pe).call(this),I(le,this,ve).call(this)}},{key:"updateSize",value:function(){var e=C(j,this).offsetWidth,t=C(j,this).offsetHeight;e==this.canvas.width&&t==this.canvas.height||(this.canvas.width=e,this.canvas.height=t)}},{key:"destroy",value:function(){var e=this,t=C(j,this);t&&(Object.keys(C(se,this)).forEach((function(r){return t.removeEventListener&&t.removeEventListener(r,C(se,e)[r])})),t.removeAttribute&&t.removeAttribute("data-ripples")),this.styleElement&&this.styleElement.remove(),this.gl=null,this.gl&&(this.gl=null),window.removeEventListener("resize",this.updateSize),I(le,this,Re).call(this),C(Q,this)&&window.cancelAnimationFrame(C(Q,this))}},{key:"show",value:function(){L(K,this,!0),this.canvas.style.visibility="visible",I(le,this,Te).call(this)}},{key:"hide",value:function(){L(K,this,!1),this.canvas.style.visibility="hidden",I(le,this,Re).call(this)}},{key:"pause",value:function(){L(V,this,!1)}},{key:"play",value:function(){L(V,this,!0)}},{key:"changePlayingState",value:function(){L(V,this,!C(V,this))}},{key:"set",value:function(e,t){"imageUrl"===e?(this.imageUrl=t,I(le,this,fe).call(this)):this[e]=t}}],r&&P(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,r}();function ce(){var e=this,t=function(t){var r=arguments.length>1&&void 0!==arguments[1]&&arguments[1];C(K,e)&&C(V,e)&&e.interactive&&(L(oe,e,Date.now()),I(le,e,we).call(e,t,e.dropRadius*(r?1.5:1),r?.14:.01))};C(se,this).mousemove=function(r){for(var n=C(W,e);n--;)t(r)},C(se,this).touchmove=C(se,this).touchstart=function(e){for(var r=e.touches,n=0;n<r.length;n++)t(r[n])},C(se,this).mousedown=function(e){return t(e,!0)},Object.keys(C(se,this)).forEach((function(t){return C(j,e)&&C(j,e).addEventListener(t,C(se,e)[t],{passive:!0})}))}function fe(){var e=this,t=this.gl,r=this.imageUrl||c(C(Z,this))||c(window.getComputedStyle(C(j,this)).backgroundImage);if(r!==this.imageSource)if(this.imageSource=r,this.imageSource){var n=new Image;n.onload=function(){var r=function(e){return!(e&e-1)},i=r(n.width)&&r(n.height)?t.REPEAT:t.CLAMP_TO_EDGE;t.bindTexture(t.TEXTURE_2D,C($,e)),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,i),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,i),t.texImage2D(t.TEXTURE_2D,0,t.RGBA,t.RGBA,t.UNSIGNED_BYTE,n),L(re,e,n.width),L(ne,e,n.height),I(le,e,Te).call(e)},n.onerror=function(){return I(le,e,be).call(e)},n.crossOrigin=this.imageSource.match(/^data:/)?null:this.crossOrigin,n.src=this.imageSource}else I(le,this,be).call(this)}function he(){var e=this;C(K,this)&&(I(le,this,ge).call(this),I(le,this,me).call(this),I(le,this,de).call(this),L(Q,this,requestAnimationFrame((function(){return I(le,e,he).call(e)}))))}function pe(){var e=this.gl;e.bindBuffer(e.ARRAY_BUFFER,C(q,this)),e.vertexAttribPointer(0,2,e.FLOAT,!1,0,0),e.drawArrays(e.TRIANGLE_FAN,0,4)}function de(){var e=this.gl;e.bindFramebuffer(e.FRAMEBUFFER,null),e.viewport(0,0,this.canvas.width,this.canvas.height),e.enable(e.BLEND),e.clear(e.COLOR_BUFFER_BIT|e.DEPTH_BUFFER_BIT),e.useProgram(this.renderProgram.id),Reflect.apply(h,this,[C($,this),0]),Reflect.apply(h,this,[C(G,this)[0],1]),e.uniform1f(this.renderProgram.locations.perturbance,C(B,this)),e.uniform2fv(this.renderProgram.locations.topLeft,this.renderProgram.uniforms.topLeft),e.uniform2fv(this.renderProgram.locations.bottomRight,this.renderProgram.uniforms.bottomRight),e.uniform2fv(this.renderProgram.locations.containerRatio,this.renderProgram.uniforms.containerRatio),e.uniform1i(this.renderProgram.locations.samplerBackground,0),e.uniform1i(this.renderProgram.locations.samplerRipples,1),I(le,this,pe).call(this),e.disable(e.BLEND)}function me(){if(this.idleFluctuations&&C(V,this)){var e=Date.now();e-C(oe,this)>C(ae,this)&&(L(oe,this,e),this.raindropsFall())}var t=this.gl;t.viewport(0,0,C(X,this),C(X,this)),t.bindFramebuffer(t.FRAMEBUFFER,C(z,this)[C(H,this)]),Reflect.apply(h,this,[C(G,this)[C(Y,this)]]),t.useProgram(C(ee,this).id),I(le,this,pe).call(this),I(le,this,ve).call(this)}function ve(){L(H,this,1-C(H,this)),L(Y,this,1-C(Y,this))}function ge(){var e,t,r,n=window.getComputedStyle(C(j,this)).backgroundSize,i=window.getComputedStyle(C(j,this)).backgroundAttachment,o=(e=window.getComputedStyle(C(j,this)).backgroundPosition,/\s+/.test(e)?e.replace(/center/,"50%").replace(/top|left/,"0%").replace(/bottom/,"100%").replace(/\s+/," ").split(" "):p(e)?[e,"50%"]:{center:["50%","50%"],top:["50%","0%"],bottom:["50%","100%"],left:["0%","50%"],right:["100%","50%"]}[e]),a="fixed"==i?{left:window.scrollX,top:window.scrollY,width:window.innerWidth,height:window.innerHeight}:{left:C(j,this).getBoundingClientRect().left,top:C(j,this).getBoundingClientRect().top,width:C(j,this).scrollWidth,height:C(j,this).scrollHeight};if("cover"==n){var s=Math.max(a.width/C(re,this),a.height/C(ne,this));t=C(re,this)*s,r=C(ne,this)*s}else if("contain"==n){var l=Math.min(a.width/C(re,this),a.height/C(ne,this));t=C(re,this)*l,r=C(ne,this)*l}else{var u=n.split(" ");t=u[0]||"",r=u[1]||t,p(t)?t=a.width*parseFloat(t)/100:"auto"!==t&&(t=parseFloat(t)),p(r)?r=a.height*parseFloat(r)/100:"auto"!==r&&(r=parseFloat(r)),"auto"==t&&"auto"==r?(t=C(re,this),r=C(ne,this)):("auto"==t&&(t=C(re,this)*(Number(r)/C(ne,this))),"auto"==r&&(r=C(ne,this)*(Number(t)/C(re,this))))}var c=o&&o[0]||"0%",f=o&&o[1]||"0%";c=p(c)?(a.left+(a.width-Number(t))*parseFloat(c)/100).toString():(a.left+parseFloat(c)).toString(),f=p(f)?(a.top+(a.height-Number(r))*parseFloat(f)/100).toString():(a.top+parseFloat(f)).toString(),this.renderProgram.uniforms.topLeft=new Float32Array([(C(j,this).offsetLeft-Number(c))/Number(t),(C(j,this).offsetTop-Number(f))/Number(r)]),this.renderProgram.uniforms.bottomRight=new Float32Array([this.renderProgram.uniforms.topLeft[0]+C(j,this).clientWidth/Number(t),this.renderProgram.uniforms.topLeft[1]+C(j,this).clientHeight/Number(r)]);var h=Math.max(this.canvas.width,this.canvas.height);this.renderProgram.uniforms.containerRatio=new Float32Array([this.canvas.width/h,this.canvas.height/h])}function Ee(){var e=this.gl,t="\n attribute vec2 vertex;\n varying vec2 coord;\n void main() {\n coord = vertex * 0.5 + 0.5;\n gl_Position = vec4(vertex, 0.0, 1.0);\n }";L(te,this,f(t,"precision highp float;\n\n const float PI = 3.141592653589793;\n uniform sampler2D texture;\n uniform vec2 center;\n uniform float radius;\n uniform float strength;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n\n float drop = max(0.0, 1.0 - length(center * 0.5 + 0.5 - coord) / radius);\n drop = 0.5 - cos(drop * PI) * 0.5;\n info.r += drop * strength;\n gl_FragColor = info;\n }",e)),L(ee,this,f(t,"precision highp float;\n\n uniform sampler2D texture;\n uniform vec2 delta;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n \n vec2 dx = vec2(delta.x, 0.0);\n vec2 dy = vec2(0.0, delta.y);\n \n float average = (\n texture2D(texture, coord - dx).r +\n texture2D(texture, coord - dy).r +\n texture2D(texture, coord + dx).r +\n texture2D(texture, coord + dy).r\n ) * 0.25;\n \n info.g += (average - info.r) * 2.0;\n info.g *= 0.995;\n info.r += info.g;\n \n gl_FragColor = info;\n }\n ",this.gl)),e.uniform2fv(C(ee,this).locations.delta,C(N,this)),this.renderProgram=f("\n precision highp float;\n\n attribute vec2 vertex;\n uniform vec2 topLeft;\n uniform vec2 bottomRight;\n uniform vec2 containerRatio;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n void main() {\n backgroundCoord = mix(topLeft, bottomRight, vertex * 0.5 + 0.5);\n backgroundCoord.y = 1.0 - backgroundCoord.y;\n ripplesCoord = vec2(vertex.x, -vertex.y) * containerRatio * 0.5 + 0.5;\n gl_Position = vec4(vertex.x, -vertex.y, 0.0, 1.0);\n }\n ","\n precision highp float;\n\n uniform sampler2D samplerBackground;\n uniform sampler2D samplerRipples;\n uniform vec2 delta;\n\n uniform float perturbance;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n\n void main() {\n float height = texture2D(samplerRipples, ripplesCoord).r;\n float heightX = texture2D(samplerRipples, vec2(ripplesCoord.x + delta.x, ripplesCoord.y)).r;\n float heightY = texture2D(samplerRipples, vec2(ripplesCoord.x, ripplesCoord.y + delta.y)).r;\n vec3 dx = vec3(delta.x, heightX - height, 0.0);\n vec3 dy = vec3(0.0, heightY - height, delta.y);\n vec2 offset = -normalize(cross(dy, dx)).xz;\n float specular = pow(max(0.0, dot(offset, normalize(vec2(-0.6, 1.0)))), 4.0);\n gl_FragColor = texture2D(samplerBackground, backgroundCoord + offset * perturbance) + specular;\n }",e),e.uniform2fv(this.renderProgram.locations.delta,C(N,this))}function ye(){var e=this.gl;L($,this,e.createTexture()),e.bindTexture(e.TEXTURE_2D,C($,this)),e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL,1),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR)}function be(){var e=this.gl;e.bindTexture(e.TEXTURE_2D,C($,this)),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,this.transparentPixels)}function Te(){var e=C(j,this).style.backgroundImage;"none"!=e&&(L(ie,this,e),L(Z,this,window.getComputedStyle(C(j,this)).backgroundImage),C(j,this).style.backgroundImage="none")}function Re(){C(j,this).style.backgroundImage=C(ie,this)||""}function we(e,t,r){var n=window.getComputedStyle(C(j,this)),i=parseInt(n.borderLeftWidth)||0,o=parseInt(n.borderTopWidth)||0,a=C(j,this).getBoundingClientRect(),s=e.clientX-a.left-i,l=e.clientY-a.top-o;this.drop(s,l,t,r)}function _e(e,t){var r=(0,a.useRef)(null);return(0,a.useEffect)((function(){return r.current=new ue(e.current,t&&t.option),function(){return r.current&&r.current.destroy()||void 0}}),[]),r}var xe=o.n;export{xe as useRipples};
1
+ import*as e from"react";import*as t from"a-element-inline-style";var r={649:(t,r,n)=>{var i,o;t.exports=(i={useEffect:()=>e.useEffect,useRef:()=>e.useRef},o={},n.d(o,i),o)}},n={};function i(e){var t=n[e];if(void 0!==t)return t.exports;var o=n[e]={exports:{}};return r[e](o,o.exports,i),o.exports}i.d=(e,t)=>{for(var r in t)i.o(t,r)&&!i.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var o={};i.d(o,{n:()=>ie});var a=i(649);const l=(s={setStyle:()=>t.setStyle},u={},i.d(u,s),u);var s,u;function c(e,t,r,n){function i(e,t){var n=r.createShader(e);if(r.shaderSource(n,t),r.compileShader(n),!r.getShaderParameter(n,r.COMPILE_STATUS))throw new Error("compile error: "+r.getShaderInfoLog(n));return n}var o,a={id:r.createProgram(),uniforms:{},locations:{}};if(r.attachShader(a.id,i(r.VERTEX_SHADER,e)),r.attachShader(a.id,i(r.FRAGMENT_SHADER,t)),r.linkProgram(a.id),!r.getProgramParameter(a.id,r.LINK_STATUS))throw new Error("link error: "+r.getProgramInfoLog(a.id));r.useProgram(a.id),r.enableVertexAttribArray(0);for(var l=e+t,s=/uniform (\w+) (\w+)/g;null!==(o=s.exec(l));){var u=o[2];a.locations[u]=r.getUniformLocation(a.id,u)}return a}function f(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=this.gl;r.activeTexture(r.TEXTURE0+(t||0)),r.bindTexture(r.TEXTURE_2D,e)}function p(){var e=this,t=function(){return e.initState=!1,null};if(!this.gl)return t();var r=this.gl,n=Object.fromEntries(["OES_texture_float","OES_texture_half_float","OES_texture_float_linear","OES_texture_half_float_linear"].reduce((function(e,t){var n=r.getExtension(t);return n&&e.push([t,n]),e}),[]));if(!n.OES_texture_float)return t();var i=[];function o(e,t,r){var i="OES_texture_"+e,o=i+"_linear",a=o in n;return{type:t,linearSupport:a,arrayType:r,extensions:a?[i,o]:[i]}}i.push(o("float",r.FLOAT,Float32Array)),n.OES_texture_half_float&&i.push(o("half_float",n.OES_texture_half_float.HALF_FLOAT_OES,null));var a=r.createTexture(),l=r.createFramebuffer();r.bindFramebuffer(r.FRAMEBUFFER,l),r.bindTexture(r.TEXTURE_2D,a),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE);for(var s=null,u=0;u<i.length;u++)if(r.texImage2D(r.TEXTURE_2D,0,r.RGBA,32,32,0,r.RGBA,i[u].type,null),r.framebufferTexture2D(r.FRAMEBUFFER,r.COLOR_ATTACHMENT0,r.TEXTURE_2D,a,0),r.checkFramebufferStatus(r.FRAMEBUFFER)===r.FRAMEBUFFER_COMPLETE){s=i[u];break}return s}function h(e){return h="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},h(e)}function d(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,v(n.key),n)}}function m(e,t,r){return t&&d(e.prototype,t),r&&d(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function g(e,t,r){return(t=v(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function v(e){var t=function(e){if("object"!=h(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=h(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==h(t)?t:t+""}var y="lmssee_ripper_element_style",b=m((function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),g(this,"styleElement",document.createElement("style")),g(this,"canvas",void 0),g(this,"gl",void 0),g(this,"config",void 0),g(this,"transparentPixels",function(){try{return new ImageData(32,32)}catch(e){return console.log(e&&""),document.createElement("canvas").getContext("2d").createImageData(32,32)}}()),g(this,"initState",!0),this.canvas=t;var r=t.getContext("webgl");if(null===r)return this.initState=!1,void(this.config=null);if(this.gl=r,null===document.querySelector("style#".concat(y))){var n=this.styleElement;n.id=y,n.innerHTML="\n .lmssee-ripples { \n position: relative; \n z-index: 0; \n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transform: translate(0,0);\n }\n ";var i=document.head;i.prepend?i.prepend(n):i.insertBefore(n,i.firstChild)}this.config=Reflect.apply(p,this,[])})),E={imageUrl:"",resolution:256,dropRadius:10,perturbance:.03,interactive:!0,crossOrigin:"",playingState:!0,accelerating:1,raindropsTimeInterval:3600,idleFluctuations:!0};function R(e){return R="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},R(e)}function T(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,w(n.key),n)}}function x(e,t,r){return t&&T(e.prototype,t),r&&T(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function _(e,t,r){return(t=w(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function w(e){var t=function(e){if("object"!=R(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=R(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==R(t)?t:t+""}Object.freeze(E);var P=x((function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),_(this,"visible",!1),_(this,"running",!1),_(this,"perturbance",void 0),_(this,"resolution",void 0),_(this,"raindropsTimeInterval",void 0),_(this,"animationFrameId",0),_(this,"quad",null),_(this,"lastRaindropsFallTime",0),_(this,"parentElement",null),_(this,"backgroundInfo",{width:0,height:0}),_(this,"dropProgram",null),_(this,"updateProgram",null),_(this,"textures",[]),_(this,"backgroundTexture",[]),_(this,"textureDelta",null),_(this,"framebuffers",[]),_(this,"bufferWriteIndex",0),_(this,"bufferReadIndex",1),_(this,"originalInlineCss",""),_(this,"originalCssBackgroundImage",""),_(this,"events",{}),_(this,"accelerating",void 0),this.perturbance=t.perturbance,this.resolution=t.resolution,this.raindropsTimeInterval=t.raindropsTimeInterval,this.accelerating=t.accelerating})),S={};function F(){var e=this.gl,t=S[this.sole];e.bindBuffer(e.ARRAY_BUFFER,t.quad),e.vertexAttribPointer(0,2,e.FLOAT,!1,0,0),e.drawArrays(e.TRIANGLE_FAN,0,4)}function A(){var e=S[this.sole],t=e.bufferWriteIndex,r=e.bufferReadIndex;e.bufferWriteIndex=1-t,e.bufferReadIndex=1-r}function O(){var e=(S[this.sole]||{}).parentElement;if(e){var t=e.style.backgroundImage;if("none"!=t){var r=S[this.sole];r.originalInlineCss=t,r.originalCssBackgroundImage=window.getComputedStyle(e).backgroundImage,e.style.backgroundImage="none"}}}function I(){var e=S[this.sole],t=e.parentElement,r=e.originalInlineCss;t.style.backgroundImage=r||""}function D(){var e=this,t=this.gl,r=S[this.sole],n=r.parentElement,i=r.backgroundTexture,o=r.originalCssBackgroundImage,a=this.imageUrl||k(o)||k(window.getComputedStyle(n).backgroundImage);if(a!==this.imageSource)if(this.imageSource=a,this.imageSource){var l=new Image;l.onload=function(){var n=function(e){return!(e&e-1)},o=n(l.width)&&n(l.height)?t.REPEAT:t.CLAMP_TO_EDGE;t.bindTexture(t.TEXTURE_2D,i),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,o),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,o),t.texImage2D(t.TEXTURE_2D,0,t.RGBA,t.RGBA,t.UNSIGNED_BYTE,l),r.backgroundInfo={width:l.width,height:l.height},Reflect.apply(O,e,[])},l.onerror=function(){return Reflect.apply(U,e,[])},l.crossOrigin=this.imageSource.match(/^data:/)?null:this.crossOrigin,l.src=this.imageSource}else Reflect.apply(U,this,[])}function U(){var e=this.gl,t=S[this.sole].backgroundTexture;e.bindTexture(e.TEXTURE_2D,t),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,this.transparentPixels)}function k(e){var t=/url\(["']?([^"']*)["']?\)/.exec(e);return null==t?null:t[1]}function C(){var e,t,r,n=S[this.sole],i=n.parentElement,o=window.getComputedStyle(i).backgroundSize,a=window.getComputedStyle(i).backgroundAttachment,l=(e=window.getComputedStyle(i).backgroundPosition,/\s+/.test(e)?e.replace(/center/,"50%").replace(/top|left/,"0%").replace(/bottom/,"100%").replace(/\s+/," ").split(" "):L(e)?[e,"50%"]:{center:["50%","50%"],top:["50%","0%"],bottom:["50%","100%"],left:["0%","50%"],right:["100%","50%"]}[e]),s={left:0,top:0,width:0,height:0};if("fixed"==a)s.height=window.innerHeight,s.left=window.screenX,s.top=window.screenY,s.width=window.innerWidth;else{var u=i.getBoundingClientRect();s.left=u.left,s.top=u.top,s.width=i.scrollWidth,s.height=i.scrollHeight}var c=n.backgroundInfo||{width:100,height:100},f=c.width,p=c.height;if("cover"==o){var h=Math.max(s.width/f,s.height/p);t=f*h,r=p*h}else if("contain"==o){var d=Math.min(s.width/f,s.height/p);t=f*d,r=p*d}else{var m=o.split(" ");t=m[0]||"",r=m[1]||t,L(t)?t=s.width*parseFloat(t)/100:"auto"!==t&&(t=parseFloat(t)),L(r)?r=s.height*parseFloat(r)/100:"auto"!==r&&(r=parseFloat(r)),"auto"==t&&"auto"==r?(t=f,r=p):("auto"==t&&(t=f*(Number(r)/p)),"auto"==r&&(r=p*(Number(t)/f)))}var g=l&&l[0]||"0%",v=l&&l[1]||"0%";g=L(g)?(s.left+(s.width-Number(t))*parseFloat(g)/100).toString():(s.left+parseFloat(g)).toString(),v=L(v)?(s.top+(s.height-Number(r))*parseFloat(v)/100).toString():(s.top+parseFloat(v)).toString(),this.renderProgram.uniforms.topLeft=new Float32Array([(i.offsetLeft-Number(g))/t,(i.offsetTop-Number(v))/r]),this.renderProgram.uniforms.bottomRight=new Float32Array([this.renderProgram.uniforms.topLeft[0]+i.clientWidth/t,this.renderProgram.uniforms.topLeft[1]+i.clientHeight/r]);var y=Math.max(this.canvas.width,this.canvas.height);this.renderProgram.uniforms.containerRatio=new Float32Array([this.canvas.width/y,this.canvas.height/y])}function L(e){return e.endsWith("%")}function j(){var e=this.gl,t=S[this.sole],r=t.perturbance,n=t.textures,i=t.backgroundTexture;e.bindFramebuffer(e.FRAMEBUFFER,null),e.viewport(0,0,this.canvas.width,this.canvas.height),e.enable(e.BLEND),e.clear(e.COLOR_BUFFER_BIT|e.DEPTH_BUFFER_BIT),e.useProgram(this.renderProgram.id),Reflect.apply(f,this,[i,0]),Reflect.apply(f,this,[n[0],1]),e.uniform1f(this.renderProgram.locations.perturbance,r),e.uniform2fv(this.renderProgram.locations.topLeft,this.renderProgram.uniforms.topLeft),e.uniform2fv(this.renderProgram.locations.bottomRight,this.renderProgram.uniforms.bottomRight),e.uniform2fv(this.renderProgram.locations.containerRatio,this.renderProgram.uniforms.containerRatio),e.uniform1i(this.renderProgram.locations.samplerBackground,0),e.uniform1i(this.renderProgram.locations.samplerRipples,1),Reflect.apply(F,this,[]),e.disable(e.BLEND)}function B(){var e=this.gl,t=S[this.sole],r=t.resolution,n=t.updateProgram,i=t.textures,o=t.framebuffers,a=t.bufferWriteIndex,l=t.bufferReadIndex;e.viewport(0,0,r,r),e.bindFramebuffer(e.FRAMEBUFFER,o[a]),Reflect.apply(f,this,[i[l]]),e.useProgram(n.id),Reflect.apply(F,this,[]),Reflect.apply(A,this,[])}function X(){var e=this,t=S[this.sole],r=t.visible,n=t.raindropsTimeInterval,i=t.running,o=t.lastRaindropsFallTime;if(r){if(Reflect.apply(C,this,[]),this.idleFluctuations&&i){var a=Date.now();a-o>n&&(t.lastRaindropsFallTime=a,this.raindropsFall())}Reflect.apply(B,this,[]),Reflect.apply(j,this,[]),t.animationFrameId=requestAnimationFrame((function(){return Reflect.apply(X,e,[])}))}}function M(e,t,r){var n=S[this.sole].parentElement,i=window.getComputedStyle(n),o=parseInt(i.borderLeftWidth)||0,a=parseInt(i.borderTopWidth)||0,l=n.getBoundingClientRect(),s=e.clientX-l.left-o,u=e.clientY-l.top-a;this.drop(s,u,t,r)}function N(){var e=this,t=S[this.sole],r=t.visible,n=t.running,i=t.accelerating,o=t.parentElement,a=t.events,l=function(i){var o=arguments.length>1&&void 0!==arguments[1]&&arguments[1];r&&n&&e.interactive&&(t.lastRaindropsFallTime=Date.now(),Reflect.apply(M,e,[i,e.dropRadius*(o?1.5:1),o?.14:.01]))};a.mousemove=function(e){for(var t=i;t--;)l(e)},a.touchmove=a.touchstart=function(e){for(var t=e.touches,r=0;r<t.length;r++)l(t[r])},a.mousedown=function(e){return l(e,!0)},Object.keys(a).forEach((function(e){return o&&o.addEventListener(e,a[e],{passive:!0})}))}var W="\n attribute vec2 vertex;\n varying vec2 coord;\n void main() {\n coord = vertex * 0.5 + 0.5;\n gl_Position = vec4(vertex, 0.0, 1.0);\n }";function G(){var e=this.gl,t=S[this.sole],r=t.textureDelta;t.dropProgram=c(W,"precision highp float;\n\n const float PI = 3.141592653589793;\n uniform sampler2D texture;\n uniform vec2 center;\n uniform float radius;\n uniform float strength;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n\n float drop = max(0.0, 1.0 - length(center * 0.5 + 0.5 - coord) / radius);\n drop = 0.5 - cos(drop * PI) * 0.5;\n info.r += drop * strength;\n gl_FragColor = info;\n }",e);var n=t.updateProgram=c(W,"\n precision highp float;\n\n uniform sampler2D texture;\n uniform vec2 delta;\n\n varying vec2 coord;\n\n void main() {\n vec4 info = texture2D(texture, coord);\n \n vec2 dx = vec2(delta.x, 0.0);\n vec2 dy = vec2(0.0, delta.y);\n \n float average = (\n texture2D(texture, coord - dx).r +\n texture2D(texture, coord - dy).r +\n texture2D(texture, coord + dx).r +\n texture2D(texture, coord + dy).r\n ) * 0.25;\n \n info.g += (average - info.r) * 2.0;\n info.g *= 0.995;\n info.r += info.g;\n \n gl_FragColor = info;\n }\n ",this.gl);e.uniform2fv(n.locations.delta,r),this.renderProgram=c("\n precision highp float;\n\n attribute vec2 vertex;\n uniform vec2 topLeft;\n uniform vec2 bottomRight;\n uniform vec2 containerRatio;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n void main() {\n backgroundCoord = mix(topLeft, bottomRight, vertex * 0.5 + 0.5);\n backgroundCoord.y = 1.0 - backgroundCoord.y;\n ripplesCoord = vec2(vertex.x, -vertex.y) * containerRatio * 0.5 + 0.5;\n gl_Position = vec4(vertex.x, -vertex.y, 0.0, 1.0);\n }\n ","\n precision highp float;\n\n uniform sampler2D samplerBackground;\n uniform sampler2D samplerRipples;\n uniform vec2 delta;\n\n uniform float perturbance;\n varying vec2 ripplesCoord;\n varying vec2 backgroundCoord;\n\n void main() {\n float height = texture2D(samplerRipples, ripplesCoord).r;\n float heightX = texture2D(samplerRipples, vec2(ripplesCoord.x + delta.x, ripplesCoord.y)).r;\n float heightY = texture2D(samplerRipples, vec2(ripplesCoord.x, ripplesCoord.y + delta.y)).r;\n vec3 dx = vec3(delta.x, heightX - height, 0.0);\n vec3 dy = vec3(0.0, heightY - height, delta.y);\n vec2 offset = -normalize(cross(dy, dx)).xz;\n float specular = pow(max(0.0, dot(offset, normalize(vec2(-0.6, 1.0)))), 4.0);\n gl_FragColor = texture2D(samplerBackground, backgroundCoord + offset * perturbance) + specular;\n }",e),e.uniform2fv(this.renderProgram.locations.delta,r)}function z(){var e=this.gl,t=S[this.sole].backgroundTexture=e.createTexture();e.bindTexture(e.TEXTURE_2D,t),e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL,1),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR)}function H(){var e=this;if(this.config){var t=S[this.sole],r=t.resolution,n=t.textures,i=t.framebuffers,o=this.gl,a=1/r;t.textureDelta=new Float32Array([a,a]),this.config.extensions.forEach((function(e){return o.getExtension(e)})),this.updateSize=this.updateSize.bind(this),window.addEventListener("resize",this.updateSize);for(var l=this.config.arrayType,s=l?new l(r*r*4):null,u=this.config,c=0;c<2;c++){var f=o.createTexture(),p=o.createFramebuffer();o.bindFramebuffer(o.FRAMEBUFFER,p),o.bindTexture(o.TEXTURE_2D,f),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_MIN_FILTER,u.linearSupport?o.LINEAR:o.NEAREST),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_MAG_FILTER,u.linearSupport?o.LINEAR:o.NEAREST),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_WRAP_S,o.CLAMP_TO_EDGE),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_WRAP_T,o.CLAMP_TO_EDGE),o.texImage2D(o.TEXTURE_2D,0,o.RGBA,r,r,0,o.RGBA,u.type,s),o.framebufferTexture2D(o.FRAMEBUFFER,o.COLOR_ATTACHMENT0,o.TEXTURE_2D,f,0),n.push(f),i.push(p)}t.quad=o.createBuffer(),o.bindBuffer(o.ARRAY_BUFFER,t.quad),o.bufferData(o.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,1,1,-1,1]),o.STATIC_DRAW),Reflect.apply(G,this,[]),Reflect.apply(z,this,[]),Reflect.apply(U,this,[]),Reflect.apply(D,this,[]),o.clearColor(0,0,0,0),o.blendFunc(o.SRC_ALPHA,o.ONE_MINUS_SRC_ALPHA),t.visible=!0,t.running=!0,Reflect.apply(N,this,[]),t.animationFrameId=requestAnimationFrame((function(){return Reflect.apply(X,e,[])}))}}function Y(e){return Y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},Y(e)}function q(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function K(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?q(Object(r),!0).forEach((function(t){ee(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):q(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function V(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,te(n.key),n)}}function J(e,t){if(t&&("object"==Y(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function Q(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(e){}return(Q=function(){return!!e})()}function Z(e){return Z=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},Z(e)}function $(e,t){return $=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},$(e,t)}function ee(e,t,r){return(t=te(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function te(e){var t=function(e){if("object"!=Y(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=Y(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==Y(t)?t:t+""}var re=new WeakMap,ne=function(){function e(t,r){var n,i,o,a;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),i=this,a=[t],o=Z(o=e),ee(n=J(i,Q()?Reflect.construct(o,a||[],Z(i).constructor):o.apply(i,a)),"sole",Symbol("ripple")),ee(n,"defaults",E),ee(n,"interactive",n.defaults.interactive),ee(n,"dropRadius",void 0),ee(n,"crossOrigin",""),ee(n,"imageUrl",void 0),ee(n,"idleFluctuations",!0),function(e,t,r){(function(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")})(e,t),t.set(e,r)}(n,re,!1),ee(n,"imageSource",""),ee(n,"renderProgram",void 0),console.log("初始化参数",r),S[n.sole]=new P(E),Object.defineProperties(n,{defaults:{value:n.defaults,writable:!1,enumerable:!1,configurable:!1}}),r&&"boolean"!=typeof r.interactive&&delete r.interactive;var s=K(K({},n.defaults),r);return n.accelerating=s.accelerating,n.dropRadius=s.dropRadius,n.resolution=s.resolution,n.interactive=s.interactive,n.perturbance=s.perturbance,n.crossOrigin=s.crossOrigin,n.imageUrl=s.imageUrl,n.idleFluctuations=s.idleFluctuations,n.playingState=s.playingState,n.raindropsTimeInterval=s.raindropsTimeInterval,!1===n.initState||null===t.parentElement||null===n.config||null===n.gl?(n.initState=!1,J(n)):(S[n.sole].parentElement=t.parentElement,function(e){var t=e.parentElement;e.width=t.clientWidth,e.height=t.clientHeight,(0,l.setStyle)(e,{position:"absolute",left:0,top:0,right:0,bottom:0,zIndex:-1,pointerEvents:"none"})}(t),Reflect.apply(H,n,[]),n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&$(e,t)}(e,b),t=e,r=[{key:"accelerating",set:function(e){e>100||e<2||(S[this.sole].accelerating=e)}},{key:"resolution",set:function(e){e<100||e>550||(S[this.sole].resolution=e)}},{key:"perturbance",set:function(e){e<1e-4||e>1||(S[this.sole].perturbance=e)}},{key:"playingState",set:function(e){S[this.sole].running=!1!==e}},{key:"initialized",get:function(){return t=this,(e=re).get(function(e,t,r){if("function"==typeof e?e===t:e.has(t))return arguments.length<3?t:r;throw new TypeError("Private element is not present on this object")}(e,t));var e,t}},{key:"raindropsTimeInterval",set:function(e){e<10||e>12e3||(S[this.sole].raindropsTimeInterval=e)}},{key:"raindropsFall",value:function(){var e=S[this.sole].parentElement,t=window.getComputedStyle(e),r=function(e){return function(e=1,t=0){let r=Math.ceil(Number(t)),n=Math.floor(Number(e));return r>n&&([n,r]=[r,n]),Math.floor(Math.random()*(n-r+1)+r)}(parseInt(e))},n=t.width,i=t.height;this.drop(r(n),r(i),this.dropRadius,.03)}},{key:"drop",value:function(e,t,r,n){var i=this.gl,o=S[this.sole],a=o.resolution,l=o.parentElement,s=o.dropProgram,u=o.textures,c=o.framebuffers,p=o.bufferWriteIndex,h=o.bufferReadIndex,d=l.offsetWidth,m=l.offsetHeight,g=Math.max(d,m);r/=g;var v=new Float32Array([(2*e-d)/g,(m-2*t)/g]);i.viewport(0,0,a,a),i.bindFramebuffer(i.FRAMEBUFFER,c[p]),Reflect.apply(f,this,[u[h]]),i.useProgram(s.id),i.uniform2fv(s.locations.center,v),i.uniform1f(s.locations.radius,r),i.uniform1f(s.locations.strength,n),Reflect.apply(F,this,[]),Reflect.apply(A,this,[])}},{key:"updateSize",value:function(){var e=S[this.sole].parentElement,t=e.offsetWidth,r=e.offsetHeight;t==this.canvas.width&&r==this.canvas.height||(this.canvas.width=t,this.canvas.height=r)}},{key:"destroy",value:function(){S[this.sole].animationFrameId&&window.cancelAnimationFrame(S[this.sole].animationFrameId);var e=S[this.sole],t=e.parentElement,r=e.events;t&&(Object.keys(r).forEach((function(e){return t.removeEventListener&&t.removeEventListener(e,r[e])})),t.removeAttribute&&t.removeAttribute("data-ripples")),this.styleElement&&this.styleElement.remove(),this.gl=null,Reflect.apply(I,this,[]);var n=S[this.sole];Object.keys(n).forEach((function(e){return n[e]=null})),S[this.sole]=null,this.gl&&(this.gl=null),window.removeEventListener("resize",this.updateSize)}},{key:"show",value:function(){S[this.sole].visible=!0,this.canvas.style.visibility="visible",Reflect.apply(O,this,[])}},{key:"hide",value:function(){S[this.sole].visible=!1,this.canvas.style.visibility="hidden",Reflect.apply(I,this,[])}},{key:"pause",value:function(){this.playingState=!1}},{key:"play",value:function(){this.playingState=!0}},{key:"changePlayingState",value:function(){this.playingState=!S[this.sole].running}},{key:"set",value:function(e,t){"imageUrl"===e?(this.imageUrl=t,Reflect.apply(D,this,[])):this[e]=t}}],r&&V(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,r}();function ie(e,t){var r=(0,a.useRef)(null);return(0,a.useEffect)((function(){var n=e.current;return r.current=new ne(n,t&&t.option),function(){return r.current&&r.current.destroy()||void 0}}),[]),r}var oe=o.n;export{oe as useRipples};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oops-ui",
3
- "version": "0.0.11",
3
+ "version": "0.0.13",
4
4
  "type": "module",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.mjs",