New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
meting - npm Package Compare versions
Comparing version 1.0.2 to 1.1.0
@@ -1,1 +0,1 @@ | ||
| "use strict";console.log("\n %c MetingJS 1.0.2 %c https://github.com/metowolf/MetingJS \n\n","color: #fff; background-image: linear-gradient(90deg, rgb(47, 172, 178) 0%, rgb(45, 190, 96) 100%); padding:5px 1px;","background-image: linear-gradient(90deg, rgb(45, 190, 96) 0%, rgb(255, 255, 255) 100%); padding:5px 0;");var aplayers=[],loadMeting=function(){function a(a,b){var c=[],d=a.dataset;c.element=a,c.music=b,c.showlrc=c.music[0].lrc?3:0,c.narrow="true"===d.narrow,c.autoplay="true"===d.autoplay,c.mutex="false"!==d.mutex,c.mode=d.mode||"circulation",c.preload=d.preload||"auto",c.listmaxheight=d.listmaxheight||"340px",c.theme=d.theme||"#ad7a86",aplayers.push(new APlayer(c))}var b="https://api.i-meto.com/meting/api?server=:server&type=:type&id=:id&r=:r";"undefined"!=typeof meting_api&&(b=meting_api);for(var f=0;f<aplayers.length;f++)try{aplayers[f].destroy()}catch(a){console.log(a)}aplayers=[];for(var c=document.querySelectorAll(".aplayer"),d=function(d){var e=c[d],f=e.dataset.id;if(f){var g=b;g=g.replace(":server",e.dataset.server),g=g.replace(":type",e.dataset.type),g=g.replace(":id",e.dataset.id),g=g.replace(":r",Math.random());var h=new XMLHttpRequest;h.onreadystatechange=function(){if(4===h.readyState&&(200<=h.status&&300>h.status||304===h.status)){var b=JSON.parse(h.responseText);a(e,b)}},h.open("get",g,!0),h.send(null)}else if(e.dataset.url){var i=[{title:e.dataset.title,author:e.dataset.author,url:e.dataset.url,pic:e.dataset.pic,lrc:e.dataset.lrc}];a(e,i)}},e=0;e<c.length;e++)d(e)};document.addEventListener("DOMContentLoaded",loadMeting,!1); | ||
| 'use strict';console.log('\n %c MetingJS 1.1.0 %c https://github.com/metowolf/MetingJS \n\n','color: #fadfa3; background: #030307; padding:5px 0;','background: #fadfa3; padding:5px 0;');var aplayers=[],loadMeting=function(){function a(a,b){var c={container:a,audio:b,mini:!1,autoplay:!1,mutex:!0,lrc:3,preload:'auto',theme:'#2980b9',loop:'all',order:'list',volume:0.7,listFolded:!1,listMaxHeight:'340px'};for(var d in c)c.hasOwnProperty(d)&&a.dataset.hasOwnProperty(d)&&(c[d]=a.dataset[d]);b.length&&('true'===c.mini&&(c.mini=!0,c.lrc=0,c.listFolded=!0),aplayers.push(new APlayer(c)))}var b='https://api.i-meto.com/meting/api?server=:server&type=:type&id=:id&r=:r';'undefined'!=typeof meting_api&&(b=meting_api);for(var f=0;f<aplayers.length;f++)try{aplayers[f].destroy()}catch(a){console.log(a)}aplayers=[];for(var c=document.querySelectorAll('.aplayer'),d=function(d){var e=c[d],f=e.dataset.id;if(f){var g=e.dataset.api||b;g=g.replace(':server',e.dataset.server),g=g.replace(':type',e.dataset.type),g=g.replace(':id',e.dataset.id),g=g.replace(':auth',e.dataset.auth),g=g.replace(':r',Math.random());var h=new XMLHttpRequest;h.onreadystatechange=function(){if(4===h.readyState&&(200<=h.status&&300>h.status||304===h.status)){var b=JSON.parse(h.responseText);a(e,b)}},h.open('get',g,!0),h.send(null)}else if(e.dataset.url){var i=[{name:e.dataset.name||e.dataset.title,artist:e.dataset.artist||e.dataset.author,url:e.dataset.url,cover:e.dataset.cover||e.dataset.pic,lrc:e.dataset.lrc}];a(e,i)}},e=0;e<c.length;e++)d(e)};document.addEventListener('DOMContentLoaded',loadMeting,!1); |
| { | ||
| "name": "meting", | ||
| "version": "1.0.2", | ||
| "version": "1.1.0", | ||
| "description": "Wow, such a beautiful html5 music player (with Meting API)", | ||
| "main": "dist/Meting.min.js", | ||
| "scripts": { | ||
| "build": "BABEL_ENV=production babel src/Meting.js -o dist/Meting.min.js", | ||
| "test": "babel src/Meting.js -o dist/Meting.min.js" | ||
| "dev": "npm run development", | ||
| "development": "babel src/Meting.js -o dist/Meting.min.js", | ||
| "prod": "npm run production", | ||
| "production": "BABEL_ENV=production babel src/Meting.js -o dist/Meting.min.js", | ||
| "test": "npm run production" | ||
| }, | ||
@@ -10,0 +13,0 @@ "repository": { |
@@ -13,11 +13,19 @@ <p align="center"> | ||
| ## Requirement | ||
| https://github.com/MoePlayer/APlayer (~1.6.0) | ||
| https://github.com/MoePlayer/APlayer | ||
| |Version|API Status|APlayer| | ||
| |---|---|---| | ||
| |1.0.x|Compatibility (2018.04.01 EOL)|[](https://github.com/MoePlayer/APlayer/tree/1.6.0)| | ||
| |1.1.x|Latest|[](https://github.com/MoePlayer/APlayer)| | ||
| ## CDN | ||
| https://cdn.jsdelivr.net/npm/meting/dist/Meting.min.js | ||
| https://unpkg.com/meting/dist/Meting.min.js | ||
| - [jsDelivr](https://www.jsdelivr.com/package/npm/meting) | ||
| - [unpkg](https://unpkg.com/meting/) | ||
| ## Quick Start | ||
| ```html | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/aplayer/1.6.0/APlayer.min.js"></script> | ||
| <!-- require APlayer --> | ||
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css"> | ||
| <script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script> | ||
@@ -29,2 +37,3 @@ <div class="aplayer" | ||
| </div> | ||
| <script src="dist/Meting.min.js"></script> | ||
@@ -35,8 +44,14 @@ ``` | ||
| ```html | ||
| <!-- require APlayer --> | ||
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css"> | ||
| <script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script> | ||
| <div class="aplayer" | ||
| data-title="rainymood" | ||
| data-author="rainymood" | ||
| data-name="rainymood" | ||
| data-artist="rainymood" | ||
| data-url="https://rainymood.com/audio1110/0.m4a" | ||
| data-pic="https://rainymood.com/i/badge.jpg"> | ||
| data-cover="https://rainymood.com/i/badge.jpg"> | ||
| </div> | ||
| <script src="dist/Meting.min.js"></script> | ||
| ``` | ||
@@ -47,24 +62,33 @@ for self-hosted media | ||
| |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-mode|`circulation`|play mode, `circulation`, `random`, `single`, `order`| | ||
| |data-autoplay|`false`|autoplay song(s), not supported by mobile browsers| | ||
| |data-mutex|`true`|pause other players when this player playing| | ||
| |data-listmaxheight|`340px`|max height of play list| | ||
| |data-preload|`auto`|the way to load music, can be `none`, `metadata`, `auto`| | ||
| |data-theme|`#ad7a86`|theme color| | ||
| |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-mini |`false` |enable mini mode| | ||
| |data-autoplay |`false` |audio autoplay| | ||
| |data-theme |`#2980b9` |main color| | ||
| |data-loop |`all` |player loop play, values: 'all', 'one', 'none'| | ||
| |data-order |`list` |player play order, values: 'list', 'random'| | ||
| |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-mode~~ |**deprecated**|Instead `data-loop`, `data-order` should be used| | ||
| more https://aplayer.js.org/docs/#/?id=options | ||
| 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 | ||
| Use self music API, see also https://github.com/metowolf/Meting | ||
| MetingJS allow you to use self-hosted API, [more information about Meting](https://github.com/metowolf/Meting). | ||
| ```html | ||
| <script> | ||
| var meting_api='http://example.com/api.php?server=:server&type=:type&id=:id&r=:r'; | ||
| var meting_api='http://example.com/api.php?server=:server&type=:type&id=:id&auth=:auth&r=:r'; | ||
| </script> | ||
| <script src="dist/Meting.min.js"></script> | ||
@@ -71,0 +95,0 @@ ``` |
@@ -1,2 +0,2 @@ | ||
| console.log("\n %c MetingJS 1.0.2 %c https://github.com/metowolf/MetingJS \n\n", "color: #fff; background-image: linear-gradient(90deg, rgb(47, 172, 178) 0%, rgb(45, 190, 96) 100%); padding:5px 1px;", "background-image: linear-gradient(90deg, rgb(45, 190, 96) 0%, rgb(255, 255, 255) 100%); padding:5px 0;"); | ||
| console.log(`\n %c MetingJS 1.1.0 %c https://github.com/metowolf/MetingJS \n\n`, `color: #fadfa3; background: #030307; padding:5px 0;`, `background: #fadfa3; padding:5px 0;`); | ||
@@ -22,7 +22,8 @@ let aplayers = []; | ||
| if (id) { | ||
| let url=api; | ||
| url=url.replace(":server", el.dataset.server); | ||
| url=url.replace(":type", el.dataset.type); | ||
| url=url.replace(":id", el.dataset.id); | ||
| url=url.replace(":r", Math.random()); | ||
| let url = el.dataset.api || api; | ||
| url = url.replace(":server", el.dataset.server); | ||
| url = url.replace(":type", el.dataset.type); | ||
| url = url.replace(":id", el.dataset.id); | ||
| url = url.replace(":auth", el.dataset.auth); | ||
| url = url.replace(":r", Math.random()); | ||
@@ -43,7 +44,7 @@ const xhr = new XMLHttpRequest(); | ||
| let data = [{ | ||
| title : el.dataset.title, | ||
| author : el.dataset.author, | ||
| url : el.dataset.url, | ||
| pic : el.dataset.pic, | ||
| lrc : el.dataset.lrc | ||
| name: el.dataset.name || el.dataset.title, | ||
| artist: el.dataset.artist || el.dataset.author, | ||
| url: el.dataset.url, | ||
| cover: el.dataset.cover || el.dataset.pic, | ||
| lrc: el.dataset.lrc | ||
| }]; | ||
@@ -55,15 +56,35 @@ build(el, data); | ||
| function build(element, music) { | ||
| let op = [], | ||
| setting = element.dataset; | ||
| op.element = element; | ||
| op.music = music; | ||
| op.showlrc = op.music[0].lrc ? 3 : 0; | ||
| op.narrow = setting.narrow === "true"; | ||
| op.autoplay = setting.autoplay === "true"; | ||
| op.mutex = setting.mutex !== "false"; | ||
| op.mode = setting.mode || "circulation"; | ||
| op.preload = setting.preload || "auto"; | ||
| op.listmaxheight = setting.listmaxheight || "340px"; | ||
| op.theme = setting.theme || "#ad7a86"; | ||
| aplayers.push(new APlayer(op)); | ||
| let options = { | ||
| container: element, | ||
| audio: music, | ||
| mini: false, | ||
| autoplay: false, | ||
| mutex: true, | ||
| lrc: 3, | ||
| preload: 'auto', | ||
| theme: '#2980b9', | ||
| loop: 'all', | ||
| order: 'list', | ||
| volume: 0.7, | ||
| listFolded: false, | ||
| listMaxHeight: '340px' | ||
| }; | ||
| for (const defaultKey in options) { | ||
| if (options.hasOwnProperty(defaultKey) && element.dataset.hasOwnProperty(defaultKey)) { | ||
| options[defaultKey] = element.dataset[defaultKey]; | ||
| } | ||
| } | ||
| if (!music.length) { | ||
| return; | ||
| } | ||
| if (options.mini === 'true') { | ||
| options.mini = true; | ||
| options.lrc = 0; | ||
| options.listFolded = true; | ||
| } | ||
| aplayers.push(new APlayer(options)); | ||
| } | ||
@@ -70,0 +91,0 @@ } |
Sorry, the diff of this file is not supported yet
No alert changes
Improved metrics
- Total package byte prevSize
10819
23.17%- Lines of code
86
24.64%- Number of lines in readme file
98
32.43%No dependency changes