🌰 Version bump to 1.2.0, support Aplayer 1.10.x

 - Support Aplayer 1.10.x
 - Fixed dataset
 - Updated presets from `es2015` to `env`

.babelrc

@@ -1,5 +1,5 @@
 {
-  "presets": ["es2015"],
+  "presets": ["env"],
   "env": {
     "production": {
       "presets": ["minify"]

.gitignore

@@ -1,3 +1,4 @@
 .idea
 node_modules
 package-lock.json
+test

README.md

@@ -15,18 +15,19 @@ https://github.com/MoePlayer/APlayer
 
 |Version|API Status|APlayer|
 |---|---|---|
-|1.0.x|Compatibility (2018.04.01 EOL)|[![](https://img.shields.io/badge/APlayer-^1.6.0-red.svg?longCache=true&style=for-the-badge)](https://github.com/MoePlayer/APlayer/tree/1.6.0)|
-|1.1.x|Latest|[![](https://img.shields.io/badge/APlayer-^1.7.0-green.svg?longCache=true&style=for-the-badge)](https://github.com/MoePlayer/APlayer)|
+|1.0.x|Deprecated|[![](https://img.shields.io/badge/APlayer-^1.6.0-red.svg?longCache=true&style=for-the-badge)](https://github.com/MoePlayer/APlayer/tree/1.6.0)|
+|1.1.x|Compatibility|[![](https://img.shields.io/badge/APlayer-^1.7.0-green.svg?longCache=true&style=for-the-badge)](https://github.com/MoePlayer/APlayer/tree/1.7.0)|
+|1.2.x|Latest|[![](https://img.shields.io/badge/APlayer-^1.10.0-green.svg?longCache=true&style=for-the-badge)](https://github.com/MoePlayer/APlayer)|
 
 ## CDN
- - [jsDelivr](https://cdn.jsdelivr.net/npm/meting@1.1/dist/Meting.min.js)
- - [unpkg](https://unpkg.com/meting@1.1/dist/Meting.min.js)
+ - https://cdn.jsdelivr.net/npm/meting@1.2/dist/Meting.min.js
+ - https://unpkg.com/meting@1.2/dist/Meting.min.js
 
 ## Quick Start
 ```html
 <!-- require APlayer -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7/dist/APlayer.min.css">
-<script src="https://cdn.jsdelivr.net/npm/aplayer@1.7/dist/APlayer.min.js"></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.css">
+<script src="https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js"></script>
 
 <div class="aplayer"
     data-id="60198"
@@ -39,28 +40,35 @@ https://github.com/MoePlayer/APlayer
 https://music.163.com/#/playlist?id=60198
 
 ```html
-<!-- require APlayer -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/APlayer.min.css">
-<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/APlayer.min.js"></script>
-
 <div class="aplayer"
     data-name="rainymood"
     data-artist="rainymood"
     data-url="https://rainymood.com/audio1110/0.m4a"
     data-cover="https://rainymood.com/i/badge.jpg">
 </div>
-
-<script src="dist/Meting.min.js"></script>
 ```
 for self-hosted media
 
+```html
+<div class="aplayer"
+    data-name="广东珠江经济电台"
+    data-artist="FM97.4"
+    data-url="http://lhttp.qingting.fm/live/1259/64k.mp3"
+    data-cover="http://pic.qingting.fm/2015/0209/20150209212831195.jpg!200"
+    data-fixed="true">
+</div>
+```
+Fixed mode
+
+
 ## Option
 
 |option               |default      |description|
 |:--------------------|:------------:|:----------|
 |data-id              |**require**   |song id / playlist id / album id / search keyword|
 |data-server          |**require**   |music platform: `netease`, `tencent`, `kugou`, `xiami`, `baidu`|
 |data-type            |**require**   |`song`, `playlist`, `album`, `search`, `artist`|
+|data-fixed           |`false`       |enable fixed mode|
 |data-mini            |`false`       |enable mini mode|
 |data-autoplay        |`false`       |audio autoplay|
 |data-theme           |`#2980b9`     |main color|
@@ -69,15 +77,14 @@ for self-hosted media
 |data-preload         |`auto`        |values: 'none', 'metadata', 'auto'|
 |data-volume          |`0.7`         |default volume, notice that player will remember user setting, default volume will not work after user set volume themselves|
 |data-mutex           |`true`        |prevent to play multiple player at the same time, pause other players when this player start play|
-|data-lrc             |`false`       |enable mini mode|
-|data-list-folded     |`false`       |indicate whether list should folded at first|
-|data-list-max-height |`340px`       |list max height|
+|data-lrctype         |`0`           |lyric type|
+|data-listfolded      |`false`       |indicate whether list should folded at first|
+|data-listmaxheight   |`340px`       |list max height|
+|data-storagename     |`metingjs`    |localStorage key that store player setting|
 |~~data-mode~~        |**deprecated**|Instead `data-loop`, `data-order` should be used|
 
 Documentation for APlayer can be found at https://aplayer.js.org/#/home?id=options
 
- > note: because of JavaScript rules, `data-listFolded` should be rewrite as `data-list-folded`
-
 ## Advanced
 
 MetingJS allow you to use self-hosted API, [more information about Meting](https://github.com/metowolf/Meting).

package.json

@@ -1,6 +1,6 @@
 {
   "name": "meting",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "Wow, such a beautiful html5 music player (with Meting API)",
   "main": "dist/Meting.min.js",
   "scripts": {
@@ -26,8 +26,8 @@
   "homepage": "https://github.com/metowolf/MetingJS",
   "devDependencies": {
     "babel-cli": "^6.26.0",
-    "babel-preset-env": "^1.6.1",
-    "babel-preset-es2015": "^6.24.1",
-    "babel-preset-minify": "^0.2.0"
+    "babel-minify": "^0.4.3",
+    "babel-preset-env": "^1.7.0",
+    "babel-preset-minify": "^0.4.3"
   }
 }

src/Meting.js

@@ -1,4 +1,4 @@
-console.log(`\n %c MetingJS 1.1.1 %c https://github.com/metowolf/MetingJS \n\n`, `color: #fadfa3; background: #030307; padding:5px 0;`, `background: #fadfa3; padding:5px 0;`);
+console.log(`${'\n'} %c MetingJS v1.2.0 %c https://github.com/metowolf/MetingJS ${'\n'}`, 'color: #fadfa3; background: #030307; padding:5px 0;', 'background: #fadfa3; padding:5px 0;');
 
 let aplayers = [];
 let loadMeting = () => {
@@ -15,7 +15,8 @@ let loadMeting = () => {
     aplayers = [];
 
     let elements = document.querySelectorAll(".aplayer");
-    for (let i = 0; i < elements.length; i++) {
+
+    for (var i = 0; i < elements.length; i++) {
         const el = elements[i];
         let id = el.dataset.id;
         if (id) {
@@ -40,54 +41,58 @@ let loadMeting = () => {
 
         } else if (el.dataset.url) {
             let data = [{
-                name: el.dataset.name || el.dataset.title,
-                artist: el.dataset.artist || el.dataset.author,
+                name: el.dataset.name || el.dataset.title || 'Audio name',
+                artist: el.dataset.artist || el.dataset.author || 'Audio artist',
                 url: el.dataset.url,
                 cover: el.dataset.cover || el.dataset.pic,
-                lrc: el.dataset.lrc
+                lrc: el.dataset.lrc,
+                type: el.dataset.type || 'auto'
             }];
+
             build(el, data);
         }
     }
 
     function build(element, music) {
-        let options = {
+
+        let defaultOption = {
             container: element,
             audio: music,
-            mini: false,
-            fixed: false,
+            mini: null,
+            fixed: null,
             autoplay: false,
             mutex: true,
-            lrc: 3,
+            lrcType: 3,
             listFolded: false,
             preload: 'auto',
             theme: '#2980b9',
             loop: 'all',
             order: 'list',
-            volume: 0.7,
-            listFolded: false,
-            listMaxHeight: '340px'
+            volume: null,
+            listMaxHeight: null,
+            customAudioType: null,
+            storageName: 'metingjs'
         };
 
-        for (const defaultKey in options) {
+        if (!music.length) {
+            return;
+        }
+
+        if (!music[0].lrc) {
+            defaultOption['lrcType'] = 0;
+        }
+
+        let options = {};
+        for (const defaultKey in defaultOption) {
             let eleKey = defaultKey.toLowerCase();
-            if (options.hasOwnProperty(defaultKey) && element.dataset.hasOwnProperty(eleKey)) {
-                options[defaultKey] = element.dataset[eleKey];
+            if (element.dataset.hasOwnProperty(eleKey) || element.dataset.hasOwnProperty(defaultKey) || defaultOption[defaultKey] !== null) {
+                options[defaultKey] = element.dataset[eleKey] || element.dataset[defaultKey] || defaultOption[defaultKey];
                 if (options[defaultKey] === 'true' || options[defaultKey] === 'false') {
                     options[defaultKey] = (options[defaultKey] == 'true');
                 }
             }
         }
 
-        if (!music.length) {
-            return;
-        }
-
-        if (options.mini === true) {
-            options.lrc = 0;
-            options.listFolded = true;
-        }
-
         aplayers.push(new APlayer(options));
     }
 }