lucky-scratch 1.1.1 → 1.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +225 -16
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -2,41 +2,250 @@
|
|
|
2
2
|
|
|
3
3
|
<div align="center">
|
|
4
4
|
<img src="https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png" width="128" alt="logo" />
|
|
5
|
-
<h1>lucky-
|
|
6
|
-
<p>一个基于 JavaScript
|
|
5
|
+
<h1>lucky-scratch 刮刮卡插件</h1>
|
|
6
|
+
<p>一个基于 JavaScript 的跨平台刮刮卡抽奖插件</p>
|
|
7
7
|
<p>
|
|
8
|
-
<a href="https://github.com/
|
|
9
|
-
<img src="https://img.shields.io/github/stars/
|
|
8
|
+
<a href="https://github.com/Cosmiumx/lucky-scratch/stargazers" target="_black">
|
|
9
|
+
<img src="https://img.shields.io/github/stars/Cosmiumx/lucky-scratch?color=%23ffba15&logo=github&style=flat-square" alt="stars" />
|
|
10
10
|
</a>
|
|
11
|
-
<a href="https://github.com/
|
|
12
|
-
<img src="https://img.shields.io/github/forks/
|
|
11
|
+
<a href="https://github.com/Cosmiumx/lucky-scratch/network/members" target="_black">
|
|
12
|
+
<img src="https://img.shields.io/github/forks/Cosmiumx/lucky-scratch?color=%23ffba15&logo=github&style=flat-square" alt="forks" />
|
|
13
13
|
</a>
|
|
14
|
-
<a href="https://github.com/
|
|
15
|
-
<img src="https://img.shields.io/badge/Author-%
|
|
14
|
+
<a href="https://github.com/Cosmiumx" target="_black">
|
|
15
|
+
<img src="https://img.shields.io/badge/Author-%20Cosmiumx%20-7289da.svg?&logo=github&style=flat-square" alt="author" />
|
|
16
16
|
</a>
|
|
17
|
-
<a href="https://github.com/
|
|
18
|
-
<img src="https://img.shields.io/github/license/
|
|
17
|
+
<a href="https://github.com/Cosmiumx/lucky-scratch/blob/master/LICENSE" target="_black">
|
|
18
|
+
<img src="https://img.shields.io/github/license/Cosmiumx/lucky-scratch?color=%232dce89&logo=github&style=flat-square" alt="license" />
|
|
19
19
|
</a>
|
|
20
20
|
</p>
|
|
21
21
|
</div>
|
|
22
22
|
|
|
23
23
|
<br />
|
|
24
24
|
|
|
25
|
-
##
|
|
25
|
+
## 安装
|
|
26
26
|
|
|
27
|
-
|
|
27
|
+
### 通过 npm/yarn
|
|
28
28
|
|
|
29
|
-
|
|
29
|
+
```bash
|
|
30
|
+
npm install lucky-scratch
|
|
31
|
+
# 或
|
|
32
|
+
yarn add lucky-scratch
|
|
33
|
+
```
|
|
30
34
|
|
|
35
|
+
### 通过 CDN
|
|
36
|
+
|
|
37
|
+
```html
|
|
38
|
+
<!-- jsDelivr -->
|
|
39
|
+
<script src="https://cdn.jsdelivr.net/npm/lucky-scratch@latest/dist/index.umd.js"></script>
|
|
40
|
+
|
|
41
|
+
<!-- unpkg -->
|
|
42
|
+
<script src="https://unpkg.com/lucky-scratch@latest/dist/index.umd.js"></script>
|
|
43
|
+
|
|
44
|
+
<!-- 指定版本 -->
|
|
45
|
+
<script src="https://cdn.jsdelivr.net/npm/lucky-scratch@1.1.2/dist/index.umd.js"></script>
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
<br />
|
|
49
|
+
|
|
50
|
+
## 快速开始
|
|
51
|
+
|
|
52
|
+
### 使用 ES Module
|
|
53
|
+
|
|
54
|
+
```javascript
|
|
55
|
+
import { LuckyScratch } from 'lucky-scratch'
|
|
56
|
+
|
|
57
|
+
const scratch = new LuckyScratch({
|
|
58
|
+
el: '#scratch',
|
|
59
|
+
}, {
|
|
60
|
+
width: '300px',
|
|
61
|
+
height: '200px',
|
|
62
|
+
mask: { type: 'color', color: '#ccc' },
|
|
63
|
+
scratch: { radius: 20, percent: 0.5 },
|
|
64
|
+
success: (progress) => {
|
|
65
|
+
alert('恭喜中奖！')
|
|
66
|
+
}
|
|
67
|
+
})
|
|
68
|
+
|
|
69
|
+
// 重置
|
|
70
|
+
scratch.init()
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
### 使用 CDN
|
|
74
|
+
|
|
75
|
+
```html
|
|
76
|
+
<!DOCTYPE html>
|
|
77
|
+
<html>
|
|
78
|
+
<head>
|
|
79
|
+
<title>刮刮卡示例</title>
|
|
80
|
+
</head>
|
|
81
|
+
<body>
|
|
82
|
+
<div id="scratch" style="position: relative; width: 300px; height: 200px;">
|
|
83
|
+
<div style="display: flex; align-items: center; justify-content: center; height: 100%; font-size: 24px;">
|
|
84
|
+
🎉 恭喜中奖！
|
|
85
|
+
</div>
|
|
86
|
+
</div>
|
|
87
|
+
|
|
88
|
+
<script src="https://cdn.jsdelivr.net/npm/lucky-scratch@latest/dist/index.umd.js"></script>
|
|
89
|
+
<script>
|
|
90
|
+
const scratch = new LuckyScratch({ el: '#scratch' }, {
|
|
91
|
+
width: '300px',
|
|
92
|
+
height: '200px',
|
|
93
|
+
mask: { type: 'color', color: '#ccc' },
|
|
94
|
+
scratch: { radius: 20, percent: 0.5 },
|
|
95
|
+
success: () => alert('恭喜中奖！')
|
|
96
|
+
})
|
|
97
|
+
</script>
|
|
98
|
+
</body>
|
|
99
|
+
</html>
|
|
100
|
+
```
|
|
31
101
|
|
|
32
102
|
<br />
|
|
33
103
|
|
|
34
|
-
##
|
|
104
|
+
## API
|
|
105
|
+
|
|
106
|
+
### 构造函数
|
|
107
|
+
|
|
108
|
+
```javascript
|
|
109
|
+
new LuckyScratch(container, config)
|
|
110
|
+
```
|
|
111
|
+
|
|
112
|
+
**container** - 容器配置
|
|
113
|
+
|
|
114
|
+
| 参数 | 类型 | 默认值 | 说明 |
|
|
115
|
+
|------|------|--------|------|
|
|
116
|
+
| el | string \| HTMLElement | 必填 | 容器选择器或 DOM 元素 |
|
|
117
|
+
|
|
118
|
+
**config** - 刮刮卡配置
|
|
119
|
+
|
|
120
|
+
| 参数 | 类型 | 默认值 | 说明 |
|
|
121
|
+
|------|------|--------|------|
|
|
122
|
+
| width | string | '300px' | 画布宽度 |
|
|
123
|
+
| height | string | '150px' | 画布高度 |
|
|
124
|
+
| mask | object | - | 遮罩层配置，见下方说明 |
|
|
125
|
+
| scratch | object | - | 刮奖配置，见下方说明 |
|
|
126
|
+
| onceBeforeStart | function | - | 首次刮奖前的校验回调 |
|
|
127
|
+
| beforeStart | function | - | 每次刮动前的校验回调 |
|
|
128
|
+
| start | function | - | 开始刮奖回调 |
|
|
129
|
+
| end | function | - | 停止刮奖回调 |
|
|
130
|
+
| success | function | - | 刮开达到阈值回调 |
|
|
131
|
+
| afterInit | function | - | 初始化完成回调 |
|
|
132
|
+
|
|
133
|
+
### mask 遮罩层配置
|
|
134
|
+
|
|
135
|
+
| 参数 | 类型 | 默认值 | 说明 |
|
|
136
|
+
|------|------|--------|------|
|
|
137
|
+
| type | string | 'color' | 遮罩类型：'color' 或 'image' |
|
|
138
|
+
| color | string | '#ccc' | type 为 'color' 时的颜色值 |
|
|
139
|
+
| src | string | - | type 为 'image' 时的图片地址 |
|
|
140
|
+
|
|
141
|
+
**示例：**
|
|
142
|
+
```javascript
|
|
143
|
+
// 颜色遮罩
|
|
144
|
+
mask: { type: 'color', color: '#cccccc' }
|
|
145
|
+
|
|
146
|
+
// 图片遮罩
|
|
147
|
+
mask: { type: 'image', src: 'https://example.com/mask.png' }
|
|
148
|
+
```
|
|
149
|
+
|
|
150
|
+
### scratch 刮奖配置
|
|
151
|
+
|
|
152
|
+
| 参数 | 类型 | 默认值 | 说明 |
|
|
153
|
+
|------|------|--------|------|
|
|
154
|
+
| radius | number | 20 | 刮开半径（像素） |
|
|
155
|
+
| percent | number | 0.5 | 触发成功的刮开比例，范围 0-1 |
|
|
156
|
+
|
|
157
|
+
**示例：**
|
|
158
|
+
```javascript
|
|
159
|
+
scratch: {
|
|
160
|
+
radius: 30, // 刮开半径 30px
|
|
161
|
+
percent: 0.6 // 刮开 60% 时触发 success 事件
|
|
162
|
+
}
|
|
163
|
+
```
|
|
164
|
+
|
|
165
|
+
### 事件回调
|
|
166
|
+
|
|
167
|
+
**onceBeforeStart(resolve)**
|
|
168
|
+
- 首次刮奖前的校验，只触发一次
|
|
169
|
+
- 调用 `resolve()` 允许刮奖，可用于权限验证
|
|
170
|
+
|
|
171
|
+
```javascript
|
|
172
|
+
onceBeforeStart: (resolve) => {
|
|
173
|
+
if (isLogin) {
|
|
174
|
+
resolve() // 允许刮奖
|
|
175
|
+
} else {
|
|
176
|
+
alert('请先登录')
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
```
|
|
180
|
+
|
|
181
|
+
**beforeStart(resolve)**
|
|
182
|
+
- 每次刮动前的校验
|
|
183
|
+
- 调用 `resolve()` 允许刮奖
|
|
184
|
+
|
|
185
|
+
**start()**
|
|
186
|
+
- 开始刮奖时触发
|
|
187
|
+
|
|
188
|
+
**end()**
|
|
189
|
+
- 停止刮奖时触发（手指/鼠标离开）
|
|
190
|
+
|
|
191
|
+
**success(progress)**
|
|
192
|
+
- 刮开达到设定百分比时触发
|
|
193
|
+
- `progress`: 当前刮开的百分比（0-1）
|
|
194
|
+
|
|
195
|
+
```javascript
|
|
196
|
+
success: (progress) => {
|
|
197
|
+
console.log('刮开进度:', progress) // 0.6
|
|
198
|
+
alert('恭喜中奖！')
|
|
199
|
+
}
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
**afterInit()**
|
|
203
|
+
- 初始化完成时触发
|
|
204
|
+
|
|
205
|
+
### 实例方法
|
|
206
|
+
|
|
207
|
+
**init()**
|
|
208
|
+
- 重置刮刮卡到初始状态
|
|
209
|
+
- 无参数，无返回值
|
|
210
|
+
|
|
211
|
+
```javascript
|
|
212
|
+
const scratch = new LuckyScratch({ el: '#scratch' }, config)
|
|
213
|
+
|
|
214
|
+
// 重置刮刮卡
|
|
215
|
+
scratch.init()
|
|
216
|
+
```
|
|
217
|
+
|
|
218
|
+
<br />
|
|
219
|
+
|
|
220
|
+
## 完整示例
|
|
221
|
+
|
|
222
|
+
```javascript
|
|
223
|
+
import { LuckyScratch } from 'lucky-scratch'
|
|
35
224
|
|
|
36
|
-
|
|
225
|
+
const scratch = new LuckyScratch({ el: '#scratch' }, {
|
|
226
|
+
width: '300px',
|
|
227
|
+
height: '200px',
|
|
228
|
+
mask: { type: 'image', src: 'https://example.com/mask.png' },
|
|
229
|
+
scratch: { radius: 30, percent: 0.6 },
|
|
230
|
+
onceBeforeStart: (resolve) => {
|
|
231
|
+
// 权限验证
|
|
232
|
+
fetch('/api/check-auth').then(res => res.json()).then(data => {
|
|
233
|
+
data.isLogin ? resolve() : alert('请先登录')
|
|
234
|
+
})
|
|
235
|
+
},
|
|
236
|
+
success: (progress) => {
|
|
237
|
+
// 获取奖品
|
|
238
|
+
fetch('/api/get-prize').then(res => res.json()).then(data => {
|
|
239
|
+
alert(`恭喜获得：${data.prize}`)
|
|
240
|
+
})
|
|
241
|
+
}
|
|
242
|
+
})
|
|
37
243
|
|
|
244
|
+
// 重置
|
|
245
|
+
document.querySelector('#resetBtn').onclick = () => scratch.init()
|
|
246
|
+
```
|
|
38
247
|
<br />
|
|
39
248
|
|
|
40
249
|
## 🙏🙏🙏 点个Star
|
|
41
250
|
|
|
42
|
-
**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/
|
|
251
|
+
**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/Cosmiumx/lucky-scratch) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**
|
package/dist/index.cjs.js
CHANGED
|
@@ -13,5 +13,5 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
|
13
13
|
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
14
14
|
PERFORMANCE OF THIS SOFTWARE.
|
|
15
15
|
***************************************************************************** */
|
|
16
|
-
var t=function(e,n){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n])},t(e,n)};var e=function(){return e=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t},e.apply(this,arguments)};function n(t,e,n,i){return new(n||(n=Promise))(function(r,o){function s(t){try{c(i.next(t))}catch(t){o(t)}}function a(t){try{c(i.throw(t))}catch(t){o(t)}}function c(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n(function(t){t(e)})).then(s,a)}c((i=i.apply(t,e||[])).next())})}function i(t,e){var n,i,r,o,s={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return o={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function a(o){return function(a){return function(o){if(n)throw new TypeError("Generator is already executing.");for(;s;)try{if(n=1,i&&(r=2&o[0]?i.return:o[0]?i.throw||((r=i.return)&&r.call(i),0):i.next)&&!(r=r.call(i,o[1])).done)return r;switch(i=0,r&&(o=[2&o[0],r.value]),o[0]){case 0:case 1:r=o;break;case 4:return s.label++,{value:o[1],done:!1};case 5:s.label++,i=o[1],o=[0];continue;case 7:o=s.ops.pop(),s.trys.pop();continue;default:if(!(r=s.trys,(r=r.length>0&&r[r.length-1])||6!==o[0]&&2!==o[0])){s=0;continue}if(3===o[0]&&(!r||o[1]>r[0]&&o[1]<r[3])){s.label=o[1];break}if(6===o[0]&&s.label<r[1]){s.label=r[1],r=o;break}if(r&&s.label<r[2]){s.label=r[2],s.ops.push(o);break}r[2]&&s.ops.pop(),s.trys.pop();continue}o=e.call(t,s)}catch(t){o=[6,t],i=0}finally{n=r=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,a])}}}function r(t,e){for(var n=0,i=e.length,r=t.length;n<i;n++,r++)t[r]=e[n];return t}Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(t,e){if(null==this)throw new TypeError('"this" is null or not defined');var n=Object(this),i=n.length>>>0;if(0===i)return!1;var r=0|e,o=Math.max(r>=0?r:i-Math.abs(r),0);function s(t,e){return t===e||"number"==typeof t&&"number"==typeof e&&isNaN(t)&&isNaN(e)}for(;o<i;){if(s(n[o],t))return!0;o++}return!1}}),String.prototype.includes||(String.prototype.includes=function(t,e){return"number"!=typeof e&&(e=0),!(e+t.length>this.length)&&-1!==this.indexOf(t,e)}),Array.prototype.find||Object.defineProperty(Array.prototype,"find",{value:function(t){if(null==this)throw new TypeError('"this" is null or not defined');var e=Object(this),n=e.length>>>0;if("function"!=typeof t)throw new TypeError("predicate must be a function");for(var i=arguments[1],r=0;r<n;){var o=e[r];if(t.call(i,o,r,e))return o;r++}}});var o=function(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];return e.some(function(e){return Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===e})},s="1.1.0",a=function(){function t(){this.subs=[]}return t.prototype.addSub=function(t){this.subs.includes(t)||this.subs.push(t)},t.prototype.notify=function(){this.subs.forEach(function(t){t.update()})},t}(),c="__proto__"in{};function h(t,e,n,i){Object.defineProperty(t,e,{value:n,enumerable:!!i,writable:!0,configurable:!0})}var l=Array.prototype,u=Object.create(l);["push","pop","shift","unshift","sort","splice","reverse"].forEach(function(t){u[t]=function(){for(var e=[],n=0;n<arguments.length;n++)e[n]=arguments[n];var i=l[t].apply(this,e),r=this.__luckyOb__;return["push","unshift","splice"].includes(t)&&r.walk(this),r.dep.notify(),i}});var f=function(){function t(t){this.dep=new a,h(t,"__luckyOb__",this),Array.isArray(t)&&(c?t.__proto__=u:Object.getOwnPropertyNames(u).forEach(function(e){h(t,e,u[e])})),this.walk(t)}return t.prototype.walk=function(t){Object.keys(t).forEach(function(e){p(t,e,t[e])})},t}();function d(t){if(t&&"object"==typeof t)return"__luckyOb__"in t?t.__luckyOb__:new f(t)}function p(t,e,n){var i=new a,r=Object.getOwnPropertyDescriptor(t,e);if(!r||!1!==r.configurable){var o=r&&r.get,s=r&&r.set;o&&!s||2!==arguments.length||(n=t[e]);var c=d(n);Object.defineProperty(t,e,{get:function(){var e=o?o.call(t):n;return a.target&&(i.addSub(a.target),c&&c.dep.addSub(a.target)),e},set:function(e){e!==n&&(n=e,o&&!s||(s?s.call(t,e):n=e,c=d(e),i.notify()))}})}}var v=0,g=function(){function t(t,e,n,i){void 0===i&&(i={}),this.id=v++,this.$lucky=t,this.expr=e,this.deep=!!i.deep,this.getter="function"==typeof e?e:function(t){t+=".";for(var e=[],n="",i=0;i<t.length;i++){var r=t[i];if(/\[|\./.test(r))e.push(n),n="";else{if(/\W/.test(r))continue;n+=r}}return function(t){return e.reduce(function(t,e){return t[e]},t)}}(e),this.cb=n,this.value=this.get()}return t.prototype.get=function(){a.target=this;var t=this.getter.call(this.$lucky,this.$lucky);return this.deep&&function(t){var e=function(t){o(t,"array","object")&&Object.keys(t).forEach(function(n){var i=t[n];e(i)})};e(t)}(t),a.target=null,t},t.prototype.update=function(){var t=this.get(),e=this.value;this.value=t,this.cb.call(this.$lucky,t,e)},t}(),y=function(r){function o(t,e){var n=r.call(this,t,{width:e.width||"300px",height:e.height||"150px"})||this;return n.mask={},n.scratch={radius:20,percent:.5},n.progress=0,n.isScratching=!1,n.isCompleted=!1,n.disabled=!1,n.isFirstScratch=!0,n.eventsInitialized=!1,n.initData(e),n.init(),n}return function(e,n){if("function"!=typeof n&&null!==n)throw new TypeError("Class extends value "+String(n)+" is not a constructor or null");function i(){this.constructor=e}t(e,n),e.prototype=null===n?Object.create(n):(i.prototype=n.prototype,new i)}(o,r),o.prototype.initData=function(t){this.$set(this,"mask",e({type:"color",color:"#ccc"},t.mask)),this.$set(this,"scratch",e({radius:20,percent:.5},t.scratch)),this.$set(this,"onceBeforeStartCallback",t.onceBeforeStart),this.$set(this,"beforeStartCallback",t.beforeStart),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end),this.$set(this,"successCallback",t.success),this.$set(this,"afterInitCallback",t.afterInit)},o.prototype.resize=function(){var t,e;r.prototype.resize.call(this),this.draw(),null===(e=(t=this.config).afterResize)||void 0===e||e.call(t)},o.prototype.init=function(){var t;return n(this,void 0,void 0,function(){return i(this,function(e){switch(e.label){case 0:return this.initLucky(),this.progress=0,this.isScratching=!1,this.isCompleted=!1,this.isFirstScratch=!0,[4,this.draw()];case 1:return e.sent(),this.handleBindEvents(),null===(t=this.afterInitCallback)||void 0===t||t.call(this),[2]}})})},o.prototype.draw=function(){var t,e,r,o;return n(this,void 0,void 0,function(){var n,s,a;return i(this,function(i){switch(i.label){case 0:return null===(e=(t=this.config).beforeInit)||void 0===e||e.call(t),this.clearCanvas(),s=(n=this).mask,n.scratch,"image"===s.type&&s.src?[4,this.loadImg(s.src,{src:s.src})]:[3,2];case 1:return a=i.sent(),this.ctx.drawImage(a,0,0,this.boxWidth,this.boxHeight),[3,3];case 2:this.ctx.fillStyle=s.color||"#ccc",this.ctx.fillRect(0,0,this.boxWidth,this.boxHeight),i.label=3;case 3:return null===(o=(r=this.config).afterInit)||void 0===o||o.call(r),[2]}})})},o.prototype.handleBindEvents=function(){var t=this;if(!this.eventsInitialized){this.eventsInitialized=!0;var e=this.config.canvasElement;e&&(e.addEventListener("touchstart",function(e){t.handleStart(e.touches[0])}),e.addEventListener("touchmove",function(e){e.preventDefault(),t.handleMove(e.touches[0])}),e.addEventListener("touchend",function(){t.handleEnd()}),e.addEventListener("mousedown",function(e){t.handleStart(e)}),e.addEventListener("mousemove",function(e){e.preventDefault(),t.handleMove(e)}),document.addEventListener("mouseup",function(){t.handleEnd()}))}},o.prototype.handleStart=function(t){var e;return n(this,void 0,void 0,function(){var n,r;return i(this,function(i){switch(i.label){case 0:if(this.isCompleted||this.disabled)return[2];if(!this.isFirstScratch||!this.onceBeforeStartCallback)return[3,5];i.label=1;case 1:return i.trys.push([1,3,,4]),[4,this.onceBeforeStartCallback()];case 2:return!1===i.sent()?[2]:[3,4];case 3:return n=i.sent(),console.error("onceBeforeStart 回调执行出错:",n),[2];case 4:this.isFirstScratch=!1,i.label=5;case 5:if(!this.beforeStartCallback)return[3,9];i.label=6;case 6:return i.trys.push([6,8,,9]),[4,this.beforeStartCallback()];case 7:return!1===i.sent()?[2]:[3,9];case 8:return r=i.sent(),console.error("beforeStart 回调执行出错:",r),[2];case 9:return this.isScratching=!0,null===(e=this.startCallback)||void 0===e||e.call(this),this.drawArc(t),[2]}})})},o.prototype.handleMove=function(t){!this.isScratching||this.isCompleted||this.disabled||this.drawArc(t)},o.prototype.handleEnd=function(){var t;!this.isScratching||this.isCompleted||this.disabled||(this.isScratching=!1,this.checkProgress(),null===(t=this.endCallback)||void 0===t||t.call(this))},o.prototype.drawArc=function(t){var e=this.config.canvasElement;if(e){var n=e.getBoundingClientRect(),i=(t.clientX-n.left)*this.config.dpr,r=(t.clientY-n.top)*this.config.dpr;this.drawArcAt(i,r)}},o.prototype.drawArcAt=function(t,e){this.ctx.globalCompositeOperation="destination-out",this.ctx.beginPath(),this.ctx.arc(t,e,this.scratch.radius*this.config.dpr,0,2*Math.PI),this.ctx.fill(),this.ctx.globalCompositeOperation="source-over"},o.prototype.checkProgress=function(){var t;try{for(var e=this.ctx.getImageData(0,0,this.boxWidth*this.config.dpr,this.boxHeight*this.config.dpr).data,n=0,i=0;i<e.length;i+=4)e[i+3]<128&&n++;this.progress=n/(e.length/4),this.progress>=this.scratch.percent&&(this.isCompleted=!0,this.clearCanvas(),null===(t=this.successCallback)||void 0===t||t.call(this,this.progress))}catch(t){console.error("无法计算刮开进度，可能是因为图片跨域:",t)}},o.prototype.setDisabled=function(t){this.disabled=t},o.prototype.handleTouchStart=function(t,e){var r;return n(this,void 0,void 0,function(){var n,o;return i(this,function(i){switch(i.label){case 0:if(this.isCompleted||this.disabled)return[2];if(!this.isFirstScratch||!this.onceBeforeStartCallback)return[3,5];i.label=1;case 1:return i.trys.push([1,3,,4]),[4,this.onceBeforeStartCallback()];case 2:return!1===i.sent()?[2]:[3,4];case 3:return n=i.sent(),console.error("onceBeforeStart 回调执行出错:",n),[2];case 4:this.isFirstScratch=!1,i.label=5;case 5:if(!this.beforeStartCallback)return[3,9];i.label=6;case 6:return i.trys.push([6,8,,9]),[4,this.beforeStartCallback()];case 7:return!1===i.sent()?[2]:[3,9];case 8:return o=i.sent(),console.error("beforeStart 回调执行出错:",o),[2];case 9:return this.isScratching=!0,null===(r=this.startCallback)||void 0===r||r.call(this),this.drawArcAt(t*this.config.dpr,e*this.config.dpr),[2]}})})},o.prototype.handleTouchMove=function(t,e){!this.isScratching||this.isCompleted||this.disabled||this.drawArcAt(t*this.config.dpr,e*this.config.dpr)},o.prototype.handleTouchEnd=function(){var t;!this.isScratching||this.isCompleted||this.disabled||(this.isScratching=!1,this.checkProgress(),null===(t=this.endCallback)||void 0===t||t.call(this))},o}(function(){function t(t,e){var n=this;this.version=s,this.htmlFontSize=16,this.rAF=function(){},this.boxWidth=0,this.boxHeight=0,"string"==typeof t?t={el:t}:1===t.nodeType&&(t={el:"",divElement:t}),this.config=t,this.data=e,t.flag||(t.flag="WEB"),t.el&&(t.divElement=document.querySelector(t.el)),t.divElement&&(t.canvasElement=document.createElement("canvas"),t.divElement.appendChild(t.canvasElement)),t.canvasElement&&(t.ctx=t.canvasElement.getContext("2d"),t.canvasElement.setAttribute("package","".concat("lucky-scratch","@").concat(s)),t.canvasElement.addEventListener("click",function(t){return n.handleClick(t)})),this.ctx=t.ctx,this.initWindowFunction(),this.config.ctx||console.error("无法获取到 CanvasContext2D"),window&&"function"==typeof window.addEventListener&&window.addEventListener("resize",function(t,e){void 0===e&&(e=300);var n=null;return function(){for(var i=this,r=[],o=0;o<arguments.length;o++)r[o]=arguments[o];n||(n=setTimeout(function(){t.apply(i,r),clearTimeout(n),n=null},e))}}(function(){return n.resize()},300)),window&&window.document&&"function"==typeof window.MutationObserver&&"WEB"===this.config.flag&&new window.MutationObserver(function(){n.resize()}).observe(document.documentElement,{attributes:!0})}return t.prototype.resize=function(){var t,e;null===(e=(t=this.config).beforeResize)||void 0===e||e.call(t),this.setHTMLFontSize(),this.setDpr(),this.resetWidthAndHeight(),this.zoomCanvas()},t.prototype.initLucky=function(){if(this.resize(),!this.boxWidth||!this.boxHeight)return console.error("无法获取到宽度或高度")},t.prototype.handleClick=function(t){},t.prototype.setHTMLFontSize=function(){window&&window.getComputedStyle&&(this.htmlFontSize=+window.getComputedStyle(document.documentElement).fontSize.slice(0,-2))},t.prototype.clearCanvas=function(){var t=[this.boxWidth,this.boxHeight],e=t[0],n=t[1];this.ctx.clearRect(-e,-n,2*e,2*n)},t.prototype.setDpr=function(){var t=this.config;t.dpr||(window?window.dpr=t.dpr=window.devicePixelRatio||1:t.dpr||console.error(t,"未传入 dpr 可能会导致绘制异常"))},t.prototype.resetWidthAndHeight=function(){var t=this.config,e=this.data,n=0,i=0;t.divElement&&(n=t.divElement.offsetWidth,i=t.divElement.offsetHeight),this.boxWidth=this.getLength(e.width||t.width)||n,this.boxHeight=this.getLength(e.height||t.height)||i,t.divElement&&(t.divElement.style.overflow="hidden",t.divElement.style.width=this.boxWidth+"px",t.divElement.style.height=this.boxHeight+"px")},t.prototype.zoomCanvas=function(){var t=this.config,e=this.ctx,n=t.canvasElement,i=t.dpr,r=[this.boxWidth*i,this.boxHeight*i],o=r[0],s=r[1];n&&(n.width=o,n.height=s,n.style.width="".concat(o,"px"),n.style.height="".concat(s,"px"),n.style["transform-origin"]="left top",n.style.transform="scale(".concat(1/i,")"),e.scale(i,i))},t.prototype.initWindowFunction=function(){var t=this.config;if(window)return this.rAF=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(t){window.setTimeout(t,1e3/60)},t.setTimeout=window.setTimeout,t.setInterval=window.setInterval,t.clearTimeout=window.clearTimeout,void(t.clearInterval=window.clearInterval);if(t.rAF)this.rAF=t.rAF;else if(t.setTimeout){var e=t.setTimeout;this.rAF=function(t){return e(t,16.7)}}else this.rAF=function(t){return setTimeout(t,16.7)}},t.prototype.isWeb=function(){return["WEB","UNI-H5","TARO-H5"].includes(this.config.flag)},t.prototype.loadImg=function(t,e,n){var i=this;return void 0===n&&(n="$resolve"),new Promise(function(r,o){if(t||o("=> '".concat(e.src,"' 不能为空或不合法")),"WEB"!==i.config.flag)return e[n]=r,void(e.$reject=o);var s=new Image;s.crossorigin="anonymous",s.onload=function(){return r(s)},s.onerror=function(){return o("=> '".concat(e.src,"' 图片加载失败"))},s.src=t})},t.prototype.drawImage=function(t,e){for(var n,i,o,s=[],a=2;a<arguments.length;a++)s[a-2]=arguments[a];var c=this.config,h=c.flag,l=c.dpr;if(["WEB","MP-WX"].includes(h))o=e;else{if(!["UNI-H5","UNI-MP","TARO-H5","TARO-MP"].includes(h))return console.error("意料之外的 flag, 该平台尚未兼容!");o=e.path}var u=null===(i=(n=o.canvas||o).getContext)||void 0===i?void 0:i.call(n,"2d");if(u&&!this.isWeb()){s=s.map(function(t){return t*l});var f=u.getImageData.apply(u,s.slice(0,4));t.putImageData.apply(t,r([f],s.slice(4,6)))}else{8===s.length&&(s=s.map(function(t,e){return e<4?t*l:t}));try{t.drawImage.apply(t,r([o],s))}catch(t){}}},t.prototype.computedWidthAndHeight=function(t,e,n,i){if(!e.width&&!e.height)return[t.width,t.height];if(e.width&&!e.height){var r=this.getLength(e.width,n);return[r,t.height*(r/t.width)]}if(!e.width&&e.height){var o=this.getLength(e.height,i);return[t.width*(o/t.height),o]}return[this.getLength(e.width,n),this.getLength(e.height,i)]},t.prototype.changeUnits=function(t,e){var n=this;void 0===e&&(e=1);var i=this.config;return Number(t.replace(/^([-]*[0-9.]*)([a-z%]*)$/,function(t,r,o){var s={"%":function(t){return t*(e/100)},px:function(t){return 1*t},rem:function(t){return t*n.htmlFontSize},vw:function(t){return t/100*window.innerWidth}}[o];if(s)return s(r);var a=i.handleCssUnit||i.unitFunc;return a?a(r,o):r}))},t.prototype.getLength=function(t,e){return o(t,"number")?t:o(t,"string")?this.changeUnits(t,e):0},t.prototype.getOffsetX=function(t,e){return void 0===e&&(e=0),(e-t)/2},t.prototype.getOffscreenCanvas=function(t,e){if(!(n=this,i="_offscreenCanvas",Object.prototype.hasOwnProperty.call(n,i)||(window&&window.document&&"WEB"===this.config.flag?this._offscreenCanvas=document.createElement("canvas"):this._offscreenCanvas=this.config.offscreenCanvas,this._offscreenCanvas)))return console.error("离屏 Canvas 无法渲染!");var n,i,r=this.config.dpr,o=this._offscreenCanvas;o.width=(t||300)*r,o.height=(e||150)*r;var s=o.getContext("2d");return s.clearRect(0,0,t,e),s.scale(r,r),s.dpr=r,{_offscreenCanvas:o,_ctx:s}},t.prototype.$set=function(t,e,n){t&&"object"==typeof t&&p(t,e,n)},t.prototype.$computed=function(t,e,n){var i=this;Object.defineProperty(t,e,{get:function(){return n.call(i)}})},t.prototype.$watch=function(t,e,n){void 0===n&&(n={}),"object"==typeof e&&(e=(n=e).handler);var i=new g(this,t,e,n);return n.immediate&&e.call(this,i.value),function(){}},t.version=s,t}());exports.LuckyScratch=y,exports.cutRound=function(t,e){var n=document.createElement("canvas"),i=n.getContext("2d"),r=t.width,o=t.height;return n.width=r,n.height=o,function(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];var i=e[0],r=e[1],o=e[2],s=e[3],a=e[4],c=Math.min(o,s),h=Math.PI;a>c/2&&(a=c/2),t.beginPath(),t.moveTo(i+a,r),t.lineTo(i+a,r),t.lineTo(i+o-a,r),t.arc(i+o-a,r+a,a,-h/2,0),t.lineTo(i+o,r+s-a),t.arc(i+o-a,r+s-a,a,0,h/2),t.lineTo(i+a,r+s),t.arc(i+a,r+s-a,a,h/2,h),t.lineTo(i,r+a),t.arc(i+a,r+a,a,h,-h/2),t.closePath()}(i,0,0,r,o,e),i.clip(),i.drawImage(t,0,0,r,o),n},exports.opacity=function(t,e){var n=document.createElement("canvas"),i=n.getContext("2d"),r=t.width,o=t.height;if(n.width=r,n.height=o,"string"==typeof i.filter)i.filter="opacity(".concat(100*e,"%)"),i.drawImage(t,0,0,r,o);else{i.drawImage(t,0,0,r,o);for(var s=i.getImageData(0,0,r,o),a=s.data,c=a.length,h=0;h<c;h+=4){var l=a[h+3];0!==l&&(a[h+3]=l*e)}i.putImageData(s,0,0)}return n};
|
|
16
|
+
var t=function(e,n){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n])},t(e,n)};var e=function(){return e=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t},e.apply(this,arguments)};function n(t,e,n,i){return new(n||(n=Promise))(function(r,o){function s(t){try{c(i.next(t))}catch(t){o(t)}}function a(t){try{c(i.throw(t))}catch(t){o(t)}}function c(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n(function(t){t(e)})).then(s,a)}c((i=i.apply(t,e||[])).next())})}function i(t,e){var n,i,r,o,s={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return o={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function a(o){return function(a){return function(o){if(n)throw new TypeError("Generator is already executing.");for(;s;)try{if(n=1,i&&(r=2&o[0]?i.return:o[0]?i.throw||((r=i.return)&&r.call(i),0):i.next)&&!(r=r.call(i,o[1])).done)return r;switch(i=0,r&&(o=[2&o[0],r.value]),o[0]){case 0:case 1:r=o;break;case 4:return s.label++,{value:o[1],done:!1};case 5:s.label++,i=o[1],o=[0];continue;case 7:o=s.ops.pop(),s.trys.pop();continue;default:if(!(r=s.trys,(r=r.length>0&&r[r.length-1])||6!==o[0]&&2!==o[0])){s=0;continue}if(3===o[0]&&(!r||o[1]>r[0]&&o[1]<r[3])){s.label=o[1];break}if(6===o[0]&&s.label<r[1]){s.label=r[1],r=o;break}if(r&&s.label<r[2]){s.label=r[2],s.ops.push(o);break}r[2]&&s.ops.pop(),s.trys.pop();continue}o=e.call(t,s)}catch(t){o=[6,t],i=0}finally{n=r=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,a])}}}function r(t,e){for(var n=0,i=e.length,r=t.length;n<i;n++,r++)t[r]=e[n];return t}Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(t,e){if(null==this)throw new TypeError('"this" is null or not defined');var n=Object(this),i=n.length>>>0;if(0===i)return!1;var r=0|e,o=Math.max(r>=0?r:i-Math.abs(r),0);function s(t,e){return t===e||"number"==typeof t&&"number"==typeof e&&isNaN(t)&&isNaN(e)}for(;o<i;){if(s(n[o],t))return!0;o++}return!1}}),String.prototype.includes||(String.prototype.includes=function(t,e){return"number"!=typeof e&&(e=0),!(e+t.length>this.length)&&-1!==this.indexOf(t,e)}),Array.prototype.find||Object.defineProperty(Array.prototype,"find",{value:function(t){if(null==this)throw new TypeError('"this" is null or not defined');var e=Object(this),n=e.length>>>0;if("function"!=typeof t)throw new TypeError("predicate must be a function");for(var i=arguments[1],r=0;r<n;){var o=e[r];if(t.call(i,o,r,e))return o;r++}}});var o=function(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];return e.some(function(e){return Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===e})},s="1.1.3",a=function(){function t(){this.subs=[]}return t.prototype.addSub=function(t){this.subs.includes(t)||this.subs.push(t)},t.prototype.notify=function(){this.subs.forEach(function(t){t.update()})},t}(),c="__proto__"in{};function h(t,e,n,i){Object.defineProperty(t,e,{value:n,enumerable:!!i,writable:!0,configurable:!0})}var u=Array.prototype,l=Object.create(u);["push","pop","shift","unshift","sort","splice","reverse"].forEach(function(t){l[t]=function(){for(var e=[],n=0;n<arguments.length;n++)e[n]=arguments[n];var i=u[t].apply(this,e),r=this.__luckyOb__;return["push","unshift","splice"].includes(t)&&r.walk(this),r.dep.notify(),i}});var f=function(){function t(t){this.dep=new a,h(t,"__luckyOb__",this),Array.isArray(t)&&(c?t.__proto__=l:Object.getOwnPropertyNames(l).forEach(function(e){h(t,e,l[e])})),this.walk(t)}return t.prototype.walk=function(t){Object.keys(t).forEach(function(e){p(t,e,t[e])})},t}();function d(t){if(t&&"object"==typeof t)return"__luckyOb__"in t?t.__luckyOb__:new f(t)}function p(t,e,n){var i=new a,r=Object.getOwnPropertyDescriptor(t,e);if(!r||!1!==r.configurable){var o=r&&r.get,s=r&&r.set;o&&!s||2!==arguments.length||(n=t[e]);var c=d(n);Object.defineProperty(t,e,{get:function(){var e=o?o.call(t):n;return a.target&&(i.addSub(a.target),c&&c.dep.addSub(a.target)),e},set:function(e){e!==n&&(n=e,o&&!s||(s?s.call(t,e):n=e,c=d(e),i.notify()))}})}}var v=0,g=function(){function t(t,e,n,i){void 0===i&&(i={}),this.id=v++,this.$lucky=t,this.expr=e,this.deep=!!i.deep,this.getter="function"==typeof e?e:function(t){t+=".";for(var e=[],n="",i=0;i<t.length;i++){var r=t[i];if(/\[|\./.test(r))e.push(n),n="";else{if(/\W/.test(r))continue;n+=r}}return function(t){return e.reduce(function(t,e){return t[e]},t)}}(e),this.cb=n,this.value=this.get()}return t.prototype.get=function(){a.target=this;var t=this.getter.call(this.$lucky,this.$lucky);return this.deep&&function(t){var e=function(t){o(t,"array","object")&&Object.keys(t).forEach(function(n){var i=t[n];e(i)})};e(t)}(t),a.target=null,t},t.prototype.update=function(){var t=this.get(),e=this.value;this.value=t,this.cb.call(this.$lucky,t,e)},t}(),y=function(r){function o(t,e){var n=r.call(this,t,{width:e.width||"300px",height:e.height||"150px"})||this;return n.mask={},n.scratch={radius:20,percent:.5},n.progress=0,n.isScratching=!1,n.isCompleted=!1,n.disabled=!1,n.isFirstScratch=!0,n.eventsInitialized=!1,n.initData(e),n.init(),n}return function(e,n){if("function"!=typeof n&&null!==n)throw new TypeError("Class extends value "+String(n)+" is not a constructor or null");function i(){this.constructor=e}t(e,n),e.prototype=null===n?Object.create(n):(i.prototype=n.prototype,new i)}(o,r),o.prototype.initData=function(t){this.$set(this,"mask",e({type:"color",color:"#ccc"},t.mask)),this.$set(this,"scratch",e({radius:20,percent:.5},t.scratch)),this.$set(this,"onceBeforeStartCallback",t.onceBeforeStart),this.$set(this,"beforeStartCallback",t.beforeStart),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end),this.$set(this,"successCallback",t.success),this.$set(this,"afterInitCallback",t.afterInit)},o.prototype.resize=function(){var t,e;r.prototype.resize.call(this),this.draw(),null===(e=(t=this.config).afterResize)||void 0===e||e.call(t)},o.prototype.init=function(){var t;return n(this,void 0,void 0,function(){return i(this,function(e){switch(e.label){case 0:return this.initLucky(),this.progress=0,this.isScratching=!1,this.isCompleted=!1,this.isFirstScratch=!0,[4,this.draw()];case 1:return e.sent(),this.handleBindEvents(),null===(t=this.afterInitCallback)||void 0===t||t.call(this),[2]}})})},o.prototype.draw=function(){var t,e,r,o;return n(this,void 0,void 0,function(){var n,s,a;return i(this,function(i){switch(i.label){case 0:return null===(e=(t=this.config).beforeInit)||void 0===e||e.call(t),this.clearCanvas(),s=(n=this).mask,n.scratch,"image"===s.type&&s.src?[4,this.loadImg(s.src,{src:s.src})]:[3,2];case 1:return a=i.sent(),this.ctx.drawImage(a,0,0,this.boxWidth,this.boxHeight),[3,3];case 2:this.ctx.fillStyle=s.color||"#ccc",this.ctx.fillRect(0,0,this.boxWidth,this.boxHeight),i.label=3;case 3:return null===(o=(r=this.config).afterInit)||void 0===o||o.call(r),[2]}})})},o.prototype.handleBindEvents=function(){var t=this;if(!this.eventsInitialized){this.eventsInitialized=!0;var e=this.config.canvasElement;e&&this.isWeb()&&(e.addEventListener("touchstart",function(e){t.handleStart(e.touches[0])}),e.addEventListener("touchmove",function(e){e.preventDefault(),t.handleMove(e.touches[0])}),e.addEventListener("touchend",function(){t.handleEnd()}),e.addEventListener("mousedown",function(e){t.handleStart(e)}),e.addEventListener("mousemove",function(e){e.preventDefault(),t.handleMove(e)}),"undefined"!=typeof document&&document.addEventListener("mouseup",function(){t.handleEnd()}))}},o.prototype.handleStart=function(t){var e;return n(this,void 0,void 0,function(){var n,r;return i(this,function(i){switch(i.label){case 0:if(this.isCompleted||this.disabled)return[2];if(!this.isFirstScratch||!this.onceBeforeStartCallback)return[3,5];i.label=1;case 1:return i.trys.push([1,3,,4]),[4,this.onceBeforeStartCallback()];case 2:return!1===i.sent()?[2]:[3,4];case 3:return n=i.sent(),console.error("onceBeforeStart 回调执行出错:",n),[2];case 4:this.isFirstScratch=!1,i.label=5;case 5:if(!this.beforeStartCallback)return[3,9];i.label=6;case 6:return i.trys.push([6,8,,9]),[4,this.beforeStartCallback()];case 7:return!1===i.sent()?[2]:[3,9];case 8:return r=i.sent(),console.error("beforeStart 回调执行出错:",r),[2];case 9:return this.isScratching=!0,null===(e=this.startCallback)||void 0===e||e.call(this),this.drawArc(t),[2]}})})},o.prototype.handleMove=function(t){!this.isScratching||this.isCompleted||this.disabled||this.drawArc(t)},o.prototype.handleEnd=function(){var t;!this.isScratching||this.isCompleted||this.disabled||(this.isScratching=!1,this.checkProgress(),null===(t=this.endCallback)||void 0===t||t.call(this))},o.prototype.drawArc=function(t){var e=this.config.canvasElement;if(e){var n=e.getBoundingClientRect(),i=(t.clientX-n.left)*this.config.dpr,r=(t.clientY-n.top)*this.config.dpr;this.drawArcAt(i,r)}},o.prototype.drawArcAt=function(t,e){this.ctx.globalCompositeOperation="destination-out",this.ctx.beginPath(),this.ctx.arc(t,e,this.scratch.radius*this.config.dpr,0,2*Math.PI),this.ctx.fill(),this.ctx.globalCompositeOperation="source-over"},o.prototype.checkProgress=function(){var t;try{for(var e=this.ctx.getImageData(0,0,this.boxWidth*this.config.dpr,this.boxHeight*this.config.dpr).data,n=0,i=0;i<e.length;i+=4)e[i+3]<128&&n++;this.progress=n/(e.length/4),this.progress>=this.scratch.percent&&(this.isCompleted=!0,this.clearCanvas(),null===(t=this.successCallback)||void 0===t||t.call(this,this.progress))}catch(t){console.error("无法计算刮开进度，可能是因为图片跨域:",t)}},o.prototype.setDisabled=function(t){this.disabled=t},o.prototype.handleTouchStart=function(t,e){var r;return n(this,void 0,void 0,function(){var n,o;return i(this,function(i){switch(i.label){case 0:if(this.isCompleted||this.disabled)return[2];if(!this.isFirstScratch||!this.onceBeforeStartCallback)return[3,5];i.label=1;case 1:return i.trys.push([1,3,,4]),[4,this.onceBeforeStartCallback()];case 2:return!1===i.sent()?[2]:[3,4];case 3:return n=i.sent(),console.error("onceBeforeStart 回调执行出错:",n),[2];case 4:this.isFirstScratch=!1,i.label=5;case 5:if(!this.beforeStartCallback)return[3,9];i.label=6;case 6:return i.trys.push([6,8,,9]),[4,this.beforeStartCallback()];case 7:return!1===i.sent()?[2]:[3,9];case 8:return o=i.sent(),console.error("beforeStart 回调执行出错:",o),[2];case 9:return this.isScratching=!0,null===(r=this.startCallback)||void 0===r||r.call(this),this.drawArcAt(t*this.config.dpr,e*this.config.dpr),[2]}})})},o.prototype.handleTouchMove=function(t,e){!this.isScratching||this.isCompleted||this.disabled||this.drawArcAt(t*this.config.dpr,e*this.config.dpr)},o.prototype.handleTouchEnd=function(){var t;!this.isScratching||this.isCompleted||this.disabled||(this.isScratching=!1,this.checkProgress(),null===(t=this.endCallback)||void 0===t||t.call(this))},o}(function(){function t(t,e){var n=this;this.version=s,this.htmlFontSize=16,this.rAF=function(){},this.boxWidth=0,this.boxHeight=0,"string"==typeof t?t={el:t}:1===t.nodeType&&(t={el:"",divElement:t}),this.config=t,this.data=e,t.flag||(t.flag="WEB"),t.el&&"undefined"!=typeof document&&(t.divElement=document.querySelector(t.el)),t.divElement&&"undefined"!=typeof document&&(t.canvasElement=document.createElement("canvas"),t.divElement.appendChild(t.canvasElement)),t.canvasElement&&(t.ctx=t.canvasElement.getContext("2d"),t.canvasElement.setAttribute("package","".concat("lucky-scratch","@").concat(s)),"function"==typeof t.canvasElement.addEventListener&&t.canvasElement.addEventListener("click",function(t){return n.handleClick(t)})),this.ctx=t.ctx,this.initWindowFunction(),this.config.ctx||console.error("无法获取到 CanvasContext2D"),window&&"function"==typeof window.addEventListener&&window.addEventListener("resize",function(t,e){void 0===e&&(e=300);var n=null;return function(){for(var i=this,r=[],o=0;o<arguments.length;o++)r[o]=arguments[o];n||(n=setTimeout(function(){t.apply(i,r),clearTimeout(n),n=null},e))}}(function(){return n.resize()},300)),window&&window.document&&"function"==typeof window.MutationObserver&&"WEB"===this.config.flag&&new window.MutationObserver(function(){n.resize()}).observe(document.documentElement,{attributes:!0})}return t.prototype.resize=function(){var t,e;null===(e=(t=this.config).beforeResize)||void 0===e||e.call(t),this.setHTMLFontSize(),this.setDpr(),this.resetWidthAndHeight(),this.zoomCanvas()},t.prototype.initLucky=function(){if(this.resize(),!this.boxWidth||!this.boxHeight)return console.error("无法获取到宽度或高度")},t.prototype.handleClick=function(t){},t.prototype.setHTMLFontSize=function(){window&&window.getComputedStyle&&"undefined"!=typeof document&&(this.htmlFontSize=+window.getComputedStyle(document.documentElement).fontSize.slice(0,-2))},t.prototype.clearCanvas=function(){var t=[this.boxWidth,this.boxHeight],e=t[0],n=t[1];this.ctx.clearRect(-e,-n,2*e,2*n)},t.prototype.setDpr=function(){var t=this.config;t.dpr||(window?window.dpr=t.dpr=window.devicePixelRatio||1:t.dpr||console.error(t,"未传入 dpr 可能会导致绘制异常"))},t.prototype.resetWidthAndHeight=function(){var t=this.config,e=this.data,n=0,i=0;t.divElement&&(n=t.divElement.offsetWidth,i=t.divElement.offsetHeight),this.boxWidth=this.getLength(e.width||t.width)||n,this.boxHeight=this.getLength(e.height||t.height)||i,t.divElement&&(t.divElement.style.overflow="hidden",t.divElement.style.width=this.boxWidth+"px",t.divElement.style.height=this.boxHeight+"px")},t.prototype.zoomCanvas=function(){var t=this.config,e=this.ctx,n=t.canvasElement,i=t.dpr,r=[this.boxWidth*i,this.boxHeight*i],o=r[0],s=r[1];n&&(n.width=o,n.height=s,n.style.width="".concat(o,"px"),n.style.height="".concat(s,"px"),n.style["transform-origin"]="left top",n.style.transform="scale(".concat(1/i,")"),e.scale(i,i))},t.prototype.initWindowFunction=function(){var t=this.config;if(window)return this.rAF=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(t){window.setTimeout(t,1e3/60)},t.setTimeout=window.setTimeout,t.setInterval=window.setInterval,t.clearTimeout=window.clearTimeout,void(t.clearInterval=window.clearInterval);if(t.rAF)this.rAF=t.rAF;else if(t.setTimeout){var e=t.setTimeout;this.rAF=function(t){return e(t,16.7)}}else this.rAF=function(t){return setTimeout(t,16.7)}},t.prototype.isWeb=function(){return["WEB","UNI-H5","TARO-H5"].includes(this.config.flag)},t.prototype.loadImg=function(t,e,n){var i=this;return void 0===n&&(n="$resolve"),new Promise(function(r,o){if(t||o("=> '".concat(e.src,"' 不能为空或不合法")),"WEB"!==i.config.flag)return e[n]=r,void(e.$reject=o);var s=new Image;s.crossorigin="anonymous",s.onload=function(){return r(s)},s.onerror=function(){return o("=> '".concat(e.src,"' 图片加载失败"))},s.src=t})},t.prototype.drawImage=function(t,e){for(var n,i,o,s=[],a=2;a<arguments.length;a++)s[a-2]=arguments[a];var c=this.config,h=c.flag,u=c.dpr;if(["WEB","MP-WX"].includes(h))o=e;else{if(!["UNI-H5","UNI-MP","TARO-H5","TARO-MP"].includes(h))return console.error("意料之外的 flag, 该平台尚未兼容!");o=e.path}var l=null===(i=(n=o.canvas||o).getContext)||void 0===i?void 0:i.call(n,"2d");if(l&&!this.isWeb()){s=s.map(function(t){return t*u});var f=l.getImageData.apply(l,s.slice(0,4));t.putImageData.apply(t,r([f],s.slice(4,6)))}else{8===s.length&&(s=s.map(function(t,e){return e<4?t*u:t}));try{t.drawImage.apply(t,r([o],s))}catch(t){}}},t.prototype.computedWidthAndHeight=function(t,e,n,i){if(!e.width&&!e.height)return[t.width,t.height];if(e.width&&!e.height){var r=this.getLength(e.width,n);return[r,t.height*(r/t.width)]}if(!e.width&&e.height){var o=this.getLength(e.height,i);return[t.width*(o/t.height),o]}return[this.getLength(e.width,n),this.getLength(e.height,i)]},t.prototype.changeUnits=function(t,e){var n=this;void 0===e&&(e=1);var i=this.config;return Number(t.replace(/^([-]*[0-9.]*)([a-z%]*)$/,function(t,r,o){var s={"%":function(t){return t*(e/100)},px:function(t){return 1*t},rem:function(t){return t*n.htmlFontSize},vw:function(t){return t/100*window.innerWidth}}[o];if(s)return s(r);var a=i.handleCssUnit||i.unitFunc;return a?a(r,o):r}))},t.prototype.getLength=function(t,e){return o(t,"number")?t:o(t,"string")?this.changeUnits(t,e):0},t.prototype.getOffsetX=function(t,e){return void 0===e&&(e=0),(e-t)/2},t.prototype.getOffscreenCanvas=function(t,e){if(!(n=this,i="_offscreenCanvas",Object.prototype.hasOwnProperty.call(n,i)||(window&&window.document&&"WEB"===this.config.flag?this._offscreenCanvas=document.createElement("canvas"):this._offscreenCanvas=this.config.offscreenCanvas,this._offscreenCanvas)))return console.error("离屏 Canvas 无法渲染!");var n,i,r=this.config.dpr,o=this._offscreenCanvas;o.width=(t||300)*r,o.height=(e||150)*r;var s=o.getContext("2d");return s.clearRect(0,0,t,e),s.scale(r,r),s.dpr=r,{_offscreenCanvas:o,_ctx:s}},t.prototype.$set=function(t,e,n){t&&"object"==typeof t&&p(t,e,n)},t.prototype.$computed=function(t,e,n){var i=this;Object.defineProperty(t,e,{get:function(){return n.call(i)}})},t.prototype.$watch=function(t,e,n){void 0===n&&(n={}),"object"==typeof e&&(e=(n=e).handler);var i=new g(this,t,e,n);return n.immediate&&e.call(this,i.value),function(){}},t.version=s,t}());exports.LuckyScratch=y,exports.cutRound=function(t,e){if("undefined"==typeof document)return console.warn("cutRound: document 不存在，在非浏览器环境中无法使用此功能"),t;var n=document.createElement("canvas"),i=n.getContext("2d"),r=t.width,o=t.height;return n.width=r,n.height=o,function(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];var i=e[0],r=e[1],o=e[2],s=e[3],a=e[4],c=Math.min(o,s),h=Math.PI;a>c/2&&(a=c/2),t.beginPath(),t.moveTo(i+a,r),t.lineTo(i+a,r),t.lineTo(i+o-a,r),t.arc(i+o-a,r+a,a,-h/2,0),t.lineTo(i+o,r+s-a),t.arc(i+o-a,r+s-a,a,0,h/2),t.lineTo(i+a,r+s),t.arc(i+a,r+s-a,a,h/2,h),t.lineTo(i,r+a),t.arc(i+a,r+a,a,h,-h/2),t.closePath()}(i,0,0,r,o,e),i.clip(),i.drawImage(t,0,0,r,o),n},exports.opacity=function(t,e){if("undefined"==typeof document)return console.warn("opacity: document 不存在，在非浏览器环境中无法使用此功能"),t;var n=document.createElement("canvas"),i=n.getContext("2d"),r=t.width,o=t.height;if(n.width=r,n.height=o,"string"==typeof i.filter)i.filter="opacity(".concat(100*e,"%)"),i.drawImage(t,0,0,r,o);else{i.drawImage(t,0,0,r,o);for(var s=i.getImageData(0,0,r,o),a=s.data,c=a.length,h=0;h<c;h+=4){var u=a[h+3];0!==u&&(a[h+3]=u*e)}i.putImageData(s,0,0)}return n};
|
|
17
17
|
//# sourceMappingURL=index.cjs.js.map
|