1 line
155 KiB
HTML
1 line
155 KiB
HTML
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=2"><meta name="theme-color" content="#FFF"><link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png"><link rel="icon" type="image/ico" sizes="32x32" href="/images/favicon.ico"><meta http-equiv="Cache-Control" content="no-transform"><meta http-equiv="Cache-Control" content="no-siteapp"><link rel="alternate" type="application/rss+xml" title="涛声依旧" href="https://hitoli.com/rss.xml"><link rel="alternate" type="application/atom+xml" title="涛声依旧" href="https://hitoli.com/atom.xml"><link rel="alternate" type="application/json" title="涛声依旧" href="https://hitoli.com/feed.json"><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Mulish:300,300italic,400,400italic,700,700italic%7CFredericka%20the%20Great:300,300italic,400,400italic,700,700italic%7CNoto%20Serif%20JP:300,300italic,400,400italic,700,700italic%7CNoto%20Serif%20SC:300,300italic,400,400italic,700,700italic%7CInconsolata:300,300italic,400,400italic,700,700italic&display=swap&subset=latin,latin-ext"><link rel="stylesheet" href="/css/app.css?v=0.0.0"><meta name="keywords" content="博客,Hexo,Shoka,背景音乐"><link rel="canonical" href="https://hitoli.com/2022/09/26/%E8%A7%A3%E5%86%B3Hexo-Shoka%E8%83%8C%E6%99%AF%E9%9F%B3%E4%B9%90%E6%97%A0%E6%B3%95%E6%92%AD%E6%94%BE%E7%9A%84%E9%97%AE%E9%A2%98/"><title>解决 Hexo+Shoka 背景音乐无法播放的问题 - Hexo - Docker - 极空间 | ☆∵∴Hito∴∵★ = 涛声依旧 = 天下事有难易乎？为之，则难者亦易矣</title></head><body itemscope itemtype="http://schema.org/WebPage"><div id="loading"><div class="cat"><div class="body"></div><div class="head"><div class="face"></div></div><div class="foot"><div class="tummy-end"></div><div class="bottom"></div><div class="legs left"></div><div class="legs right"></div></div><div class="paw"><div class="hands left"></div><div class="hands right"></div></div></div></div><div id="container"><header id="header" itemscope itemtype="http://schema.org/WPHeader"><div class="inner"><div id="brand"><div class="pjax"><h1 itemprop="name headline">解决 Hexo+Shoka 背景音乐无法播放的问题</h1><div class="meta"><span class="item" title="创建时间：2022-09-26 19:30:00"><span class="icon"><i class="ic i-calendar"></i> </span><span class="text">发表于</span> <time itemprop="dateCreated datePublished" datetime="2022-09-26T19:30:00+08:00">2022-09-26</time> </span><span class="item" title="本文字数"><span class="icon"><i class="ic i-pen"></i> </span><span class="text">本文字数</span> <span>23k</span> <span class="text">字</span> </span><span class="item" title="阅读时长"><span class="icon"><i class="ic i-clock"></i> </span><span class="text">阅读时长</span> <span>21 分钟</span></span></div></div></div><nav id="nav"><div class="inner"><div class="toggle"><div class="lines" aria-label="切换导航栏"><span class="line"></span> <span class="line"></span> <span class="line"></span></div></div><ul class="menu"><li class="item title"><a href="/" rel="start">☆∵∴Hito∴∵★</a></li></ul><ul class="right"><li class="item theme"><i class="ic i-sun"></i></li><li class="item search"><i class="ic i-search"></i></li></ul></div></nav></div><div id="imgs" class="pjax"><ul><li class="item" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1gipexbei4hj20zk0m8npd.jpg"></li><li class="item" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1gicliierfjj20zk0m8npd.jpg"></li><li class="item" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1gipew28b65j20zk0m8hdt.jpg"></li><li class="item" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1giph4fomxoj20zk0m8axp.jpg"></li><li class="item" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1gicm07ih54j20zk0m84qp.jpg"></li><li class="item" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1gipevo9j1jj20zk0m8e81.jpg"></li></ul></div></header><div id="waves"><svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto"><defs><path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"/></defs><g class="parallax"><use xlink:href="#gentle-wave" x="48" y="0"/><use xlink:href="#gentle-wave" x="48" y="3"/><use xlink:href="#gentle-wave" x="48" y="5"/><use xlink:href="#gentle-wave" x="48" y="7"/></g></svg></div><main><div class="inner"><div id="main" class="pjax"><div class="article wrap"><div class="breadcrumb" itemscope itemtype="https://schema.org/BreadcrumbList"><i class="ic i-home"></i> <span><a href="/">首页</a></span><i class="ic i-angle-right"></i> <span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/" itemprop="item" rel="index" title="分类于 极空间"><span itemprop="name">极空间</span></a><meta itemprop="position" content="1"></span><i class="ic i-angle-right"></i> <span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/" itemprop="item" rel="index" title="分类于 Docker"><span itemprop="name">Docker</span></a><meta itemprop="position" content="2"></span><i class="ic i-angle-right"></i> <span class="current" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/Hexo/" itemprop="item" rel="index" title="分类于 Hexo"><span itemprop="name">Hexo</span></a><meta itemprop="position" content="3"></span></div><article itemscope itemtype="http://schema.org/Article" class="post block" lang="zh-CN"><link itemprop="mainEntityOfPage" href="https://hitoli.com/2022/09/26/%E8%A7%A3%E5%86%B3Hexo-Shoka%E8%83%8C%E6%99%AF%E9%9F%B3%E4%B9%90%E6%97%A0%E6%B3%95%E6%92%AD%E6%94%BE%E7%9A%84%E9%97%AE%E9%A2%98/"><span hidden itemprop="author" itemscope itemtype="http://schema.org/Person"><meta itemprop="image" content="/images/avatar.jpg"><meta itemprop="name" content="Hito Li"><meta itemprop="description" content="天下事有难易乎？为之，则难者亦易矣, 天生我材必有用"></span><span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization"><meta itemprop="name" content="涛声依旧"></span><div class="body md" itemprop="articleBody"><h4 id="问题描述"><a class="anchor" href="#问题描述">#</a> 问题描述</h4><p>今天突然发现博客的音乐无法播放了，经过一顿查找，发现是因为<span class="red"><span class="exturl" data-url="aHR0cHM6Ly9hcGkuaS1tZXRvLmNvbS9tZXRpbmcvYXBp"> https://api.i-meto.com/meting/api</span></span> 获取的音乐地址出现了问题，估计是被网易云给封禁了。shoka 主题应该是通过这个网站提取音乐地址、图片等信息。通过断点发现网易播放列表还是能正常获取的，只是列表中的具体音乐、图片出现了问题。因为 meto 是把音乐的 url 指向自己的服务地址，然后通过参数获取的最终音乐，所以我通过参数拼凑出最终的网易云音乐地址，自此问题基本解决。只针对网易播放列表，图片只能使用一张固定的（因为图片的具体规律不知道 O (∩_∩) O~）。</p><h4 id="解决方法"><a class="anchor" href="#解决方法">#</a> 解决方法</h4><p>到 themes\shoka\source\js\_app 目录下打开 player.js 文件，替换成如下代码。<br></p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br><span class="line">135</span><br><span class="line">136</span><br><span class="line">137</span><br><span class="line">138</span><br><span class="line">139</span><br><span class="line">140</span><br><span class="line">141</span><br><span class="line">142</span><br><span class="line">143</span><br><span class="line">144</span><br><span class="line">145</span><br><span class="line">146</span><br><span class="line">147</span><br><span class="line">148</span><br><span class="line">149</span><br><span class="line">150</span><br><span class="line">151</span><br><span class="line">152</span><br><span class="line">153</span><br><span class="line">154</span><br><span class="line">155</span><br><span class="line">156</span><br><span class="line">157</span><br><span class="line">158</span><br><span class="line">159</span><br><span class="line">160</span><br><span class="line">161</span><br><span class="line">162</span><br><span class="line">163</span><br><span class="line">164</span><br><span class="line">165</span><br><span class="line">166</span><br><span class="line">167</span><br><span class="line">168</span><br><span class="line">169</span><br><span class="line">170</span><br><span class="line">171</span><br><span class="line">172</span><br><span class="line">173</span><br><span class="line">174</span><br><span class="line">175</span><br><span class="line">176</span><br><span class="line">177</span><br><span class="line">178</span><br><span class="line">179</span><br><span class="line">180</span><br><span class="line">181</span><br><span class="line">182</span><br><span class="line">183</span><br><span class="line">184</span><br><span class="line">185</span><br><span class="line">186</span><br><span class="line">187</span><br><span class="line">188</span><br><span class="line">189</span><br><span class="line">190</span><br><span class="line">191</span><br><span class="line">192</span><br><span class="line">193</span><br><span class="line">194</span><br><span class="line">195</span><br><span class="line">196</span><br><span class="line">197</span><br><span class="line">198</span><br><span class="line">199</span><br><span class="line">200</span><br><span class="line">201</span><br><span class="line">202</span><br><span class="line">203</span><br><span class="line">204</span><br><span class="line">205</span><br><span class="line">206</span><br><span class="line">207</span><br><span class="line">208</span><br><span class="line">209</span><br><span class="line">210</span><br><span class="line">211</span><br><span class="line">212</span><br><span class="line">213</span><br><span class="line">214</span><br><span class="line">215</span><br><span class="line">216</span><br><span class="line">217</span><br><span class="line">218</span><br><span class="line">219</span><br><span class="line">220</span><br><span class="line">221</span><br><span class="line">222</span><br><span class="line">223</span><br><span class="line">224</span><br><span class="line">225</span><br><span class="line">226</span><br><span class="line">227</span><br><span class="line">228</span><br><span class="line">229</span><br><span class="line">230</span><br><span class="line">231</span><br><span class="line">232</span><br><span class="line">233</span><br><span class="line">234</span><br><span class="line">235</span><br><span class="line">236</span><br><span class="line">237</span><br><span class="line">238</span><br><span class="line">239</span><br><span class="line">240</span><br><span class="line">241</span><br><span class="line">242</span><br><span class="line">243</span><br><span class="line">244</span><br><span class="line">245</span><br><span class="line">246</span><br><span class="line">247</span><br><span class="line">248</span><br><span class="line">249</span><br><span class="line">250</span><br><span class="line">251</span><br><span class="line">252</span><br><span class="line">253</span><br><span class="line">254</span><br><span class="line">255</span><br><span class="line">256</span><br><span class="line">257</span><br><span class="line">258</span><br><span class="line">259</span><br><span class="line">260</span><br><span class="line">261</span><br><span class="line">262</span><br><span class="line">263</span><br><span class="line">264</span><br><span class="line">265</span><br><span class="line">266</span><br><span class="line">267</span><br><span class="line">268</span><br><span class="line">269</span><br><span class="line">270</span><br><span class="line">271</span><br><span class="line">272</span><br><span class="line">273</span><br><span class="line">274</span><br><span class="line">275</span><br><span class="line">276</span><br><span class="line">277</span><br><span class="line">278</span><br><span class="line">279</span><br><span class="line">280</span><br><span class="line">281</span><br><span class="line">282</span><br><span class="line">283</span><br><span class="line">284</span><br><span class="line">285</span><br><span class="line">286</span><br><span class="line">287</span><br><span class="line">288</span><br><span class="line">289</span><br><span class="line">290</span><br><span class="line">291</span><br><span class="line">292</span><br><span class="line">293</span><br><span class="line">294</span><br><span class="line">295</span><br><span class="line">296</span><br><span class="line">297</span><br><span class="line">298</span><br><span class="line">299</span><br><span class="line">300</span><br><span class="line">301</span><br><span class="line">302</span><br><span class="line">303</span><br><span class="line">304</span><br><span class="line">305</span><br><span class="line">306</span><br><span class="line">307</span><br><span class="line">308</span><br><span class="line">309</span><br><span class="line">310</span><br><span class="line">311</span><br><span class="line">312</span><br><span class="line">313</span><br><span class="line">314</span><br><span class="line">315</span><br><span class="line">316</span><br><span class="line">317</span><br><span class="line">318</span><br><span class="line">319</span><br><span class="line">320</span><br><span class="line">321</span><br><span class="line">322</span><br><span class="line">323</span><br><span class="line">324</span><br><span class="line">325</span><br><span class="line">326</span><br><span class="line">327</span><br><span class="line">328</span><br><span class="line">329</span><br><span class="line">330</span><br><span class="line">331</span><br><span class="line">332</span><br><span class="line">333</span><br><span class="line">334</span><br><span class="line">335</span><br><span class="line">336</span><br><span class="line">337</span><br><span class="line">338</span><br><span class="line">339</span><br><span class="line">340</span><br><span class="line">341</span><br><span class="line">342</span><br><span class="line">343</span><br><span class="line">344</span><br><span class="line">345</span><br><span class="line">346</span><br><span class="line">347</span><br><span class="line">348</span><br><span class="line">349</span><br><span class="line">350</span><br><span class="line">351</span><br><span class="line">352</span><br><span class="line">353</span><br><span class="line">354</span><br><span class="line">355</span><br><span class="line">356</span><br><span class="line">357</span><br><span class="line">358</span><br><span class="line">359</span><br><span class="line">360</span><br><span class="line">361</span><br><span class="line">362</span><br><span class="line">363</span><br><span class="line">364</span><br><span class="line">365</span><br><span class="line">366</span><br><span class="line">367</span><br><span class="line">368</span><br><span class="line">369</span><br><span class="line">370</span><br><span class="line">371</span><br><span class="line">372</span><br><span class="line">373</span><br><span class="line">374</span><br><span class="line">375</span><br><span class="line">376</span><br><span class="line">377</span><br><span class="line">378</span><br><span class="line">379</span><br><span class="line">380</span><br><span class="line">381</span><br><span class="line">382</span><br><span class="line">383</span><br><span class="line">384</span><br><span class="line">385</span><br><span class="line">386</span><br><span class="line">387</span><br><span class="line">388</span><br><span class="line">389</span><br><span class="line">390</span><br><span class="line">391</span><br><span class="line">392</span><br><span class="line">393</span><br><span class="line">394</span><br><span class="line">395</span><br><span class="line">396</span><br><span class="line">397</span><br><span class="line">398</span><br><span class="line">399</span><br><span class="line">400</span><br><span class="line">401</span><br><span class="line">402</span><br><span class="line">403</span><br><span class="line">404</span><br><span class="line">405</span><br><span class="line">406</span><br><span class="line">407</span><br><span class="line">408</span><br><span class="line">409</span><br><span class="line">410</span><br><span class="line">411</span><br><span class="line">412</span><br><span class="line">413</span><br><span class="line">414</span><br><span class="line">415</span><br><span class="line">416</span><br><span class="line">417</span><br><span class="line">418</span><br><span class="line">419</span><br><span class="line">420</span><br><span class="line">421</span><br><span class="line">422</span><br><span class="line">423</span><br><span class="line">424</span><br><span class="line">425</span><br><span class="line">426</span><br><span class="line">427</span><br><span class="line">428</span><br><span class="line">429</span><br><span class="line">430</span><br><span class="line">431</span><br><span class="line">432</span><br><span class="line">433</span><br><span class="line">434</span><br><span class="line">435</span><br><span class="line">436</span><br><span class="line">437</span><br><span class="line">438</span><br><span class="line">439</span><br><span class="line">440</span><br><span class="line">441</span><br><span class="line">442</span><br><span class="line">443</span><br><span class="line">444</span><br><span class="line">445</span><br><span class="line">446</span><br><span class="line">447</span><br><span class="line">448</span><br><span class="line">449</span><br><span class="line">450</span><br><span class="line">451</span><br><span class="line">452</span><br><span class="line">453</span><br><span class="line">454</span><br><span class="line">455</span><br><span class="line">456</span><br><span class="line">457</span><br><span class="line">458</span><br><span class="line">459</span><br><span class="line">460</span><br><span class="line">461</span><br><span class="line">462</span><br><span class="line">463</span><br><span class="line">464</span><br><span class="line">465</span><br><span class="line">466</span><br><span class="line">467</span><br><span class="line">468</span><br><span class="line">469</span><br><span class="line">470</span><br><span class="line">471</span><br><span class="line">472</span><br><span class="line">473</span><br><span class="line">474</span><br><span class="line">475</span><br><span class="line">476</span><br><span class="line">477</span><br><span class="line">478</span><br><span class="line">479</span><br><span class="line">480</span><br><span class="line">481</span><br><span class="line">482</span><br><span class="line">483</span><br><span class="line">484</span><br><span class="line">485</span><br><span class="line">486</span><br><span class="line">487</span><br><span class="line">488</span><br><span class="line">489</span><br><span class="line">490</span><br><span class="line">491</span><br><span class="line">492</span><br><span class="line">493</span><br><span class="line">494</span><br><span class="line">495</span><br><span class="line">496</span><br><span class="line">497</span><br><span class="line">498</span><br><span class="line">499</span><br><span class="line">500</span><br><span class="line">501</span><br><span class="line">502</span><br><span class="line">503</span><br><span class="line">504</span><br><span class="line">505</span><br><span class="line">506</span><br><span class="line">507</span><br><span class="line">508</span><br><span class="line">509</span><br><span class="line">510</span><br><span class="line">511</span><br><span class="line">512</span><br><span class="line">513</span><br><span class="line">514</span><br><span class="line">515</span><br><span class="line">516</span><br><span class="line">517</span><br><span class="line">518</span><br><span class="line">519</span><br><span class="line">520</span><br><span class="line">521</span><br><span class="line">522</span><br><span class="line">523</span><br><span class="line">524</span><br><span class="line">525</span><br><span class="line">526</span><br><span class="line">527</span><br><span class="line">528</span><br><span class="line">529</span><br><span class="line">530</span><br><span class="line">531</span><br><span class="line">532</span><br><span class="line">533</span><br><span class="line">534</span><br><span class="line">535</span><br><span class="line">536</span><br><span class="line">537</span><br><span class="line">538</span><br><span class="line">539</span><br><span class="line">540</span><br><span class="line">541</span><br><span class="line">542</span><br><span class="line">543</span><br><span class="line">544</span><br><span class="line">545</span><br><span class="line">546</span><br><span class="line">547</span><br><span class="line">548</span><br><span class="line">549</span><br><span class="line">550</span><br><span class="line">551</span><br><span class="line">552</span><br><span class="line">553</span><br><span class="line">554</span><br><span class="line">555</span><br><span class="line">556</span><br><span class="line">557</span><br><span class="line">558</span><br><span class="line">559</span><br><span class="line">560</span><br><span class="line">561</span><br><span class="line">562</span><br><span class="line">563</span><br><span class="line">564</span><br><span class="line">565</span><br><span class="line">566</span><br><span class="line">567</span><br><span class="line">568</span><br><span class="line">569</span><br><span class="line">570</span><br><span class="line">571</span><br><span class="line">572</span><br><span class="line">573</span><br><span class="line">574</span><br><span class="line">575</span><br><span class="line">576</span><br><span class="line">577</span><br><span class="line">578</span><br><span class="line">579</span><br><span class="line">580</span><br><span class="line">581</span><br><span class="line">582</span><br><span class="line">583</span><br><span class="line">584</span><br><span class="line">585</span><br><span class="line">586</span><br><span class="line">587</span><br><span class="line">588</span><br><span class="line">589</span><br><span class="line">590</span><br><span class="line">591</span><br><span class="line">592</span><br><span class="line">593</span><br><span class="line">594</span><br><span class="line">595</span><br><span class="line">596</span><br><span class="line">597</span><br><span class="line">598</span><br><span class="line">599</span><br><span class="line">600</span><br><span class="line">601</span><br><span class="line">602</span><br><span class="line">603</span><br><span class="line">604</span><br><span class="line">605</span><br><span class="line">606</span><br><span class="line">607</span><br><span class="line">608</span><br><span class="line">609</span><br><span class="line">610</span><br><span class="line">611</span><br><span class="line">612</span><br><span class="line">613</span><br><span class="line">614</span><br><span class="line">615</span><br><span class="line">616</span><br><span class="line">617</span><br><span class="line">618</span><br><span class="line">619</span><br><span class="line">620</span><br><span class="line">621</span><br><span class="line">622</span><br><span class="line">623</span><br><span class="line">624</span><br><span class="line">625</span><br><span class="line">626</span><br><span class="line">627</span><br><span class="line">628</span><br><span class="line">629</span><br><span class="line">630</span><br><span class="line">631</span><br><span class="line">632</span><br><span class="line">633</span><br><span class="line">634</span><br><span class="line">635</span><br><span class="line">636</span><br><span class="line">637</span><br><span class="line">638</span><br><span class="line">639</span><br><span class="line">640</span><br><span class="line">641</span><br><span class="line">642</span><br><span class="line">643</span><br><span class="line">644</span><br><span class="line">645</span><br><span class="line">646</span><br><span class="line">647</span><br><span class="line">648</span><br><span class="line">649</span><br><span class="line">650</span><br><span class="line">651</span><br><span class="line">652</span><br><span class="line">653</span><br><span class="line">654</span><br><span class="line">655</span><br><span class="line">656</span><br><span class="line">657</span><br><span class="line">658</span><br><span class="line">659</span><br><span class="line">660</span><br><span class="line">661</span><br><span class="line">662</span><br><span class="line">663</span><br><span class="line">664</span><br><span class="line">665</span><br><span class="line">666</span><br><span class="line">667</span><br><span class="line">668</span><br><span class="line">669</span><br><span class="line">670</span><br><span class="line">671</span><br><span class="line">672</span><br><span class="line">673</span><br><span class="line">674</span><br><span class="line">675</span><br><span class="line">676</span><br><span class="line">677</span><br><span class="line">678</span><br><span class="line">679</span><br><span class="line">680</span><br><span class="line">681</span><br><span class="line">682</span><br><span class="line">683</span><br><span class="line">684</span><br><span class="line">685</span><br><span class="line">686</span><br><span class="line">687</span><br><span class="line">688</span><br><span class="line">689</span><br><span class="line">690</span><br><span class="line">691</span><br><span class="line">692</span><br><span class="line">693</span><br><span class="line">694</span><br><span class="line">695</span><br><span class="line">696</span><br><span class="line">697</span><br><span class="line">698</span><br><span class="line">699</span><br><span class="line">700</span><br><span class="line">701</span><br><span class="line">702</span><br><span class="line">703</span><br><span class="line">704</span><br><span class="line">705</span><br><span class="line">706</span><br><span class="line">707</span><br><span class="line">708</span><br><span class="line">709</span><br><span class="line">710</span><br><span class="line">711</span><br><span class="line">712</span><br><span class="line">713</span><br><span class="line">714</span><br><span class="line">715</span><br><span class="line">716</span><br><span class="line">717</span><br><span class="line">718</span><br><span class="line">719</span><br><span class="line">720</span><br><span class="line">721</span><br><span class="line">722</span><br><span class="line">723</span><br><span class="line">724</span><br><span class="line">725</span><br><span class="line">726</span><br><span class="line">727</span><br><span class="line">728</span><br><span class="line">729</span><br><span class="line">730</span><br><span class="line">731</span><br><span class="line">732</span><br><span class="line">733</span><br><span class="line">734</span><br><span class="line">735</span><br><span class="line">736</span><br><span class="line">737</span><br><span class="line">738</span><br><span class="line">739</span><br><span class="line">740</span><br><span class="line">741</span><br><span class="line">742</span><br><span class="line">743</span><br><span class="line">744</span><br><span class="line">745</span><br><span class="line">746</span><br><span class="line">747</span><br><span class="line">748</span><br><span class="line">749</span><br><span class="line">750</span><br><span class="line">751</span><br><span class="line">752</span><br><span class="line">753</span><br><span class="line">754</span><br><span class="line">755</span><br><span class="line">756</span><br><span class="line">757</span><br><span class="line">758</span><br><span class="line">759</span><br><span class="line">760</span><br><span class="line">761</span><br><span class="line">762</span><br><span class="line">763</span><br><span class="line">764</span><br><span class="line">765</span><br><span class="line">766</span><br><span class="line">767</span><br><span class="line">768</span><br><span class="line">769</span><br><span class="line">770</span><br><span class="line">771</span><br><span class="line">772</span><br><span class="line">773</span><br><span class="line">774</span><br><span class="line">775</span><br><span class="line">776</span><br><span class="line">777</span><br><span class="line">778</span><br><span class="line">779</span><br><span class="line">780</span><br><span class="line">781</span><br><span class="line">782</span><br><span class="line">783</span><br><span class="line">784</span><br><span class="line">785</span><br><span class="line">786</span><br><span class="line">787</span><br><span class="line">788</span><br><span class="line">789</span><br><span class="line">790</span><br><span class="line">791</span><br><span class="line">792</span><br><span class="line">793</span><br><span class="line">794</span><br><span class="line">795</span><br><span class="line">796</span><br><span class="line">797</span><br><span class="line">798</span><br><span class="line">799</span><br><span class="line">800</span><br><span class="line">801</span><br><span class="line">802</span><br><span class="line">803</span><br><span class="line">804</span><br><span class="line">805</span><br><span class="line">806</span><br><span class="line">807</span><br><span class="line">808</span><br><span class="line">809</span><br><span class="line">810</span><br><span class="line">811</span><br><span class="line">812</span><br><span class="line">813</span><br><span class="line">814</span><br><span class="line">815</span><br><span class="line">816</span><br><span class="line">817</span><br><span class="line">818</span><br><span class="line">819</span><br><span class="line">820</span><br><span class="line">821</span><br><span class="line">822</span><br><span class="line">823</span><br><span class="line">824</span><br><span class="line">825</span><br><span class="line">826</span><br><span class="line">827</span><br><span class="line">828</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> <span class="variable constant_">NOWPLAYING</span> = <span class="literal">null</span></span><br><span class="line"><span class="keyword">const</span> isMobile = <span class="regexp">/mobile/i</span>.<span class="title function_">test</span>(<span class="variable language_">window</span>.<span class="property">navigator</span>.<span class="property">userAgent</span>);</span><br><span class="line"><span class="keyword">const</span> mediaPlayer = <span class="keyword">function</span> (<span class="params">t, config</span>) {</span><br><span class="line"> <span class="keyword">var</span> option = {</span><br><span class="line"> <span class="attr">type</span>: <span class="string">'audio'</span>,</span><br><span class="line"> <span class="attr">mode</span>: <span class="string">'random'</span>,</span><br><span class="line"> <span class="attr">btns</span>: [<span class="string">'play-pause'</span>, <span class="string">'music'</span>],</span><br><span class="line"> <span class="attr">controls</span>: [<span class="string">'mode'</span>, <span class="string">'backward'</span>, <span class="string">'play-pause'</span>, <span class="string">'forward'</span>, <span class="string">'volume'</span>],</span><br><span class="line"> <span class="attr">events</span>: {</span><br><span class="line"> <span class="string">"play-pause"</span>: <span class="keyword">function</span> (<span class="params">event</span>) {</span><br><span class="line"> <span class="keyword">if</span> (source.<span class="property">paused</span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">play</span>()</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">pause</span>()</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="string">"music"</span>: <span class="keyword">function</span> (<span class="params">event</span>) {</span><br><span class="line"> <span class="keyword">if</span> (info.<span class="property">el</span>.<span class="title function_">hasClass</span>(<span class="string">'show'</span>)) {</span><br><span class="line"> info.<span class="title function_">hide</span>()</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> info.<span class="property">el</span>.<span class="title function_">addClass</span>(<span class="string">'show'</span>);</span><br><span class="line"> playlist.<span class="title function_">scroll</span>().<span class="title function_">title</span>()</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> }, utils = {</span><br><span class="line"> <span class="attr">random</span>: <span class="keyword">function</span> (<span class="params">len</span>) {</span><br><span class="line"> <span class="keyword">return</span> <span class="title class_">Math</span>.<span class="title function_">floor</span>((<span class="title class_">Math</span>.<span class="title function_">random</span>() * len))</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">parse</span>: <span class="keyword">function</span> (<span class="params">link</span>) {</span><br><span class="line"> <span class="keyword">var</span> result = [];</span><br><span class="line"> [</span><br><span class="line"> [<span class="string">'music.163.com.*song.*id=(\\d+)'</span>, <span class="string">'netease'</span>, <span class="string">'song'</span>],</span><br><span class="line"> [<span class="string">'music.163.com.*album.*id=(\\d+)'</span>, <span class="string">'netease'</span>, <span class="string">'album'</span>],</span><br><span class="line"> [<span class="string">'music.163.com.*artist.*id=(\\d+)'</span>, <span class="string">'netease'</span>, <span class="string">'artist'</span>],</span><br><span class="line"> [<span class="string">'music.163.com.*playlist.*id=(\\d+)'</span>, <span class="string">'netease'</span>, <span class="string">'playlist'</span>],</span><br><span class="line"> [<span class="string">'music.163.com.*discover/toplist.*id=(\\d+)'</span>, <span class="string">'netease'</span>, <span class="string">'playlist'</span>],</span><br><span class="line"> [<span class="string">'y.qq.com.*song/(\\w+).html'</span>, <span class="string">'tencent'</span>, <span class="string">'song'</span>],</span><br><span class="line"> [<span class="string">'y.qq.com.*album/(\\w+).html'</span>, <span class="string">'tencent'</span>, <span class="string">'album'</span>],</span><br><span class="line"> [<span class="string">'y.qq.com.*singer/(\\w+).html'</span>, <span class="string">'tencent'</span>, <span class="string">'artist'</span>],</span><br><span class="line"> [<span class="string">'y.qq.com.*playsquare/(\\w+).html'</span>, <span class="string">'tencent'</span>, <span class="string">'playlist'</span>],</span><br><span class="line"> [<span class="string">'y.qq.com.*playlist/(\\w+).html'</span>, <span class="string">'tencent'</span>, <span class="string">'playlist'</span>],</span><br><span class="line"> [<span class="string">'xiami.com.*song/(\\w+)'</span>, <span class="string">'xiami'</span>, <span class="string">'song'</span>],</span><br><span class="line"> [<span class="string">'xiami.com.*album/(\\w+)'</span>, <span class="string">'xiami'</span>, <span class="string">'album'</span>],</span><br><span class="line"> [<span class="string">'xiami.com.*artist/(\\w+)'</span>, <span class="string">'xiami'</span>, <span class="string">'artist'</span>],</span><br><span class="line"> [<span class="string">'xiami.com.*collect/(\\w+)'</span>, <span class="string">'xiami'</span>, <span class="string">'playlist'</span>],</span><br><span class="line"> ].<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">rule</span>) {</span><br><span class="line"> <span class="keyword">var</span> patt = <span class="keyword">new</span> <span class="title class_">RegExp</span>(rule[<span class="number">0</span>])</span><br><span class="line"> <span class="keyword">var</span> res = patt.<span class="title function_">exec</span>(link)</span><br><span class="line"> <span class="keyword">if</span> (res !== <span class="literal">null</span>) {</span><br><span class="line"> result = [rule[<span class="number">1</span>], rule[<span class="number">2</span>], res[<span class="number">1</span>]]</span><br><span class="line"> }</span><br><span class="line"> })</span><br><span class="line"> <span class="keyword">return</span> result</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">fetch</span>: <span class="keyword">function</span> (<span class="params">source</span>) {</span><br><span class="line"> <span class="keyword">var</span> list = []</span><br><span class="line"></span><br><span class="line"> <span class="keyword">return</span> <span class="keyword">new</span> <span class="title class_">Promise</span>(<span class="keyword">function</span> (<span class="params">resolve, reject</span>) {</span><br><span class="line"> source.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">raw</span>) {</span><br><span class="line"> <span class="keyword">var</span> meta = utils.<span class="title function_">parse</span>(raw)</span><br><span class="line"> <span class="keyword">if</span> (meta[<span class="number">0</span>]) {</span><br><span class="line"> <span class="keyword">var</span> skey = <span class="title class_">JSON</span>.<span class="title function_">stringify</span>(meta)</span><br><span class="line"> <span class="keyword">var</span> playlist = store.<span class="title function_">get</span>(skey)</span><br><span class="line"> <span class="keyword">if</span> (playlist) {</span><br><span class="line"> <span class="comment">//自己修改-start</span></span><br><span class="line"> <span class="keyword">var</span> audioInfos = <span class="title class_">JSON</span>.<span class="title function_">parse</span>(playlist);</span><br><span class="line"> audioInfos.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">item, i</span>) {</span><br><span class="line"> item.<span class="property">company</span> = meta[<span class="number">0</span>];</span><br><span class="line"> });</span><br><span class="line"> list.<span class="property">push</span>.<span class="title function_">apply</span>(list, audioInfos);</span><br><span class="line"> <span class="title function_">resolve</span>(list);</span><br><span class="line"> <span class="comment">//自己修改-end</span></span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> <span class="title function_">fetch</span>(<span class="string">'https://api.i-meto.com/meting/api?server='</span> + meta[<span class="number">0</span>] + <span class="string">'&type='</span> + meta[<span class="number">1</span>] + <span class="string">'&id='</span> + meta[<span class="number">2</span>] + <span class="string">'&r='</span> + <span class="title class_">Math</span>.<span class="title function_">random</span>())</span><br><span class="line"> .<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params">response</span>) {</span><br><span class="line"> <span class="keyword">return</span> response.<span class="title function_">json</span>()</span><br><span class="line"> }).<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params">json</span>) {</span><br><span class="line"> store.<span class="title function_">set</span>(skey, <span class="title class_">JSON</span>.<span class="title function_">stringify</span>(json))</span><br><span class="line"> list.<span class="property">push</span>.<span class="title function_">apply</span>(list, json);</span><br><span class="line"> <span class="title function_">resolve</span>(list);</span><br><span class="line"> }).<span class="title function_">catch</span>(<span class="keyword">function</span> (<span class="params">ex</span>) { })</span><br><span class="line"> }</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> list.<span class="title function_">push</span>(raw);</span><br><span class="line"> <span class="title function_">resolve</span>(list);</span><br><span class="line"> }</span><br><span class="line"> })</span><br><span class="line"> })</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">secondToTime</span>: <span class="keyword">function</span> (<span class="params">second</span>) {</span><br><span class="line"> <span class="keyword">var</span> add0 = <span class="keyword">function</span> (<span class="params">num</span>) {</span><br><span class="line"> <span class="keyword">return</span> <span class="built_in">isNaN</span>(num) ? <span class="string">'00'</span> : (num < <span class="number">10</span> ? <span class="string">'0'</span> + num : <span class="string">''</span> + num)</span><br><span class="line"> };</span><br><span class="line"> <span class="keyword">var</span> hour = <span class="title class_">Math</span>.<span class="title function_">floor</span>(second / <span class="number">3600</span>);</span><br><span class="line"> <span class="keyword">var</span> min = <span class="title class_">Math</span>.<span class="title function_">floor</span>((second - hour * <span class="number">3600</span>) / <span class="number">60</span>);</span><br><span class="line"> <span class="keyword">var</span> sec = <span class="title class_">Math</span>.<span class="title function_">floor</span>(second - hour * <span class="number">3600</span> - min * <span class="number">60</span>);</span><br><span class="line"> <span class="keyword">return</span> (hour > <span class="number">0</span> ? [hour, min, sec] : [min, sec]).<span class="title function_">map</span>(add0).<span class="title function_">join</span>(<span class="string">':'</span>);</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">nameMap</span>: {</span><br><span class="line"> <span class="attr">dragStart</span>: isMobile ? <span class="string">'touchstart'</span> : <span class="string">'mousedown'</span>,</span><br><span class="line"> <span class="attr">dragMove</span>: isMobile ? <span class="string">'touchmove'</span> : <span class="string">'mousemove'</span>,</span><br><span class="line"> <span class="attr">dragEnd</span>: isMobile ? <span class="string">'touchend'</span> : <span class="string">'mouseup'</span>,</span><br><span class="line"> }</span><br><span class="line"> }, source = <span class="literal">null</span>;</span><br><span class="line"></span><br><span class="line"> t.<span class="property">player</span> = {</span><br><span class="line"> <span class="attr">_id</span>: utils.<span class="title function_">random</span>(<span class="number">999999</span>),</span><br><span class="line"> <span class="attr">group</span>: <span class="literal">true</span>,</span><br><span class="line"> <span class="comment">// 加载播放列表</span></span><br><span class="line"> <span class="attr">load</span>: <span class="keyword">function</span> (<span class="params">newList</span>) {</span><br><span class="line"> <span class="keyword">var</span> d = <span class="string">""</span></span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (newList && newList.<span class="property">length</span> > <span class="number">0</span>) {</span><br><span class="line"> <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">options</span>.<span class="property">rawList</span> !== newList) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">options</span>.<span class="property">rawList</span> = newList;</span><br><span class="line"> playlist.<span class="title function_">clear</span>()</span><br><span class="line"> <span class="comment">// 获取新列表</span></span><br><span class="line"> <span class="comment">//this.fetch()</span></span><br><span class="line"> }</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> <span class="comment">// 没有列表时，隐藏按钮</span></span><br><span class="line"> d = <span class="string">"none"</span></span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">pause</span>()</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">var</span> el <span class="keyword">in</span> buttons.<span class="property">el</span>) {</span><br><span class="line"> buttons.<span class="property">el</span>[el].<span class="title function_">display</span>(d)</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> <span class="variable language_">this</span></span><br><span class="line"> },</span><br><span class="line"> <span class="attr">fetch</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span>;</span><br><span class="line"> <span class="keyword">return</span> <span class="keyword">new</span> <span class="title class_">Promise</span>(<span class="keyword">function</span> (<span class="params">resolve, reject</span>) {</span><br><span class="line"> <span class="keyword">if</span> (playlist.<span class="property">data</span>.<span class="property">length</span> > <span class="number">0</span>) {</span><br><span class="line"> <span class="title function_">resolve</span>()</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> <span class="keyword">if</span> (that.<span class="property">options</span>.<span class="property">rawList</span>) {</span><br><span class="line"> <span class="keyword">var</span> promises = [];</span><br><span class="line"></span><br><span class="line"> that.<span class="property">options</span>.<span class="property">rawList</span>.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">raw, index</span>) {</span><br><span class="line"> promises.<span class="title function_">push</span>(<span class="keyword">new</span> <span class="title class_">Promise</span>(<span class="keyword">function</span> (<span class="params">resolve, reject</span>) {</span><br><span class="line"> <span class="keyword">var</span> group = index</span><br><span class="line"> <span class="keyword">var</span> source</span><br><span class="line"> <span class="keyword">if</span> (!raw.<span class="property">list</span>) {</span><br><span class="line"> group = <span class="number">0</span></span><br><span class="line"> that.<span class="property">group</span> = <span class="literal">false</span></span><br><span class="line"> source = [raw]</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> that.<span class="property">group</span> = <span class="literal">true</span></span><br><span class="line"> source = raw.<span class="property">list</span></span><br><span class="line"> }</span><br><span class="line"> utils.<span class="title function_">fetch</span>(source).<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params">list</span>) {</span><br><span class="line"> playlist.<span class="title function_">add</span>(group, list)</span><br><span class="line"> <span class="title function_">resolve</span>()</span><br><span class="line"> })</span><br><span class="line"> }))</span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> <span class="title class_">Promise</span>.<span class="title function_">all</span>(promises).<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="title function_">resolve</span>(<span class="literal">true</span>)</span><br><span class="line"> })</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> }).<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params">c</span>) {</span><br><span class="line"> <span class="keyword">if</span> (c) {</span><br><span class="line"> playlist.<span class="title function_">create</span>()</span><br><span class="line"> controller.<span class="title function_">create</span>()</span><br><span class="line"> that.<span class="title function_">mode</span>()</span><br><span class="line"> }</span><br><span class="line"> })</span><br><span class="line"> },</span><br><span class="line"> <span class="comment">// 根据模式切换当前曲目index</span></span><br><span class="line"> <span class="attr">mode</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> total = playlist.<span class="property">data</span>.<span class="property">length</span>;</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (!total || playlist.<span class="property">errnum</span> == total)</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> step = controller.<span class="property">step</span> == <span class="string">'next'</span> ? <span class="number">1</span> : -<span class="number">1</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> next = <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> index = playlist.<span class="property">index</span> + step</span><br><span class="line"> <span class="keyword">if</span> (index > total || index < <span class="number">0</span>) {</span><br><span class="line"> index = controller.<span class="property">step</span> == <span class="string">'next'</span> ? <span class="number">0</span> : total - <span class="number">1</span>;</span><br><span class="line"> }</span><br><span class="line"> playlist.<span class="property">index</span> = index;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> random = <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> p = utils.<span class="title function_">random</span>(total)</span><br><span class="line"> <span class="keyword">if</span> (playlist.<span class="property">index</span> !== p) {</span><br><span class="line"> playlist.<span class="property">index</span> = p</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> <span class="title function_">next</span>()</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">switch</span> (<span class="variable language_">this</span>.<span class="property">options</span>.<span class="property">mode</span>) {</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'random'</span>:</span><br><span class="line"> <span class="title function_">random</span>()</span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'order'</span>:</span><br><span class="line"> <span class="title function_">next</span>()</span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'loop'</span>:</span><br><span class="line"> <span class="keyword">if</span> (controller.<span class="property">step</span>)</span><br><span class="line"> <span class="title function_">next</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (playlist.<span class="property">index</span> == -<span class="number">1</span>)</span><br><span class="line"> <span class="title function_">random</span>()</span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">init</span>()</span><br><span class="line"> },</span><br><span class="line"> <span class="comment">// 直接设置当前曲目index</span></span><br><span class="line"> <span class="attr">switch</span>: <span class="keyword">function</span> (<span class="params">index</span>) {</span><br><span class="line"> <span class="keyword">if</span> (<span class="keyword">typeof</span> index == <span class="string">'number'</span></span><br><span class="line"> && index != playlist.<span class="property">index</span></span><br><span class="line"> && playlist.<span class="title function_">current</span>()</span><br><span class="line"> && !playlist.<span class="title function_">current</span>().<span class="property">error</span>) {</span><br><span class="line"> playlist.<span class="property">index</span> = index;</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">init</span>()</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="comment">// 更新source为当前曲目index</span></span><br><span class="line"> <span class="attr">init</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> item = playlist.<span class="title function_">current</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (!item || item[<span class="string">'error'</span>]) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">mode</span>();</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> playing = <span class="literal">false</span>;</span><br><span class="line"> <span class="keyword">if</span> (!source.<span class="property">paused</span>) {</span><br><span class="line"> playing = <span class="literal">true</span></span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">stop</span>()</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> source.<span class="title function_">attr</span>(<span class="string">'src'</span>, item.<span class="property">url</span>);</span><br><span class="line"> source.<span class="title function_">attr</span>(<span class="string">'title'</span>, item.<span class="property">name</span> + <span class="string">' - '</span> + item.<span class="property">artist</span>);</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">volume</span>(store.<span class="title function_">get</span>(<span class="string">'_PlayerVolume'</span>) || <span class="string">'0.7'</span>)</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">muted</span>(store.<span class="title function_">get</span>(<span class="string">'_PlayerMuted'</span>))</span><br><span class="line"></span><br><span class="line"> progress.<span class="title function_">create</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">options</span>.<span class="property">type</span> == <span class="string">'audio'</span>)</span><br><span class="line"> preview.<span class="title function_">create</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (playing == <span class="literal">true</span>) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">play</span>()</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">play</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="variable constant_">NOWPLAYING</span> && <span class="variable constant_">NOWPLAYING</span>.<span class="property">player</span>.<span class="title function_">pause</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (playlist.<span class="title function_">current</span>().<span class="property">error</span>) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">mode</span>();</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span></span><br><span class="line"> source.<span class="title function_">play</span>().<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> playlist.<span class="title function_">scroll</span>()</span><br><span class="line"> }).<span class="title function_">catch</span>(<span class="keyword">function</span> (<span class="params">e</span>) { });</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">pause</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> source.<span class="title function_">pause</span>()</span><br><span class="line"> <span class="variable language_">document</span>.<span class="property">title</span> = originTitle</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">stop</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> source.<span class="title function_">pause</span>();</span><br><span class="line"> source.<span class="property">currentTime</span> = <span class="number">0</span>;</span><br><span class="line"> <span class="variable language_">document</span>.<span class="property">title</span> = originTitle;</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">seek</span>: <span class="keyword">function</span> (<span class="params">time</span>) {</span><br><span class="line"> time = <span class="title class_">Math</span>.<span class="title function_">max</span>(time, <span class="number">0</span>)</span><br><span class="line"> time = <span class="title class_">Math</span>.<span class="title function_">min</span>(time, source.<span class="property">duration</span>)</span><br><span class="line"> <span class="keyword">if</span> (<span class="built_in">isNaN</span>(time)) {</span><br><span class="line"> time = <span class="number">0</span>;</span><br><span class="line"> }</span><br><span class="line"> source.<span class="property">currentTime</span> = time;</span><br><span class="line"> progress.<span class="title function_">update</span>(time / source.<span class="property">duration</span>)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">muted</span>: <span class="keyword">function</span> (<span class="params">status</span>) {</span><br><span class="line"> <span class="keyword">if</span> (status == <span class="string">'muted'</span>) {</span><br><span class="line"> source.<span class="property">muted</span> = status</span><br><span class="line"> store.<span class="title function_">set</span>(<span class="string">'_PlayerMuted'</span>, status)</span><br><span class="line"> controller.<span class="title function_">update</span>(<span class="number">0</span>)</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> store.<span class="title function_">del</span>(<span class="string">'_PlayerMuted'</span>)</span><br><span class="line"> source.<span class="property">muted</span> = <span class="literal">false</span></span><br><span class="line"> controller.<span class="title function_">update</span>(source.<span class="property">volume</span>)</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">volume</span>: <span class="keyword">function</span> (<span class="params">percentage</span>) {</span><br><span class="line"> <span class="keyword">if</span> (!<span class="built_in">isNaN</span>(percentage)) {</span><br><span class="line"> controller.<span class="title function_">update</span>(percentage)</span><br><span class="line"> store.<span class="title function_">set</span>(<span class="string">'_PlayerVolume'</span>, percentage)</span><br><span class="line"> source.<span class="property">volume</span> = percentage</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">mini</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> info.<span class="title function_">hide</span>()</span><br><span class="line"> }</span><br><span class="line"> };</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> info = {</span><br><span class="line"> <span class="attr">el</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">el</span>)</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span> = t.<span class="title function_">createChild</span>(<span class="string">'div'</span>, {</span><br><span class="line"> <span class="attr">className</span>: <span class="string">'player-info'</span>,</span><br><span class="line"> <span class="attr">innerHTML</span>: (t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">type</span> == <span class="string">'audio'</span> ? <span class="string">'<div class="preview"></div>'</span> : <span class="string">''</span>) + <span class="string">'<div class="controller"></div><div class="playlist"></div>'</span></span><br><span class="line"> }, <span class="string">'after'</span>);</span><br><span class="line"></span><br><span class="line"> preview.<span class="property">el</span> = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">".preview"</span>);</span><br><span class="line"> playlist.<span class="property">el</span> = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">".playlist"</span>);</span><br><span class="line"> controller.<span class="property">el</span> = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">".controller"</span>);</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">hide</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> el = <span class="variable language_">this</span>.<span class="property">el</span></span><br><span class="line"> el.<span class="title function_">addClass</span>(<span class="string">'hide'</span>);</span><br><span class="line"> <span class="variable language_">window</span>.<span class="built_in">setTimeout</span>(<span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> el.<span class="title function_">removeClass</span>(<span class="string">'show hide'</span>)</span><br><span class="line"> }, <span class="number">300</span>);</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> playlist = {</span><br><span class="line"> <span class="attr">el</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">data</span>: [],</span><br><span class="line"> <span class="attr">index</span>: -<span class="number">1</span>,</span><br><span class="line"> <span class="attr">errnum</span>: <span class="number">0</span>,</span><br><span class="line"> <span class="attr">add</span>: <span class="keyword">function</span> (<span class="params">group, list</span>) {</span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span></span><br><span class="line"> list.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">item, i</span>) {</span><br><span class="line"> item.<span class="property">group</span> = group;</span><br><span class="line"> item.<span class="property">name</span> = item.<span class="property">name</span> || item.<span class="property">title</span> || <span class="string">'Meida name'</span>;</span><br><span class="line"> item.<span class="property">artist</span> = item.<span class="property">artist</span> || item.<span class="property">author</span> || <span class="string">'Anonymous'</span>;</span><br><span class="line"> item.<span class="property">cover</span> = item.<span class="property">cover</span> || item.<span class="property">pic</span>;</span><br><span class="line"> item.<span class="property">type</span> = item.<span class="property">type</span> || <span class="string">'normal'</span>;</span><br><span class="line"></span><br><span class="line"> that.<span class="property">data</span>.<span class="title function_">push</span>(item);</span><br><span class="line"> });</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">clear</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">data</span> = []</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="property">innerHTML</span> = <span class="string">""</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">index</span> !== -<span class="number">1</span>) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">index</span> = -<span class="number">1</span></span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">fetch</span>()</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> el = <span class="variable language_">this</span>.<span class="property">el</span></span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">data</span>.<span class="title function_">map</span>(<span class="keyword">function</span> (<span class="params">item, index</span>) {</span><br><span class="line"> <span class="keyword">if</span> (item.<span class="property">el</span>)</span><br><span class="line"> <span class="keyword">return</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> id = <span class="string">'list-'</span> + t.<span class="property">player</span>.<span class="property">_id</span> + <span class="string">'-'</span> + item.<span class="property">group</span></span><br><span class="line"> <span class="keyword">var</span> tab = $(<span class="string">'#'</span> + id)</span><br><span class="line"> <span class="keyword">if</span> (!tab) {</span><br><span class="line"> tab = el.<span class="title function_">createChild</span>(<span class="string">'div'</span>, {</span><br><span class="line"> <span class="attr">id</span>: id,</span><br><span class="line"> <span class="attr">className</span>: t.<span class="property">player</span>.<span class="property">group</span> ? <span class="string">'tab'</span> : <span class="string">''</span>,</span><br><span class="line"> <span class="attr">innerHTML</span>: <span class="string">'<ol></ol>'</span>,</span><br><span class="line"> })</span><br><span class="line"> <span class="keyword">if</span> (t.<span class="property">player</span>.<span class="property">group</span>) {</span><br><span class="line"> tab.<span class="title function_">attr</span>(<span class="string">'data-title'</span>, t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">rawList</span>[item.<span class="property">group</span>][<span class="string">'title'</span>])</span><br><span class="line"> .<span class="title function_">attr</span>(<span class="string">'data-id'</span>, t.<span class="property">player</span>.<span class="property">_id</span>)</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> item.<span class="property">el</span> = tab.<span class="title function_">child</span>(<span class="string">'ol'</span>).<span class="title function_">createChild</span>(<span class="string">'li'</span>, {</span><br><span class="line"> <span class="attr">title</span>: item.<span class="property">name</span> + <span class="string">' - '</span> + item.<span class="property">artist</span>,</span><br><span class="line"> <span class="attr">innerHTML</span>: <span class="string">'<span class="info"><span>'</span> + item.<span class="property">name</span> + <span class="string">'</span><span>'</span> + item.<span class="property">artist</span> + <span class="string">'</span></span>'</span>,</span><br><span class="line"> <span class="attr">onclick</span>: <span class="keyword">function</span> (<span class="params">event</span>) {</span><br><span class="line"> <span class="keyword">var</span> current = event.<span class="property">currentTarget</span>;</span><br><span class="line"> <span class="keyword">if</span> (playlist.<span class="property">index</span> === index && progress.<span class="property">el</span>) {</span><br><span class="line"> <span class="keyword">if</span> (source.<span class="property">paused</span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">play</span>();</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">seek</span>(source.<span class="property">duration</span> * progress.<span class="title function_">percent</span>(event, current))</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"> }</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">switch</span>(index);</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">play</span>();</span><br><span class="line"> }</span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> <span class="keyword">return</span> item</span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> <span class="title function_">tabFormat</span>()</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">current</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">return</span> <span class="variable language_">this</span>.<span class="property">data</span>[<span class="variable language_">this</span>.<span class="property">index</span>]</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">scroll</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> item = <span class="variable language_">this</span>.<span class="title function_">current</span>()</span><br><span class="line"> <span class="keyword">var</span> li = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">'li.active'</span>)</span><br><span class="line"> li && li.<span class="title function_">removeClass</span>(<span class="string">'active'</span>)</span><br><span class="line"> <span class="keyword">var</span> tab = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">'.tab.active'</span>)</span><br><span class="line"> tab && tab.<span class="title function_">removeClass</span>(<span class="string">'active'</span>)</span><br><span class="line"> li = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">find</span>(<span class="string">'.nav li'</span>)[item.<span class="property">group</span>]</span><br><span class="line"> li && li.<span class="title function_">addClass</span>(<span class="string">'active'</span>)</span><br><span class="line"> tab = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">find</span>(<span class="string">'.tab'</span>)[item.<span class="property">group</span>]</span><br><span class="line"> tab && tab.<span class="title function_">addClass</span>(<span class="string">'active'</span>)</span><br><span class="line"></span><br><span class="line"> <span class="title function_">pageScroll</span>(item.<span class="property">el</span>, item.<span class="property">el</span>.<span class="property">offsetTop</span>)</span><br><span class="line"></span><br><span class="line"> <span class="keyword">return</span> <span class="variable language_">this</span></span><br><span class="line"> },</span><br><span class="line"> <span class="attr">title</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">if</span> (source.<span class="property">paused</span>)</span><br><span class="line"> <span class="keyword">return</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> current = <span class="variable language_">this</span>.<span class="title function_">current</span>()</span><br><span class="line"> <span class="variable language_">document</span>.<span class="property">title</span> = <span class="string">'Now Playing...'</span> + current[<span class="string">'name'</span>] + <span class="string">' - '</span> + current[<span class="string">'artist'</span>] + <span class="string">' | '</span> + originTitle;</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">error</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> current = <span class="variable language_">this</span>.<span class="title function_">current</span>()</span><br><span class="line"> current.<span class="property">el</span>.<span class="title function_">removeClass</span>(<span class="string">'current'</span>).<span class="title function_">addClass</span>(<span class="string">'error'</span>)</span><br><span class="line"> current.<span class="property">error</span> = <span class="literal">true</span></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">errnum</span>++</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> lyrics = {</span><br><span class="line"> <span class="attr">el</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">data</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">index</span>: <span class="number">0</span>,</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params">box</span>) {</span><br><span class="line"> <span class="keyword">var</span> current = playlist.<span class="property">index</span></span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span></span><br><span class="line"> <span class="keyword">var</span> raw = playlist.<span class="title function_">current</span>().<span class="property">lrc</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> callback = <span class="keyword">function</span> (<span class="params">body</span>) {</span><br><span class="line"> <span class="keyword">if</span> (current !== playlist.<span class="property">index</span>)</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"></span><br><span class="line"> that.<span class="property">data</span> = that.<span class="title function_">parse</span>(body)</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> lrc = <span class="string">''</span></span><br><span class="line"> that.<span class="property">data</span>.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">line, index</span>) {</span><br><span class="line"> lrc += <span class="string">'<p'</span> + (index === <span class="number">0</span> ? <span class="string">' class="current"'</span> : <span class="string">''</span>) + <span class="string">'>'</span> + line[<span class="number">1</span>] + <span class="string">'</p>'</span>;</span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> that.<span class="property">el</span> = box.<span class="title function_">createChild</span>(<span class="string">'div'</span>, {</span><br><span class="line"> <span class="attr">className</span>: <span class="string">'inner'</span>,</span><br><span class="line"> <span class="attr">innerHTML</span>: lrc</span><br><span class="line"> }, <span class="string">'replace'</span>)</span><br><span class="line"></span><br><span class="line"> that.<span class="property">index</span> = <span class="number">0</span>;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (raw && raw.<span class="title function_">startsWith</span>(<span class="string">'http'</span>))</span><br><span class="line"> <span class="variable language_">this</span>.<span class="title function_">fetch</span>(raw, callback)</span><br><span class="line"> <span class="keyword">else</span></span><br><span class="line"> <span class="title function_">callback</span>(raw)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">update</span>: <span class="keyword">function</span> (<span class="params">currentTime</span>) {</span><br><span class="line"> <span class="keyword">if</span> (!<span class="variable language_">this</span>.<span class="property">data</span>)</span><br><span class="line"> <span class="keyword">return</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">index</span> > <span class="variable language_">this</span>.<span class="property">data</span>.<span class="property">length</span> - <span class="number">1</span> || currentTime < <span class="variable language_">this</span>.<span class="property">data</span>[<span class="variable language_">this</span>.<span class="property">index</span>][<span class="number">0</span>] || (!<span class="variable language_">this</span>.<span class="property">data</span>[<span class="variable language_">this</span>.<span class="property">index</span> + <span class="number">1</span>] || currentTime >= <span class="variable language_">this</span>.<span class="property">data</span>[<span class="variable language_">this</span>.<span class="property">index</span> + <span class="number">1</span>][<span class="number">0</span>])) {</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="number">0</span>; i < <span class="variable language_">this</span>.<span class="property">data</span>.<span class="property">length</span>; i++) {</span><br><span class="line"> <span class="keyword">if</span> (currentTime >= <span class="variable language_">this</span>.<span class="property">data</span>[i][<span class="number">0</span>] && (!<span class="variable language_">this</span>.<span class="property">data</span>[i + <span class="number">1</span>] || currentTime < <span class="variable language_">this</span>.<span class="property">data</span>[i + <span class="number">1</span>][<span class="number">0</span>])) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">index</span> = i;</span><br><span class="line"> <span class="keyword">var</span> y = -(<span class="variable language_">this</span>.<span class="property">index</span> - <span class="number">1</span>);</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="property">style</span>.<span class="property">transform</span> = <span class="string">'translateY('</span> + y + <span class="string">'rem)'</span>;</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="property">style</span>.<span class="property">webkitTransform</span> = <span class="string">'translateY('</span> + y + <span class="string">'rem)'</span>;</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">getElementsByClassName</span>(<span class="string">'current'</span>)[<span class="number">0</span>].<span class="title function_">removeClass</span>(<span class="string">'current'</span>);</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">getElementsByTagName</span>(<span class="string">'p'</span>)[i].<span class="title function_">addClass</span>(<span class="string">'current'</span>);</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">parse</span>: <span class="keyword">function</span> (<span class="params">lrc_s</span>) {</span><br><span class="line"> <span class="keyword">if</span> (lrc_s) {</span><br><span class="line"> lrc_s = lrc_s.<span class="title function_">replace</span>(<span class="regexp">/([^\]^\n])\[/g</span>, <span class="keyword">function</span> (<span class="params">match, p1</span>) { <span class="keyword">return</span> p1 + <span class="string">'\n['</span> });</span><br><span class="line"> <span class="keyword">const</span> lyric = lrc_s.<span class="title function_">split</span>(<span class="string">'\n'</span>);</span><br><span class="line"> <span class="keyword">var</span> lrc = [];</span><br><span class="line"> <span class="keyword">const</span> lyricLen = lyric.<span class="property">length</span>;</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="number">0</span>; i < lyricLen; i++) {</span><br><span class="line"> <span class="comment">// match lrc time</span></span><br><span class="line"> <span class="keyword">const</span> lrcTimes = lyric[i].<span class="title function_">match</span>(<span class="regexp">/\[(\d{2}):(\d{2})(\.(\d{2,3}))?]/g</span>);</span><br><span class="line"> <span class="comment">// match lrc text</span></span><br><span class="line"> <span class="keyword">const</span> lrcText = lyric[i]</span><br><span class="line"> .<span class="title function_">replace</span>(<span class="regexp">/.*\[(\d{2}):(\d{2})(\.(\d{2,3}))?]/g</span>, <span class="string">''</span>)</span><br><span class="line"> .<span class="title function_">replace</span>(<span class="regexp">/<(\d{2}):(\d{2})(\.(\d{2,3}))?>/g</span>, <span class="string">''</span>)</span><br><span class="line"> .<span class="title function_">replace</span>(<span class="regexp">/^\s+|\s+$/g</span>, <span class="string">''</span>);</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (lrcTimes) {</span><br><span class="line"> <span class="comment">// handle multiple time tag</span></span><br><span class="line"> <span class="keyword">const</span> timeLen = lrcTimes.<span class="property">length</span>;</span><br><span class="line"> <span class="keyword">for</span> (<span class="keyword">var</span> j = <span class="number">0</span>; j < timeLen; j++) {</span><br><span class="line"> <span class="keyword">const</span> oneTime = <span class="regexp">/\[(\d{2}):(\d{2})(\.(\d{2,3}))?]/</span>.<span class="title function_">exec</span>(lrcTimes[j]);</span><br><span class="line"> <span class="keyword">const</span> min2sec = oneTime[<span class="number">1</span>] * <span class="number">60</span>;</span><br><span class="line"> <span class="keyword">const</span> sec2sec = <span class="built_in">parseInt</span>(oneTime[<span class="number">2</span>]);</span><br><span class="line"> <span class="keyword">const</span> msec2sec = oneTime[<span class="number">4</span>] ? <span class="built_in">parseInt</span>(oneTime[<span class="number">4</span>]) / ((oneTime[<span class="number">4</span>] + <span class="string">''</span>).<span class="property">length</span> === <span class="number">2</span> ? <span class="number">100</span> : <span class="number">1000</span>) : <span class="number">0</span>;</span><br><span class="line"> <span class="keyword">const</span> lrcTime = min2sec + sec2sec + msec2sec;</span><br><span class="line"> lrc.<span class="title function_">push</span>([lrcTime, lrcText]);</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> <span class="comment">// sort by time</span></span><br><span class="line"> lrc = lrc.<span class="title function_">filter</span>(<span class="keyword">function</span> (<span class="params">item</span>) { <span class="keyword">return</span> item[<span class="number">1</span>] });</span><br><span class="line"> lrc.<span class="title function_">sort</span>(<span class="keyword">function</span> (<span class="params">a, b</span>) { <span class="keyword">return</span> a[<span class="number">0</span>] - b[<span class="number">0</span>] });</span><br><span class="line"> <span class="keyword">return</span> lrc;</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> <span class="keyword">return</span> [];</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">fetch</span>: <span class="keyword">function</span> (<span class="params">url, callback</span>) {</span><br><span class="line"> <span class="title function_">fetch</span>(url)</span><br><span class="line"> .<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params">response</span>) {</span><br><span class="line"> <span class="keyword">return</span> response.<span class="title function_">text</span>()</span><br><span class="line"> }).<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params">body</span>) {</span><br><span class="line"> <span class="title function_">callback</span>(body)</span><br><span class="line"> }).<span class="title function_">catch</span>(<span class="keyword">function</span> (<span class="params">ex</span>) { })</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> preview = {</span><br><span class="line"> <span class="attr">el</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> current = playlist.<span class="title function_">current</span>()</span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="property">innerHTML</span> = <span class="string">'<div class="cover"><div class="disc"><img src="'</span> + (current.<span class="property">cover</span>) + <span class="string">'" class="blur" /></div></div>'</span></span><br><span class="line"> + <span class="string">'<div class="info"><h4 class="title">'</span> + current.<span class="property">name</span> + <span class="string">'</h4><span>'</span> + current.<span class="property">artist</span> + <span class="string">'</span>'</span></span><br><span class="line"> + <span class="string">'<div class="lrc"></div></div>'</span></span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">'.cover'</span>).<span class="title function_">addEventListener</span>(<span class="string">'click'</span>, t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">events</span>[<span class="string">'play-pause'</span>])</span><br><span class="line"></span><br><span class="line"> lyrics.<span class="title function_">create</span>(<span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">child</span>(<span class="string">'.lrc'</span>))</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> progress = {</span><br><span class="line"> <span class="attr">el</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">bar</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">var</span> current = playlist.<span class="title function_">current</span>().<span class="property">el</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (current) {</span><br><span class="line"></span><br><span class="line"> <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">el</span>) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="property">parentNode</span>.<span class="title function_">removeClass</span>(<span class="string">'current'</span>)</span><br><span class="line"> .<span class="title function_">removeEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragStart</span>, <span class="variable language_">this</span>.<span class="property">drag</span>)</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">remove</span>()</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span> = current.<span class="title function_">createChild</span>(<span class="string">'div'</span>, {</span><br><span class="line"> <span class="attr">className</span>: <span class="string">'progress'</span></span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">attr</span>(<span class="string">'data-dtime'</span>, utils.<span class="title function_">secondToTime</span>(<span class="number">0</span>))</span><br><span class="line"></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">bar</span> = <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">createChild</span>(<span class="string">'div'</span>, {</span><br><span class="line"> <span class="attr">className</span>: <span class="string">'bar'</span>,</span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> current.<span class="title function_">addClass</span>(<span class="string">'current'</span>)</span><br><span class="line"></span><br><span class="line"> current.<span class="title function_">addEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragStart</span>, <span class="variable language_">this</span>.<span class="property">drag</span>);</span><br><span class="line"></span><br><span class="line"> playlist.<span class="title function_">scroll</span>()</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">update</span>: <span class="keyword">function</span> (<span class="params">percent</span>) {</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">bar</span>.<span class="title function_">width</span>(<span class="title class_">Math</span>.<span class="title function_">floor</span>(percent * <span class="number">100</span>) + <span class="string">'%'</span>)</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">attr</span>(<span class="string">'data-ptime'</span>, utils.<span class="title function_">secondToTime</span>(percent * source.<span class="property">duration</span>))</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">seeking</span>: <span class="keyword">function</span> (<span class="params">type</span>) {</span><br><span class="line"> <span class="keyword">if</span> (type)</span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">addClass</span>(<span class="string">'seeking'</span>)</span><br><span class="line"> <span class="keyword">else</span></span><br><span class="line"> <span class="variable language_">this</span>.<span class="property">el</span>.<span class="title function_">removeClass</span>(<span class="string">'seeking'</span>)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">percent</span>: <span class="keyword">function</span> (<span class="params">e, el</span>) {</span><br><span class="line"> <span class="keyword">var</span> percentage = ((e.<span class="property">clientX</span> || e.<span class="property">changedTouches</span>[<span class="number">0</span>].<span class="property">clientX</span>) - el.<span class="title function_">left</span>()) / el.<span class="title function_">width</span>();</span><br><span class="line"> percentage = <span class="title class_">Math</span>.<span class="title function_">max</span>(percentage, <span class="number">0</span>);</span><br><span class="line"> <span class="keyword">return</span> <span class="title class_">Math</span>.<span class="title function_">min</span>(percentage, <span class="number">1</span>)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">drag</span>: <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> e.<span class="title function_">preventDefault</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> current = playlist.<span class="title function_">current</span>().<span class="property">el</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> thumbMove = <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> e.<span class="title function_">preventDefault</span>()</span><br><span class="line"> <span class="keyword">var</span> percentage = progress.<span class="title function_">percent</span>(e, current)</span><br><span class="line"> progress.<span class="title function_">update</span>(percentage)</span><br><span class="line"> lyrics.<span class="title function_">update</span>(percentage * source.<span class="property">duration</span>);</span><br><span class="line"> };</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> thumbUp = <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> e.<span class="title function_">preventDefault</span>()</span><br><span class="line"> current.<span class="title function_">removeEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragEnd</span>, thumbUp)</span><br><span class="line"> current.<span class="title function_">removeEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragMove</span>, thumbMove)</span><br><span class="line"> <span class="keyword">var</span> percentage = progress.<span class="title function_">percent</span>(e, current)</span><br><span class="line"> progress.<span class="title function_">update</span>(percentage)</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">seek</span>(percentage * source.<span class="property">duration</span>)</span><br><span class="line"> source.<span class="property">disableTimeupdate</span> = <span class="literal">false</span></span><br><span class="line"> progress.<span class="title function_">seeking</span>(<span class="literal">false</span>)</span><br><span class="line"> };</span><br><span class="line"></span><br><span class="line"> source.<span class="property">disableTimeupdate</span> = <span class="literal">true</span></span><br><span class="line"> progress.<span class="title function_">seeking</span>(<span class="literal">true</span>)</span><br><span class="line"> current.<span class="title function_">addEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragMove</span>, thumbMove)</span><br><span class="line"> current.<span class="title function_">addEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragEnd</span>, thumbUp)</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> controller = {</span><br><span class="line"> <span class="attr">el</span>: <span class="literal">null</span>,</span><br><span class="line"> <span class="attr">btns</span>: {},</span><br><span class="line"> <span class="attr">step</span>: <span class="string">'next'</span>,</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">if</span> (!t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">controls</span>)</span><br><span class="line"> <span class="keyword">return</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span></span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">controls</span>.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">item</span>) {</span><br><span class="line"> <span class="keyword">if</span> (that.<span class="property">btns</span>[item])</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> opt = {</span><br><span class="line"> <span class="attr">onclick</span>: <span class="keyword">function</span> (<span class="params">event</span>) {</span><br><span class="line"> that.<span class="property">events</span>[item] ? that.<span class="property">events</span>[item](event) : t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">events</span>[item](event)</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">switch</span> (item) {</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'volume'</span>:</span><br><span class="line"> opt.<span class="property">className</span> = <span class="string">' '</span> + (source.<span class="property">muted</span> ? <span class="string">'off'</span> : <span class="string">'on'</span>)</span><br><span class="line"> opt.<span class="property">innerHTML</span> = <span class="string">'<div class="bar"></div>'</span></span><br><span class="line"> opt[<span class="string">'on'</span> + utils.<span class="property">nameMap</span>.<span class="property">dragStart</span>] = that.<span class="property">events</span>[<span class="string">'volume'</span>]</span><br><span class="line"> opt.<span class="property">onclick</span> = <span class="literal">null</span></span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'mode'</span>:</span><br><span class="line"> opt.<span class="property">className</span> = <span class="string">' '</span> + t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span></span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> <span class="attr">default</span>:</span><br><span class="line"> opt.<span class="property">className</span> = <span class="string">''</span></span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> opt.<span class="property">className</span> = item + opt.<span class="property">className</span> + <span class="string">' btn'</span></span><br><span class="line"></span><br><span class="line"> that.<span class="property">btns</span>[item] = that.<span class="property">el</span>.<span class="title function_">createChild</span>(<span class="string">'div'</span>, opt)</span><br><span class="line"> })</span><br><span class="line"></span><br><span class="line"> that.<span class="property">btns</span>[<span class="string">'volume'</span>].<span class="property">bar</span> = that.<span class="property">btns</span>[<span class="string">'volume'</span>].<span class="title function_">child</span>(<span class="string">'.bar'</span>)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">events</span>: {</span><br><span class="line"> <span class="attr">mode</span>: <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> <span class="keyword">switch</span> (t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span>) {</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'loop'</span>:</span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span> = <span class="string">'random'</span></span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> <span class="keyword">case</span> <span class="string">'random'</span>:</span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span> = <span class="string">'order'</span></span><br><span class="line"> <span class="keyword">break</span>;</span><br><span class="line"> <span class="attr">default</span>:</span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span> = <span class="string">'loop'</span></span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> controller.<span class="property">btns</span>[<span class="string">'mode'</span>].<span class="property">className</span> = <span class="string">'mode '</span> + t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span> + <span class="string">' btn'</span></span><br><span class="line"> store.<span class="title function_">set</span>(<span class="string">'_PlayerMode'</span>, t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span>)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">volume</span>: <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> e.<span class="title function_">preventDefault</span>()</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> current = e.<span class="property">currentTarget</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> drag = <span class="literal">false</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> thumbMove = <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> e.<span class="title function_">preventDefault</span>()</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">volume</span>(controller.<span class="title function_">percent</span>(e, current))</span><br><span class="line"> drag = <span class="literal">true</span></span><br><span class="line"> };</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> thumbUp = <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> e.<span class="title function_">preventDefault</span>()</span><br><span class="line"> current.<span class="title function_">removeEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragEnd</span>, thumbUp)</span><br><span class="line"> current.<span class="title function_">removeEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragMove</span>, thumbMove)</span><br><span class="line"> <span class="keyword">if</span> (drag) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">muted</span>()</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">volume</span>(controller.<span class="title function_">percent</span>(e, current))</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> <span class="keyword">if</span> (source.<span class="property">muted</span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">muted</span>()</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">volume</span>(source.<span class="property">volume</span>)</span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">muted</span>(<span class="string">'muted'</span>)</span><br><span class="line"> controller.<span class="title function_">update</span>(<span class="number">0</span>)</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"> };</span><br><span class="line"></span><br><span class="line"> current.<span class="title function_">addEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragMove</span>, thumbMove)</span><br><span class="line"> current.<span class="title function_">addEventListener</span>(utils.<span class="property">nameMap</span>.<span class="property">dragEnd</span>, thumbUp)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">backward</span>: <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> controller.<span class="property">step</span> = <span class="string">'prev'</span></span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">mode</span>()</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">forward</span>: <span class="keyword">function</span> (<span class="params">e</span>) {</span><br><span class="line"> controller.<span class="property">step</span> = <span class="string">'next'</span></span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">mode</span>()</span><br><span class="line"> },</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">update</span>: <span class="keyword">function</span> (<span class="params">percent</span>) {</span><br><span class="line"> controller.<span class="property">btns</span>[<span class="string">'volume'</span>].<span class="property">className</span> = <span class="string">'volume '</span> + (!source.<span class="property">muted</span> && percent > <span class="number">0</span> ? <span class="string">'on'</span> : <span class="string">'off'</span>) + <span class="string">' btn'</span></span><br><span class="line"> controller.<span class="property">btns</span>[<span class="string">'volume'</span>].<span class="property">bar</span>.<span class="title function_">width</span>(<span class="title class_">Math</span>.<span class="title function_">floor</span>(percent * <span class="number">100</span>) + <span class="string">'%'</span>)</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">percent</span>: <span class="keyword">function</span> (<span class="params">e, el</span>) {</span><br><span class="line"> <span class="keyword">var</span> percentage = ((e.<span class="property">clientX</span> || e.<span class="property">changedTouches</span>[<span class="number">0</span>].<span class="property">clientX</span>) - el.<span class="title function_">left</span>()) / el.<span class="title function_">width</span>();</span><br><span class="line"> percentage = <span class="title class_">Math</span>.<span class="title function_">max</span>(percentage, <span class="number">0</span>);</span><br><span class="line"> <span class="keyword">return</span> <span class="title class_">Math</span>.<span class="title function_">min</span>(percentage, <span class="number">1</span>);</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> events = {</span><br><span class="line"> <span class="attr">onerror</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="comment">//自己修改-start</span></span><br><span class="line"> <span class="keyword">var</span> item = playlist.<span class="title function_">current</span>();</span><br><span class="line"> <span class="keyword">if</span> (!item.<span class="property">repair</span> && item.<span class="property">company</span> && item.<span class="property">company</span> == <span class="string">"netease"</span>) {</span><br><span class="line"> <span class="keyword">var</span> id = item.<span class="property">url</span>.<span class="title function_">substring</span>(item.<span class="property">url</span>.<span class="title function_">indexOf</span>(<span class="string">"id="</span>) + <span class="number">3</span>, item.<span class="property">url</span>.<span class="title function_">indexOf</span>(<span class="string">"&auth="</span>));</span><br><span class="line"> item.<span class="property">url</span> = <span class="string">"https://music.163.com/song/media/outer/url?id="</span> + id; <span class="comment">// 修正的网易云url</span></span><br><span class="line"> item.<span class="property">pic</span> = <span class="string">"https://p3.music.126.net/Vji3PQJAZ2C7gS_6X51NFQ==/109951164723650033.jpg?param=200y200"</span>; <span class="comment">//使用网易云上固定的一张封面</span></span><br><span class="line"> item.<span class="property">cover</span> = item.<span class="property">pic</span>;</span><br><span class="line"> item.<span class="property">repair</span> = <span class="literal">true</span>; <span class="comment">// 已修正</span></span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">init</span>(); <span class="comment">// 重新播放</span></span><br><span class="line"> } <span class="keyword">else</span> {</span><br><span class="line"> playlist.<span class="title function_">error</span>()</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">mode</span>()</span><br><span class="line"> }</span><br><span class="line"> <span class="comment">//自己修改-end</span></span><br><span class="line"> },</span><br><span class="line"> <span class="attr">ondurationchange</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">if</span> (source.<span class="property">duration</span> !== <span class="number">1</span>) {</span><br><span class="line"> progress.<span class="property">el</span>.<span class="title function_">attr</span>(<span class="string">'data-dtime'</span>, utils.<span class="title function_">secondToTime</span>(source.<span class="property">duration</span>))</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">onloadedmetadata</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">seek</span>(<span class="number">0</span>)</span><br><span class="line"> progress.<span class="property">el</span>.<span class="title function_">attr</span>(<span class="string">'data-dtime'</span>, utils.<span class="title function_">secondToTime</span>(source.<span class="property">duration</span>))</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">onplay</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> t.<span class="property">parentNode</span>.<span class="title function_">addClass</span>(<span class="string">'playing'</span>)</span><br><span class="line"> <span class="title function_">showtip</span>(<span class="variable language_">this</span>.<span class="title function_">attr</span>(<span class="string">'title'</span>))</span><br><span class="line"> <span class="variable constant_">NOWPLAYING</span> = t</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">onpause</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> t.<span class="property">parentNode</span>.<span class="title function_">removeClass</span>(<span class="string">'playing'</span>)</span><br><span class="line"> <span class="variable constant_">NOWPLAYING</span> = <span class="literal">null</span></span><br><span class="line"> },</span><br><span class="line"> <span class="attr">ontimeupdate</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">if</span> (!<span class="variable language_">this</span>.<span class="property">disableTimeupdate</span>) {</span><br><span class="line"> progress.<span class="title function_">update</span>(<span class="variable language_">this</span>.<span class="property">currentTime</span> / <span class="variable language_">this</span>.<span class="property">duration</span>)</span><br><span class="line"> lyrics.<span class="title function_">update</span>(<span class="variable language_">this</span>.<span class="property">currentTime</span>)</span><br><span class="line"> }</span><br><span class="line"> },</span><br><span class="line"> <span class="attr">onended</span>: <span class="keyword">function</span> (<span class="params">argument</span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">mode</span>()</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">play</span>()</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> buttons = {</span><br><span class="line"> <span class="attr">el</span>: {},</span><br><span class="line"> <span class="attr">create</span>: <span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> <span class="keyword">if</span> (!t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">btns</span>)</span><br><span class="line"> <span class="keyword">return</span></span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> that = <span class="variable language_">this</span></span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">btns</span>.<span class="title function_">forEach</span>(<span class="keyword">function</span> (<span class="params">item</span>) {</span><br><span class="line"> <span class="keyword">if</span> (that.<span class="property">el</span>[item])</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"></span><br><span class="line"> that.<span class="property">el</span>[item] = t.<span class="title function_">createChild</span>(<span class="string">'div'</span>, {</span><br><span class="line"> <span class="attr">className</span>: item + <span class="string">' btn'</span>,</span><br><span class="line"> <span class="attr">onclick</span>: <span class="keyword">function</span> (<span class="params">event</span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="title function_">fetch</span>().<span class="title function_">then</span>(<span class="keyword">function</span> (<span class="params"></span>) {</span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">events</span>[item](event)</span><br><span class="line"> })</span><br><span class="line"> }</span><br><span class="line"> });</span><br><span class="line"> });</span><br><span class="line"> }</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="keyword">var</span> init = <span class="keyword">function</span> (<span class="params">config</span>) {</span><br><span class="line"> <span class="keyword">if</span> (t.<span class="property">player</span>.<span class="property">created</span>)</span><br><span class="line"> <span class="keyword">return</span>;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span> = <span class="title class_">Object</span>.<span class="title function_">assign</span>(option, config);</span><br><span class="line"> t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span> = store.<span class="title function_">get</span>(<span class="string">'_PlayerMode'</span>) || t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">mode</span></span><br><span class="line"></span><br><span class="line"> <span class="comment">// 初始化button、controls以及click事件</span></span><br><span class="line"> buttons.<span class="title function_">create</span>()</span><br><span class="line"></span><br><span class="line"> <span class="comment">// 初始化audio or video</span></span><br><span class="line"> source = t.<span class="title function_">createChild</span>(t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">type</span>, events);</span><br><span class="line"> <span class="comment">// 初始化播放列表、预览、控件按钮等</span></span><br><span class="line"> info.<span class="title function_">create</span>();</span><br><span class="line"></span><br><span class="line"> t.<span class="property">parentNode</span>.<span class="title function_">addClass</span>(t.<span class="property">player</span>.<span class="property">options</span>.<span class="property">type</span>)</span><br><span class="line"></span><br><span class="line"> t.<span class="property">player</span>.<span class="property">created</span> = <span class="literal">true</span>;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> <span class="title function_">init</span>(config)</span><br><span class="line"></span><br><span class="line"> <span class="keyword">return</span> t;</span><br><span class="line">}</span><br></pre></td></tr></table></figure><p></p><div class="tags"><a href="/tags/%E5%8D%9A%E5%AE%A2/" rel="tag"><i class="ic i-tag"></i> 博客</a> <a href="/tags/Hexo/" rel="tag"><i class="ic i-tag"></i> Hexo</a> <a href="/tags/Shoka/" rel="tag"><i class="ic i-tag"></i> Shoka</a> <a href="/tags/%E8%83%8C%E6%99%AF%E9%9F%B3%E4%B9%90/" rel="tag"><i class="ic i-tag"></i> 背景音乐</a></div></div><footer><div class="meta"><span class="item"><span class="icon"><i class="ic i-calendar-check"></i> </span><span class="text">更新于</span> <time title="修改时间：2022-11-11 12:42:29" itemprop="dateModified" datetime="2022-11-11T12:42:29+08:00">2022-11-11</time> </span><span id="2022/09/26/解决Hexo-Shoka背景音乐无法播放的问题/" class="item leancloud_visitors" data-flag-title="解决 Hexo+Shoka 背景音乐无法播放的问题" title="阅读次数"><span class="icon"><i class="ic i-eye"></i> </span><span class="text">阅读次数</span> <span class="leancloud-visitors-count"></span> <span class="text">次</span></span></div><div class="reward"><button><i class="ic i-heartbeat"></i> 赞赏</button><p>请我喝[茶]~(￣▽￣)~*</p><div id="qr"><div><img data-src="/images/wechatpay.png" alt="Hito Li 微信支付"><p>微信支付</p></div><div><img data-src="/images/alipay.png" alt="Hito Li 支付宝"><p>支付宝</p></div></div></div><div id="copyright"><ul><li class="author"><strong>本文作者： </strong>Hito li <i class="ic i-at"><em>@</em></i>涛声依旧</li><li class="link"><strong>本文链接：</strong> <a href="https://hitoli.com/2022/09/26/%E8%A7%A3%E5%86%B3Hexo-Shoka%E8%83%8C%E6%99%AF%E9%9F%B3%E4%B9%90%E6%97%A0%E6%B3%95%E6%92%AD%E6%94%BE%E7%9A%84%E9%97%AE%E9%A2%98/" title="解决 Hexo+Shoka 背景音乐无法播放的问题">https://hitoli.com/2022/09/26/解决Hexo-Shoka背景音乐无法播放的问题/</a></li><li class="license"><strong>版权声明： </strong>本站所有文章除特别声明外，均采用 <span class="exturl" data-url="aHR0cHM6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL2xpY2Vuc2VzL2J5LW5jLXNhLzQuMC9kZWVkLnpo"><i class="ic i-creative-commons"><em>(CC)</em></i>BY-NC-SA</span> 许可协议。转载请注明出处！</li></ul></div></footer></article></div><div class="post-nav"><div class="item left"><a href="/2022/09/23/%E8%A7%A3%E5%86%B3%E5%9F%9F%E5%90%8Dip%E5%8F%98%E5%8A%A8%E5%90%8E%E9%9C%80%E8%A6%81%E9%87%8D%E5%90%AFnginx%E7%9A%84%E9%97%AE%E9%A2%98/" itemprop="url" rel="prev" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1giclga70tsj20zk0m84mr.jpg" title="解决域名ip变动后需要重启nginx的问题"><span class="type">上一篇</span> <span class="category"><i class="ic i-flag"></i> Nginx</span><h3>解决域名ip变动后需要重启nginx的问题</h3></a></div><div class="item right"><a href="/2022/09/27/nginx%E8%B4%9F%E8%BD%BD%E5%9D%87%E8%A1%A1%E9%85%8D%E7%BD%AE/" itemprop="url" rel="next" data-background-image="https://nas.hitoli.com:18014/images/2022/10/29/6833939bly1giclgi503lj20zk0m8hdt.jpg" title="nginx负载均衡配置"><span class="type">下一篇</span> <span class="category"><i class="ic i-flag"></i> Nginx</span><h3>nginx负载均衡配置</h3></a></div></div><div class="wrap" id="comments"></div></div><div id="sidebar"><div class="inner"><div class="panels"><div class="inner"><div class="contents panel pjax" data-title="文章目录"><ol class="toc"><li class="toc-item toc-level-4"><a class="toc-link" href="#%E9%97%AE%E9%A2%98%E6%8F%8F%E8%BF%B0"><span class="toc-number">1.</span> <span class="toc-text">问题描述</span></a></li><li class="toc-item toc-level-4"><a class="toc-link" href="#%E8%A7%A3%E5%86%B3%E6%96%B9%E6%B3%95"><span class="toc-number">2.</span> <span class="toc-text">解决方法</span></a></li></ol></div><div class="related panel pjax" data-title="系列文章"><ul><li><a href="/2022/09/14/Hexo%E5%AE%89%E8%A3%85%E6%91%B8%E7%B4%A2/" rel="bookmark" title="Hexo安装摸索">Hexo安装摸索</a></li><li><a href="/2022/09/17/Hexo-Theme-Shoka-algolia%E6%90%9C%E7%B4%A2%E8%B8%A9%E5%9D%91/" rel="bookmark" title="Hexo + Theme.Shoka + algolia搜索踩坑">Hexo + Theme.Shoka + algolia搜索踩坑</a></li><li class="active"><a href="/2022/09/26/%E8%A7%A3%E5%86%B3Hexo-Shoka%E8%83%8C%E6%99%AF%E9%9F%B3%E4%B9%90%E6%97%A0%E6%B3%95%E6%92%AD%E6%94%BE%E7%9A%84%E9%97%AE%E9%A2%98/" rel="bookmark" title="解决Hexo+Shoka背景音乐无法播放的问题">解决Hexo+Shoka背景音乐无法播放的问题</a></li><li><a href="/2022/10/21/Hexo-Theme-Shoka-Valine%E8%AF%84%E8%AE%BA%E9%85%8D%E7%BD%AE/" rel="bookmark" title="Hexo + Theme.Shoka + Valine评论配置">Hexo + Theme.Shoka + Valine评论配置</a></li><li><a href="/2023/07/01/shoka%E4%B8%BB%E9%A2%98%E9%80%9F%E5%BA%A6%E4%BC%98%E5%8C%96-%E6%8B%86%E5%88%86jsdelivr/" rel="bookmark" title="shoka主题速度优化-拆分jsdelivr">shoka主题速度优化-拆分jsdelivr</a></li></ul></div><div class="overview panel" data-title="站点概览"><div class="author" itemprop="author" itemscope itemtype="http://schema.org/Person"><img class="image" itemprop="image" alt="Hito Li" data-src="/images/avatar.jpg"><p class="name" itemprop="name">Hito Li</p><div class="description" itemprop="description">天生我材必有用</div></div><nav class="state"><div class="item posts"><a href="/archives/"><span class="count">54</span> <span class="name">文章</span></a></div><div class="item categories"><a href="/categories/"><span class="count">22</span> <span class="name">分类</span></a></div><div class="item tags"><a href="/tags/"><span class="count">92</span> <span class="name">标签</span></a></div></nav><div class="social"><span class="exturl item weibo" data-url="aHR0cHM6Ly93ZWliby5jb20vdS8xMDYxNDYwNzQ1" title="https://weibo.com/u/1061460745"><i class="ic i-weibo"></i></span> <span class="exturl item douban" data-url="aHR0cHM6Ly93d3cuZG91YmFuLmNvbS9wZW9wbGUvMjU5Mzc2NTY0" title="https://www.douban.com/people/259376564"><i class="ic i-douban"></i></span> <span class="exturl item music" data-url="aHR0cHM6Ly9tdXNpYy4xNjMuY29tLyMvdXNlci9ob21lP2lkPTEwNTQ2NzQ2Mw==" title="https://music.163.com/#/user/home?id=105467463"><i class="ic i-cloud-music"></i></span> <a href="/about/me" title="about/me" class="item about"><i class="ic i-address-card"></i></a></div><ul class="menu"><li class="item"><a href="/" rel="section"><i class="ic i-home"></i>首页</a></li><li class="item dropdown"><a href="javascript:void(0);"><i class="ic i-feather"></i>文章</a><ul class="submenu"><li class="item"><a href="/archives/" rel="section"><i class="ic i-list-alt"></i>归档</a></li><li class="item"><a href="/categories/" rel="section"><i class="ic i-th"></i>分类</a></li><li class="item"><a href="/tags/" rel="section"><i class="ic i-tags"></i>标签</a></li></ul></li><li class="item"><a href="/tools/" rel="section"><i class="ic i-magic"></i>工具</a></li><li class="item"><span class="exturl" data-url="aHR0cHM6Ly93d3cuZm9yZXZlcmJsb2cuY24vZ28uaHRtbA=="><i class="ic i-paper-plane"></i>虫洞</span></li><li class="item"><a href="/about/me" rel="section"><i class="ic i-user"></i>关于</a></li></ul></div></div></div><ul id="quick"><li class="prev pjax"><a href="/2022/09/23/%E8%A7%A3%E5%86%B3%E5%9F%9F%E5%90%8Dip%E5%8F%98%E5%8A%A8%E5%90%8E%E9%9C%80%E8%A6%81%E9%87%8D%E5%90%AFnginx%E7%9A%84%E9%97%AE%E9%A2%98/" rel="prev" title="上一篇"><i class="ic i-chevron-left"></i></a></li><li class="up"><i class="ic i-arrow-up"></i></li><li class="down"><i class="ic i-arrow-down"></i></li><li class="next pjax"><a href="/2022/09/27/nginx%E8%B4%9F%E8%BD%BD%E5%9D%87%E8%A1%A1%E9%85%8D%E7%BD%AE/" rel="next" title="下一篇"><i class="ic i-chevron-right"></i></a></li><li class="percent"></li></ul></div></div><div class="dimmer"></div></div></main><footer id="footer"><div class="inner"><div class="widgets"><div class="rpost pjax"><h2>随机文章</h2><ul><li class="item"><div class="breadcrumb"><a href="/categories/Windows/" title="分类于 Windows">Windows</a> <i class="ic i-angle-right"></i> <a href="/categories/Windows/%E5%B7%A5%E5%85%B7/" title="分类于 工具">工具</a></div><span><a href="/2023/10/28/Windows%E4%B8%8B%E5%BF%AB%E9%80%9F%E9%83%A8%E7%BD%B2SpringBoot%E9%A1%B9%E7%9B%AE%E7%9A%84%E6%89%B9%E5%A4%84%E7%90%86/" title="Windows下快速部署SpringBoot项目的批处理">Windows下快速部署SpringBoot项目的批处理</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E5%B7%A5%E4%BD%9C/" title="分类于 工作">工作</a> <i class="ic i-angle-right"></i> <a href="/categories/%E5%B7%A5%E4%BD%9C/KLineChart/" title="分类于 KLineChart">KLineChart</a></div><span><a href="/2023/01/31/KLineChart%E7%94%BB%E6%B3%A2%E6%AE%B5%E9%AB%98%E4%BD%8E%E4%BB%B7%E5%9B%BE/" title="KLineChart画波段高低价图">KLineChart画波段高低价图</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/" title="分类于 极空间">极空间</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/" title="分类于 Docker">Docker</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/Hexo/" title="分类于 Hexo">Hexo</a></div><span><a href="/2022/09/14/Hexo%E5%AE%89%E8%A3%85%E6%91%B8%E7%B4%A2/" title="Hexo安装摸索">Hexo安装摸索</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/" title="分类于 极空间">极空间</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/" title="分类于 Docker">Docker</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/Hexo/" title="分类于 Hexo">Hexo</a></div><span><a href="/2022/10/21/Hexo-Theme-Shoka-Valine%E8%AF%84%E8%AE%BA%E9%85%8D%E7%BD%AE/" title="Hexo + Theme.Shoka + Valine评论配置">Hexo + Theme.Shoka + Valine评论配置</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E5%B7%A5%E4%BD%9C/" title="分类于 工作">工作</a> <i class="ic i-angle-right"></i> <a href="/categories/%E5%B7%A5%E4%BD%9C/KLineChart/" title="分类于 KLineChart">KLineChart</a></div><span><a href="/2022/11/24/KLineChart%E5%AE%9E%E7%8E%B0%E4%B8%80%E5%B9%85%E5%9B%BE%E4%B8%8A%E7%94%BB%E5%A4%9A%E4%B8%AA%E8%9C%A1%E7%83%9BK%E7%BA%BF/" title="KLineChart实现一幅图上画多个蜡烛K线">KLineChart实现一幅图上画多个蜡烛K线</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/" title="分类于 极空间">极空间</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/" title="分类于 Docker">Docker</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/Hexo/" title="分类于 Hexo">Hexo</a></div><span><a href="/2023/07/01/shoka%E4%B8%BB%E9%A2%98%E9%80%9F%E5%BA%A6%E4%BC%98%E5%8C%96-%E6%8B%86%E5%88%86jsdelivr/" title="shoka主题速度优化-拆分jsdelivr">shoka主题速度优化-拆分jsdelivr</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E5%B7%A5%E4%BD%9C/" title="分类于 工作">工作</a> <i class="ic i-angle-right"></i> <a href="/categories/%E5%B7%A5%E4%BD%9C/Vue/" title="分类于 Vue">Vue</a></div><span><a href="/2022/11/09/Vue%E6%8C%89%E7%8E%AF%E5%A2%83%E8%AE%BE%E7%BD%AE%E7%BC%96%E8%AF%91%E9%A1%B9%E7%9B%AE/" title="Vue按环境设置编译项目">Vue按环境设置编译项目</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/" title="分类于 极空间">极空间</a> <i class="ic i-angle-right"></i> <a href="/categories/%E6%9E%81%E7%A9%BA%E9%97%B4/Docker/" title="分类于 Docker">Docker</a></div><span><a href="/2022/09/16/%E6%9E%81%E7%A9%BA%E9%97%B4chevereto%E5%9B%BE%E5%BA%8Adocker%E7%89%88%E5%AE%89%E8%A3%85/" title="极空间chevereto图床docker版安装">极空间chevereto图床docker版安装</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/%E5%B7%A5%E4%BD%9C/" title="分类于 工作">工作</a> <i class="ic i-angle-right"></i> <a href="/categories/%E5%B7%A5%E4%BD%9C/Vue/" title="分类于 Vue">Vue</a></div><span><a href="/2022/11/04/%E8%AE%B0%E4%B8%80%E6%AC%A1Vue%E9%A1%B9%E7%9B%AE%E7%9A%84%E9%83%A8%E7%BD%B2/" title="记一次Vue项目的部署">记一次Vue项目的部署</a></span></li><li class="item"><div class="breadcrumb"><a href="/categories/Windows/" title="分类于 Windows">Windows</a> <i class="ic i-angle-right"></i> <a href="/categories/Windows/%E5%B7%A5%E5%85%B7/" title="分类于 工具">工具</a></div><span><a href="/2022/10/12/%E4%BD%BF%E7%94%A8picgo%E4%B8%8A%E4%BC%A0%E5%9B%BE%E7%89%87%E5%88%B0chevereto/" title="使用PicGo上传图片到chevereto">使用PicGo上传图片到chevereto</a></span></li></ul></div><div><h2>最新评论</h2><ul class="leancloud-recent-comment"></ul></div></div><div class="status"><div class="copyright">© 2010 – <span itemprop="copyrightYear">2024</span> <span class="with-love"><i class="ic i-sakura rotate"></i> </span><span class="author" itemprop="copyrightHolder">Hito Li @ ☆∵∴Hito∴∵★</span></div><div class="count"><span class="post-meta-item-icon"><i class="ic i-chart-area"></i> </span><span title="站点总字数">121k 字</span> <span class="post-meta-divider">|</span> <span class="post-meta-item-icon"><i class="ic i-coffee"></i> </span><span title="站点阅读时长">1:50</span></div><div class="powered-by">基于 <span class="exturl" data-url="aHR0cHM6Ly9oZXhvLmlv">Hexo</span> & Theme.<span class="exturl" data-url="aHR0cHM6Ly9naXRodWIuY29tL2FtZWhpbWUvaGV4by10aGVtZS1zaG9rYQ==">Shoka</span></div></div></div></footer></div><script data-config type="text/javascript">var LOCAL={path:"2022/09/26/解决Hexo-Shoka背景音乐无法播放的问题/",favicon:{show:"（●´3‘●）哎呀呀",hide:"(´Д｀)真糟糕！"},search:{placeholder:"文章搜索",empty:"关于 「 ${query} 」，什么也没搜到",stats:"${time} ms 内找到 ${hits} 条结果"},valine:!0,fancybox:!0,copyright:'复制成功，转载请遵守 <i class="ic i-creative-commons"></i>BY-NC-SA 协议。',ignores:[function(e){return e.includes("#")},function(e){return new RegExp(LOCAL.path+"$").test(e)}]}</script><script src="https://nas.hitoli.com:18003/assets/polyfill.js"></script><script src="https://nas.hitoli.com:18003/assets/pace.min.js"></script><script src="https://nas.hitoli.com:18003/assets/pjax.min.js"></script><script src="https://nas.hitoli.com:18003/assets/fetch.umd.js"></script><script src="https://nas.hitoli.com:18003/assets/anime.min.js"></script><script src="https://nas.hitoli.com:18003/assets/algoliasearch-lite.umd.min.js"></script><script src="https://nas.hitoli.com:18003/assets/instantsearch.production.min.js"></script><script src="https://nas.hitoli.com:18003/assets/lozad.min.js"></script><script src="https://nas.hitoli.com:18003/assets/quicklink.umd.min.js"></script><script src="https://nas.hitoli.com:18003/assets/jquery.min.js,jquery.fancybox.min.js,jquery.justifiedGallery.min.js" async></script><script src="https://nas.hitoli.com:18003/assets/MiniValine.min.js"></script><script src="https://nas.hitoli.com:18003/assets/copy-tex.min.js" async></script><script src="https://nas.hitoli.com:18003/assets/frappe-charts.min.iife.js"></script><script src="/js/app.js?v=0.0.0"></script></body></html> |