|
|
<!DOCTYPE html> |
|
|
<html lang="en" ng-app="listenone"> |
|
|
<head> |
|
|
<script> |
|
|
|
|
|
if (/Mobi|Android|iPhone|iPad|Windows Phone/.test(navigator.userAgent)) { |
|
|
window.location.href = chrome.runtime.getURL('listen1_mobile.html'); |
|
|
} |
|
|
</script> |
|
|
<meta charset="utf-8" /> |
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
|
|
|
|
|
<meta name="description" content="" /> |
|
|
<meta name="author" content="" /> |
|
|
<title ng-bind="document_title">Listen 1</title> |
|
|
|
|
|
<link href="css/notyf.min.css" rel="stylesheet" /> |
|
|
<link href="css/hotkeys.css" rel="stylesheet" /> |
|
|
<link href="css/icon.css" rel="stylesheet" /> |
|
|
|
|
|
<link href="css/origin.css" rel="stylesheet" id="theme" /> |
|
|
<link href="css/common.css" rel="stylesheet" /> |
|
|
|
|
|
<link href="images/logo_16.png" rel="shortcut icon" /> |
|
|
<link href="images/logo_16.png" rel="bookmark" /> |
|
|
<script> |
|
|
if (typeof module === 'object') { |
|
|
window.module = module; |
|
|
module = undefined; |
|
|
} |
|
|
</script> |
|
|
<script type="text/javascript" src="js/vendor/angular.min.js"></script> |
|
|
<script src="js/vendor/i18next.min.js"></script> |
|
|
<script src="js/vendor/i18nextHttpBackend.min.js"></script> |
|
|
<script |
|
|
type="text/javascript" |
|
|
src="js/vendor/forge_listen1_fork.min.js" |
|
|
></script> |
|
|
<script type="text/javascript" src="js/vendor/axios.min.js"></script> |
|
|
<script type="text/javascript" src="js/vendor/notyf.min.js"></script> |
|
|
<script type="text/javascript" src="js/vendor/howler.core.min.js"></script> |
|
|
<script type="text/javascript" src="js/vendor/hotkeys.min.js"></script> |
|
|
<script type="text/javascript" src="js/vendor/async.min.js"></script> |
|
|
<script type="text/javascript" src="js/vendor/lru-cache.min.js"></script> |
|
|
|
|
|
<script type="text/javascript" src="js/lowebutil.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/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/provider/kugou.js"></script> |
|
|
<script type="text/javascript" src="js/provider/kuwo.js"></script> |
|
|
<script type="text/javascript" src="js/provider/bilibili.js"></script> |
|
|
<script type="text/javascript" src="js/provider/migu.js"></script> |
|
|
<script type="text/javascript" src="js/provider/taihe.js"></script> |
|
|
<script type="text/javascript" src="js/provider/localmusic.js"></script> |
|
|
|
|
|
<script type="text/javascript" src="js/bridge.js"></script> |
|
|
<script type="text/javascript" src="js/player_thread.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/l1_player.js"></script> |
|
|
<script type="text/javascript" src="js/app.js"></script> |
|
|
<script type="text/javascript" src="js/controller/profile.js"></script> |
|
|
<script type="text/javascript" src="js/controller/auth.js"></script> |
|
|
<script type="text/javascript" src="js/controller/navigation.js"></script> |
|
|
<script type="text/javascript" src="js/controller/my_playlist.js"></script> |
|
|
<script type="text/javascript" src="js/controller/platform.js"></script> |
|
|
<script type="text/javascript" src="js/controller/playlist.js"></script> |
|
|
<script type="text/javascript" src="js/controller/play.js"></script> |
|
|
<script |
|
|
type="text/javascript" |
|
|
src="js/controller/instant_search.js" |
|
|
></script> |
|
|
|
|
|
<script> |
|
|
if (window.module) module = window.module; |
|
|
</script> |
|
|
</head> |
|
|
|
|
|
<body> |
|
|
<div |
|
|
id="feather-container" |
|
|
style="visibility: hidden; position: absolute; width: 0px; height: 0px" |
|
|
></div> |
|
|
<div |
|
|
ng-controller="PlayController as playCtrl" |
|
|
ng-init="loadLocalSettings()" |
|
|
> |
|
|
<div ng-controller="AuthController" ng-init="refreshAuthStatus()"> |
|
|
<div ng-controller="ProfileController" ng-init="initProfile()"> |
|
|
<div ng-controller="NavigationController"> |
|
|
<div class="wrap"> |
|
|
|
|
|
<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"> |
|
|
|
|
|
<ul class="dialog-playlist" ng-show="dialog_type==0"> |
|
|
<li class="detail-add" ng-click="newDialogOption(1)"> |
|
|
<img src="images/mycover.jpg" /> |
|
|
<h2>{{_CREATE_PLAYLIST}}</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> |
|
|
|
|
|
<div class="dialog-newplaylist" ng-show="dialog_type==1"> |
|
|
<input |
|
|
class="form-control" |
|
|
type="text" |
|
|
placeholder="{{_INPUT_NEW_PLAYLIST_TITLE}}" |
|
|
ng-model="newlist_title" |
|
|
/> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="createAndAddPlaylist()" |
|
|
> |
|
|
{{_CONFIRM}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-default" |
|
|
ng-click="cancelNewDialog(0)" |
|
|
> |
|
|
{{_CANCEL}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="dialog-editplaylist" ng-show="dialog_type==3"> |
|
|
<div class="form-group"> |
|
|
<label>{{_PLAYLIST_TITLE}}</label> |
|
|
<input |
|
|
class="form-control" |
|
|
type="text" |
|
|
placeholder="{{_INPUT_PLAYLIST_TITLE}}" |
|
|
ng-model="dialog_playlist_title" |
|
|
/> |
|
|
</div> |
|
|
<div class="form-group"> |
|
|
<label>{{_PLAYLIST_COVER_IMAGE_URL}}</label> |
|
|
<input |
|
|
class="form-control" |
|
|
type="text" |
|
|
placeholder="{{_INPUT_PLAYLIST_COVER_IMAGE_URL}}" |
|
|
ng-model="dialog_cover_img_url" |
|
|
/> |
|
|
</div> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="editMyPlaylist(list_id)" |
|
|
> |
|
|
{{_CONFIRM}} |
|
|
</button> |
|
|
<button class="btn btn-default" ng-click="closeDialog()"> |
|
|
{{_CANCEL}} |
|
|
</button> |
|
|
</div> |
|
|
<div class="dialog-footer"> |
|
|
<button |
|
|
class="btn btn-danger remove-button" |
|
|
ng-click="removeMyPlaylist(list_id)" |
|
|
> |
|
|
{{_REMOVE_PLAYLIST}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="dialog-connect-lastfm" ng-show="dialog_type==4"> |
|
|
<p>{{_OPENING_LASTFM_PAGE}}</p> |
|
|
<p>{{_CONFIRM_NOTICE_LASTFM}}</p> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="lastfm.updateStatus();closeDialog();" |
|
|
> |
|
|
{{_AUTHORIZED_FINISHED}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-warning warning-button" |
|
|
ng-click="lastfm.getAuth();" |
|
|
> |
|
|
{{_AUTHORIZED_REOPEN}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="dialog-open-url" ng-show="dialog_type==5"> |
|
|
<div class="form-group"> |
|
|
<label>{{_PLAYLIST_LINK}}</label> |
|
|
<input |
|
|
class="form-control" |
|
|
type="text" |
|
|
placeholder="{{_EXAMPLE}}https://www.xiami.com/collect/198267231" |
|
|
ng-model="dialog_url" |
|
|
/> |
|
|
</div> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="openUrl(dialog_url);closeDialog();dialog_url='';" |
|
|
> |
|
|
{{_CONFIRM}} |
|
|
</button> |
|
|
<button class="btn btn-default" ng-click="closeDialog()"> |
|
|
{{_CANCEL}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<ul class="dialog-merge-playlist" ng-show="dialog_type==6"> |
|
|
<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 class="dialog-connect-github" ng-show="dialog_type==7"> |
|
|
<p>{{_OPENING_GITHUB_PAGE}}</p> |
|
|
<p>{{_CONFIRM_NOTICE_GITHUB}}</p> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="updateGithubStatus();closeDialog();" |
|
|
> |
|
|
{{_AUTHORIZED_FINISHED}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-warning warning-button" |
|
|
ng-click="openGithubAuth();" |
|
|
> |
|
|
{{_AUTHORIZED_REOPEN}} |
|
|
</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>{{_CREATE_PLAYLIST_BACKUP}}</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 }}<br /> |
|
|
{{backup.description}} |
|
|
</h2> |
|
|
</li> |
|
|
</ul> |
|
|
|
|
|
<div class="dialog-newbackup" ng-show="dialog_type==9"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="backupMySettings2Gist(null, true);closeDialog();" |
|
|
> |
|
|
{{_CREATE_PUBLIC_BACKUP}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="backupMySettings2Gist(null, false);closeDialog();" |
|
|
> |
|
|
{{_CREATE_PRIVATE_BACKUP}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-default" |
|
|
ng-click="cancelNewDialog(8)" |
|
|
> |
|
|
{{_CANCEL}} |
|
|
</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 class="dialog-open-login" ng-show="dialog_type==11"> |
|
|
<p>{{_LOGIN_DIALOG_NOTICE}}</p> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="closeDialog();refreshAuthStatus();" |
|
|
> |
|
|
{{_LOGIN_SUCCESS}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-warning warning-button" |
|
|
ng-click="openLogin(dialog_data);" |
|
|
> |
|
|
{{_LOGIN_FAIL_RETRY}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="dialog-proxy" ng-show="dialog_type==12"> |
|
|
<select |
|
|
ng-options="mode.displayText for mode in proxyModes" |
|
|
ng-model="proxyModeInput" |
|
|
ng-change="changeProxyMode(proxyModeInput)" |
|
|
></select> |
|
|
<div |
|
|
ng-show="proxyModeInput.name=='custom'" |
|
|
class="custom-proxy" |
|
|
> |
|
|
<div class="rule-input"> |
|
|
<div class="field-name">{{_PROTOCOL}}</div> |
|
|
<select |
|
|
ng-options="protocol for protocol in proxyProtocols" |
|
|
ng-model="proxyProtocol" |
|
|
ng-change="changeProxyProtocol(proxyProtocol)" |
|
|
></select> |
|
|
<div class="field-name">{{_HOST}}</div> |
|
|
<input type="text" id="proxy-rules-host" /> |
|
|
<div class="field-name">{{_PORT}}</div> |
|
|
<input type="text" id="proxy-rules-port" /> |
|
|
</div> |
|
|
</div> |
|
|
<div class="buttons"> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="setProxyConfig();closeDialog();" |
|
|
> |
|
|
{{_CONFIRM}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-warning warning-button" |
|
|
ng-click="closeDialog();" |
|
|
> |
|
|
{{_CANCEL}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="main" ng-controller="MyPlayListController"> |
|
|
<div class="sidebar"> |
|
|
<div class="flex-scroll-wrapper"> |
|
|
<div class="menu-control"></div> |
|
|
<div class="menu-title"> |
|
|
<div class="title">{{_PLATFORM_UNION}}</div> |
|
|
</div> |
|
|
<ul class="nav masthead-nav"> |
|
|
<li |
|
|
ng-class="{ 'active':(current_tag==2) && (window_url_stack.length ==0) }" |
|
|
ng-click="showTag(2)" |
|
|
> |
|
|
<div class="sidebar-block"> |
|
|
<span class="icon li-featured-list"></span |
|
|
><a>{{_PLAYLISTS}}</a> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
<div |
|
|
ng-if="!isChrome || is_login('netease') || is_login('qq')" |
|
|
class="menu-title" |
|
|
> |
|
|
<div class="title">{{_MY_MUSIC}}</div> |
|
|
</div> |
|
|
<ul class="nav masthead-nav"> |
|
|
<li |
|
|
ng-if="!isChrome" |
|
|
ng-click="showPlaylist('lmplaylist_reserve')" |
|
|
ng-class="{ 'active':window_type=='list' && ( '/playlist?list_id=lmplaylist_reserve' === getCurrentUrl() ) }" |
|
|
> |
|
|
<div class="sidebar-block"> |
|
|
<span class="icon li-featured-list"></span |
|
|
><a>{{_LOCAL_MUSIC}}</a> |
|
|
</div> |
|
|
</li> |
|
|
<li |
|
|
ng-if="is_login('netease')" |
|
|
ng-click="showTag(6, {platform:'netease', user: musicAuth.netease});" |
|
|
ng-class="{ 'active':(current_tag==6 && tag_params.platform=='netease') && (window_url_stack.length ==0) }" |
|
|
> |
|
|
<div class="sidebar-block"> |
|
|
<svg class="feather"> |
|
|
<use href="#globe"></use> |
|
|
</svg> |
|
|
<a>{{_MY_NETEASE}}</a> |
|
|
</div> |
|
|
</li> |
|
|
<li |
|
|
ng-if="is_login('qq')" |
|
|
ng-click="showTag(6, {platform:'qq', user: musicAuth.qq});" |
|
|
ng-class="{ 'active':(current_tag==6 && tag_params.platform=='qq') && (window_url_stack.length ==0) }" |
|
|
> |
|
|
<div class="sidebar-block"> |
|
|
<svg class="feather"> |
|
|
<use href="#globe"></use> |
|
|
</svg> |
|
|
<a>{{_MY_QQ}}</a> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
<div class="menu-title" ng-init="loadMyPlaylist();"> |
|
|
<div class="title">{{_CREATED_PLAYLIST}}</div> |
|
|
<svg class="feather icon" ng-click="showDialog(5)"> |
|
|
<use href="#plus-square"></use> |
|
|
</svg> |
|
|
</div> |
|
|
<ul class="nav masthead-nav"> |
|
|
<li |
|
|
ng-repeat="i in myplaylists track by $index" |
|
|
ng-class="{ 'active':window_type=='list' && ( ('/playlist?list_id='+i.info.id) === getCurrentUrl() ) }" |
|
|
ng-click="showPlaylist(i.info.id)" |
|
|
drag-drop-zone |
|
|
drag-zone-type="'application/listen1-myplaylist'" |
|
|
drop-zone-ondrop="onSidebarPlaylistDrop('my', i.info.id, arg1, arg2, arg3)" |
|
|
draggable="true" |
|
|
sortable="true" |
|
|
drag-zone-object="i" |
|
|
drag-zone-title="i.info.title" |
|
|
> |
|
|
<div class="sidebar-block"> |
|
|
<svg class="feather"> |
|
|
<use href="#disc"></use> |
|
|
</svg> |
|
|
<a>{{i.info.title}}</a> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
<div class="menu-title" ng-init="loadFavoritePlaylist();"> |
|
|
<div class="title">{{_FAVORITED_PLAYLIST}}</div> |
|
|
</div> |
|
|
<ul class="nav masthead-nav"> |
|
|
<li |
|
|
ng-repeat="i in favoriteplaylists track by $index" |
|
|
ng-class="{ 'active':window_type=='list' && ( ('/playlist?list_id='+i.info.id) === getCurrentUrl() ) }" |
|
|
ng-click="showPlaylist(i.info.id, {useCache: false})" |
|
|
drag-drop-zone |
|
|
drag-zone-type="'application/listen1-favoriteplaylist'" |
|
|
drop-zone-ondrop="onSidebarPlaylistDrop('favorite', i.info.id, arg1, arg2, arg3)" |
|
|
draggable="true" |
|
|
sortable="true" |
|
|
drag-zone-object="i" |
|
|
drag-zone-title="i.info.title" |
|
|
> |
|
|
<div class="sidebar-block"> |
|
|
<svg class="feather"> |
|
|
<use href="#disc"></use> |
|
|
</svg> |
|
|
<a>{{i.info.title}}</a> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="content" ng-controller="InstantSearchController"> |
|
|
<div class="navigation"> |
|
|
<div class="backfront"> |
|
|
<span class="icon li-back" ng-click="popWindow()"></span> |
|
|
<span |
|
|
class="icon li-advance" |
|
|
ng-click="forwardWindow()" |
|
|
></span> |
|
|
</div> |
|
|
<div class="search"> |
|
|
<input |
|
|
class="form-control search-input" |
|
|
id="search-input" |
|
|
type="text" |
|
|
ng-model="keywords" |
|
|
placeholder="{{_SEARCH_PLACEHOLDER}}" |
|
|
ng-model-options="{debounce: 500}" |
|
|
ng-keyup="enterEvent($event)" |
|
|
/> |
|
|
</div> |
|
|
<div |
|
|
ng-class="{ 'active': (current_tag==4) && (window_url_stack.length ==0)}" |
|
|
ng-click="showTag(5)" |
|
|
class="settings" |
|
|
> |
|
|
<span class="icon"> |
|
|
<svg class="feather"> |
|
|
<use href="#users"></use> |
|
|
</svg> |
|
|
</span> |
|
|
</div> |
|
|
<div |
|
|
ng-class="{ 'active': (current_tag==4) && (window_url_stack.length ==0)}" |
|
|
ng-click="showTag(4)" |
|
|
class="settings" |
|
|
> |
|
|
<span class="icon li-setting"></span> |
|
|
</div> |
|
|
<div ng-if="!isChrome && !isMac" class="window-control"> |
|
|
<svg class="icon" window-control="window_min"> |
|
|
<use href="#minimize-2"></use> |
|
|
</svg> |
|
|
<svg class="icon" window-control="window_max"> |
|
|
<use href="#maximize"></use> |
|
|
</svg> |
|
|
<svg class="icon" window-control="window_close"> |
|
|
<use href="#x"></use> |
|
|
</svg> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="browser flex-scroll-wrapper" |
|
|
infinite-scroll="scrolling()" |
|
|
content-selector="'#playlist-content'" |
|
|
> |
|
|
|
|
|
<div |
|
|
class="page page-hot-playlist" |
|
|
ng-show="current_tag==2 && is_window_hidden==1" |
|
|
ng-controller="PlayListController" |
|
|
ng-init="loadPlaylist();" |
|
|
> |
|
|
<div class="source-list" ng-show="is_window_hidden==1"> |
|
|
<div |
|
|
ng-repeat-start="source in ::sourceList" |
|
|
class="source-button" |
|
|
ng-class="{'active':tab === source.name}" |
|
|
ng-click="changeTab(source.name)" |
|
|
> |
|
|
{{source.displayText}} |
|
|
</div> |
|
|
<div |
|
|
ng-repeat-end |
|
|
ng-if="!$last" |
|
|
class="splitter" |
|
|
></div> |
|
|
</div> |
|
|
<div class="playlist-filter"> |
|
|
<div |
|
|
class="l1-button filter-item" |
|
|
ng-repeat="filter in playlistFilters[tab] || []" |
|
|
ng-click="changeFilter(filter.id)" |
|
|
ng-class="{'active':filter.id === currentFilterId}" |
|
|
> |
|
|
{{filter.name}} |
|
|
</div> |
|
|
<div |
|
|
class="l1-button filter-item" |
|
|
ng-show="playlistFilters[tab] && playlistFilters[tab].length > 0" |
|
|
ng-click="toggleMorePlaylists()" |
|
|
> |
|
|
更多... |
|
|
</div> |
|
|
</div> |
|
|
<div class="all-playlist-filter" ng-show="showMore"> |
|
|
<div |
|
|
ng-repeat="category in allPlaylistFilters[tab] || []" |
|
|
class="category" |
|
|
> |
|
|
<div class="category-title"> |
|
|
{{category.category}} |
|
|
</div> |
|
|
<div class="category-filters"> |
|
|
<div |
|
|
class="filter-item" |
|
|
ng-repeat="filter in category.filters" |
|
|
> |
|
|
<span ng-click="changeFilter(filter.id)"> |
|
|
{{filter.name}}</span |
|
|
> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="site-wrapper-innerd" id="hotplaylist"> |
|
|
<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}}" |
|
|
ng-click="showPlaylist(i.id)" |
|
|
/> |
|
|
<div |
|
|
class="bottom" |
|
|
ng-click="directplaylist(i.id)" |
|
|
> |
|
|
<svg class="feather"> |
|
|
<use href="#play-circle"></use> |
|
|
</svg> |
|
|
</div> |
|
|
</div> |
|
|
<div class="desc"> |
|
|
<span |
|
|
class="title" |
|
|
ng-click="showPlaylist(i.id)" |
|
|
>{{i.title}}</span |
|
|
> |
|
|
</div> |
|
|
</li> |
|
|
|
|
|
|
|
|
|
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div |
|
|
class="page page-hot-playlist" |
|
|
ng-show="current_tag==6 && is_window_hidden==1" |
|
|
ng-controller="PlatformController" |
|
|
> |
|
|
<div class="source-list" ng-show="is_window_hidden==1"> |
|
|
<div |
|
|
ng-repeat-start="source in ::platformSourceList" |
|
|
class="source-button" |
|
|
ng-class="{'active':tab === source.name}" |
|
|
ng-click="changeTab(source.name)" |
|
|
> |
|
|
{{source.displayText}} |
|
|
</div> |
|
|
<div |
|
|
ng-repeat-end |
|
|
ng-if="!$last" |
|
|
class="splitter" |
|
|
></div> |
|
|
</div> |
|
|
<div class="site-wrapper-innerd" id="hotplaylist"> |
|
|
<div class="cover-container" id="playlist-content"> |
|
|
<ul class="playlist-covers"> |
|
|
<li ng-repeat="i in myPlatformPlaylists"> |
|
|
<div class="u-cover"> |
|
|
<img |
|
|
ng-src="{{i.cover_img_url}}" |
|
|
ng-click="showPlaylist(i.id)" |
|
|
/> |
|
|
<div |
|
|
class="bottom" |
|
|
ng-click="directplaylist(i.id)" |
|
|
> |
|
|
<svg class="feather"> |
|
|
<use href="#play-circle"></use> |
|
|
</svg> |
|
|
</div> |
|
|
</div> |
|
|
<div class="desc"> |
|
|
<span |
|
|
class="title" |
|
|
ng-click="showPlaylist(i.id)" |
|
|
>{{i.title}}</span |
|
|
> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div |
|
|
class="page" |
|
|
ng-show="current_tag==3 && is_window_hidden==1" |
|
|
> |
|
|
<div class="site-wrapper-innerd"> |
|
|
<div class="cover-container"> |
|
|
|
|
|
<div class="searchbox"> |
|
|
<ul class="source-list"> |
|
|
<li |
|
|
class="source-button" |
|
|
ng-class="{'active':tab === 'allmusic'}" |
|
|
ng-click="changeSourceTab('allmusic')" |
|
|
> |
|
|
<a>{{_ALL_MUSIC}}(Beta)</a> |
|
|
</li> |
|
|
<div class="splitter"></div> |
|
|
<div |
|
|
ng-repeat-start="source in ::sourceList" |
|
|
class="source-button" |
|
|
ng-class="{'active':tab === source.name}" |
|
|
ng-click="changeSourceTab(source.name)" |
|
|
> |
|
|
{{source.displayText}} |
|
|
</div> |
|
|
<div |
|
|
ng-repeat-end |
|
|
ng-if="!$last" |
|
|
class="splitter" |
|
|
></div> |
|
|
<svg |
|
|
class="searchspinner" |
|
|
ng-show="loading" |
|
|
version="1.1" |
|
|
id="loader-1" |
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
xmlns:xlink="http://www.w3.org/1999/xlink" |
|
|
x="0px" |
|
|
y="0px" |
|
|
width="40px" |
|
|
height="40px" |
|
|
viewBox="0 0 40 40" |
|
|
enable-background="new 0 0 40 40" |
|
|
xml:space="preserve" |
|
|
> |
|
|
<path |
|
|
opacity="0.2" |
|
|
fill="#000" |
|
|
d="M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634 c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z" |
|
|
/> |
|
|
<path |
|
|
fill="#000" |
|
|
d="M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z" |
|
|
> |
|
|
<animateTransform |
|
|
attributeType="xml" |
|
|
attributeName="transform" |
|
|
type="rotate" |
|
|
from="0 20 20" |
|
|
to="360 20 20" |
|
|
dur="0.6s" |
|
|
repeatCount="indefinite" |
|
|
/> |
|
|
</path> |
|
|
</svg> |
|
|
<div class="search-type"> |
|
|
<li |
|
|
class="source-button" |
|
|
ng-class="{'active':isSearchType(0)}" |
|
|
ng-click="changeSearchType(0)" |
|
|
> |
|
|
<a>单曲</a> |
|
|
</li> |
|
|
<div class="splitter"></div> |
|
|
<li |
|
|
class="source-button" |
|
|
ng-class="{'active':isSearchType(1)}" |
|
|
ng-click="changeSearchType(1)" |
|
|
> |
|
|
<a>歌单</a> |
|
|
</li> |
|
|
</div> |
|
|
</ul> |
|
|
<ul class="detail-songlist"> |
|
|
<li class="head" ng-if="searchType===0 "> |
|
|
<div class="title"><a>{{_SONGS}}</a></div> |
|
|
<div class="artist"><a>{{_ARTISTS}}</a></div> |
|
|
<div class="album"><a>{{_ALBUMS}}</a></div> |
|
|
<div class="tools">{{_OPERATION}}</div> |
|
|
</li> |
|
|
<li class="head" ng-if="searchType===1 "> |
|
|
<div class="title"> |
|
|
<a>{{_PLAYLIST_TITLE}}</a> |
|
|
</div> |
|
|
<div class="artist"> |
|
|
<a>{{_PLAYLIST_AUTHOR}}</a> |
|
|
</div> |
|
|
<div class="album"> |
|
|
<a>{{_PLAYLIST_SONG_COUNT}}</a> |
|
|
</div> |
|
|
</li> |
|
|
<li |
|
|
ng-if="searchType===0" |
|
|
ng-repeat="song in result" |
|
|
ng-class-odd="'odd'" |
|
|
ng-class-even="'even'" |
|
|
ng-mouseenter="options=true" |
|
|
ng-mouseleave="options=false" |
|
|
> |
|
|
<div class="title"> |
|
|
|
|
|
<a add-and-play="song" |
|
|
><span |
|
|
ng-if="isActiveTab('allmusic')" |
|
|
class="source" |
|
|
>{{song.sourceName}}</span |
|
|
>{{ song.title |limitTo:30}}</a |
|
|
> |
|
|
</div> |
|
|
<div class="artist"> |
|
|
<a ng-click="showPlaylist(song.artist_id)" |
|
|
>{{ song.artist |limitTo:20}}</a |
|
|
> |
|
|
</div> |
|
|
<div class="album"> |
|
|
<a ng-click="showPlaylist(song.album_id)" |
|
|
>{{ song.album |limitTo:30}}</a |
|
|
> |
|
|
</div> |
|
|
|
|
|
<div class="tools"> |
|
|
<a |
|
|
title="{{_ADD_TO_QUEUE}}" |
|
|
class="detail-add-button" |
|
|
add-without-play="song" |
|
|
ng-show="options" |
|
|
><span class="icon li-add"></span |
|
|
></a> |
|
|
<a |
|
|
title="{{_ADD_TO_PLAYLIST}}" |
|
|
class="detail-fav-button" |
|
|
ng-show="options" |
|
|
ng-click="showDialog(0, song)" |
|
|
><span class="icon li-songlist"></span |
|
|
></a> |
|
|
<a |
|
|
title="{{_REMOVE_FROM_PLAYLIST}}" |
|
|
class="detail-delete-button" |
|
|
ng-click="removeSongFromPlaylist(song, list_id)" |
|
|
ng-show="options && is_mine=='1' " |
|
|
><span class="icon li-del"></span |
|
|
></a> |
|
|
<a |
|
|
title="{{_ORIGIN_LINK}}" |
|
|
class="source-button" |
|
|
open-url="song.source_url" |
|
|
ng-show="options" |
|
|
><span class="icon li-link"></span |
|
|
></a> |
|
|
</div> |
|
|
</li> |
|
|
<li |
|
|
ng-if="searchType===1" |
|
|
ng-repeat="playlist in result" |
|
|
ng-class-odd="'odd'" |
|
|
ng-class-even="'even'" |
|
|
class="playlist-result" |
|
|
> |
|
|
<div class="title"> |
|
|
<a ng-click="showPlaylist(playlist.id)"> |
|
|
<img |
|
|
ng-src="{{ playlist.img_url }}" |
|
|
err-src="https://y.gtimg.cn/mediastyle/global/img/playlist_300.png" |
|
|
/> |
|
|
<div> |
|
|
{{ playlist.title |limitTo:30}}<span |
|
|
ng-if="isActiveTab('allmusic')" |
|
|
class="source playlist" |
|
|
>{{playlist.sourceName}}</span |
|
|
> |
|
|
</div> |
|
|
</a> |
|
|
</div> |
|
|
<div class="artist"> |
|
|
{{ playlist.author |limitTo:20}} |
|
|
</div> |
|
|
<div class="album"> |
|
|
{{ playlist.count |limitTo:30}} |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
<div |
|
|
class="search-pagination" |
|
|
ng-show="totalpage>1" |
|
|
pagination |
|
|
></div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div |
|
|
class="page" |
|
|
ng-show="current_tag==4 && is_window_hidden==1" |
|
|
ng-init="lastfm.updateStatus(); updateGithubStatus();" |
|
|
> |
|
|
<div class="site-wrapper-innerd"> |
|
|
<div class="cover-container"> |
|
|
<div class="settings-title"> |
|
|
<span>{{_LANGUAGE}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div> |
|
|
<button |
|
|
class="language-button" |
|
|
ng-click="setLang('zh-CN')" |
|
|
> |
|
|
简体中文 |
|
|
</button> |
|
|
<button |
|
|
class="language-button" |
|
|
ng-click="setLang('zh-TC')" |
|
|
> |
|
|
繁体中文 |
|
|
</button> |
|
|
<button |
|
|
class="language-button" |
|
|
ng-click="setLang('en-US')" |
|
|
> |
|
|
English |
|
|
</button> |
|
|
<button |
|
|
class="language-button" |
|
|
ng-click="setLang('fr-FR')" |
|
|
> |
|
|
French |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_THEME}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div> |
|
|
<button |
|
|
class="theme-button" |
|
|
ng-click="setTheme('white')" |
|
|
> |
|
|
{{_THEME_WHITE}} |
|
|
</button> |
|
|
<button |
|
|
class="theme-button" |
|
|
ng-click="setTheme('black')" |
|
|
> |
|
|
{{_THEME_BLACK}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_AUTO_CHOOSE_SOURCE}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div |
|
|
class="shortcut" |
|
|
class="btn btn-primary confirm-button" |
|
|
> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableAutoChooseSource" |
|
|
ng-click="setAutoChooseSource(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableAutoChooseSource" |
|
|
ng-click="setAutoChooseSource(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
{{_AUTO_CHOOSE_SOURCE_NOTICE}} |
|
|
</div> |
|
|
<div |
|
|
class="search-description" |
|
|
ng-show="enableAutoChooseSource" |
|
|
> |
|
|
{{_AUTO_CHOOSE_SOURCE_LIST}} |
|
|
</div> |
|
|
<div |
|
|
class="search-source-list" |
|
|
ng-show="enableAutoChooseSource" |
|
|
> |
|
|
<div |
|
|
ng-repeat="item in sourceList" |
|
|
class="search-source" |
|
|
> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="autoChooseSourceList.indexOf(item.name) === -1" |
|
|
ng-click="enableSource(item.name)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="autoChooseSourceList.indexOf(item.name) > -1" |
|
|
ng-click="disableSource(item.name)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
{{item.displayText}} |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div ng-if="isChrome" class="settings-title"> |
|
|
<span |
|
|
>{{_CLOSE_TAB_ACTION}}({{_VALID_AFTER_RESTART}})</span |
|
|
> |
|
|
</div> |
|
|
<div ng-if="isChrome" class="settings-content"> |
|
|
<div class="shortcut"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableStopWhenClose" |
|
|
ng-click="setStopWhenClose(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableStopWhenClose" |
|
|
ng-click="setStopWhenClose(false)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
<span style="margin-right: 20px" |
|
|
>{{_QUIT_APPLICATION}}</span |
|
|
> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableStopWhenClose" |
|
|
ng-click="setStopWhenClose(false)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableStopWhenClose" |
|
|
ng-click="setStopWhenClose(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
<span> {{_MINIMIZE_TO_BACKGROUND}}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_NOWPLAYING_DISPLAY}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div class="shortcut"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableNowplayingCoverBackground" |
|
|
ng-click="setNowplayingCoverBackground(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableNowplayingCoverBackground" |
|
|
ng-click="setNowplayingCoverBackground(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
{{_NOWPLAYING_COVER_BACKGROUND_NOTICE}} |
|
|
</div> |
|
|
<div class="shortcut"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableNowplayingBitrate" |
|
|
ng-click="setNowplayingBitrate(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableNowplayingBitrate" |
|
|
ng-click="setNowplayingBitrate(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
{{_NOWPLAYING_BITRATE_NOTICE}} |
|
|
</div> |
|
|
<div class="shortcut"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableNowplayingPlatform" |
|
|
ng-click="setNowplayingPlatform(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableNowplayingPlatform" |
|
|
ng-click="setNowplayingPlatform(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
{{_NOWPLAYING_PLATFORM_NOTICE}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_LYRIC_DISPLAY}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div class="shortcut" ng-if="!isChrome"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableLyricFloatingWindow" |
|
|
ng-click="openLyricFloatingWindow(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableLyricFloatingWindow" |
|
|
ng-click="openLyricFloatingWindow(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
<span ng-show="enableLyricFloatingWindow"></span |
|
|
>{{_SHOW_DESKTOP_LYRIC}} |
|
|
</div> |
|
|
<div class="shortcut"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableLyricTranslation" |
|
|
ng-click="toggleLyricTranslation()" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableLyricTranslation" |
|
|
ng-click="toggleLyricTranslation()" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
<span ng-show="enableLyricTranslation"></span |
|
|
>{{_SHOW_LYRIC_TRANSLATION}} |
|
|
</div> |
|
|
<div class="shortcut" ng-if="!isChrome"> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableLyricFloatingWindowTranslation" |
|
|
ng-click="toggleLyricFloatingWindowTranslation()" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableLyricFloatingWindowTranslation" |
|
|
ng-click="toggleLyricFloatingWindowTranslation()" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
<span |
|
|
ng-show="enableLyricFloatingWindowTranslation" |
|
|
></span |
|
|
>{{_SHOW_DESKTOP_LYRIC_TRANSLATION}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_BACKUP_PLAYLIST}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<p>{{_BACKUP_WARNING}}</p> |
|
|
<div> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-click="backupMySettings()" |
|
|
> |
|
|
{{_EXPORT_TO_LOCAL_FILE}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-show="githubStatus == 2" |
|
|
ng-click="showDialog(8)" |
|
|
> |
|
|
{{_EXPORT_TO_GITHUB_GIST}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_RECOVER_PLAYLIST}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<p>{{_RECOVER_WARNING}}</p> |
|
|
<label class="upload-button" for="my-file-selector"> |
|
|
<input |
|
|
id="my-file-selector" |
|
|
type="file" |
|
|
style="display: none" |
|
|
ng-model="myuploadfiles" |
|
|
custom-on-change="importMySettings" |
|
|
/>{{_RECOVER_FROM_LOCAL_FILE}} |
|
|
</label> |
|
|
<button |
|
|
class="btn btn-warning confirm-button" |
|
|
ng-show="githubStatus == 2" |
|
|
ng-click="showDialog(10)" |
|
|
> |
|
|
{{_RECOVER_FROM_GITHUB_GIST}} |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="settings-title"> |
|
|
<span>{{_CONNECT_TO_GITHUB}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div> |
|
|
<p>{{_STATUS}}：{{ githubStatusText }}</p> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-show="githubStatus == 0" |
|
|
ng-click="openGithubAuth(); showDialog(7);" |
|
|
> |
|
|
{{_CONNECT_TO_GITHUB}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-warning confirm-button" |
|
|
ng-show="githubStatus == 1" |
|
|
ng-click="showDialog(7);" |
|
|
> |
|
|
{{_RECONNECT}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-show="githubStatus == 2" |
|
|
ng-click="GithubLogout();" |
|
|
> |
|
|
{{_CANCEL_CONNECT}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="settings-title"> |
|
|
<span>{{_CONNECT_TO_LASTFM}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div> |
|
|
<p>{{_STATUS}}：{{ lastfm.getStatusText() }}</p> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-show="!lastfm.isAuthRequested()" |
|
|
ng-click="lastfm.getAuth(); showDialog(4);" |
|
|
> |
|
|
{{_CONNECT_TO_LASTFM}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-warning confirm-button" |
|
|
ng-show="lastfm.isAuthRequested() && !lastfm.isAuthorized()" |
|
|
ng-click="lastfm.getAuth(); showDialog(4);" |
|
|
> |
|
|
{{_RECONNECT}} |
|
|
</button> |
|
|
<button |
|
|
class="btn btn-primary confirm-button" |
|
|
ng-show="lastfm.isAuthRequested()" |
|
|
ng-click="lastfm.cancelAuth();" |
|
|
> |
|
|
{{_CANCEL_CONNECT}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_SHORTCUTS}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<div class="shortcut_table"> |
|
|
<div class="shortcut_table-header"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_SHORTCUTS_FUNCTION}} |
|
|
</div> |
|
|
<div class="shortcut_table-key"> |
|
|
{{_SHORTCUTS}} |
|
|
</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
{{_GLOBAL_SHORTCUTS}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_PLAY_OR_PAUSE}} |
|
|
</div> |
|
|
<div class="shortcut_table-key">p</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
Ctrl(Cmd) + Alt + {{_KEYBOARD_SPACE}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_PREVIOUS_TRACK}} |
|
|
</div> |
|
|
<div class="shortcut_table-key">[</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
Ctrl(Cmd) + Alt + ← |
|
|
</div> |
|
|
</div> |
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_NEXT_TRACK}} |
|
|
</div> |
|
|
<div class="shortcut_table-key">]</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
Ctrl(Cmd) + Alt + → |
|
|
</div> |
|
|
</div> |
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_VOLUME_UP}} |
|
|
</div> |
|
|
<div class="shortcut_table-key">u</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
{{_SHORTCUTS_NOT_SET}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_VOLUME_DOWN}} |
|
|
</div> |
|
|
<div class="shortcut_table-key">d</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
{{_SHORTCUTS_NOT_SET}} |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{_QUICK_SEARCH}} |
|
|
</div> |
|
|
<div class="shortcut_table-key">f</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
{{_SHORTCUTS_NOT_SET}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="shortcut_table-line"> |
|
|
<div class="shortcut_table-function"> |
|
|
{{ZOOM_IN_OUT}} |
|
|
</div> |
|
|
<div class="shortcut_table-key"> |
|
|
Ctrl(Cmd) + +/- |
|
|
</div> |
|
|
<div |
|
|
ng-if="!isChrome" |
|
|
class="shortcut_table-globalkey" |
|
|
> |
|
|
{{_SHORTCUTS_NOT_SET}} |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
<div |
|
|
class="shortcut" |
|
|
ng-if="!isChrome" |
|
|
class="btn btn-primary confirm-button" |
|
|
> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="!enableGlobalShortCut" |
|
|
ng-click="applyGlobalShortcut(true)" |
|
|
> |
|
|
<use href="#square"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather" |
|
|
ng-show="enableGlobalShortCut" |
|
|
ng-click="applyGlobalShortcut(true)" |
|
|
> |
|
|
<use href="#check-square"></use> |
|
|
</svg> |
|
|
{{_GLOBAL_SHORTCUTS_NOTICE}} |
|
|
</div> |
|
|
</div> |
|
|
<div class="settings-title" ng-if="!isChrome"> |
|
|
<span>{{_PROXY_CONFIG}}</span> |
|
|
</div> |
|
|
<div class="settings-content" ng-if="!isChrome"> |
|
|
<span>{{_PROXY_CONFIG}}:</span> |
|
|
{{proxyMode.displayText}} |
|
|
<span ng-show="proxyMode.name=='custom'" |
|
|
>{{proxyRules}}</span |
|
|
> |
|
|
<button ng-click="showDialog(12)"> |
|
|
{{_MODIFY}} |
|
|
</button> |
|
|
</div> |
|
|
<div class="settings-title"> |
|
|
<span>{{_ABOUT}}</span> |
|
|
</div> |
|
|
<div class="settings-content"> |
|
|
<p> |
|
|
Listen 1 {{_HOMEPAGE}}: |
|
|
<a |
|
|
open-url="'https://listen1.github.io/listen1/'" |
|
|
> |
|
|
https://listen1.github.io/listen1/ |
|
|
</a> |
|
|
</p> |
|
|
<p>Listen 1 {{_EMAIL}}: [email protected]</p> |
|
|
<p> |
|
|
{{_FEEDBACK}}: |
|
|
<a |
|
|
ng-if="isChrome" |
|
|
open-url="'https://github.com/listen1/listen1_chrome_extension/issues'" |
|
|
>https://github.com/listen1/listen1_chrome_extension/issues</a |
|
|
> |
|
|
<a |
|
|
ng-if="!isChrome" |
|
|
open-url="'https://github.com/listen1/listen1_desktop/issues'" |
|
|
>https://github.com/listen1/listen1_desktop/issues</a |
|
|
> |
|
|
</p> |
|
|
<p>{{_DESIGNER}}: iparanoid</p> |
|
|
<p>{{_VERSION}}: v2.21.7 {{_LICENSE_NOTICE}}</p> |
|
|
<p ng-show='lastestVersion!=""'> |
|
|
{{_LATEST_VERSION}}: {{lastestVersion}} |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div |
|
|
class="page" |
|
|
ng-show="current_tag==5 && is_window_hidden==1" |
|
|
> |
|
|
<div class="login"> |
|
|
<div ng-repeat="source in loginSourceList"> |
|
|
<div ng-show="is_login(source)"> |
|
|
<div class="usercard"> |
|
|
<img ng-src="{{musicAuth[source].avatar}}" /> |
|
|
<div class="usercard-title"> |
|
|
<div class="usercard-nickname"> |
|
|
{{musicAuth[source].nickname}} |
|
|
</div> |
|
|
<div class="usercard-info">{{source}}</div> |
|
|
</div> |
|
|
<button ng-click="logout(source)"> |
|
|
{{_LOGOUT}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div ng-show="!is_login(source)"> |
|
|
<div class="usercard"> |
|
|
<img src="images/placeholder.png" /> |
|
|
|
|
|
<div class="usercard-title"> |
|
|
<div class="usercard-nickname"> |
|
|
{{_NOT_LOGIN_NICKNAME}} |
|
|
</div> |
|
|
<div class="usercard-info">{{source}}</div> |
|
|
</div> |
|
|
|
|
|
<button |
|
|
ng-click=" openLogin(source);showDialog(11, source);" |
|
|
> |
|
|
{{_LOGIN}} |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="page"> |
|
|
<div |
|
|
class="playlist-detail" |
|
|
ng-show="is_window_hidden!=1 && window_type=='list'" |
|
|
> |
|
|
<div class="detail-head"> |
|
|
<div class="detail-head-cover"> |
|
|
<img |
|
|
ng-src="{{ cover_img_url }}" |
|
|
err-src="https://y.gtimg.cn/mediastyle/global/img/singer_300.png" |
|
|
/> |
|
|
</div> |
|
|
<div class="detail-head-title"> |
|
|
<h2>{{ playlist_title }}</h2> |
|
|
<div class="playlist-button-list"> |
|
|
<div class="playlist-button playadd-button"> |
|
|
<div |
|
|
class="play-list" |
|
|
ng-click="playMylist(list_id)" |
|
|
> |
|
|
<span class="icon li-play-s"></span> |
|
|
{{_PLAY_ALL}} |
|
|
</div> |
|
|
<div |
|
|
class="add-list" |
|
|
ng-click="addMylist(list_id)" |
|
|
> |
|
|
<span class="icon li-add"></span> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button clone-button" |
|
|
ng-show="is_local" |
|
|
ng-click="addLocalMusic(list_id)" |
|
|
> |
|
|
<div class="play-list"> |
|
|
<span class="icon li-songlist"></span |
|
|
><span>{{_ADD_LOCAL_SONGS}}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button clone-button" |
|
|
ng-show="!is_mine && !is_local" |
|
|
ng-click="clonePlaylist(list_id)" |
|
|
> |
|
|
<div class="play-list"> |
|
|
<span class="icon li-songlist"></span |
|
|
><span>{{_ADD_TO_PLAYLIST}}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button edit-button" |
|
|
ng-show="is_mine && !is_local" |
|
|
ng-click="showDialog(3, {list_id: list_id, playlist_title: playlist_title, cover_img_url: cover_img_url})" |
|
|
> |
|
|
<div class="play-list"> |
|
|
<svg class="feather"> |
|
|
<use href="#edit"></use> |
|
|
</svg> |
|
|
<span>{{_EDIT}}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button fav-button" |
|
|
ng-show="!is_mine && !is_local" |
|
|
ng-click="favoritePlaylist(list_id)" |
|
|
> |
|
|
<div |
|
|
class="play-list" |
|
|
ng-class="{'favorited':is_favorite,'notfavorite':!is_favorite}" |
|
|
> |
|
|
<svg class="feather"> |
|
|
<use href="#star"></use> |
|
|
</svg> |
|
|
<span |
|
|
>{{is_favorite?_FAVORITED:_FAVORITE}}</span |
|
|
> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button edit-button" |
|
|
ng-show="isChrome && is_favorite && !is_local" |
|
|
ng-click="closeWindow();showPlaylist(list_id)" |
|
|
> |
|
|
<div class="play-list"> |
|
|
<span class="icon li-loop"></span |
|
|
><span>{{_REFRESH_PLAYLIST}}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button edit-button" |
|
|
ng-show="!is_mine && !is_local" |
|
|
open-url="playlist_source_url" |
|
|
> |
|
|
<div class="play-list"> |
|
|
<span class="icon li-link"></span |
|
|
><span>{{_ORIGIN_LINK}}</span> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="playlist-button edit-button" |
|
|
ng-show="is_mine && !is_local" |
|
|
ng-click="showDialog(6)" |
|
|
> |
|
|
<div class="play-list"> |
|
|
<svg class="feather"> |
|
|
<use href="#git-merge"></use> |
|
|
</svg> |
|
|
<span>{{_IMPORT}}</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<ul class="detail-songlist"> |
|
|
<div class="playlist-search"> |
|
|
<svg class="feather playlist-search-icon"> |
|
|
<use href="#search"></use> |
|
|
</svg> |
|
|
<svg |
|
|
class="feather playlist-clear-icon" |
|
|
ng-show="playlistFilter.key!=''" |
|
|
ng-click="clearFilter()" |
|
|
> |
|
|
<use href="#x"></use> |
|
|
</svg> |
|
|
<input |
|
|
class="playlist-search-input" |
|
|
type="text" |
|
|
ng-model="playlistFilter.key" |
|
|
placeholder="{{_SEARCH_PLAYLIST}}" |
|
|
/> |
|
|
</div> |
|
|
<li class="head"> |
|
|
<div class="title"> |
|
|
<a>{{_SONGS + '(' + songs.length + ')'}}</a> |
|
|
</div> |
|
|
<div class="artist"><a>{{_ARTISTS}}</a></div> |
|
|
<div class="album"><a>{{_ALBUMS}}</a></div> |
|
|
<div class="tools">{{_OPERATION}}</div> |
|
|
</li> |
|
|
<li |
|
|
ng-repeat="song in songs | filter: fieldFilter track by $index" |
|
|
ng-class-odd="'odd'" |
|
|
ng-class-even="'even'" |
|
|
ng-mouseenter="options=true" |
|
|
ng-mouseleave="options=false" |
|
|
draggable="true" |
|
|
drag-drop-zone |
|
|
drag-zone-object="song" |
|
|
drag-zone-title="song.title" |
|
|
sortable="is_mine || is_local" |
|
|
drag-zone-type="'application/listen1-song'" |
|
|
drop-zone-ondrop="onPlaylistSongDrop(list_id, song, arg1, arg2, arg3)" |
|
|
> |
|
|
<div class="title"> |
|
|
|
|
|
<a add-and-play="song">{{ song.title }}</a> |
|
|
</div> |
|
|
<div class="artist"> |
|
|
<a ng-click="showPlaylist(song.artist_id)" |
|
|
>{{ song.artist }}</a |
|
|
> |
|
|
</div> |
|
|
<div class="album"> |
|
|
<a ng-click="showPlaylist(song.album_id)" |
|
|
>{{ song.album }}</a |
|
|
> |
|
|
</div> |
|
|
<div class="tools"> |
|
|
<a |
|
|
title="{{_ADD_TO_QUEUE}}" |
|
|
class="detail-add-button" |
|
|
add-without-play="song" |
|
|
ng-show="options" |
|
|
><span class="icon li-add"></span |
|
|
></a> |
|
|
<a |
|
|
title="{{_ADD_TO_PLAYLIST}}" |
|
|
class="detail-fav-button" |
|
|
ng-show="options" |
|
|
ng-click="showDialog(0, song)" |
|
|
><span class="icon li-songlist"></span |
|
|
></a> |
|
|
<a |
|
|
title="{{_REMOVE_FROM_PLAYLIST}}" |
|
|
class="detail-delete-button" |
|
|
ng-click="removeSongFromPlaylist(song, list_id)" |
|
|
ng-show="options && (is_mine=='1'||is_local) " |
|
|
><span class="icon li-del"></span |
|
|
></a> |
|
|
<a |
|
|
title="{{_ORIGIN_LINK}}" |
|
|
class="source-button" |
|
|
open-url="song.source_url" |
|
|
ng-show="options && !is_local" |
|
|
><span class="icon li-link"></span |
|
|
></a> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div |
|
|
class="songdetail-wrapper" |
|
|
ng-class="{slidedown: window_type!=='track', coverbg: enableNowplayingCoverBackground}" |
|
|
> |
|
|
<div class="draggable-zone"></div> |
|
|
<div |
|
|
ng-if="enableNowplayingCoverBackground" |
|
|
class="bg" |
|
|
ng-style="{'background-image': 'url(' + currentPlaying.img_url + ')'}" |
|
|
></div> |
|
|
<div |
|
|
class="translate-switch" |
|
|
ng-click="toggleLyricTranslation()" |
|
|
ng-class="{selected: enableLyricTranslation}" |
|
|
> |
|
|
译 |
|
|
</div> |
|
|
<div |
|
|
class="close" |
|
|
ng-class="isMac? 'mac':'' " |
|
|
ng-click="popWindow()" |
|
|
> |
|
|
<svg class="icon"> |
|
|
<use href="#chevron-down"></use> |
|
|
</svg> |
|
|
</div> |
|
|
|
|
|
<div ng-if="!isChrome && !isMac" class="window-control"> |
|
|
<svg class="icon" window-control="window_min"> |
|
|
<use href="#minimize-2"></use> |
|
|
</svg> |
|
|
<svg class="icon" window-control="window_max"> |
|
|
<use href="#maximize"></use> |
|
|
</svg> |
|
|
<svg class="icon" window-control="window_close"> |
|
|
<use href="#x"></use> |
|
|
</svg> |
|
|
</div> |
|
|
|
|
|
<div class="playsong-detail"> |
|
|
<div class="detail-head"> |
|
|
<div class="detail-head-cover"> |
|
|
<img |
|
|
ng-src="{{ currentPlaying.img_url }}" |
|
|
err-src="https://y.gtimg.cn/mediastyle/global/img/album_300.png" |
|
|
/> |
|
|
</div> |
|
|
<div class="detail-head-title"> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<div class="detail-songinfo"> |
|
|
<div class="title"> |
|
|
<h2>{{ currentPlaying.title }}</h2> |
|
|
<span |
|
|
class="badge" |
|
|
ng-if="enableNowplayingBitrate && currentPlaying.bitrate !== undefined" |
|
|
>{{ currentPlaying.bitrate }}</span |
|
|
> |
|
|
<span |
|
|
class="badge platform" |
|
|
ng-if="enableNowplayingPlatform && currentPlaying.platform !== undefined" |
|
|
>{{ currentPlaying.platformText }}</span |
|
|
> |
|
|
</div> |
|
|
<div class="info"> |
|
|
<div class="singer"> |
|
|
<span>{{_ARTIST}}： </span |
|
|
><a |
|
|
ng-click="showPlaylist(currentPlaying.artist_id)" |
|
|
title="{{currentPlaying.artist}}" |
|
|
>{{ currentPlaying.artist }}</a |
|
|
> |
|
|
</div> |
|
|
<div class="album"> |
|
|
<span>{{_ALBUM}}： </span |
|
|
><a |
|
|
ng-click="showPlaylist(currentPlaying.album_id)" |
|
|
title="{{currentPlaying.album}}" |
|
|
>{{ currentPlaying.album }}</a |
|
|
> |
|
|
</div> |
|
|
</div> |
|
|
<div class="lyric"> |
|
|
<div class="placeholder"></div> |
|
|
<p |
|
|
ng-repeat="line in lyricArray track by $index" |
|
|
data-line="{{line.lineNumber}}" |
|
|
ng-class="{ 'highlight': (line.lineNumber == lyricLineNumber) || (line.lineNumber == lyricLineNumberTrans) , hide: (line.translationFlag && !enableLyricTranslation), translate: line.translationFlag}" |
|
|
> |
|
|
{{ line.content }} |
|
|
</p> |
|
|
<div class="placeholder"></div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="footer"> |
|
|
<div class="left-control"> |
|
|
<span class="icon li-previous" prev-track=""></span> |
|
|
<span |
|
|
class="icon li-play play" |
|
|
ng-class="isPlaying? 'li-pause': 'li-play'" |
|
|
play-pause-toggle="" |
|
|
></span> |
|
|
<span class="icon li-next" next-track=""></span> |
|
|
</div> |
|
|
<div class="main-info"> |
|
|
<div class="logo-banner" ng-if="playlist.length == 0"> |
|
|
<svg |
|
|
class="logo" |
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
width="24" |
|
|
height="24" |
|
|
viewBox="0 0 24 24" |
|
|
fill="#666666" |
|
|
stroke="#666666" |
|
|
stroke-width="1" |
|
|
stroke-linecap="round" |
|
|
stroke-linejoin="round" |
|
|
> |
|
|
<polygon |
|
|
points="7 4 7 19 16 19 16 16 10 16 10 4" |
|
|
></polygon> |
|
|
<polygon points="13 4 13 13 16 13 16 4"></polygon> |
|
|
</svg> |
|
|
</div> |
|
|
<div |
|
|
class="cover" |
|
|
class="cover" |
|
|
ng-if="playlist.length > 0" |
|
|
ng-click="toggleNowPlaying()" |
|
|
> |
|
|
<img |
|
|
ng-src="{{ currentPlaying.img_url }}" |
|
|
err-src="https://y.gtimg.cn/mediastyle/global/img/album_300.png" |
|
|
/> |
|
|
<div class="mask"> |
|
|
<svg class="feather"> |
|
|
<use href="#chevrons-up"></use> |
|
|
</svg> |
|
|
</div> |
|
|
</div> |
|
|
<div class="detail" ng-if="playlist.length > 0"> |
|
|
<div class="ctrl"> |
|
|
<a |
|
|
ng-click="showDialog(0, currentPlaying)" |
|
|
title="{{_ADD_TO_PLAYLIST}}" |
|
|
> |
|
|
<span class="icon li-songlist"></span> |
|
|
</a> |
|
|
<a |
|
|
title="{{ settings.playmode | playmode_title }}(s)" |
|
|
ng-click="changePlaymode()" |
|
|
> |
|
|
<span |
|
|
ng-show="settings.playmode == 0" |
|
|
class="icon li-loop" |
|
|
></span> |
|
|
<span |
|
|
ng-show="settings.playmode == 1" |
|
|
class="icon li-random-loop" |
|
|
></span> |
|
|
<span |
|
|
ng-show="settings.playmode == 2" |
|
|
class="icon li-single-cycle" |
|
|
></span> |
|
|
</a> |
|
|
</div> |
|
|
|
|
|
<div class="title"> |
|
|
<span |
|
|
ng-if="currentPlaying.source === 'xiami'" |
|
|
style="color: orange; font-size: medium" |
|
|
>⚠️ </span |
|
|
>{{ currentPlaying.title }} |
|
|
</div> |
|
|
<div class="more-info"> |
|
|
<div class="current">{{ currentPosition }}</div> |
|
|
<div class="singer"> |
|
|
<a ng-click="showPlaylist(currentPlaying.artist_id)" |
|
|
>{{ currentPlaying.artist }}</a |
|
|
> |
|
|
- |
|
|
<a ng-click="showPlaylist(currentPlaying.album_id)" |
|
|
>{{ currentPlaying.album }}</a |
|
|
> |
|
|
</div> |
|
|
<div class="total">{{ currentDuration }}</div> |
|
|
</div> |
|
|
<div class="playbar"> |
|
|
<div class="playbar-clickable"> |
|
|
<div |
|
|
class="barbg" |
|
|
id="progressbar" |
|
|
mode="play" |
|
|
draggable-bar="" |
|
|
> |
|
|
<div |
|
|
class="cur" |
|
|
ng-style="{width : myProgress + '%' }" |
|
|
> |
|
|
<span class="btn"><i></i></span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="right-control"> |
|
|
<div class="playlist-toggle"> |
|
|
<span |
|
|
ng-click="togglePlaylist()" |
|
|
class="icon li-list" |
|
|
></span> |
|
|
</div> |
|
|
<div class="volume-ctrl" volume-wheel=""> |
|
|
<span |
|
|
class="icon" |
|
|
ng-class="mute? 'li-mute': 'li-volume'" |
|
|
ng-click="toggleMuteStatus()" |
|
|
></span> |
|
|
<div class="m-pbar volume"> |
|
|
<div |
|
|
class="barbg" |
|
|
id="volumebar" |
|
|
mode="volume" |
|
|
draggable-bar="" |
|
|
> |
|
|
<div class="cur" ng-style="{width : volume + '%' }"> |
|
|
<span class="btn"><i></i></span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div ng-if="!isChrome" class="lyric-toggle"> |
|
|
<div |
|
|
ng-click="openLyricFloatingWindow(true)" |
|
|
class="lyric-icon" |
|
|
ng-class="{'selected': enableLyricFloatingWindow}" |
|
|
> |
|
|
词 |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
class="menu-modal" |
|
|
ng-class="{slideup: !menuHidden}" |
|
|
ng-click="togglePlaylist()" |
|
|
></div> |
|
|
<div class="menu" ng-class="{slideup: !menuHidden}"> |
|
|
<div class="menu-header"> |
|
|
<span class="menu-title" |
|
|
>{{_TOTAL_SONG_PREFIX}}{{playlist.length}}{{_TOTAL_SONG_POSTFIX}}</span |
|
|
> |
|
|
<a class="add-all" ng-click="showDialog(0, playlist)"> |
|
|
<span |
|
|
class="icon li-songlist" |
|
|
ng-click="togglePlaylist()" |
|
|
></span> |
|
|
<span>{{_ADD_TO_PLAYLIST}}</span></a |
|
|
> |
|
|
<a class="remove-all" clear-playlist="" |
|
|
><span |
|
|
class="icon li-del" |
|
|
ng-click="togglePlaylist()" |
|
|
></span |
|
|
><span>{{_CLEAR_ALL}}</span></a |
|
|
> |
|
|
|
|
|
<a class="close" ng-click="togglePlaylist()" |
|
|
><svg class="feather"> |
|
|
<use href="#x"></use> |
|
|
</svg> |
|
|
</a> |
|
|
</div> |
|
|
<ul class="menu-list"> |
|
|
<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" |
|
|
ng-class-odd="'odd'" |
|
|
ng-class-even="'even'" |
|
|
draggable="true" |
|
|
drag-drop-zone |
|
|
drag-zone-object="song" |
|
|
drag-zone-title="song.title" |
|
|
sortable="true" |
|
|
drag-zone-type="'application/listen1-song'" |
|
|
drop-zone-ondrop="onCurrentPlayingSongDrop(song, arg1, arg2, arg3)" |
|
|
> |
|
|
<div class="song-status-icon"> |
|
|
<svg |
|
|
class="feather play" |
|
|
ng-show="currentPlaying.id == song.id" |
|
|
> |
|
|
<use href="#play"></use> |
|
|
</svg> |
|
|
</div> |
|
|
<div |
|
|
class="song-title" |
|
|
ng-class="song.disabled? 'disabled':'' " |
|
|
> |
|
|
<a play-from-playlist="song" |
|
|
><span |
|
|
ng-if="song.source === 'xiami'" |
|
|
style=" |
|
|
color: orange; |
|
|
border-radius: 12px; |
|
|
border: solid 1px; |
|
|
padding: 0 4px; |
|
|
" |
|
|
>⚠️ 🦐</span |
|
|
>{{ song.title }}</a |
|
|
> |
|
|
</div> |
|
|
<div class="song-singer"> |
|
|
<a |
|
|
ng-click="showPlaylist(song.artist_id); togglePlaylist();" |
|
|
>{{ song.artist }}</a |
|
|
> |
|
|
</div> |
|
|
<div class="tools"> |
|
|
<span |
|
|
remove-from-playlist="song" |
|
|
data-index="{{$index}}" |
|
|
ng-show="playlist_highlight" |
|
|
class="icon li-del" |
|
|
></span> |
|
|
<span |
|
|
open-url="song.source_url" |
|
|
ng-show="playlist_highlight" |
|
|
class="icon li-link" |
|
|
></span> |
|
|
</div> |
|
|
|
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</body> |
|
|
</html> |
|
|
|
