| <!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}}: githublisten1@gmail.com</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> |
|
|
