change docs

docs/README.md

@@ -0,0 +1,399 @@
+## wIoT for NodeJS
+适用于NodeJS的wIoT服务器控制组件，轻松物联
+
+## 先觉条件
+ - 拥有烧录好wIoT固件的**D1 MINI**单片机
+ - 一台或多台无线WiFi路由器2.4G/5G
+ - 局域网内拥有一台装有**NodeJS**的服务器或电脑 (NodeJS装法非常简单, 请自行Google或百度)
+ - 配置好**npm**
+
+## 快速开始
+
+### 单片机接入
+1. 使用MicroUSB, 5V, 或3V pin脚给单片机供电
+2. 用一根导线连接D0脚与3V3脚，持续一秒以上拔出，以重置单片机
+3. 用手机或电脑搜索它的WiFi热点，名称格式`wiot-xx:xx:xx:xx:xx:xx`
+4. 连接上此热点，密码为`1234567890`
+5. 用浏览器打开网址`http://192.168.0.1`，记录网页中的MAC地址，这将用于识别此单片机
+6. 配置你无线路由器的ssid(即wifi名称，注意不能有非ASCII字符，比如汉字)和密码
+7. 配置完成后热点将自动断开，单片机将连接到你的无线路由器
+
+### 依赖安装
+在你的项目文件夹下打开命令行，输入以下指令安装wiot:
+````shell
+$ npm install wiot
+````
+### 使用方法
+在你的项目文件夹中新建一个app.js文件，输入以下内容：
+
+```js
+var wiot = require('wiot'); //引入wiot依赖包
+
+// 新建一个单片机对象
+// 这里使用了两个参数，MAC是单片机的MAC地址，pin中指定需要OUTPUT输出的端口
+// 请自行修改MAC地址的值
+var MyMCU = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx", pin: {D4: wiot.OUTPUT}});
+
+
+// 以下代码将实现，板载led亮1秒，灭1秒的循环
+
+// 等待所有单品即准备就绪
+wiot.begin([MyMCU], ()=>{ // 第一个参数为要等待的单片机对象数组，第二个参数为要执行的函数
+    // 设置计时器，每隔2000毫秒, MyMCU的3号pin口将拉高一次电平
+    setInterval(()=>{
+        MyMCU.write(wiot.D4, wiot.HIGH);
+    }, 2000);
+
+    // 设置计时器，延时1000毫秒后开始执行大括号中指令
+    setTimeout(()=>{
+        // 设置计时器，每隔2000毫秒，MyMCU的3号pin口将拉低一次电平
+        setInterval(()=>{
+            MyMCU.write(wiot.D4, wiot.LOW);
+        }, 2000);
+    }, 1000);
+});
+```
+
+### 开始执行
+在项目文件夹中打开命令行，输入以下指令:
+````shell
+node app.js
+````
+
+### 预期结果
+如果一切顺利，你现在应该会发现你的板载led在闪烁了
+
+
+## 进阶设置
+
+### wiot.client
+
+#### 参数说明
+名称 | 默认值 | 描述
+----|-------|----
+MAC | "" | 单片机的MAC地址
+pin | {D1: 0, D2: 0, D3: 0, D4: 0, D5: 0, D6: 0, D7: 0, D8: 0} | pin脚的模式, 0为INPUT, 1为OUTPUT, 2为INPUT_PULLUP 
+hint | true | 是否显示状态提示
+debug | false | 是否开启debug模式
+ip | "default" | 指定单片机IP, 请在长时间搜索不到IP时尝试此选项
+port | 8848 | Client的TCP Socket通信端口，默认8848
+ip_range | "192.168.0" | IP搜索字段，请在长时间搜索不到IP时尝试此选项
+localIP | "127.0.0.1" | 本机IP
+errDelayTime | 2000 | 遇到网络错误时重试间隔时间(毫秒)
+okDelayTime | 30 | 收到网络请求后延时等待时间(毫秒)
+resetDelayTime | 4500 | 向单片机发送重置指令后多久不再发送新消息(毫秒)
+noTryMaxTime | 15000 | 经过此时间单片机仍未响应则重新发送消息(毫秒)
+IntervalTime | 2000 | 监听行为心跳间隔
+MaxToReScanTime | 180000 | 经过此事件单片机无响应则从新扫描IP地址(毫秒)
+MinResearchTime | 5000 | 搜索IP经过一此轮询后间隔时间(毫秒)
+IpScanTimeout | 1 | IP扫描时的Ping检测超时时间(秒)
+pingTimeout | 2 | 心跳Ping检测的超时时间(秒)
+MaxTraceBackTimes | 8 | 判断连接状态所向前追溯的历史心跳个数
+
+
+例如：
+
+```js
+var MyMCU = new wiot.client({
+    MAC: "xx:xx:xx:xx:xx:xx",
+    pin: {
+        D1: 0,
+        D2: 0,
+        D3: 1,
+        D4: 1,
+        D5: 0,
+        D6: 1,
+        D7: 0,
+        D8: 0
+    },
+    hint: true,
+    debug: false,
+    ip: "192.168.0.55",
+    port: 6666,
+    ip_range: "192.168.0",
+    localIP: "127.0.0.1",
+    errDelayTime: 2000,
+    okDelayTime: 30,
+    resetDelayTime: 4500,
+    noTryMaxTime: 15000,
+    IntervalTime: 2000,
+    MaxToReScanTime: 180000,
+    MinResearchTime: 5000,
+    IpScanTimeOut: 1,
+    pingTimeout: 2,
+    MaxTraceBackTimes: 8
+});
+
+```
+
+
+
+#### 事件绑定
+`.on(event, handler)`
+
+**client事件列表**
+- `begin`  开始于单片机正常交互
+- `disConnected`  与单片机断开连接
+- `reConnected`   与单片机恢复连接
+
+```js
+var MCU = new wiot.client({"MAC": "xx:xx:xx:xx:xx:xx"});
+
+MCU.on('disConnected', function () {
+    // 当与MCU失联时会执行此处指令
+    console.log('Disconnected with MCU!!');
+});
+```
+
+`.pinOn(pin, event, handler)`
+
+**pin事件列表**
+- `on` pin口电位从低到高
+- `off` pin口电位从高到低
+- `change` pin口电位变化
+
+
+```js
+var MCU = new wiot.client({"MAC": "xx:xx:xx:xx:xx:xx"});
+
+MCU.pinOn(wiot.D2, 'on', function () {
+    // 当MCU的D2电位由低到高时会执行
+    console.log('D2 from LOW to HIGH!!');
+});
+```
+
+
+### API
+
++ `wiot.begin()`: 单片机准备完成后开始执行
+
+```js
+MCU0 = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx", pin: {D4: wiot.OUTPUT}});
+MCU1 = new wiot.client({MAC: "xx:xx:xx:xx:xx:ww"});
+
+wiot.begin([MCU0, MCU1], ()=>{
+    //这里放你要执行的指令
+    //这些指令将会在MCU0和MCU1准备就绪后开始执行
+});
+```
+
++ `wiot.loop()`: 循环执行的指令，适合于条件控制语句
+
+```js
+MCU0 = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx", pin: {D4: wiot.OUTPUT}});
+MCU1 = new wiot.client({MAC: "xx:xx:xx:xx:xx:ww"});
+
+// 以下代码将实现: 当MCU0的D5接收到HIGH，MCU1的D4将会输出HIGH
+//                当MCU0的D5接收到LOW, MCU1的D4将会输出LOW
+// 本函数接受两个参数: 第一个是MCU对象数组, 第二个是参数为MCU对象数组的函数
+wiot.loop([MCU0, MCU1], () => {
+    if(MCU1.read(wiot.D5) == wiot.HIGH){
+        MCU0.write(wiot.D4, wiot.HIGH);
+    }else{
+        MCU0.write(wiot.D4, wiot.LOW);
+    }
+});
+
+```
+
+### 注册表
++ `wiot.register.set(status1, status2, function)`: 向注册表中添加一条规则, status可以是值或函数，当status1==status2时会触发function。
+注册表的设计是为了方便协调各扩展模块的使用，详见下文[扩展模块](#传感器扩展模块)。
++ `wiot.register.set(status, function)`: 你也可以传入两个函数，其中status的返回值是bool型，变为true时触发function
+
+```js
+var myLED = wiot.led(MyMCU, wiot.D4);
+var pir = wiot.pir(MyMCU, wiot.D2);
+
+//注册一条规则，当pir探测到人时，myLED亮
+wiot.register.set(pir.getStatus, wiot.HIGH, ()=>{
+    myLED.set(wiot.HIGH);
+});
+
+//注册一条规则，当人离开时，myLED灭
+wiot.register.set(()=>{
+    return (wiot.LOW == pir.getStatus);
+}, ()=>{
+    myLED.clear();
+});
+```
+
+
+## 传感器扩展模块
+
+### LED
++ `wiot.led(MCU, pin)`: 声明一个led模块
++ `wiot.led.getStatus()`: 获取led状态
++ `wiot.led.set(status, time = 0, isSmooth = false)`: 设置led状态，起始状态，中间状态，最终状态，周期
++ `wiot.led.breath(period)`: 设置一个呼吸灯
++ `wiot.led.clear()`: 重置led
+
+```js
+MCU0 = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx", pin: {D4: wiot.OUTPUT}});
+
+var myLED = wiot.led(MCU0, wiot.D4); //新建一个led对象，使用MCU0上的D4口
+
+/* 如果myLED不亮，则点亮它 */
+if(!myLED.getStatus()){
+    myLED.set(wiot.HIGH);
+}
+
+/* 设置一个周期为2秒的呼吸灯 */
+myLED.breath(2000);
+
+/* 设置一个亮三秒，灭四秒的led */
+myLED.set([wiot.HIGH, wiot.LOW], [3000, 4000]);
+
+/* 设置一个呼1秒吸3秒的呼吸渐变灯 */
+myLED.set([wiot.LOW, wiot.HIGH], [1000, 3000], true);
+
+/* 自定义一个先半亮2秒再全亮3秒再熄灭2秒的led灯 */
+myLED.set([100, wiot.HIGH, wiot.LOW], [2000, 3000, 2000]);
+
+/* 熄灭led */
+myLED.clear();
+
+```
+
+### PIR 红外人体传感器
+
++ `wiot.pir(MCU, pin)`: 声明一个PIR模块
++ `wiot.pir.getStatus()`: 获取PIR状态，返回值wiot.HIGH(有人)，wiot.LOW(无人)
+
+#### 事件触发器
++ `wiot.pir.on(event, handler)`
+
+**事件列表**
+- `detected`  探测到人
+- `undetected`  人体移动出探测范围
+- `change`   状态改变，包括有人到无人和无人到有人
+
+```js
+MCU0 = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx"});
+
+var myPIR = wiot.pir(MCU0, wiot.D2); //新建一个pir对象，使用MCU0上的D2口
+
+/* 输出pir状态到控制台 */
+console.log(myPIR.getStatus());
+
+/* 当探测到人，打印 "Detected People!" 到控制台 */
+myPIR.on("detected", ()=>{
+    console.log("Detected People!");
+});
+
+/* 人移动出探测范围，打印 "No People!!" 到控制台 */
+myPIR.on("undetected", ()=>{
+    console.log("No People!!");
+});
+
+/* 当状态改变，执行指令 */
+myPIR.on("change", ()=>{
+    /* 你的指令 */
+});
+
+```
+
+### IR 红外循迹/障碍传感器
+
++ `wiot.ir(MCU, pin)`: 声明一个IR模块，pin可以是模拟或数字端口
++ `wiot.ir.getStatus()`: 获取IR状态，返回值wiot.HIGH(有障碍)，wiot.LOW(无障碍)，或者0-1024数值(限模拟端口)
+
+#### 事件触发器
++ `wiot.ir.on(event, handler)`
+
+**事件列表**
+- `detected`  探测到障碍
+- `undetected`  障碍消失
+- `change`   状态改变
+
+```js
+MCU0 = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx"});
+
+var myPIR = wiot.pir(MCU0, wiot.D2); //新建一个pir对象，使用MCU0上的D2口
+
+/* 输出pir状态到控制台 */
+console.log(myPIR.getStatus());
+
+/* 当探测到人，打印 "Detected People!" 到控制台 */
+myPIR.on("detected", ()=>{
+    console.log("Detected People!");
+});
+
+/* 人移动出探测范围，打印 "No People!!" 到控制台 */
+myPIR.on("undetected", ()=>{
+    console.log("No People!!");
+});
+
+/* 当状态改变，执行指令 */
+myPIR.on("change", ()=>{
+    /* 你的指令 */
+});
+
+```
+
+### lightSensor 光敏传感器
+
++ `wiot.lightSensor(MCU, pin)`: 声明一个lightSensor模块, pin可以是模拟或数字端口
++ `wiot.lightSensor.getStatus()`: 获取lightSensor状态，返回值wiot.HIGH(有光)，wiot.LOW(无光)，或者0-1024数值(限模拟端口)
+
+#### 事件触发器
++ `wiot.light.on(event, handler)`
+
+**事件列表**
+- `light`  由暗到明
+- `dark`  由明到暗
+- `change`   状态改变
+
+```js
+MCU0 = new wiot.client({MAC: "xx:xx:xx:xx:xx:xx"});
+
+var myLightSensor = wiot.lightSensor(MCU0, wiot.D1); //新建一个pir对象，使用MCU0上的D2口
+
+/* 输出LightSensor状态到控制台 */
+console.log(mylightSensor.getStatus());
+
+/* 当由暗到明，打印 "Light!!!" 到控制台 */
+myLightSensor.on("light", ()=>{
+    console.log("Light!");
+});
+
+/* 由明到暗，打印 "Dark!!" 到控制台 */
+myLightSensor.on("dark", ()=>{
+    console.log("Dark!!");
+});
+
+/* 当状态改变，执行指令 */
+myLightSensor.on("change", ()=>{
+    /* 你的指令 */
+});
+```
+
+
+## 网络扩展模块
+
+### mail 邮件模块
+使用本模块向指定邮箱发送邮件。自豪地引用[Yimian API](https://api.yimian.xyz/)构建！
+
++ `wiot.mail(to, from = "wIoT")`: 声明一个mail模块，参数收件地址，发件人名称
++ `wiot.mail.send(subject, body)`: 发送邮件，需传入主题，邮件内容
+
+```js
+var mail = wiot.mail("i@iotcat.me", "wIoT Test");
+
+mail.send("Test", "Test from wiot!!");
+
+```
+
+### guguji 咕咕机模块
+使用本模块向指定咕咕机发送消息。咕咕机是一款便携式私人打印机，详见[官网](https://www.memobird.shop/)。使用本模块需要在官网提前申请好自己的开发者ak, 详见[这里](https://api.yimian.xyz/gugu/intro.php)。自豪地引用[Yimian API](https://api.yimian.xyz/)构建！
+
++ `wiot.guguji(ak, userID, memobirdID)`: 声明一个guguji模块，参数: 开发者ak, 用户id, 咕咕机id
++ `wiot.guguji.send(msg)`: 发送消息，需传入待发送的消息
+
+```js
+var gugu = wiot.guguji("9e55121803474371bfa25d20e554b31f", "832598", "b3ee06a8bd9b49e1");
+
+gugu.print("This is from wIoT!!");
+
+```
+

docs/config.js

@@ -0,0 +1,71 @@
+const langs = [
+    { title: 'English', path: '/home', matchPath: /^\/(home|ecosystem|support)/ },
+    { title: '简体中文', path: '/zh-Hans/', matchPath: /^\/zh-Hans/ },
+];
+
+docute.init({
+    landing: 'landing.html',
+    title: 'wIoT',
+    repo: 'iotcat/wIoT',
+    twitter: 'wiott',
+    'edit-link': 'https://github.com/iotcat/wiot/docs',
+    nav: {
+        default: [
+            {
+                title: 'Home', path: '/home'
+            },
+            {
+                title: 'Ecosystem', path: '/ecosystem'
+            },
+            {
+                title: 'Support DPlayer', path: '/support'
+            },
+            {
+                title: 'Languages', type: 'dropdown', items: langs
+            }
+        ],
+        'zh-Hans': [
+            {
+                title: '首页', path: '/zh-Hans/'
+            },
+            {
+                title: '生态', path: '/zh-Hans/ecosystem'
+            },
+            {
+                title: '支持 DPlayer', path: '/zh-Hans/support'
+            },
+            {
+                title: '选择语言', type: 'dropdown', items: langs
+            }
+        ],
+    },
+    plugins: [
+        docsearch({
+            apiKey: '46a8ba306e368972c1d75feb581fb430',
+            indexName: 'wiot',
+            tags: ['english', 'zh-Hans'],
+            url: 'http://wiot.eee.dog'
+        }),
+        evanyou()
+    ]
+});
+
+function loadScript (src, callback) {
+    let s,
+        r,
+        t;
+    r = false;
+    s = document.createElement('script');
+    s.type = 'text/javascript';
+    s.src = src;
+    s.onload = s.onreadystatechange = function () {
+    // console.log( this.readyState ); //uncomment this line to see which ready states are called.
+        if (!r && (!this.readyState || this.readyState == 'complete'))
+        {
+            r = true;
+            callback();
+        }
+    };
+    t = document.getElementsByTagName('script')[0];
+    t.parentNode.insertBefore(s, t);
+}

docs/ecosystem.md

@@ -0,0 +1,63 @@
+---
+search: english
+---
+
+# Ecosystem
+
+Let's make DPlayer better, feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31)
+
+## Help
+
+### Joining the Discussion
+
+- [Telegram Group](https://t.me/adplayer)
+
+### Creating issue
+
+- [MoePlayer/DPlayer/issues](https://github.com/MoePlayer/DPlayer/issues)
+
+## Related Projects
+
+### Tooling
+
+- [DPlayer-thumbnails](https://github.com/MoePlayer/DPlayer-thumbnails): generate video thumbnails
+
+### Danamku api
+
+- [DPlayer-node](https://github.com/MoePlayer/DPlayer-node): Node.js
+- [laravel-danmaku](https://github.com/MoePlayer/laravel-danmaku): PHP
+- [dplayer-live-backend](https://github.com/Izumi-kun/dplayer-live-backend): Node.js, WebSocket live backend
+- [RailsGun](https://github.com/MoePlayer/RailsGun): Ruby
+
+### Plugins
+
+- [DPlayer-for-typecho](https://github.com/volio/DPlayer-for-typecho): Typecho
+- [Hexo-tag-dplayer](https://github.com/NextMoe/hexo-tag-dplayer): Hexo
+- [DPlayer_for_Z-BlogPHP](https://github.com/fghrsh/DPlayer_for_Z-BlogPHP): Z-BlogPHP
+- [DPlayer for Discuz!](https://coding.net/u/Click_04/p/video/git): Discuz!
+- [DPlayer for WordPress](https://github.com/BlueCocoa/DPlayer-WordPress): WordPress
+- [DPlayerHandle](https://github.com/kn007/DPlayerHandle): WordPress
+- [Vue-DPlayer](https://github.com/sinchang/vue-dplayer): Vue
+- [react-dplayer](https://github.com/hnsylitao/react-dplayer): React
+
+### Other
+
+- [DPlayer-Lite](https://github.com/kn007/DPlayer-Lite): lite version
+- [hlsjs-p2p-engine](https://github.com/cdnbye/hlsjs-p2p-engine)
+
+## Who use DPlayer?
+
+- [小红书](https://www.xiaohongshu.com/): 中国最大的生活社区分享平台，同时也是发现全球好物的电商平台
+- [极客时间](https://time.geekbang.org/): 极客邦科技出品的一款 IT 内容知识服务 App
+- [嘀哩嘀哩](http://www.dilidili.wang/): 兴趣使然的无名小站（D站）
+- [银色子弹](https://www.sbsub.com/): 银色子弹，简称银弹，由多数柯南热爱者聚集在一起的组织
+- [浙江大学CC98论坛](https://zh.wikipedia.org/wiki/CC98%E8%AE%BA%E5%9D%9B): 浙江大学校网内规模最大的论坛，中国各大学中较活跃的BBS之一
+- [纸飞机南航青年网络社区](http://my.nuaa.edu.cn/video-video.html): 南京航空航天大学门户网站
+- [otomads](https://otomads.com/): 专注于音MAD的视频弹幕网站
+- [Cloudreve](https://github.com/HFO4/Cloudreve): 基于ThinkPHP构建的网盘系统
+
+## Contributors
+
+This project exists thanks to all the people who contribute.
+
+<a href="https://github.com/MoePlayer/DPlayer/graphs/contributors"><img src="https://opencollective.com/DPlayer/contributors.svg?width=890" /></a>

docs/index.html

@@ -1,212 +1,35 @@
 <!DOCTYPE html>
 <html>
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
+  <title>wIoT | Free IoT</title>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docute@3.4.12/dist/docute.css">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docute@3.4.12/dist/theme-github.css" />
+  <!-- Global site tag (gtag.js) - Google Analytics -->
 
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
-        <meta name="renderer" content="webkit">
-        <title>wIoT | 轻松物联</title>
-        <link rel="stylesheet" type="text/css" href="amWiki/css/markdownbody.github.css" />
-        <link rel="stylesheet" type="text/css" href="amWiki/css/lhjs.github-gist.css" />
-        <link rel="stylesheet" type="text/css" href="amWiki/css/amWiki.css" />
-        
-    </head>
-
-    <body>
-        <!-- 头部 -->
-        <header class="header">
-            <div class="header-inner">
-                <a class="logo" href="?file=首页">
-                    <img src="amWiki/images/logo.png" /><i></i>
-                    <b>wIoT 开发文档</b>
-                    <span>by Group A22</span>
-                </a>
-                <div class="menu-icon" id="menuIcon">
-                    <svg>
-                        <use xlink:href="#icon:navStart"></use>
-                    </svg>
-                </div>
-            </div>
-        </header>
-        <!-- 页面 -->
-        <div class="container" id="container">
-            <div class="nav" id="nav">
-                <div class="menu-filter">
-                    <svg>
-                        <use xlink:href="#icon:navFilter"></use>
-                    </svg>
-                    <input type="text" id="menuFilter" value="" placeholder="请输入筛选条件" title="请输入筛选条件" />
-                    <i class="off" title="清空筛选">&times;</i>
-                </div>
-                <div class="menu-search" id="searchShow" title="全库搜索">
-                    <svg>
-                        <use xlink:href="#icon:search"></use>
-                    </svg>
-                </div>
-                <nav class="menubar scroller" id="menuBar" data-x-rolling="true">
-                    <div class="scroller-inner">
-                        <div class="scroller-content"></div>
-                    </div>
-                </nav>
-            </div>
-            <div class="main scroller" id="main">
-                <div class="main-inner scroller-inner">
-                    <!-- 正文 -->
-                    <article class="markdown-body scroller-content" id="view"></article>
-                    <script id="template:footnote" type="text/html">
-                        <sup><a href="#fn:foot{{index}}" name="fn:note{{index}}" title="{{title}}">[{{index}}]</a></sup>
-                        <ol class="footnote"><i>[参考资料]：</i>{{list}}</ol>
-                        <li id="fn:foot{{index}}">{{content}} {{back}}</li>
-                        <li class="footnote-none" data-msg="匹配缺失">{{content}}</li>
-                        <a href="#fn:note{{index}}">
-                            <svg>
-                                <use xlink:href="#icon:footnoteBack"></use>
-                            </svg>
-                        </a>
-                    </script>
-                    <!-- 上下翻页 -->
-                    <div class="main-sibling scroller-content" id="mainSibling">
-                        <p><span>上一篇：</span>
-                            <a href="#"></a>
-                        </p>
-                        <p><span>下一篇：</span>
-                            <a href="#"></a>
-                        </p>
-                    </div>
-                    <!-- 全库搜索 -->
-                    <div class="search-box" id="searchBox">
-                        <div class="search-update">
-                            <input type="button" id="searchUpdate" value="更新所有缓存" />
-                            <div class="text">
-                                <p>上次完全更新：<time id="cacheLasttime">0000-00-00 00:00:00</time></p>
-                                <p>文档总数：<b id="cacheDocTotal">0</b> <i>/</i> <span>已缓存：<i id="cacheState">0%</i></span></p>
-                            </div>
-                        </div>
-                        <h2>全库搜索</h2>
-                        <div class="search-input">
-                            <input type="text" id="searchText" placeholder="请输入搜索内容" />
-                            <input type="button" id="search" value="搜 索" />
-                        </div>
-                        <div class="search-results" id="results">
-                            <div class="search-result-message" id="resultMsg"></div>
-                            <ul class="search-list"></ul>
-                            <div class="search-result-more" id="resultMore">显示更多</div>
-                            <script id="template:searchResult" type="text/html">
-                                <li class="search-item">
-                                    <a href="?file={{path}}">
-                                        <div class="content">
-                                            <strong>{{title}}</strong> {{api}} {{content}}
-                                        </div>
-                                        <div class="bottom">
-                                            <p>位置：<span>{{path}}</span></p>
-                                            <div class="time">最后缓存于
-                                                <time>{{time}}</time>
-                                            </div>
-                                        </div>
-                                    </a>
-                                </li>
-                            </script>
-                        </div>
-                    </div>
-                    <!-- 接口测试 -->
-                    
-                </div>
-            </div>
-        </div>
-        <aside>
-            <!-- 侧边目录 -->
-            <div class="contents" id="contents">
-                <div class="btn">
-                    <svg>
-                        <use xlink:href="#icon:contents"></use>
-                    </svg>
-                    <span>目录</span>
-                </div>
-                <div class="contents-list">
-                    <p>
-                        <a id="contentsTitle" href="#客户日志流水接口示例">客户日志流水接口示例</a>
-                    </p>
-                    <div class="markdown-contents"></div>
-                </div>
-            </div>
-            <!-- 返回顶部 -->
-            <div class="back-top" id="backTop">
-                <a class="back-icon" href="#">
-                    <svg>
-                        <use xlink:href="#icon:backTop"></use>
-                    </svg>
-                </a>
-                <a class="back-text" href="#">返回顶部</a>
-            </div>
-        </aside>
-        <!-- 图片预览 -->
-        <section class="imgsv" id="imgsView">
-            <div class="imgsv-background"></div>
-            <div class="imgsv-view" id="imgsViewInner"></div>
-            <ul class="imgsv-panel">
-                <li class="prev off">Prev</li>
-                <li class="next">Next</li>
-                <li class="original">1:1</li>
-                <li class="suit">适合</li>
-            </ul>
-        </section>
-        <footer>
-            <!-- 签名 -->
-            <div class="signature">Powered by
-                <a href="https://github.com/TevinLi/amWiki" target="_blank">amWiki</a>
-            </div>
-        </footer>
-        <!-- mounts -->
-        <div class="hidden" aw-include="mountLinks">
-            <script>AWConfig={"name":"amWiki轻文库","version":"by Tevin","logo":"amWiki/images/logo.png","testing":false,"colour":"#4296eb","pageMounts":false,"githubUrl":"","libraryPrefix":""}</script>
-        </div>
-        <!-- js -->
-        <div class="hidden">
-            <script type="text/javascript" src="amWiki/js/gbk.js"></script>
-            <script type="text/javascript" src="amWiki/js/pinyin.js"></script>
-            <script type="text/javascript" src="amWiki/js/jquery-compat-3.1.0.min.js"></script>
-            <script type="text/javascript" src="amWiki/js/marked.min.js"></script>
-            <script type="text/javascript" src="amWiki/js/highlight.pack.js"></script>
-            <script type="text/javascript" src="amWiki/js/raphael-min.js"></script>
-            <script type="text/javascript" src="amWiki/js/flowchart.min.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.tools.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.storage.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.search.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.search.worker.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.docs.js"></script>
-            
-            <script type="text/javascript" src="amWiki/js/amWiki.scrollbar.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.imgsView.js"></script>
-            <script type="text/javascript" src="amWiki/js/amWiki.js"></script>
-            
-        </div>
-        <!-- svg -->
-        <div class="hidden" id="svgSymbols"></div>
-        <!-- 低版本浏览器警告 -->
-        <div id="lowBrowser">
-            <div></div>
-            <p><span>您的浏览器版本过低，不支持浏览本Wiki，请升级或更换您的浏览器再试！</span></p>
-            <script>
-                (function(win) {
-                    var notice = document.getElementById('lowBrowser');
-                    //jQuery 3.x 需要 addEventListener 方法支持
-                    if(typeof win.addEventListener == 'undefined') {
-                        notice.style.display = 'block';
-                    } else {
-                        var comments = notice.previousSibling;
-                        if(comments.nodeType == 8) {
-                            comments.parentNode.removeChild(comments);
-                        } else if(comments.previousSibling.nodeType == 8) {
-                            comments = comments.previousSibling;
-                            comments.parentNode.removeChild(comments);
-                        }
-                        notice.parentNode.removeChild(notice);
-                    }
-                    notice = comments = null;
-                })(window);
-            </script>
-        </div>
-    </body>
-
-</html>
+  <style>
+    body {
+      text-rendering: auto;
+    }
+    #evanyou-canvas {
+      z-index: -1 !important;
+    }
+    .dplayer-wrap {
+      max-width: 700px;
+      margin: 20px 0;
+    }
+  </style>
+</head>
+<body>
+  <!-- don't remove this part start -->
+  <div id="app"></div>
+  <script src="https://cdn.jsdelivr.net/npm/docute@3.4.12/plugins/docsearch.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/docute-evanyou/dist/evanyou.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/docute@3.4.12/dist/docute.js"></script>
+  <script src="./config.js"></script>
+  <!-- livereload script placeholder -->
+  <!-- don't remove this part end -->
+</body>
+</html>

docs/landing.html

@@ -0,0 +1,80 @@
+<h1>wIoT</h1>
+<br/><br/>
+<h3>🍭 Wow, such a lovely IoT system.</h3>
+
+
+<div class="landing-buttons">
+    <a class="landing-button" target="_blank" href="https://github.com/iotcat/wiot">
+        GitHub
+    </a>
+
+    <a class="landing-button" router-link="/home">
+        Docs
+    </a>
+</div>
+
+<style>
+    h1 {
+        margin: 0;
+        margin-top: -50px;
+        font-weight: normal;
+        font-size: 40px;
+        letter-spacing: 1px;
+    }
+
+    h3 {
+        margin-top: 20px;
+        color: #999;
+        font-weight: normal;
+        letter-spacing: 1px;
+    }
+
+    .landing {
+        padding: 10px;
+        display: -webkit-box;
+        display: -ms-flexbox;
+        display: flex;
+        -webkit-box-align: center;
+        -ms-flex-align: center;
+        align-items: center;
+        -webkit-box-pack: center;
+        -ms-flex-pack: center;
+        justify-content: center;
+        -webkit-box-orient: vertical;
+        -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+        flex-direction: column;
+        height: 100%;
+        -webkit-user-select: none;
+        user-select: none;
+    }
+
+    .features {
+        margin-top: 20px;
+        margin-bottom: 10px;
+        font-size: 16px;
+        line-height: 1.7;
+    }
+
+    .landing-button {
+        border: 1px solid #ccc;
+        border-radius: 33px;
+        padding: 10px 30px;
+        background-color: white;
+        display: inline-block;
+        margin-right: 20px;
+        color: #333;
+    }
+
+    .landing-button:hover {
+        border-color: #42b983;
+        color: #42b983;
+        text-decoration: none;
+    }
+
+    .dplayer-wrap {
+        max-width: 600px;
+        margin: 20px 0 40px;
+        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+    }
+</style>

docs/old/index.html

@@ -0,0 +1,212 @@
+<!DOCTYPE html>
+<html>
+
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+        <meta name="renderer" content="webkit">
+        <title>wIoT | 轻松物联</title>
+        <link rel="stylesheet" type="text/css" href="amWiki/css/markdownbody.github.css" />
+        <link rel="stylesheet" type="text/css" href="amWiki/css/lhjs.github-gist.css" />
+        <link rel="stylesheet" type="text/css" href="amWiki/css/amWiki.css" />
+        
+    </head>
+
+    <body>
+        <!-- 头部 -->
+        <header class="header">
+            <div class="header-inner">
+                <a class="logo" href="?file=首页">
+                    <img src="amWiki/images/logo.png" /><i></i>
+                    <b>wIoT 开发文档</b>
+                    <span>by Group A22</span>
+                </a>
+                <div class="menu-icon" id="menuIcon">
+                    <svg>
+                        <use xlink:href="#icon:navStart"></use>
+                    </svg>
+                </div>
+            </div>
+        </header>
+        <!-- 页面 -->
+        <div class="container" id="container">
+            <div class="nav" id="nav">
+                <div class="menu-filter">
+                    <svg>
+                        <use xlink:href="#icon:navFilter"></use>
+                    </svg>
+                    <input type="text" id="menuFilter" value="" placeholder="请输入筛选条件" title="请输入筛选条件" />
+                    <i class="off" title="清空筛选">&times;</i>
+                </div>
+                <div class="menu-search" id="searchShow" title="全库搜索">
+                    <svg>
+                        <use xlink:href="#icon:search"></use>
+                    </svg>
+                </div>
+                <nav class="menubar scroller" id="menuBar" data-x-rolling="true">
+                    <div class="scroller-inner">
+                        <div class="scroller-content"></div>
+                    </div>
+                </nav>
+            </div>
+            <div class="main scroller" id="main">
+                <div class="main-inner scroller-inner">
+                    <!-- 正文 -->
+                    <article class="markdown-body scroller-content" id="view"></article>
+                    <script id="template:footnote" type="text/html">
+                        <sup><a href="#fn:foot{{index}}" name="fn:note{{index}}" title="{{title}}">[{{index}}]</a></sup>
+                        <ol class="footnote"><i>[参考资料]：</i>{{list}}</ol>
+                        <li id="fn:foot{{index}}">{{content}} {{back}}</li>
+                        <li class="footnote-none" data-msg="匹配缺失">{{content}}</li>
+                        <a href="#fn:note{{index}}">
+                            <svg>
+                                <use xlink:href="#icon:footnoteBack"></use>
+                            </svg>
+                        </a>
+                    </script>
+                    <!-- 上下翻页 -->
+                    <div class="main-sibling scroller-content" id="mainSibling">
+                        <p><span>上一篇：</span>
+                            <a href="#"></a>
+                        </p>
+                        <p><span>下一篇：</span>
+                            <a href="#"></a>
+                        </p>
+                    </div>
+                    <!-- 全库搜索 -->
+                    <div class="search-box" id="searchBox">
+                        <div class="search-update">
+                            <input type="button" id="searchUpdate" value="更新所有缓存" />
+                            <div class="text">
+                                <p>上次完全更新：<time id="cacheLasttime">0000-00-00 00:00:00</time></p>
+                                <p>文档总数：<b id="cacheDocTotal">0</b> <i>/</i> <span>已缓存：<i id="cacheState">0%</i></span></p>
+                            </div>
+                        </div>
+                        <h2>全库搜索</h2>
+                        <div class="search-input">
+                            <input type="text" id="searchText" placeholder="请输入搜索内容" />
+                            <input type="button" id="search" value="搜 索" />
+                        </div>
+                        <div class="search-results" id="results">
+                            <div class="search-result-message" id="resultMsg"></div>
+                            <ul class="search-list"></ul>
+                            <div class="search-result-more" id="resultMore">显示更多</div>
+                            <script id="template:searchResult" type="text/html">
+                                <li class="search-item">
+                                    <a href="?file={{path}}">
+                                        <div class="content">
+                                            <strong>{{title}}</strong> {{api}} {{content}}
+                                        </div>
+                                        <div class="bottom">
+                                            <p>位置：<span>{{path}}</span></p>
+                                            <div class="time">最后缓存于
+                                                <time>{{time}}</time>
+                                            </div>
+                                        </div>
+                                    </a>
+                                </li>
+                            </script>
+                        </div>
+                    </div>
+                    <!-- 接口测试 -->
+                    
+                </div>
+            </div>
+        </div>
+        <aside>
+            <!-- 侧边目录 -->
+            <div class="contents" id="contents">
+                <div class="btn">
+                    <svg>
+                        <use xlink:href="#icon:contents"></use>
+                    </svg>
+                    <span>目录</span>
+                </div>
+                <div class="contents-list">
+                    <p>
+                        <a id="contentsTitle" href="#客户日志流水接口示例">客户日志流水接口示例</a>
+                    </p>
+                    <div class="markdown-contents"></div>
+                </div>
+            </div>
+            <!-- 返回顶部 -->
+            <div class="back-top" id="backTop">
+                <a class="back-icon" href="#">
+                    <svg>
+                        <use xlink:href="#icon:backTop"></use>
+                    </svg>
+                </a>
+                <a class="back-text" href="#">返回顶部</a>
+            </div>
+        </aside>
+        <!-- 图片预览 -->
+        <section class="imgsv" id="imgsView">
+            <div class="imgsv-background"></div>
+            <div class="imgsv-view" id="imgsViewInner"></div>
+            <ul class="imgsv-panel">
+                <li class="prev off">Prev</li>
+                <li class="next">Next</li>
+                <li class="original">1:1</li>
+                <li class="suit">适合</li>
+            </ul>
+        </section>
+        <footer>
+            <!-- 签名 -->
+            <div class="signature">Powered by
+                <a href="https://github.com/TevinLi/amWiki" target="_blank">amWiki</a>
+            </div>
+        </footer>
+        <!-- mounts -->
+        <div class="hidden" aw-include="mountLinks">
+            <script>AWConfig={"name":"amWiki轻文库","version":"by Tevin","logo":"amWiki/images/logo.png","testing":false,"colour":"#4296eb","pageMounts":false,"githubUrl":"","libraryPrefix":""}</script>
+        </div>
+        <!-- js -->
+        <div class="hidden">
+            <script type="text/javascript" src="amWiki/js/gbk.js"></script>
+            <script type="text/javascript" src="amWiki/js/pinyin.js"></script>
+            <script type="text/javascript" src="amWiki/js/jquery-compat-3.1.0.min.js"></script>
+            <script type="text/javascript" src="amWiki/js/marked.min.js"></script>
+            <script type="text/javascript" src="amWiki/js/highlight.pack.js"></script>
+            <script type="text/javascript" src="amWiki/js/raphael-min.js"></script>
+            <script type="text/javascript" src="amWiki/js/flowchart.min.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.tools.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.storage.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.search.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.search.worker.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.docs.js"></script>
+            
+            <script type="text/javascript" src="amWiki/js/amWiki.scrollbar.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.imgsView.js"></script>
+            <script type="text/javascript" src="amWiki/js/amWiki.js"></script>
+            
+        </div>
+        <!-- svg -->
+        <div class="hidden" id="svgSymbols"></div>
+        <!-- 低版本浏览器警告 -->
+        <div id="lowBrowser">
+            <div></div>
+            <p><span>您的浏览器版本过低，不支持浏览本Wiki，请升级或更换您的浏览器再试！</span></p>
+            <script>
+                (function(win) {
+                    var notice = document.getElementById('lowBrowser');
+                    //jQuery 3.x 需要 addEventListener 方法支持
+                    if(typeof win.addEventListener == 'undefined') {
+                        notice.style.display = 'block';
+                    } else {
+                        var comments = notice.previousSibling;
+                        if(comments.nodeType == 8) {
+                            comments.parentNode.removeChild(comments);
+                        } else if(comments.previousSibling.nodeType == 8) {
+                            comments = comments.previousSibling;
+                            comments.parentNode.removeChild(comments);
+                        }
+                        notice.parentNode.removeChild(notice);
+                    }
+                    notice = comments = null;
+                })(window);
+            </script>
+        </div>
+    </body>
+
+</html>