Docs: support

README.md

@@ -3,7 +3,7 @@
 </p>
 <h1 align="center">DPlayer</h1>
 
-> Wow, such a lovely HTML5 danmaku video player
+> 🍭 Wow, such a lovely HTML5 danmaku video player
 
 [![npm](https://img.shields.io/npm/v/dplayer.svg?style=flat-square)](https://www.npmjs.com/package/dplayer)
 [![npm](https://img.shields.io/npm/l/dplayer.svg?style=flat-square)](https://github.com/MoePlayer/DPlayer/blob/master/LICENSE)
@@ -41,142 +41,94 @@ DPlayer is a lovely HTML5 danmaku video player to help people build video and da
 
 Using DPlayer on your project? [Let me know!](https://github.com/DIYgod/DPlayer/issues/31)
 
-**[Demo](http://dplayer.js.org/)**
+**[Docs](http://dplayer.js.org)**
 
-**[Docs](http://dplayer.js.org/docs)**
+**[中文文档](http://dplayer.js.org/#/zh-Hans/)**
 
-## Install
+## Join the Discussion
 
-```
-$ npm install dplayer --save
-```
+- [Telegram Group](https://t.me/adplayer)
+- [QQ Group](https://shang.qq.com/wpa/qunwpa?idkey=bf22213ae0028a82e5adf3f286dfd4f01e0997dc9f1dcd8e831a0a85e799be17): 415835947
 
-## Quick Start
+## Related Projects
 
-```html
-<link rel="stylesheet" href="dist/DPlayer.min.css">
-<div id="player1"></div>
-<script src="dist/DPlayer.min.js"></script>
-```
+Feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31)
 
-```js
-var dp = new DPlayer({
-    element: document.getElementById('player1'),
-    video: {
-        url: 'dplayer.mp4',
-        pic: 'dplayer.png'
-    },
-    danmaku: {
-        id: 'testid',
-        api: 'https://api.prprpr.me/dplayer/'
-    }
-});
-```
+### Tooling
 
-## Usage
+- [DPlayer-thumbnails](https://github.com/MoePlayer/DPlayer-thumbnails): generate video thumbnails
 
-[Read the Docs](http://dplayer.js.org/docs)
+### Danamku api
 
-## CDN
+- [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
 
-- [jsDelivr](https://www.jsdelivr.com/package/npm/dplayer)
-- [cdnjs](https://cdnjs.com/libraries/dplayer)
-- [unpkg](https://unpkg.com/dplayer/)
+### Plugins
 
-## FAQ
+- [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
 
-<details><summary>Why can't some videos be full screen?</summary><br>
+### Other
 
-If player is contained in a iframe, try adding the allowfullscreen attribute to the iframe.
+- [DPlayer-Lite](https://github.com/kn007/DPlayer-Lite): lite version
 
-For full browser support it should look like this:
+## Who use DPlayer?
 
-```html
-<iframe src="example.com"
-        allowfullscreen="allowfullscreen"
-        mozallowfullscreen="mozallowfullscreen"
-        msallowfullscreen="msallowfullscreen"
-        oallowfullscreen="oallowfullscreen"
-        webkitallowfullscreen="webkitallowfullscreen"></iframe> 
-```
-</details>
+- [嘀哩嘀哩](http://www.dilidili.wang/): 兴趣使然的无名小站（D站）
+- [银色子弹](https://www.sbsub.com/): 银色子弹，简称银弹，由多数柯南热爱者聚集在一起的组织
+- [纸飞机南航青年网络社区](http://my.nuaa.edu.cn/video-video.html): 南京航空航天大学门户网站
+- [otomads](https://otomads.com/): 专注于音MAD的视频弹幕网站
+- [Cloudreve](https://github.com/HFO4/Cloudreve): 基于ThinkPHP构建的网盘系统
+- Feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31)
 
-<details><summary>Why can't player autoplay in some mobile browsers?</summary><br>
+## Donate
 
-Most mobile browsers forbid video autoplay, you wont be able to achieve it without hacks.
-</details>
+DPlayer is an MIT licensed open source project and completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing.
 
-## Join the Discussion
+## One-time Donations
 
-- [Telegram Group](https://t.me/adplayer)
-- [QQ Group](https://shang.qq.com/wpa/qunwpa?idkey=bf22213ae0028a82e5adf3f286dfd4f01e0997dc9f1dcd8e831a0a85e799be17): 415835947
+We accept donations through these channels:
 
-## Related Projects
+- [Paypal](https://www.paypal.me/DIYgod)
+- [WeChat Pay](https://i.imgur.com/aq6PtWa.png)
+- [Alipay](https://i.imgur.com/wv1Pj2k.png)
+- Bitcoin: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1
 
-- [DPlayer-backend](https://github.com/MoePlayer/DPlayer-backend)
-- [DPlayer-data(weekly backup for api.prprpr.me/dplayer)](https://github.com/MoePlayer/DPlayer-data)
-- [DPlayer-thumbnails](https://github.com/MoePlayer/DPlayer-thumbnails)
-- [DPlayer-for-typecho](https://github.com/volio/DPlayer-for-typecho)
-- [Hexo-tag-dplayer](https://github.com/NextMoe/hexo-tag-dplayer)
-- [DPlayer_for_Z-BlogPHP](https://github.com/fghrsh/DPlayer_for_Z-BlogPHP)
-- [纸飞机视频区插件(DPlayer for Discuz!)](https://coding.net/u/Click_04/p/video/git)
-- [DPlayer for WordPress](https://github.com/BlueCocoa/DPlayer-WordPress)
-- [Vue-DPlayer](https://github.com/sinchang/vue-dplayer)
-- [react-dplayer](https://github.com/hnsylitao/react-dplayer)
-- [DPlayer-Lite](https://github.com/kn007/DPlayer-Lite)
-- [DPlayerHandle](https://github.com/kn007/DPlayerHandle)
-- [laravel-danmaku](https://github.com/MoePlayer/laravel-danmaku)
-- [dplayer-live-backend](https://github.com/Izumi-kun/dplayer-live-backend)
-- Feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31)
+## Recurring Pledges
 
-## Who use DPlayer?
+Recurring pledges come with exclusive perks, e.g. having your name or your company logo listed in the DPlayer GitHub repository and this website.
 
-- [嘀哩嘀哩](http://www.dilidili.wang/)
-- [银弹字幕组](https://www.sbsub.com/)
-- [纸飞机南航青年网络社区](http://my.nuaa.edu.cn/video-video.html)
-- [otomads](https://otomads.com/)
-- Feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlayer/issues/31)
+- Become a backer or sponsor via [OpenCollective](https://opencollective.com/dplayer)
+- E-mail us: i#html.love
 
-## Donate
+## Current Premium Sponsors
 
-- [Donate via OpenCollective](https://opencollective.com/dplayer)
-- [Donate via Paypal](https://www.paypal.me/DIYgod)
-- [Donate via WeChat Pay](https://ws4.sinaimg.cn/large/006tKfTcgy1fhu1uowywej307s07st8h.jpg)
-- [Donate via Alipay](https://ws4.sinaimg.cn/large/006tKfTcgy1fhu1vf4ih7j307s07sdfm.jpg)
-- Donate via Bitcoin: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1
-
-## Sponsors
-
-Thank you to all our sponsors!
-
-<table>
-  <tbody>
-    <tr>
-      <td align="center" valign="middle">
-        <a href="https://pear.hk/" target="_blank">
-          <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
-        </a>
-      </td>
-      <td align="center" valign="middle">
-        <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
-          <img width="222px" src="https://imgur.com/apG1uKf.png">
-        </a>
-      </td>
-    </tr>
-  </tbody>
-</table>
+### Special Sponsors
 
-## Contributors
+<a href="https://pear.hk/" target="_blank">
+    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+</a>
+<a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
+    <img width="222px" src="https://imgur.com/apG1uKf.png">
+</a>
 
-This project exists thanks to all the people who contribute.
+### OpenCollective backers
 
-<a href="https://github.com/MoePlayer/DPlayer/graphs/contributors"><img src="https://opencollective.com/DPlayer/contributors.svg?width=890" /></a>
+![](https://opencollective.com/DPlayer/backers.svg?width=890)
 
-## Backers
+## Contributors
 
-Thank you to all our backers!
+This project exists thanks to all the people who contribute.
 
-<a href="https://opencollective.com/DPlayer#backers" target="_blank"><img src="https://opencollective.com/DPlayer/backers.svg?width=890"></a>
+<a href="https://github.com/MoePlayer/DPlayer/graphs/contributors"><img src="https://opencollective.com/DPlayer/contributors.svg?width=890" /></a>
 
 ## Author
 

docs/README.md

@@ -8,22 +8,12 @@ search: english
 
 ## Special Sponsors
 
-<table>
-  <tbody>
-    <tr>
-      <td align="center" valign="middle">
-        <a href="https://pear.hk/" target="_blank">
-          <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
-        </a>
-      </td>
-      <td align="center" valign="middle">
-        <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
-          <img width="222px" src="https://imgur.com/apG1uKf.png">
-        </a>
-      </td>
-    </tr>
-  </tbody>
-</table>
+<a href="https://pear.hk/" target="_blank">
+    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+</a>
+<a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
+    <img width="222px" src="https://imgur.com/apG1uKf.png">
+</a>
 
 ## Installation
 

docs/config.js

@@ -1,5 +1,5 @@
 const langs = [
-    { title: 'English', path: '/home', matchPath: /^\/(home|ecosystem)/ },
+    { title: 'English', path: '/home', matchPath: /^\/(home|ecosystem|support)/ },
     { title: '简体中文', path: '/zh-Hans/', matchPath: /^\/zh-Hans/ },
 ];
 
@@ -17,6 +17,9 @@ docute.init({
             {
                 title: 'Ecosystem', path: '/ecosystem'
             },
+            {
+                title: 'Support DPlayer', path: '/support'
+            },
             {
                 title: 'Languages', type: 'dropdown', items: langs
             }
@@ -28,6 +31,9 @@ docute.init({
             {
                 title: '生态', path: '/zh-Hans/ecosystem'
             },
+            {
+                title: '支持 DPlayer', path: '/zh-Hans/support'
+            },
             {
                 title: '选择语言', type: 'dropdown', items: langs
             }

docs/support.md

@@ -0,0 +1,50 @@
+---
+search: english
+---
+
+# Sponsor DPlayer Development
+
+DPlayer is an MIT licensed open source project and completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing.
+
+If you run a business and are using DPlayer in a revenue-generating product, it makes business sense to sponsor DPlayer development: it ensures the project that your product relies on stays healthy and actively maintained.
+
+If you are an individual user and have enjoyed the productivity of using DPlayer, consider donating as a sign of appreciation - like buying me coffee once in a while :)
+
+You can support DPlayer development via the following methods:
+
+## One-time Donations
+
+We accept donations through these channels:
+
+- [Paypal](https://www.paypal.me/DIYgod)
+- [WeChat Pay](https://i.imgur.com/aq6PtWa.png)
+- [Alipay](https://i.imgur.com/wv1Pj2k.png)
+- Bitcoin: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1
+
+## Recurring Pledges
+
+Recurring pledges come with exclusive perks, e.g. having your name or your company logo listed in the DPlayer GitHub repository and this website.
+
+- Become a backer or sponsor via [OpenCollective](https://opencollective.com/dplayer)
+- E-mail us: i#html.love
+
+## Current Premium Sponsors
+
+### Special Sponsors
+
+<a href="https://pear.hk/" target="_blank">
+    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+</a>
+<a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
+    <img width="222px" src="https://imgur.com/apG1uKf.png">
+</a>
+
+### OpenCollective backers
+
+![](https://opencollective.com/DPlayer/backers.svg?width=890)
+
+## DPlayer 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/zh-Hans/ecosystem.md

@@ -48,13 +48,8 @@ search: zh-Hans
 
 ## 谁在用 DPlayer?
 
-- [嘀哩嘀哩](http://www.dilidili.wang/)
-- [银弹字幕组](https://www.sbsub.com/)
-- [纸飞机南航青年网络社区](http://my.nuaa.edu.cn/video-video.html)
-- [otomads](https://otomads.com/)
-
-## 贡献者
-
-感谢所有贡献者。
-
-<a href="https://github.com/MoePlayer/DPlayer/graphs/contributors"><img src="https://opencollective.com/DPlayer/contributors.svg?width=890" /></a>
+- [嘀哩嘀哩](http://www.dilidili.wang/): 兴趣使然的无名小站（D站）
+- [银色子弹](https://www.sbsub.com/): 银色子弹，简称银弹，由多数柯南热爱者聚集在一起的组织
+- [纸飞机南航青年网络社区](http://my.nuaa.edu.cn/video-video.html): 南京航空航天大学门户网站
+- [otomads](https://otomads.com/): 专注于音MAD的视频弹幕网站
+- [Cloudreve](https://github.com/HFO4/Cloudreve): 基于ThinkPHP构建的网盘系统

docs/zh-Hans/support.md

@@ -0,0 +1,51 @@
+---
+nav: zh-Hans
+search: zh-Hans
+---
+
+# 赞助 DPlayer 的研发
+
+DPlayer 是采用 MIT 许可的开源项目，使用完全免费。 但是随着项目规模的增长，也需要有相应的资金支持才能持续项目的维护的开发。
+
+如果你是企业经营者并且将 DPlayer 用在商业产品中，那么赞助 DPlayer 有商业上的益处：可以让你的产品所依赖的框架保持健康并得到积极的维护。
+
+如果你是个人开发者并且享受 DPlayer 带来的高开发效率，可以用捐助来表示你的谢意 —— 比如偶尔给我买杯咖啡 :)
+
+你可以通过下列的方法来赞助 DPlayer 的开发。
+
+## 一次性赞助
+
+我们通过以下方式接受赞助：
+
+- [微信支付](https://i.imgur.com/aq6PtWa.png)
+- [支付宝](https://i.imgur.com/wv1Pj2k.png)
+- [Paypal](https://www.paypal.me/DIYgod)
+- 比特币: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1
+
+## 周期性赞助
+
+周期性赞助可以获得额外的回报，比如你的名字或你的公司 logo 会出现在 DPlayer 的 GitHub 仓库和现在我们的官网中。
+
+- 通过 [OpenCollective](https://opencollective.com/dplayer) 赞助成为 backer 或 sponsor 
+- 给我们发邮件联系赞助事宜: i#html.love
+
+## 当前的顶级赞助商
+
+### 特别赞助商
+
+<a href="https://pear.hk/" target="_blank">
+    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+</a>
+<a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
+    <img width="222px" src="https://imgur.com/apG1uKf.png">
+</a>
+
+### OpenCollective backers
+
+![](https://opencollective.com/DPlayer/backers.svg?width=890)
+
+## DPlayer 贡献者
+
+感谢所有贡献者。
+
+<a href="https://github.com/MoePlayer/DPlayer/graphs/contributors"><img src="https://opencollective.com/DPlayer/contributors.svg?width=890" /></a>