Home Explore Help
Sign In
owen
/
Musare
mirror of https://github.com/odiffey/MusareNode
1
0
Fork 0
Files Issues 0 Wiki
Browse Source

Improved sitename config usage

Owen Diffey 4 years ago
parent
aa24ff5af0
commit
9e160a933f
8 changed files with 65 additions and 31 deletions
Split View Show Diff Stats
  1. 4 4
      frontend/dist/index.tpl.html
  2. 1 1
      frontend/src/components/Queue.vue
  3. 32 11
      frontend/src/components/layout/MainFooter.vue
  4. 3 1
      frontend/src/components/layout/MainHeader.vue
  5. 7 1
      frontend/src/components/modals/ManageStation/index.vue
  6. 0 7
      frontend/src/main.js
  7. 14 6
      frontend/src/pages/Home.vue
  8. 4 0
      frontend/webpack.common.js

+ 4 - 4
frontend/dist/index.tpl.html
View File 

@@ -1,14 +1,14 @@
 
 <!DOCTYPE html>
 
 <html lang='en'>
 
 <head>
 
-	<title>Musare</title>
 
+	<title><%= htmlWebpackPlugin.options.title %></title>
 
 
 	<meta charset='UTF-8'>
 
 	<meta http-equiv='X-UA-Compatible' content='IE=edge'>
 
 	<meta name='viewport' content='width=device-width, initial-scale=1, user-scalable=no'>
 
-	<meta name='keywords' content='music, musare, listen, station, station, radio, edm, chill, community, official, rooms, room, party, good, mus, pop'>
 
-	<meta name='description' content='On Musare you can listen to lots of different songs, playing 24/7 in our official stations and in user-made community stations!'>
 
-	<meta name='copyright' content='© Copyright Musare 2015-2021 All Right Reserved'>
 
+	<meta name='keywords' content='music, <%= htmlWebpackPlugin.options.title %>, listen, station, station, radio, edm, chill, community, official, rooms, room, party, good, mus, pop'>
 
+	<meta name='description' content='On <%= htmlWebpackPlugin.options.title %> you can listen to lots of different songs, playing 24/7 in our official stations and in user-made community stations!'>
 
+	<meta name='copyright' content='© Copyright <%= htmlWebpackPlugin.options.title %> 2015-2021 All Right Reserved'>
 
 
 	<link rel='apple-touch-icon' sizes='57x57' href='/assets/favicon/apple-touch-icon-57x57.png?v=06042016'>
 
 	<link rel='apple-touch-icon' sizes='60x60' href='/assets/favicon/apple-touch-icon-60x60.png?v=06042016'>

+ 1 - 1
frontend/src/components/Queue.vue
View File 

@@ -82,7 +82,7 @@
 
 						!station.locked ||
 
 						(station.locked && isAdminOnly() && dismissedWarning))
 
 			"
 
-			@click="openModal('manageStation') & showManageStationTab('search')" 
+			@click="openModal('manageStation') & showManageStationTab('search')"
 
 		>
 
 			<i class="material-icons icon-with-button">queue</i>
 
 			<span> Add Song To Queue </span>

+ 32 - 11
frontend/src/components/layout/MainFooter.vue
View File 

@@ -3,13 +3,21 @@
 
 		<div class="container">
 
 			<div class="footer-content has-text-centered">
 
 				<div id="footer-copyright">
 
-					<p>© Copyright Musare 2015 - 2021</p>
 
+					<p>© Copyright {{ siteSettings.sitename }} 2015 - 2021</p>
 
 				</div>
 
-				<a id="footer-logo" href="/"
 
-					><img src="/assets/blue_wordmark.png" alt="Musare"
 
-				/></a>
 
+				<a id="footer-logo" href="/">
 
+					<img
 
+						v-if="siteSettings.sitename === 'Musare'"
 
+						:src="siteSettings.logo_blue"
 
+						:alt="siteSettings.sitename || `Musare`"
 
+					/>
 
+					<span v-else>{{ siteSettings.sitename }}</span>
 
+				</a>
 
 				<div id="footer-links">
 
-					<a :href="github" target="_blank" title="GitHub Repository"
 
+					<a
 
+						:href="siteSettings.github"
 
+						target="_blank"
 
+						title="GitHub Repository"
 
 						>GitHub</a
 
 					>
 
 					<router-link title="About Musare" to="/about"
 
@@ -48,7 +56,11 @@ import { mapState, mapGetters, mapActions } from "vuex";
 
 export default {
 
 	data() {
 
 		return {
 
-			github: "#",
 
+			siteSettings: {
 
+				logo: "",
 
+				sitename: "Musare",
 
+				github: "#"
 
+			},
 
 			localNightmode: null
 
 		};
 
 	},
 
@@ -78,8 +90,6 @@ export default {
 
 		}
 
 	},
 
 	async mounted() {
 
-		this.github = await lofig.get("siteSettings.github");
 
-
 
 		this.localNightmode = JSON.parse(localStorage.getItem("nightmode"));
 
 
 		this.socket.dispatch("users.getPreferences", res => {
 
@@ -148,6 +158,17 @@ export default {
 
 		width: 160px;
 
 		order: 1;
 
 		user-select: none;
 
+		font-size: 2.5rem !important;
 
+		line-height: 50px !important;
 
+		font-family: Pacifico, cursive;
 
+		color: var(--primary-color);
 
+		white-space: nowrap;
 
+
 
+		img {
 
+			max-height: 38px;
 
+			color: var(--primary-color);
 
+			user-select: none;
 
+		}
 
 	}
 
 
 	#footer-links {
 
@@ -158,15 +179,15 @@ export default {
 
 		}
 
 
 		a {
 
-			padding: 0 7px 0 4px;
 
+			padding: 0 5px;
 
 			color: var(--primary-color);
 
 
 			&:first-of-type {
 
-				padding: 0 7px 0 0;
 
+				padding: 0 5px 0 0;
 
 			}
 
 
 			&:last-of-type {
 
-				padding: 0 0 0 7px;
 
+				padding: 0 0 0 5px;
 
 			}
 
 
 			&:hover {

+ 3 - 1
frontend/src/components/layout/MainHeader.vue
View File 

@@ -3,9 +3,11 @@
 
 		<div class="nav-left">
 
 			<router-link v-if="!hideLogo" class="nav-item is-brand" to="/">
 
 				<img
 
+					v-if="siteSettings.sitename === 'Musare'"
 
 					:src="siteSettings.logo_white"
 
 					:alt="siteSettings.sitename || `Musare`"
 
 				/>
 
+				<span v-else>{{ siteSettings.sitename }}</span>
 
 			</router-link>
 
 		</div>
 
 
@@ -71,7 +73,7 @@ export default {
 
 			isMobile: false,
 
 			frontendDomain: "",
 
 			siteSettings: {
 
-				logo: "",
 
+				logo_white: "",
 
 				sitename: ""
 
 			}
 
 		};

+ 7 - 1
frontend/src/components/modals/ManageStation/index.vue
View File 

@@ -583,7 +583,13 @@ export default {
 
 
 <style lang="scss" scoped>
 
 .night-mode {
 
-	.manage-station-modal.modal .modal-card-body .custom-modal-body .left-section .tabs-container .tab-selection .button {
 
+	.manage-station-modal.modal
 
+		.modal-card-body
 
+		.custom-modal-body
 
+		.left-section
 
+		.tabs-container
 
+		.tab-selection
 
+		.button {
 
 		background: var(--dark-grey);
 
 		color: var(--white);
 
 	}

+ 0 - 7
frontend/src/main.js
View File 

@@ -11,10 +11,6 @@ import AppComponent from "./App.vue";
 
 
 const REQUIRED_CONFIG_VERSION = 6;
 
 
-const handleMetadata = attrs => {
 
-	document.title = `Musare | ${attrs.title}`;
 
-};
 
-
 
 const app = createApp(AppComponent);
 
 
 app.use(store);
 
@@ -39,9 +35,6 @@ app.component("Metadata", {
 
 	watch: {
 
 		$attrs: {
 
 			// eslint-disable-next-line vue/no-arrow-functions-in-watch
 
-			handler: attrs => {
 
-				handleMetadata(attrs);
 
-			},
 
 			deep: true,
 
 			immediate: true
 
 		}

+ 14 - 6
frontend/src/pages/Home.vue
View File 

@@ -13,10 +13,14 @@
 
 				<div class="content-container">
 
 					<div class="content">
 
 						<img
 
+							v-if="siteSettings.sitename === 'Musare'"
 
+							:src="siteSettings.logo_white"
 
+							:alt="siteSettings.sitename || `Musare`"
 
 							class="logo"
 
-							src="/assets/white_wordmark.png"
 
-							:alt="`${this.sitename}` || `Musare`"
 
 						/>
 
+						<span v-else class="logo">{{
 
+							siteSettings.sitename
 
+						}}</span>
 
 						<div v-if="!loggedIn" class="buttons">
 
 							<button
 
 								class="button login"
 
@@ -465,7 +469,10 @@ export default {
 
 			stations: [],
 
 			favoriteStations: [],
 
 			searchQuery: "",
 
-			sitename: "Musare",
 
+			siteSettings: {
 
+				logo_white: "",
 
+				sitename: ""
 
+			},
 
 			orderOfFavoriteStations: []
 
 		};
 
 	},
 
@@ -515,7 +522,7 @@ export default {
 
 		}
 
 	},
 
 	async mounted() {
 
-		this.sitename = await lofig.get("siteSettings.sitename");
 
+		this.siteSettings = await lofig.get("siteSettings");
 
 
 		if (this.socket.readyState === 1) this.init();
 
 		ws.onConnect(() => this.init());
 
@@ -883,12 +890,13 @@ html {
 
 			right: 0;
 
 			transform: translateY(-50%);
 
 			background-color: transparent !important;
 
-			img.logo {
 
+			.logo {
 
 				max-height: 90px;
 
-				font-size: 40px;
 
+				font-size: 50px;
 
 				color: var(--white);
 
 				font-family: Pacifico, cursive;
 
 				user-select: none;
 
+				white-space: nowrap;
 
 			}
 
 			.buttons {
 
 				display: flex;

+ 4 - 0
frontend/webpack.common.js
View File 

@@ -1,3 +1,6 @@
 
+process.env.NODE_CONFIG_DIR = `${__dirname}/dist/config/`;
 
+const config = require("config");
 
+
 
 const path = require("path");
 
 const { VueLoaderPlugin } = require("vue-loader");
 
 const HtmlWebpackPlugin = require("html-webpack-plugin");
 
@@ -17,6 +20,7 @@ module.exports = {
 
 	plugins: [
 
 		new VueLoaderPlugin(),
 
 		new HtmlWebpackPlugin({
 
+			title: config.get("siteSettings.sitename"),
 
 			hash: true,
 
 			template: "dist/index.tpl.html",
 
 			inject: "body",