tcsenpai/swingmusic
1
0
Fork 0
mirror of https://github.com/tcsenpai/swingmusic.git synced 2025-06-06 03:05:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Migrate to vite and some more stuff

Browse Source 
- server: add a `Track` class
- server: add a create_track_class function
- client: migrate from vue-cli to vite
This commit is contained in:
geoffrey45 2022-01-25 11:51:26 +03:00
parent 7689f13fdc
commit d6204946c2
18 changed files with 638 additions and 8372 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
.eslintrc.js
View File

@ -1,17 +1,11 @@
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/vue3-essential',
'eslint:recommended'
],
parserOptions: {
parser: 'babel-eslint'
es2021: true,
},
extends: ["plugin:vue/vue3-essential", "eslint:recommended"],
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
},
};

5
babel.config.js
View File

@ -1,5 +0,0 @@
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}

21
index.html Normal file
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="img/favicon.ico" />
<title>MusicX</title>
</head>
<body>
<noscript>
<strong
>We're sorry but this app doesn't work properly without JavaScript
enabled. Please enable it to continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script type="module" src="/src/main.js"></script>
</body>
</html>

22
package.json
View File

@ -3,16 +3,16 @@
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
"dev": "vite",
"serve": "vite preview",
"build": "vite build",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src"
},
"dependencies": {
"animate.css": "^4.1.1",
"core-js": "^3.6.5",
"mitt": "^3.0.0",
"register-service-worker": "^1.7.1",
"sass": "^1.44.0",
"sass": "^1.49.0",
"sass-loader": "^10",
"vue": "^3.0.0",
"vue-debounce": "^3.0.2",
@ -20,14 +20,10 @@
"webpack": "^5.64.4"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-pwa": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vitejs/plugin-vue": "^1.6.1",
"@vue/compiler-sfc": "^3.0.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0"
"eslint": "^8.7.0",
"eslint-plugin-vue": "^8.3.0",
"vite": "^2.5.4"
}
}

17
public/index.html
View File

@ -1,17 +0,0 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="img/favicon.ico">
<title>MusicX</title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

69
server/app/api.py
View File

@ -11,8 +11,11 @@ all_the_f_music = helpers.getAllSongs()
def initialize() -> None:
"""
Runs all the necessary setup functions.
"""
helpers.create_config_dir()
helpers.check_for_new_songs()
# helpers.check_for_new_songs()
initialize()
@ -38,19 +41,19 @@ def search_by_title():
artists_dicts = []
for track in all_the_f_music:
if query.lower() in track['title'].lower():
if query.lower() in track.title.lower():
tracks.append(track)
if query.lower() in track['album'].lower():
if query.lower() in track.album.lower():
albums.append(track)
if query.lower() in str(track['artists']).lower():
if query.lower() in str(track.artists).lower():
artists.append(track)
for song in albums:
album_obj = {
"name": song["album"],
"artist": song["album_artist"],
"name": song.album,
"artist": song.album_artist,
}
if album_obj not in albums_dicts:
@ -58,11 +61,11 @@ def search_by_title():
for album in albums_dicts:
for track in albums:
if album['name'] == track['album']:
album['image'] = track['image']
if album['name'] == track.album:
album['image'] = track.image
for song in artists:
for artist in song["artists"]:
for artist in song.artists:
if query.lower() in artist.lower():
artist_obj = {
@ -80,22 +83,23 @@ def search_by_title():
else:
more_tracks = False
if len(artists_dicts) > 5:
if len(artists_dicts) > 8:
more_artists = True
else:
more_artists = False
if len(albums_dicts) > 5:
if len(albums_dicts) > 8:
more_albums = True
else:
more_albums = False
return {'data': [
{'tracks': tracks[:5], 'more': more_tracks},
{'albums': albums_dicts[:5], 'more': more_albums},
{'artists': artists_dicts[:5], 'more': more_artists}
{'albums': albums_dicts[:8], 'more': more_albums},
{'artists': artists_dicts[:8], 'more': more_artists}
]}
@bp.route('/populate')
def x():
functions.populate()
@ -111,13 +115,13 @@ def get_album_artists(album, artist):
tracks = []
for track in all_the_f_music:
if track["album"] == album and track["album_artist"] == artist:
if track.album == album and track.album_artist == artist:
tracks.append(track)
artists = []
for track in tracks:
for artist in track['artists']:
for artist in track.artists:
if artist not in artists:
artists.append(artist)
@ -213,35 +217,13 @@ def getFolderTree(folder: str):
songs = []
for x in all_the_f_music:
if x['folder'] == req_dir:
songs.append(x)
for song in songs:
song['image'] = song['image'].replace('127.0.0.1', '0.0.0.0')
for track in all_the_f_music:
if track.folder == req_dir:
songs.append(track)
return {"files": helpers.remove_duplicates(songs), "folders": sorted(folders, key=lambda i: i['name'])}
@bp.route('/qwerty')
def populateArtists():
all_songs = instances.songs_instance.get_all_songs()
artists = []
for song in all_songs:
for a in song['artists']:
a_obj = {
"name": a,
}
if a_obj not in artists:
artists.append(a_obj)
instances.artist_instance.insert_artist(a_obj)
return {'songs': artists}
@bp.route('/albums')
def getAlbums():
@ -310,8 +292,3 @@ def convert_images_to_webp():
'.jpg', '.webp')), format='webp')
return "Done"
@bp.route('/test')
def test_http_status_response():
return "OK", 200

103
server/app/functions.py
View File

@ -6,6 +6,7 @@ import time
import os
import requests
import random
import datetime
from mutagen.flac import MutagenError
from mutagen.mp3 import MP3
@ -18,6 +19,7 @@ from io import BytesIO
from app import helpers
from app import instances
from app import api
from app import models
def populate():
@ -53,61 +55,63 @@ def populate_images():
bar = Bar('Processing images', max=len(artists))
for artist in artists:
file_path = helpers.app_dir + '/images/artists/' + \
artist.replace('/', '::') + '.jpg'
artist.replace('/', '::') + '.webp'
if not os.path.exists(file_path):
url = 'https://api.deezer.com/search/artist?q={}'.format(artist)
try:
def try_save_image():
url = 'https://api.deezer.com/search/artist?q={}'.format(artist)
response = requests.get(url)
except requests.ConnectionError:
print('\n sleeping for 5 seconds')
data = response.json()
try:
img_path = data['data'][0]['picture_medium']
except:
img_path = None
if img_path is not None:
# save image as webp
img = Image.open(BytesIO(requests.get(img_path).content))
img.save(file_path, format="webp")
try:
try_save_image()
except requests.exceptions.ConnectionError:
time.sleep(5)
response = requests.get(url)
data = response.json()
try:
img_data = data['data'][0]['picture_xl']
except:
img_data = None
if img_data is not None:
helpers.save_image(img_data, file_path)
try_save_image()
bar.next()
bar.finish()
def extract_thumb(path: str) -> str:
def extract_thumb(audio_file_path: str = None) -> str:
"""
Extracts the thumbnail from an audio file. Returns the path to the thumbnail.
"""
album_art = None
def use_defaults() -> str:
"""
Returns a path to a random image in the defaults directory.
"""
path = "http://127.0.0.1:8900/images/defaults/" + \
str(random.randint(0, 10)) + '.webp'
path = str(random.randint(0, 10)) + '.webp'
return path
webp_path = path.split('/')[-1] + '.webp'
webp_path = audio_file_path.split('/')[-1] + '.webp'
img_path = os.path.join(helpers.app_dir, "images", "thumbnails", webp_path)
if os.path.exists(img_path):
return "http://127.0.0.1:8900/images/thumbnails/" + webp_path
return webp_path
if path.endswith('.flac'):
if audio_file_path.endswith('.flac'):
try:
audio = FLAC(path)
audio = FLAC(audio_file_path)
album_art = audio.pictures[0].data
except:
album_art = None
elif path.endswith('.mp3'):
elif audio_file_path.endswith('.mp3'):
try:
audio = ID3(path)
audio = ID3(audio_file_path)
album_art = audio.getall('APIC')[0].data
except:
album_art = None
@ -128,9 +132,8 @@ def extract_thumb(path: str) -> str:
except:
return use_defaults()
final_path = "http://0.0.0.0:8900/images/thumbnails/" + webp_path
return webp_path
return final_path
def getTags(full_path: str) -> dict:
"""
@ -198,8 +201,23 @@ def getTags(full_path: str) -> dict:
except IndexError:
genre = "Unknown"
try:
date = audio['date'][0]
except KeyError:
try:
date = audio['TDRC'][0]
except:
date = "Unknown"
except IndexError:
date = "Unknown"
img_path = extract_thumb(full_path)
length = str(datetime.timedelta(seconds=round(audio.info.length)))
if length[:2] == "0:":
length = length.replace('0:', '')
tags = {
"filepath": full_path.replace(helpers.home_dir, ''),
"folder": os.path.dirname(full_path).replace(helpers.home_dir, ""),
@ -208,8 +226,9 @@ def getTags(full_path: str) -> dict:
"album_artist": album_artist,
"album": album,
"genre": genre,
"length": round(audio.info.length),
"bitrate": audio.info.bitrate,
"length": length,
"bitrate": round(int(audio.info.bitrate)/1000),
"date": str(date)[:4],
"image": img_path,
}
@ -220,15 +239,16 @@ def getTags(full_path: str) -> dict:
def getAlbumBio(title: str, album_artist: str) -> dict:
last_fm_url = 'http://ws.audioscrobbler.com/2.0/?method=album.getinfo&api_key={}&artist={}&album={}&format=json'.format(
helpers.last_fm_api_key, album_artist, title)
try:
response = requests.get(last_fm_url)
data = response.json()
except:
return "None"
try:
bio = data['album']['wiki']['summary'].split('<a href="https://www.last.fm/')[0]
bio = data['album']['wiki']['summary'].split(
'<a href="https://www.last.fm/')[0]
except KeyError:
bio = None
@ -236,3 +256,20 @@ def getAlbumBio(title: str, album_artist: str) -> dict:
return "None"
return bio
def create_track_class(tags):
return models.Track(
tags['_id']["$oid"],
tags['title'],
tags['artists'],
tags['album_artist'],
tags['album'],
tags['filepath'],
tags['folder'],
tags['length'],
tags['date'],
tags['genre'],
tags['bitrate'],
tags['image']
)

30
server/app/helpers.py
View File

@ -17,6 +17,7 @@ home_dir = os.path.expanduser('~') + '/'
app_dir = os.path.join(home_dir, '.musicx')
last_fm_api_key = "762db7a44a9e6fb5585661f5f2bdf23a"
def background(f):
'''
a threading decorator
@ -29,6 +30,9 @@ def background(f):
@background
def check_for_new_songs():
"""
Checks for new songs every 5 minutes.
"""
flag = False
while flag is False:
@ -68,12 +72,12 @@ def remove_duplicates(array: list) -> list:
while song_num < len(array) - 1:
for index, song in enumerate(array):
try:
if array[song_num].title == song.title and \
array[song_num].album == song.album and \
array[song_num].artists == song.artists and \
index != song_num:
array.remove(song)
if array[song_num]["title"] == song["title"] and array[song_num]["album"] == song["album"] and array[song_num]["artists"] == song["artists"] and index != song_num:
array.remove(song)
except:
print('whe')
song_num += 1
return array
@ -113,27 +117,29 @@ def create_config_dir() -> None:
for dir in dirs:
path = os.path.join(config_folder, dir)
os.chmod(path, 0o755)
try:
os.makedirs(path)
except FileExistsError:
pass
os.chmod(path, 0o755)
def getAllSongs() -> None:
"""
Gets all songs under the ~/ directory.
"""
tracks = instances.songs_instance.get_all_songs()
tracks = []
for track in instances.songs_instance.get_all_songs():
track = functions.create_track_class(track)
for track in tracks:
try:
os.chmod(os.path.join(home_dir, track['filepath']), 0o755)
os.chmod(os.path.join(home_dir, track.filepath), 0o755)
except FileNotFoundError:
instances.songs_instance.remove_song_by_filepath(track['filepath'])
instances.songs_instance.remove_song_by_filepath(track.filepath)
if track['artists'] is not None:
track['artists'] = track['artists'].split(', ')
tracks.append(track)
return tracks

23
server/app/models.py
View File

@ -1,3 +1,4 @@
from dataclasses import dataclass
import pymongo
import json
from bson import ObjectId, json_util
@ -119,3 +120,25 @@ class AllSongs(Mongo):
return True
except:
return False
@dataclass
class Track:
id: str
title: str
artists: str
album_artist: str
album: str
filepath: str
folder: str
length: int
date: int
genre: str
bitrate: int
image: str
def __post_init__(self):
self.artists = self.artists.split(', ')
self.image = "http://127.0.0.1:8900/images/thumbnails/" + self.image

76
src/components/FolderView/SongList.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="folder">
<div class="table rounded" v-if="songs.length">
<div class="table rounded" v-if="props.songs.length">
<table>
<thead>
<tr>
@ -12,7 +12,7 @@
</thead>
<tbody>
<SongItem
v-for="song in songs"
v-for="song in props.songs"
:key="song"
:song="song"
@updateQueue="updateQueue"
@ -21,69 +21,61 @@
</tbody>
</table>
</div>
<div v-else-if="songs.length === 0 && search_query">
<div v-else-if="props.songs.length === 0 && search_query">
<div class="no-results">
<div class="icon"></div>
<div class="text">❗ Track not found!</div>
<div class="text">No tracks 🎸</div>
</div>
</div>
<div v-else ref="songtitle"></div>
</div>
</template>
<script>
<script setup>
import { ref } from "@vue/reactivity";
import { onMounted } from "@vue/runtime-core";
// import { defineProps } from 'vue';
import SongItem from "../shared/SongItem.vue";
import routeLoader from "@/composables/routeLoader.js";
import perks from "@/composables/perks.js";
import state from "@/composables/state.js";
import { useRoute } from "vue-router";
export default {
props: ["songs"],
components: {
SongItem,
},
setup() {
let route;
const props = defineProps({
songs: {
type: Array,
required: true
}
});
const current = ref(perks.current);
const search_query = ref(state.search_query);
onMounted(() => {
route = useRoute().name;
});
let route;
function updateQueue(song) {
let type;
const search_query = ref(state.search_query);
switch (route) {
// check which route the play request come from
case "FolderView":
type = "folder";
break;
case "AlbumView":
type = "album";
break;
}
onMounted(() => {
route = useRoute().name;
});
perks.updateQueue(song, type);
}
function updateQueue(song) {
let type;
function loadAlbum(title, album_artist) {
routeLoader.toAlbum(title, album_artist);
}
switch (route) {
// check which route the play request come from
case "FolderView":
type = "folder";
break;
case "AlbumView":
type = "album";
break;
}
return {
updateQueue,
loadAlbum,
current,
search_query,
};
},
};
perks.updateQueue(song, type);
}
function loadAlbum(title, album_artist) {
routeLoader.toAlbum(title, album_artist);
}
</script>
<style lang="scss">

2
src/components/RightSideBar/NowPlaying.vue
View File

@ -21,7 +21,7 @@
</div>
</div>
<div class="progress">
<div class="duration">{{ fmtMSS(current.length) }}</div>
<div class="duration">{{ current.length }}</div>
<input
id="progress"
type="range"

4
src/components/RightSideBar/UpNext.vue
View File

@ -31,7 +31,7 @@
:key="song"
@click="playThis(song)"
:class="{
currentInQueue: current._id.$oid == song._id.$oid,
currentInQueue: current.id == song.id,
}"
>
<div
@ -42,7 +42,7 @@
>
<div
class="now-playing-track image"
v-if="current._id.$oid == song._id.$oid"
v-if="current.id == song.id"
:class="{ active: is_playing, not_active: !is_playing }"
></div>
</div>

6
src/components/shared/SongItem.vue
View File

@ -1,8 +1,8 @@
<template>
<tr
class="songlist-item"
:class="{ current: current.id == song.id }"
>
<!-- :class="{ current: current._id.$oid == song._id.$oid }" -->
<td class="flex" @click="emitUpdate(song)">
<div
class="album-art rounded image"
@ -12,7 +12,7 @@
>
<div
class="now-playing-track image"
v-if="current._id.$oid == song._id.$oid"
v-if="current.id == song.id"
:class="{ active: is_playing, not_active: !is_playing }"
></div>
</div>
@ -45,7 +45,7 @@
</div>
</td>
<td class="song-duration">
{{ `${Math.trunc(song.length / 60)} min` }}
{{ song.length }}
</td>
</tr>
</template>

6
src/composables/perks.js
View File

@ -38,7 +38,7 @@ const putCommas = (artists) => {
function updateNext(song_) {
const index = state.queue.value.findIndex(
(item) => item._id.$oid === song_._id.$oid
(item) => item.id === song_.id
);
if (index == queue.value.length - 1) {
@ -53,7 +53,7 @@ function updateNext(song_) {
function updatePrev(song) {
const index = state.queue.value.findIndex(
(item) => item._id.$oid === song._id.$oid
(item) => item.id === song.id
);
if (index == 0) {
@ -94,7 +94,7 @@ const updateQueue = async (song, type) => {
break;
}
if (state.queue.value[0]._id.$oid !==list[0]._id.$oid) {
if (state.queue.value[0].id !==list[0].id) {
const new_queue =list;
localStorage.setItem("queue", JSON.stringify(new_queue));
state.queue.value = new_queue;

2
src/router/index.js
View File

@ -46,7 +46,7 @@ const routes = [
];
const router = createRouter({
history: createWebHistory(process.env.BASE_URL),
history: createWebHistory(import.meta.env.BASE_URL),
routes,
});

19
vite.config.js Normal file
View File

@ -0,0 +1,19 @@
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
const path = require("path");
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
"@": path.resolve(__dirname, "src"),
},
},
css: {
preprocessorOptions: {
scss: {
additionalData: `@import "@/assets/css/_variables.scss";`,
},
},
},
});

9
vue.config.js
View File

@ -1,9 +0,0 @@
module.exports = {
css: {
loaderOptions: {
sass: {
additionalData: `@import "@/assets/css/_variables.scss";`
}
}
}
};

8578
yarn.lock
View File

File diff suppressed because it is too large Load Diff