6c3d1b55b9
* continue to play next after playing all songs in shuffle list * add playlist to song list * dedupe song list after adding
491 lines
27 KiB
HTML
491 lines
27 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en" ng-app="listenone">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
|
||
<meta name="description" content="">
|
||
<meta name="author" content="">
|
||
|
||
<title ng-bind="page_title">Listen 1</title>
|
||
|
||
<link href="css/bootstrap.min.css" rel="stylesheet">
|
||
<link href="css/angular-ui-notification.css" rel="stylesheet">
|
||
|
||
<link href="css/cover.css" rel="stylesheet">
|
||
<link href="css/player.css" rel="stylesheet">
|
||
<link href="css/hotkeys.css" rel="stylesheet">
|
||
|
||
<script type="text/javascript" src="js/vendor/jquery-1.12.2.js"></script>
|
||
<script type="text/javascript" src="js/vendor/angular.min.js"></script>
|
||
<script type="text/javascript" src="js/vendor/angular-soundmanager2.js"></script>
|
||
<script type="text/javascript" src="js/vendor/angular-ui-notification.js"></script>
|
||
<script type="text/javascript" src="js/vendor/hotkeys.js"></script>
|
||
<script type="text/javascript" src="js/vendor/md5.js"></script>
|
||
<script type="text/javascript" src="js/vendor/aes.js"></script>
|
||
<script type="text/javascript" src="js/vendor/bigint.js"></script>
|
||
<script type="text/javascript" src="js/vendor/timer.js"></script>
|
||
|
||
<script type="text/javascript" src="js/github_api.js"></script>
|
||
<script type="text/javascript" src="js/github.js"></script>
|
||
<script type="text/javascript" src="js/lastfm.js"></script>
|
||
|
||
<script type="text/javascript" src="js/lowebutil.js"></script>
|
||
<script type="text/javascript" src="js/provider/xiami.js"></script>
|
||
<script type="text/javascript" src="js/provider/qq.js"></script>
|
||
<script type="text/javascript" src="js/provider/netease.js"></script>
|
||
|
||
<script type="text/javascript" src="js/myplaylist.js"></script>
|
||
<script type="text/javascript" src="js/loweb.js"></script>
|
||
<script type="text/javascript" src="js/app.js"></script>
|
||
|
||
</head>
|
||
|
||
<body ng-controller="NavigationController">
|
||
|
||
<!-- dialog -->
|
||
<div class="shadow" ng-hide="is_dialog_hidden==1"></div>
|
||
<div class="dialog" ng-hide="is_dialog_hidden==1" ng-style="myStyle">
|
||
<div class="dialog-header"> <span>{{ dialog_title }}</span> <span class="dialog-close" ng-click="closeDialog()">×</span></div>
|
||
<div class="dialog-body">
|
||
|
||
<!-- choose playlist dialog -->
|
||
<ul class="dialog-playlist" ng-show="dialog_type==0">
|
||
<li class="detail-add" ng-click="newDialogOption(1)">
|
||
<img src="images/mycover.jpg" />
|
||
<h2> 新建歌单 </h2>
|
||
</li>
|
||
<li ng-repeat="playlist in myplaylist track by $index" ng-class-odd="'odd'" ng-class-even="'even'" ng-click="chooseDialogOption(playlist.info.id)">
|
||
<img ng-src="{{ playlist.info.cover_img_url }}" />
|
||
<h2> {{ playlist.info.title }} </h2>
|
||
</li>
|
||
</ul>
|
||
|
||
<!-- create new playlist dialog -->
|
||
<div ng-show="dialog_type==1" class="dialog-newplaylist">
|
||
<input type="text" class="form-control" placeholder="输入歌单名称" ng-model="newlist_title"/>
|
||
<button class="btn btn-primary confirm-button" ng-click="createAndAddPlaylist()">创建并添加</button>
|
||
<button class="btn btn-default" ng-click="cancelNewDialog(0)">取消</button>
|
||
</div>
|
||
|
||
<!-- login douban dialog -->
|
||
<!-- <div ng-show="dialog_type==2" class="dbimport" ng-controller="ImportController" ng-init="getLoginInfo()" >
|
||
<form class="form-signin" name="loginForm" ng-submit="loginForm.$valid && loginDouban()" novalidate ng-show="!isDoubanLogin">
|
||
<label for="inputEmail" class="sr-only">邮件地址</label>
|
||
<input type="email" id="inputEmail" class="form-control" name="email" placeholder="登录邮箱" ng-model="session.user" required autofocus>
|
||
<label for="inputPassword" class="sr-only">密码</label>
|
||
<input type="password" id="inputPassword" class="form-control" placeholder="密码" ng-model="session.password" required>
|
||
<img ng-src="{{validcode_url}}" class="valid-img" ng-click="getLoginInfo()">
|
||
<label for="captchaSolution" class="sr-only">验证码</label>
|
||
<input type="text" id="captchaSolution" class="form-control" placeholder="请输入验证码，看不清请点击图片" ng-model="session.solution" required>
|
||
<button class="btn btn-lg btn-primary btn-block" type="submit" ng-disabled="!loginForm.$valid">登录</button>
|
||
<p class='security-notice'>注：本软件不保存和传输密码给除豆瓣以外的任何组织和个人。</p>
|
||
</form>
|
||
<button class="btn btn-lg btn-primary btn-block" ng-click="importDoubanFav()" ng-show="isDoubanLogin">导入红心兆赫到我的歌单</button>
|
||
<button class="btn btn-lg btn-primary btn-block" ng-click="logoutDouban()" ng-show="isDoubanLogin">退出登录</button>
|
||
<p ng-show="isDoubanLogin">{{ status }}</p>
|
||
</div> -->
|
||
|
||
<!-- edit playlist dialog -->
|
||
<div ng-show="dialog_type==3" class="dialog-editplaylist">
|
||
<div class="form-group">
|
||
<label >标题</label>
|
||
<input type="text" class="form-control" placeholder="输入歌单名称" ng-model="dialog_playlist_title"/>
|
||
</div>
|
||
<div class="form-group">
|
||
<label >封面图片url</label>
|
||
<input type="text" class="form-control" placeholder="输入歌单名称" ng-model="dialog_cover_img_url"/>
|
||
</div>
|
||
|
||
<button class="btn btn-primary confirm-button" ng-click="editMyPlaylist(list_id)">修改歌单</button>
|
||
<button class="btn btn-default" ng-click="closeDialog()">取消</button>
|
||
<div class='dialog-footer'>
|
||
<button class="btn btn-danger remove-button" ng-click="removeMyPlaylist(list_id)">删除歌单</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div ng-show="dialog_type==4" class="dialog-connect-lastfm">
|
||
<p>正在打开Last.fm页面...</p>
|
||
<p>请在打开的页面点击"Yes, all access", 允许Listen 1访问你的账户。</p>
|
||
<div class="buttons">
|
||
<button class="btn btn-primary confirm-button" ng-click="lastfm.updateStatus();closeDialog();">已经完成授权</button>
|
||
<button class="btn btn-warning warning-button" ng-click="lastfm.getAuth();">遇到问题，再次打开授权页</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- open playlist dialog -->
|
||
<div ng-show="dialog_type==5" class="dialog-open-url">
|
||
<div class="form-group">
|
||
<label >歌单链接</label>
|
||
<input type="text" class="form-control" placeholder="例如http://www.xiami.com/collect/198267231" ng-model="dialog_url"/>
|
||
</div>
|
||
|
||
<button class="btn btn-primary confirm-button" ng-click="openUrl(dialog_url);closeDialog();">打开歌单</button>
|
||
<button class="btn btn-default" ng-click="closeDialog()">取消</button>
|
||
</div>
|
||
|
||
<ul ng-show="dialog_type==6" class="dialog-merge-playlist">
|
||
<li ng-repeat="playlist in myplaylist track by $index" ng-class-odd="'odd'" ng-class-even="'even'" ng-click="mergePlaylist(playlist.info.id)">
|
||
<img ng-src="{{ playlist.info.cover_img_url }}" />
|
||
<h2> {{ playlist.info.title }} </h2>
|
||
</li>
|
||
</ul>
|
||
|
||
<div ng-show="dialog_type==7" class="dialog-connect-github">
|
||
<p>正在打开Github.com页面...</p>
|
||
<p>请在打开的页面点击"Authencate", 允许Listen 1访问你的账户。</p>
|
||
<div class="buttons">
|
||
<button class="btn btn-primary confirm-button" ng-click="github.updateStatus();closeDialog();">已经完成授权</button>
|
||
<button class="btn btn-warning warning-button" ng-click="github.openAuthUrl();">遇到问题，再次打开授权页</button>
|
||
</div>
|
||
</div>
|
||
|
||
<ul class="dialog-backuplist" ng-show="dialog_type==8">
|
||
<li class="detail-add" ng-click="newDialogOption(9)">
|
||
<img src="images/mycover.jpg" />
|
||
<h2> 新建歌单备份 </h2>
|
||
</li>
|
||
<li ng-repeat="backup in myBackup track by $index" ng-class-odd="'odd'" ng-class-even="'even'" ng-click="backupMySettings2Gist(backup.id, backup.public); closeDialog();">
|
||
<img ng-src="images/mycover.jpg" />
|
||
<h2> {{ backup.id }} {{backup.description}}</h2>
|
||
</li>
|
||
</ul>
|
||
|
||
<!-- create new backup dialog -->
|
||
<div ng-show="dialog_type==9" class="dialog-newbackup">
|
||
<button class="btn btn-primary confirm-button" ng-click="backupMySettings2Gist(null, true);closeDialog();">创建公开备份</button>
|
||
<button class="btn btn-primary confirm-button" ng-click="backupMySettings2Gist(null, false);closeDialog();">创建私有备份</button>
|
||
<button class="btn btn-default" ng-click="cancelNewDialog(8)">取消</button>
|
||
</div>
|
||
|
||
<ul class="dialog-backuplist" ng-show="dialog_type==10">
|
||
<li ng-repeat="backup in myBackup track by $index" ng-class-odd="'odd'" ng-class-even="'even'" ng-click="importMySettingsFromGist(backup.id); closeDialog();">
|
||
<img ng-src="images/mycover.jpg" />
|
||
<h2> {{ backup.id }} {{backup.description}}</h2>
|
||
</li>
|
||
</ul>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- page header -->
|
||
<div class="masthead clearfix">
|
||
<div class="inner">
|
||
<img class="logo" src="images/logo.png" ng-click="showTag(2)" />
|
||
<h3 class="masthead-brand" ng-click="showTag(2)">Listen 1</h3>
|
||
<nav>
|
||
<ul class="nav masthead-nav">
|
||
<li ng-class="{ 'active':current_tag==2 }"><a ng-click="showTag(2)">精选歌单</a></li>
|
||
<li ng-class="{ 'active':current_tag==1 }"><a ng-click="showTag(1)">我的歌单</a></li>
|
||
<li ng-class="{ 'active':current_tag==3 }"><a ng-click="showTag(3)">快速搜索</a></li>
|
||
<li ng-class="{ 'active':current_tag==4 }"><a ng-click="showTag(4)">关于</a></li>
|
||
</ul>
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- content page: 我的歌单 -->
|
||
<div class="site-wrapper" ng-show="current_tag==1" ng-controller="MyPlayListController">
|
||
<div class="cover-container container-placeholder">
|
||
<!-- make empty placeholder div to position sidebar -->
|
||
<div class="source-list" ng-show="is_window_hidden==1">
|
||
<div class="open-url-button" ng-click="showDialog(5)">打开歌单</div>
|
||
</div>
|
||
</div>
|
||
<div class="site-wrapper-innerd" resize>
|
||
<div class="cover-container">
|
||
<div class="playlist" ng-init="loadMyPlaylist();">
|
||
<ul class="playlist-covers">
|
||
<li ng-repeat="i in myplaylists track by $index">
|
||
<div class="u-cover">
|
||
<img ng-src="{{i.info.cover_img_url}}">
|
||
<a title="" class="mask" ng-click="showPlaylist(i.info.id)"></a>
|
||
<div class="bottom">
|
||
<span class="icon-headset"></span>
|
||
<a class="icon-play" ng-click="directplaylist(i.info.id)" title="播放"></a>
|
||
</div>
|
||
</div>
|
||
<p class="desc">
|
||
<a title="" ng-click="showPlaylist(i.info.id)">{{i.info.title}}</a>
|
||
</p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- content page: 精选歌单 -->
|
||
<div class="site-wrapper" ng-show="current_tag==2" ng-controller="PlayListController" ng-init="loadPlaylist();">
|
||
<div class="cover-container container-placeholder">
|
||
<!-- make empty placeholder div to position sidebar -->
|
||
<div class="source-list" ng-show="is_window_hidden==1">
|
||
<div class="source-button" ng-class="{'active':isActiveTab(0)}" ng-click="changeTab(0)">网易</div>
|
||
<div class="source-button" ng-class="{'active':isActiveTab(1)}" ng-click="changeTab(1)">虾米</div>
|
||
<div class="source-button" ng-class="{'active':isActiveTab(2)}" ng-click="changeTab(2)">QQ音乐</div>
|
||
<!-- <button type="button" class="btn btn-default" ng-class="{'active':isActiveTab(3)}" ng-click="changeTab(3)" ng-show="isDoubanLogin">豆瓣</button> -->
|
||
</div>
|
||
</div>
|
||
|
||
<div class="site-wrapper-innerd" id="hotplaylist" resize infinite-scroll="scrolling()" content-selector="'#playlist-content'">
|
||
<div class="cover-container" id="playlist-content">
|
||
<ul class="playlist-covers">
|
||
<li ng-repeat="i in result ">
|
||
<div class="u-cover">
|
||
<img ng-src="{{i.cover_img_url}}">
|
||
<a title="" class="mask" ng-click="showPlaylist(i.id)"></a>
|
||
<div class="bottom">
|
||
<a class="icon-play" title="播放" ng-click="directplaylist(i.id)"></a>
|
||
</div>
|
||
</div>
|
||
<div class="desc">
|
||
<a title="{{i.title}}" ng-click="showPlaylist(i.id)">{{i.title}}</a>
|
||
</div>
|
||
</li>
|
||
<div class="loading_bottom">
|
||
<img class="searchspinner" id="spinner" src="images/loading.gif" ng-show="loading">
|
||
</div>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- content page: 快速搜索 -->
|
||
<div class="site-wrapper" ng-show="current_tag==3">
|
||
<div class="site-wrapper-innerd" resize>
|
||
<div class="cover-container">
|
||
<!-- Initialize a new AngularJS app and associate it with a module named "instantSearch"-->
|
||
<div class="searchbox" ng-controller="InstantSearchController" >
|
||
<!-- Create a binding between the searchString model and the text field -->
|
||
<input type="text" id="search-input" class="form-control" ng-model="keywords" placeholder="输入歌曲名，歌手或专辑" ng-model-options="{debounce: 500}" />
|
||
|
||
|
||
|
||
<ul class="nav nav-tabs">
|
||
<li ng-class="{'active':isActiveTab(0)}" ng-click="changeTab(0)"><a>网易</a></li>
|
||
<li ng-class="{'active':isActiveTab(1)}" ng-click="changeTab(1)"><a href="#">虾米</a></li>
|
||
<li ng-class="{'active':isActiveTab(2)}" ng-click="changeTab(2)"><a href="#">QQ音乐</a></li>
|
||
<li ng-class="{'active':isActiveTab(3)}" ng-click="changeTab(3)" ng-show="isDoubanLogin"><a href="#">豆瓣</a></li>
|
||
<img class="searchspinner" id="spinner" src="images/loading.gif" ng-show="loading">
|
||
</ul>
|
||
<ul class="detail-songlist">
|
||
<li ng-repeat="song in result" ng-class-odd="'odd'" ng-class-even="'even'" ng-mouseenter="options=true" ng-mouseleave="options=false">
|
||
<div class="col2">
|
||
<a ng-if="song.disabled" class="disabled" ng-click="copyrightNotice()">{{ song.title |limitTo:30}}</a>
|
||
<a ng-if="!song.disabled" add-and-play="song">{{ song.title |limitTo:30}}</a>
|
||
</div>
|
||
<div class="col1 detail-artist"><a ng-click="showPlaylist(song.artist_id)">{{ song.artist |limitTo:20}}</a></div>
|
||
<div class="col2"><a ng-click="showPlaylist(song.album_id)">{{ song.album |limitTo:30}}</a></div>
|
||
|
||
<div class="detail-tools">
|
||
<a title="添加到当前播放" class="detail-add-button" add-without-play="song" ng-show="options"></a>
|
||
<a title="添加到歌单" class="detail-fav-button" ng-show="options" ng-click="showDialog(0, song)"></a>
|
||
<a title="原始链接" class="source-button" open-url="song.source_url" ng-show="options"></a>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
<div class="search-pagination" ng-show= "totalpage>1" pagination></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- content page: 设置 -->
|
||
<div class="site-wrapper" ng-show="current_tag==4" ng-init="lastfm.updateStatus(); github.updateStatus();">
|
||
<div class="site-wrapper-innerd" resize>
|
||
<div class="cover-container">
|
||
<!-- <div class="settings-title"><span>第三方登录<span></div>
|
||
<div class="settings-content">
|
||
<div ng-show="isDoubanLogin"> 豆瓣：<button class="btn btn-primary confirm-button" ng-click="showDialog(2)">已登录</button></div>
|
||
<div ng-hide="isDoubanLogin"> 豆瓣：<button class="btn btn-primary confirm-button" ng-click="showDialog(2)">登录</button> </div>
|
||
</div> -->
|
||
<div class="settings-title"><span>导出我的歌单<span></div>
|
||
<div class="settings-content">
|
||
<p>重装插件或清除缓存数据会导致我的歌单数据丢失，强烈建议在这些操作前，备份我的歌单。</p>
|
||
<div>
|
||
<button class="btn btn-primary confirm-button" ng-click="backupMySettings()">导出到本地文件</button>
|
||
<button class="btn btn-primary confirm-button" ng-show="github.getStatus() == 2" ng-click="showDialog(8)">导出到Github Gist</button>
|
||
</div>
|
||
</div>
|
||
<div class="settings-title"><span>导入我的歌单<span></div>
|
||
<div class="settings-content">
|
||
<p>选择备份文件，恢复我的歌单。注意：恢复我的歌单会覆盖现有的歌单。</p>
|
||
<label class="btn btn-warning" for="my-file-selector">
|
||
<input id="my-file-selector" type="file" style="display:none;" ng-model="myuploadfiles" custom-on-change="importMySettings">从本地文件导入
|
||
</label>
|
||
<button class="btn btn-warning confirm-button" ng-show="github.getStatus() == 2" ng-click="showDialog(10)">从Github Gist导入</button>
|
||
</div>
|
||
|
||
<div class="settings-title"><span>连接到 Github.com<span></div>
|
||
<div class="settings-content">
|
||
<div>
|
||
<p> 状态：{{ github.getStatusText() }} </p>
|
||
<button class="btn btn-primary confirm-button" ng-show="github.getStatus() == 0" ng-click="github.openAuthUrl(); showDialog(7);">连接到 Github.com</button>
|
||
<button class="btn btn-warning confirm-button" ng-show="github.getStatus() == 1" ng-click="showDialog(7);">重新连接</button>
|
||
<button class="btn btn-primary confirm-button" ng-show="github.getStatus() == 2" ng-click="github.logout();">取消连接</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="settings-title"><span>快捷键<span></div>
|
||
<div class="settings-content">
|
||
<div>
|
||
<button class="btn btn-primary confirm-button" ng-click="showShortcuts()">查看快捷键列表</button>
|
||
</div>
|
||
</div>
|
||
<div class="settings-title"><span>连接到 Last.fm<span></div>
|
||
<div class="settings-content">
|
||
<div>
|
||
<p> 状态：{{ lastfm.getStatusText() }} </p>
|
||
<button class="btn btn-primary confirm-button" ng-show="!lastfm.isAuthRequested()" ng-click="lastfm.getAuth(); showDialog(4);">连接到 Last.fm</button>
|
||
<button class="btn btn-warning confirm-button" ng-show="lastfm.isAuthRequested() && !lastfm.isAuthorized()" ng-click="lastfm.getAuth(); showDialog(4);">重新连接</button>
|
||
<button class="btn btn-primary confirm-button" ng-show="lastfm.isAuthRequested()" ng-click="lastfm.cancelAuth();">取消连接</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="settings-title"><span>关于<span></div>
|
||
<div class="settings-content">
|
||
<p> Listen 1 主页: <a href="http://listen1.github.io/listen1/" target="_blank"> http://listen1.github.io/listen1/ </a> </p>
|
||
<p> Listen 1 邮箱: githublisten1@gmail.com </p>
|
||
<p> 当前版本 1.4.0 (本软件基于MIT协议开源免费)</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- track list window -->
|
||
<div class="site-wrapper" ng-hide="is_window_hidden==1">
|
||
<div class="cover-container container-placeholder">
|
||
<div class="detail-close">
|
||
<span ng-click="popWindow()">×</span>
|
||
</div>
|
||
</div>
|
||
<div class="site-wrapper-innerd" resize>
|
||
<div class="cover-container" >
|
||
<div class="playlist-detail">
|
||
<div class="detail-head">
|
||
<div class="detail-head-cover">
|
||
<img ng-src="{{ cover_img_url }}">
|
||
</div>
|
||
<div class="detail-head-title">
|
||
<h2>{{ playlist_title }}</h2>
|
||
<a title="播放歌单" class="play" ng-show="playlist_title!=''" ng-click="playMylist(list_id)">播放</a>
|
||
<a title="添加到当前播放" class="add" ng-show="playlist_title!=''" ng-click="addMylist(list_id)">添加到当前播放</a>
|
||
<a title="收藏歌单" class="clone" ng-show="playlist_title!='' && !is_mine" ng-click="clonePlaylist(list_id)">收藏</a>
|
||
<a title="编辑歌单" class="edit" ng-show="playlist_title!='' && is_mine" ng-click="showDialog(3, {list_id: list_id, playlist_title: playlist_title, cover_img_url: cover_img_url})">编辑</a>
|
||
<a title="原始链接" class="link" ng-show="playlist_title!=''" open-url="playlist_source_url">原始链接</a>
|
||
<a title="导入合并" class="merge" ng-show="playlist_title!='' && is_mine" ng-click="showDialog(6)">导入合并</a>
|
||
</div>
|
||
</div>
|
||
<ul class="detail-songlist">
|
||
<li ng-repeat="song in songs track by $index" ng-class-odd="'odd'" ng-class-even="'even'" ng-mouseenter="options=true" ng-mouseleave="options=false">
|
||
<div class="col2">
|
||
<a ng-if="song.disabled" class="disabled" ng-click="copyrightNotice()">{{ song.title }}</a>
|
||
<a ng-if="!song.disabled" add-and-play="song">{{ song.title }}</a>
|
||
</div>
|
||
<div class="col1 detail-artist"><a ng-click="showPlaylist(song.artist_id)">{{ song.artist }}</a></div>
|
||
<div class="col2"><a ng-click="showPlaylist(song.album_id)">{{ song.album }}</a></div>
|
||
<div class="detail-tools">
|
||
<a title="添加到当前播放" class="detail-add-button" add-without-play="song" ng-show="options"></a>
|
||
<a title="添加到歌单" class="detail-fav-button" ng-click="showDialog(0, song)" ng-show="options"></a>
|
||
<a title="从歌单删除" class="detail-delete-button" ng-click="removeSongFromPlaylist(song, list_id)" ng-show="options && is_mine=='1' "></a>
|
||
<a title="原始链接" class="source-button" open-url="song.source_url" ng-show="options"></a>
|
||
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- page footer -->
|
||
<div class="mastfoot" ng-controller="PlayController as playCtrl" ng-init="loadLocalSettings()">
|
||
<div class="m-playbar" >
|
||
<div class="btns">
|
||
<a class="previous" title="上一首([)" prev-track >上一首([)</a>
|
||
<a class="play" ng-class="{pas: isPlaying}" title="播放/暂停(p)" play-pause-toggle>播放/暂停(p)</a>
|
||
<a class="next" title="下一首(])" next-track>下一首(])</a>
|
||
</div>
|
||
|
||
<div class="head">
|
||
<!-- <img ng-src="{{ currentPlaying.img_url }}" err-src="images/placeholder.png"> -->
|
||
<img ng-src="{{ currentPlaying.img_url }}">
|
||
<a ng-click="showPlaylist(currentPlaying.album_id)" class="mask"></a>
|
||
</div>
|
||
|
||
<div class="maininfo">
|
||
<div class="words">
|
||
<a class="overflowhide name notextdeco floatleft" title="{{currentPlaying.title}}">{{currentPlaying.title}}</a>
|
||
<span class="by overflowhide floatleft">
|
||
<span title="{{ currentPlaying.artist }}">
|
||
<a class="" ng-click="showPlaylist(currentPlaying.artist_id)">{{ currentPlaying.artist }}</a>
|
||
</span>
|
||
</span>
|
||
<a open-url="currentPlaying.source_url" class="src" title="原始链接"></a>
|
||
</div>
|
||
|
||
<div class="m-pbar play" >
|
||
<div class="barbg" id="progressbar" mode="play" draggable>
|
||
<!-- <div class="rdy" ng-style="{width : myProgress + '%' }"></div> -->
|
||
<div class="cur" ng-style="{width : myProgress + '%' }">
|
||
<span class="btn"><i></i></span>
|
||
</div>
|
||
</div>
|
||
|
||
<span class="time"><em>{{ currentPosition }}</em> <span ng-show=" currentDuration!=none ">/</span> {{ currentDuration }}</span>
|
||
</div>
|
||
|
||
<!-- init soundManager2 player -->
|
||
<sound-manager></sound-manager>
|
||
</div>
|
||
|
||
<div class="ctrl">
|
||
<a class="icn icn-add" ng-click="showDialog(0, currentPlaying)" title="添加到歌单">添加到歌单</a>
|
||
<a class="icn" ng-class="{ 'icn-repeatone': settings.playmode == 2,'icn-shuffle': settings.playmode == 1, 'icn-loop': settings.playmode == 0 }" title="{{ settings.playmode | playmode_title }}(s)" ng-click="changePlaymode()"></a>
|
||
<a class="icn icn-list" title="列表(l)" ng-click="togglePlaylist()"></a>
|
||
</div>
|
||
|
||
<div class="volume-ctrl">
|
||
<a class="icn" ng-class="{ 'icn-vol-mute': mute, 'icn-vol': mute == false }" title="静音(m) 增大(u) 减少(d)" ng-click="toggleMuteStatus()"></a>
|
||
<div class="m-pbar volume" >
|
||
<div class="barbg" id="volumebar" mode="volume" draggable>
|
||
<div class="cur" ng-style="{width : volume + '%' }">
|
||
<span class="btn"><i></i></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="menu" ng-hide="menuHidden">
|
||
<div class="menu-header">
|
||
<span>播放列表</span>
|
||
<a clear-playlist class="remove-all"><small>(移除所有</small></a>
|
||
<a class="add-all" ng-click="showDialog(0, playlist)"><small>添加所有到歌单)</small></a>
|
||
<a class="close-popup" ng-click="menuHidden=!menuHidden">×</a>
|
||
</div>
|
||
<ul>
|
||
<li id="song{{ song.id }}" ng-repeat="song in playlist track by $index" ng-class="{ playing: currentPlaying.id == song.id }" ng-mouseenter="playlist_highlight=true" ng-mouseleave="playlist_highlight=false">
|
||
<div class="title" play-from-playlist="song"><a>{{ song.title }}</a></div>
|
||
<a class="icn-remove" remove-from-playlist="song" data-index="{{$index}}" ng-show="playlist_highlight"></a>
|
||
<div class="singer" ng-click="showPlaylist(song.artist_id)">{{ song.artist }}</div>
|
||
</li>
|
||
</ul>
|
||
<div class="lyric">
|
||
<div class="placeholder"></div>
|
||
<p ng-repeat="line in lyricArray track by $index" ng-class="{ 'highlight': line.lineNumber == lyricLineNumber }" >{{ line.content }} </p>
|
||
<div style="placeholder"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</body>
|
||
</html>
|