changed purple sidebar link active color; now app.js is importing all the vue components to make sure they are all mounted
This commit is contained in:
Roberto Tonino
parent
973dc630c5
commit
85e0525a1b
|
|
@ -4,6 +4,7 @@ This is just the WebUI for deemix, it should be used with deemix-pyweb or someth
|
|||
|
||||
## What's left to do?
|
||||
|
||||
- Completely remove jQuery dependency
|
||||
- Make the UI look coherent
|
||||
- Style buttons
|
||||
- Style text inputs
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -224,15 +224,7 @@ <h1>No results</h1>
|
|||
</div>
|
||||
<!-- ### Track Search Tab ### -->
|
||||
<div id="track_search" class="search_tabcontent">
|
||||
<div v-if="!results.trackTab.loaded" class="loading_placeholder">
|
||||
<span class="loading_placeholder__text">Loading...</span>
|
||||
<div class="lds-ring">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<loading-placeholder v-if="!results.trackTab.loaded"></loading-placeholder>
|
||||
<div v-else-if="results.trackTab.data.length == 0">
|
||||
<h1>No Tracks found</h1>
|
||||
</div>
|
||||
|
|
@ -294,15 +286,7 @@ <h1>No Tracks found</h1>
|
|||
</div>
|
||||
<!-- ### Album Search Tab ### -->
|
||||
<div id="album_search" class="search_tabcontent">
|
||||
<div v-if="!results.albumTab.loaded" class="loading_placeholder">
|
||||
<span class="loading_placeholder__text">Loading...</span>
|
||||
<div class="lds-ring">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<loading-placeholder v-if="!results.albumTab.loaded"></loading-placeholder>
|
||||
<div v-else-if="results.albumTab.data.length == 0">
|
||||
<h1>No Albums found</h1>
|
||||
</div>
|
||||
|
|
@ -325,15 +309,7 @@ <h1>No Albums found</h1>
|
|||
</div>
|
||||
<!-- ### Artist Search Tab ### -->
|
||||
<div id="artist_search" class="search_tabcontent">
|
||||
<div v-if="!results.artistTab.loaded" class="loading_placeholder">
|
||||
<span class="loading_placeholder__text">Loading...</span>
|
||||
<div class="lds-ring">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<loading-placeholder v-if="!results.artistTab.loaded"></loading-placeholder>
|
||||
<div v-else-if="results.artistTab.data.length == 0">
|
||||
<h1>No Artists found</h1>
|
||||
</div>
|
||||
|
|
@ -353,15 +329,7 @@ <h1>No Artists found</h1>
|
|||
</div>
|
||||
<!-- ### Playlist Search Tab ### -->
|
||||
<div id="playlist_search" class="search_tabcontent">
|
||||
<div v-if="!results.playlistTab.loaded" class="loading_placeholder">
|
||||
<span class="loading_placeholder__text">Loading...</span>
|
||||
<div class="lds-ring">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<loading-placeholder v-if="!results.playlistTab.loaded"></loading-placeholder>
|
||||
<div v-else-if="results.playlistTab.data.length == 0">
|
||||
<h1>No Playlists found</h1>
|
||||
</div>
|
||||
|
|
@ -613,7 +581,7 @@ <h1>No Favorite Tracks found</h1>
|
|||
</div>
|
||||
|
||||
<div id="analyzer_tab" class="main_tabcontent image_header">
|
||||
<h1>Link Analyzer</h1>
|
||||
<h2 class="page_heading">Link Analyzer</h2>
|
||||
<div v-if="link == ''">
|
||||
<p>You can use this section to find out more information about the link you are trying to
|
||||
download<br />This is usefull if you're trying to download some tracks that are not available in your
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,3 +1,17 @@
|
|||
// Global Vue components
|
||||
import './modules/components/LoadingPlaceholder.js'
|
||||
|
||||
// Vue views components
|
||||
import './modules/components/artist-tab.js'
|
||||
import './modules/components/charts-tab.js'
|
||||
import './modules/components/errors-tab.js'
|
||||
import './modules/components/favorites-tab.js'
|
||||
import './modules/components/home-tab.js'
|
||||
import './modules/components/link-analyzer-tab.js'
|
||||
import './modules/components/main-search.js'
|
||||
import './modules/components/settings-tab.js'
|
||||
import './modules/components/tracklist-tab.js'
|
||||
|
||||
import $ from 'jquery'
|
||||
import { socket } from './modules/socket.js'
|
||||
import { toast } from './modules/toasts.js'
|
||||
|
|
@ -10,8 +24,7 @@ import TrackPreview from './modules/track-preview.js'
|
|||
/* ===== App initialization ===== */
|
||||
|
||||
function startApp() {
|
||||
// Setting current theme
|
||||
setUserTheme()
|
||||
setCurrentUserTheme()
|
||||
|
||||
Downloads.init()
|
||||
QualityModal.init()
|
||||
|
|
@ -33,9 +46,8 @@ window.addEventListener('pywebviewready', initClient)
|
|||
/**
|
||||
* Sets the current theme according to
|
||||
* the localStorage saved theme.
|
||||
* @since 0.1.6
|
||||
*/
|
||||
function setUserTheme() {
|
||||
function setCurrentUserTheme() {
|
||||
let selectedTheme = localStorage.getItem('selectedTheme')
|
||||
|
||||
if (selectedTheme) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
import Vue from 'vue'
|
||||
|
||||
Vue.component('loading-placeholder', {
|
||||
template: `<div class="loading_placeholder">
|
||||
<span class="loading_placeholder__text">Loading...</span>
|
||||
<div class="lds-ring">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>`
|
||||
})
|
||||
|
|
@ -1,9 +1,6 @@
|
|||
import ArtistTab from './components/artist-tab.js'
|
||||
import TracklistTab from './components/tracklist-tab.js'
|
||||
import LinkAnalyzerTab from './components/link-analyzer-tab.js'
|
||||
import HomeTab from './components/home-tab.js'
|
||||
import ChartsTab from './components/charts-tab.js'
|
||||
import FavoritesTab from './components/favorites-tab.js'
|
||||
import ErrorsTab from './components/errors-tab.js'
|
||||
import { socket } from './socket.js'
|
||||
import SettingsTab from './components/settings-tab.js'
|
||||
|
|
@ -73,7 +70,6 @@ function linkListeners() {
|
|||
* according to clicked icon.
|
||||
* Uses event delegation
|
||||
* @param {Event} event
|
||||
* @since 0.1.0
|
||||
*/
|
||||
function handleSidebarClick(event) {
|
||||
const { target } = event
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ $sidebar-delay: 75ms;
|
|||
|
||||
// Fix for purple theme in which grayscale shows incoherent color
|
||||
html[data-theme='purple'] & {
|
||||
background: var(--sidebar-link-bg);
|
||||
background: var(--sidebar-link-bg-20);
|
||||
filter: grayscale(0);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue