Skip to content

Commit 954478a

Browse files
MemoryShadowMemoryShadow
committed
README新增对Loading.js的描述.
Loading.js支持链式调用功能
1 parent 0372d36 commit 954478a

2 files changed

Lines changed: 139 additions & 5 deletions

File tree

‎Template/Public/JavaScript/Loading.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
* @Date : 2020-12-25 20:36:22
33
* @Author : MemoryShadow
44
* @LastEditors : MemoryShadow
5-
* @LastEditTime : 2020-12-25 23:14:05
5+
* @LastEditTime : 2020-12-26 18:01:16
66
* @Description : 创建一个正在加载的界面
77
*/
88

@@ -77,19 +77,17 @@ function Loading_Control(ID) {
7777
// 设置最大进度
7878
this.setSchedule = function (Percentage) {
7979
this.Schedule = Percentage;
80+
return this;
8081
}
8182
// 将百分比数值转换为开源用于显示的数值
8283
this.PercentageValue2ShowValue = function (params) {
8384
switch (params) {
8485
case 100:
8586
return 2;
86-
break;
8787
case 0:
8888
return 0;
89-
break;
9089
default:
9190
return (100 - params) / 100 * 2;
92-
break;
9391
}
9492
}
9593
// 渲染
@@ -116,20 +114,21 @@ function Loading_Control(ID) {
116114
this.startID = setInterval(function (ID) {
117115
Loading_Control.indexOf(ID).Refresh();
118116
}, 50, this.canvasIndex);
117+
return this;
119118
}
120119
// 停止
121120
this.stop = function (e) {
122121
this.ClickFlag = -1;
123122
clearInterval(this.startID);
124123
this.startID = 0;
124+
return this;
125125
}
126126
// 设置事件接收器
127127
this.onClick = function (value) {
128128
// 如果是false或者0, 就设数据为0,并且在移除监听器后退出
129129
if (value === false) {
130130
this.ClickFlag = 0;
131131
this.loading_canvas.onclick = null;
132-
return true;
133132
} else {
134133
// 就检测值,如果此时为负数就执行start,如果此时为正数,就执行stop
135134
// 重新设置监听器
@@ -138,6 +137,7 @@ function Loading_Control(ID) {
138137
};
139138
this.ClickFlag < 0 ? this.start() : this.stop();
140139
}
140+
return this;
141141
}
142142
// 执行代码
143143
return this.Init(ID);

‎Template/Public/JavaScript/README.md‎

Lines changed: 134 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,9 @@
1616
## 索引
1717

1818
* [3DBox](#3DBox)
19+
* [Loading](#Loading)
1920
* [Minecraft Texture](#Minecraft-Texture)
21+
* [Tools](#Tools)
2022

2123
****
2224

@@ -117,6 +119,133 @@
117119
}
118120
```
119121

122+
## Loading
123+
124+
这里是关于文件[Loading.js](https://github.com/MemoryShadow/MemoryShadow.github.io/blob/master/Template/Public/JavaScript/Loading.js "访问源代码")
125+
的详细介绍.
126+
127+
此文件包含了一个类`Loading_Control`,该类接受以下参数作为构造器:
128+
129+
|参数|类型|描述|用途|
130+
|---|---|---|---
131+
|ID|string|要作为加载控件的`canvas`节点ID|通过此ID,将会将指定的节点设为`Loading`等待控件|
132+
133+
此类还有一些预设的成员:
134+
135+
|成员类型|成员名|表达式类型|用途/功能|
136+
|---|---|---|---|
137+
|属性|loading_canvas|Object|储存了指定`canvas`节点的**控制**对象|
138+
|属性|ctx|Object|储存了指定`canvas`节点的**绘制**对象|
139+
|属性|Schedule|Number|储存了可以表达的最大百分比|
140+
|属性|startID|String|储存了周期任务的任务ID|
141+
|属性|canvasID|String|储存了指定`canvas`的ID|
142+
|属性|canvasIndex|Number|指明自身在内部维护的储存库中的编号|
143+
|属性|ClickFlag|Number|控件动画播放的状态|
144+
|方法|[Init_CTX](#Loading.Init_CTX "详细信息")|Object|初始化内部的绘图对象`ctx`,返回`this.ctx`|
145+
|方法|[Init](#Loading.Init "详细信息")|Object|初始化自身,会自动调用`this.Init_CTX`,返回`this`|
146+
|方法|[setSchedule](#Loading.setSchedule "详细信息")|Object|直接设定`Schedule`的值,返回`this`|
147+
|方法|[PercentageValue2ShowValue](#Loading.PercentageValue2ShowValue "详细信息")|Number|将百分比的值转换为用于显示的值|
148+
|方法|[Refresh](#Loading.Refresh "详细信息")|void|根据配置渲染页面|
149+
|方法|[start](#Loading.start "详细信息")|Object|开始动画,返回`this`|
150+
|方法|[stop](#Loading.stop "详细信息")|Object|停止动画,返回`this`|
151+
|方法|[onClick](#Loading.onClick "详细信息")|Object|如果传参为非`false`就认为是开启点击事件响应功能,返回`this`|
152+
|静态方法|[indexOf](#Loading.static-indexOf "详细信息")|Object|取得指定的`Loading_Control`对象|
153+
154+
### Loading.Init_CTX
155+
156+
>初始化内部的绘图对象`ctx`
157+
158+
* 返回值:`canvas`绘制控制对象
159+
160+
### Loading.Init
161+
162+
>初始化自身,会自动调用`this.Init_CTX`
163+
164+
参数列表:
165+
|参数名|参数类型|参数描述|
166+
|---|---|---|
167+
|ID|String|要指定的控件ID|
168+
169+
* 返回值:所在对象自身
170+
171+
### Loading.setSchedule
172+
173+
>直接设定`Schedule`的值
174+
175+
参数列表:
176+
|参数名|参数类型|参数描述|
177+
|---|---|---|
178+
|Percentage|Number|要设定的最大进度|
179+
180+
* 返回值:所在对象自身
181+
182+
### Loading.PercentageValue2ShowValue
183+
184+
>将百分比的值转换为用于显示的系数
185+
186+
* 返回值:用于显示的公式系数之一,在内部参与运算
187+
188+
### Loading.Refresh
189+
190+
>根据配置渲染页面
191+
192+
* 返回值:无返回值
193+
194+
### Loading.start
195+
196+
>开始动画
197+
198+
* 返回值:所在对象自身
199+
200+
### Loading.stop
201+
202+
>停止动画
203+
204+
* 返回值:所在对象自身
205+
206+
### Loading.onClick
207+
208+
>如果传参为非`false`就认为是开启点击事件响应功能
209+
210+
参数列表:
211+
|参数名|参数类型|参数描述|
212+
|---|---|---|
213+
|value|Boolean|如果传入`false`,将会关闭此事件监听器,反之`true`就是打开|
214+
215+
* 返回值:所在对象自身
216+
217+
### Loading.static-indexOf
218+
219+
>取得指定的`Loading_Control`对象
220+
221+
参数列表:
222+
|参数名|参数类型|参数描述|
223+
|---|---|---|
224+
|index|Number/String|依据指定的索引编号或者`canvas`节点的ID,返回对应的`Loading_Control`对象|
225+
226+
* 返回值:指定的对象
227+
228+
### Loading 示例
229+
230+
HTML:
231+
232+
```HTML
233+
...
234+
<canvas id="loading_canvas">
235+
Your browser does not support the canvas element.
236+
</canvas>
237+
...
238+
```
239+
240+
JavaScript:
241+
242+
```JavaScript
243+
...
244+
var loading_Control = new Loading_Control("loading_canvas");
245+
loading_Control.setSchedule(95).onClick(true).start();
246+
...
247+
```
248+
120249
## Minecraft Texture
121250

122251
这里是关于文件[MinecraftTexture.js](https://github.com/MemoryShadow/MemoryShadow.github.io/blob/master/Template/Public/JavaScript/MinecraftTexture.js "访问源代码")
@@ -131,3 +260,8 @@ data:image/png;base64,' + TextureList['dirt']
131260
```
132261
133262
* 里面有好多图标,不定期更新到最新版(其实我在等1.16)
263+
264+
## Tools
265+
266+
这里是关于文件[Tools.js](https://github.com/MemoryShadow/MemoryShadow.github.io/blob/master/Template/Public/JavaScript/Tools.js "访问源代码")
267+
的详细介绍.

0 commit comments

Comments
 (0)