deleting unused components and restructuring
This commit is contained in:
13
nginx/vue/src/components/admin/Login.vue
Normal file
13
nginx/vue/src/components/admin/Login.vue
Normal file
@@ -0,0 +1,13 @@
|
||||
<script setup>
|
||||
import { ref, onMounted } from "vue";
|
||||
|
||||
const loggedIn = ref(false);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="!loggedIn">
|
||||
<h1>login</h1>
|
||||
<textarea>Username</textarea>
|
||||
<textarea>Password</textarea>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,21 +0,0 @@
|
||||
<template>
|
||||
<div v-if="!loggedIn">
|
||||
<h1>login</h1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, onMounted } from "vue";
|
||||
export default {
|
||||
name: "api-login",
|
||||
setup() {
|
||||
const loggedIn = ref(false);
|
||||
|
||||
onMounted(() => {
|
||||
loggedIn.value = true;
|
||||
});
|
||||
|
||||
return { loggedIn };
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -1,32 +0,0 @@
|
||||
<template>
|
||||
<!-- Input post display -->
|
||||
<div v-if="posting"></div>
|
||||
<!-- View post display -->
|
||||
<div v-else>
|
||||
<div v-for="(post, idx) in posts" :key="post.id || idx">
|
||||
<h1>post info</h1>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, onMounted } from "vue";
|
||||
export default {
|
||||
name: "api-posts",
|
||||
setup() {
|
||||
const posting = ref(false);
|
||||
const posts = ref([]);
|
||||
|
||||
async function fetchRecent() {}
|
||||
|
||||
onMounted(() => {
|
||||
fetchRecent();
|
||||
setInterval(fetchRecent, 120000);
|
||||
});
|
||||
return {
|
||||
posting,
|
||||
posts,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
50
nginx/vue/src/components/borders/UtenaFrame.vue
Normal file
50
nginx/vue/src/components/borders/UtenaFrame.vue
Normal file
@@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<img src="/img/borders/utena.png" class="flower tl antirotate" />
|
||||
<img src="/img/borders/utena.png" class="flower tr rotate" />
|
||||
<img src="/img/borders/utena.png" class="flower bl rotate" />
|
||||
<img src="/img/borders/utena.png" class="flower br antirotate" />
|
||||
<slot />
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.flower {
|
||||
position: absolute;
|
||||
width: 150px;
|
||||
}
|
||||
.tl {
|
||||
top: 100px;
|
||||
left: 0px;
|
||||
--start: 0deg;
|
||||
}
|
||||
.tr {
|
||||
top: 100px;
|
||||
right: 0;
|
||||
--start: 90deg;
|
||||
}
|
||||
.bl {
|
||||
bottom: -100px;
|
||||
left: 0;
|
||||
--start: 180deg;
|
||||
}
|
||||
.br {
|
||||
bottom: -100px;
|
||||
right: 0;
|
||||
--start: 270deg;
|
||||
}
|
||||
.rotate {
|
||||
animation: spin 3s linear infinite;
|
||||
}
|
||||
|
||||
.antirotate {
|
||||
animation: spin 3s linear infinite reverse;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotate(var(--start));
|
||||
}
|
||||
to {
|
||||
transform: rotate(calc(var(--start) + 360deg));
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,42 +0,0 @@
|
||||
<template>
|
||||
<h2 class="center-content">Listening to RN! ^_^</h2>
|
||||
<div v-if="song.is_playing" class="center-content bg-white border2 shadow1">
|
||||
<img :src="song.item.album.images[0].url" />
|
||||
<p><strong>Song:</strong> {{ song.item.name }}</p>
|
||||
<p><strong>Artist:</strong> {{ song.item.artists[0].name }}</p>
|
||||
</div>
|
||||
<div v-else class="center-content bg-white border2 shadow1">
|
||||
<img src="/img/Untitled.png" />
|
||||
<p>I ain't listenin to nofin rn :/</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, onMounted } from "vue";
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
name: "spotify-listening",
|
||||
setup() {
|
||||
const song = ref({});
|
||||
|
||||
async function fetchSpotify() {
|
||||
try {
|
||||
const res = await axios.get("/api/spotify/listening");
|
||||
song.value = res.data;
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchSpotify();
|
||||
setInterval(fetchSpotify, 120000);
|
||||
});
|
||||
|
||||
return {
|
||||
song,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -1,63 +0,0 @@
|
||||
<template>
|
||||
<h2 class="center-content">Listening to RECENTLY</h2>
|
||||
<div v-if="fetched" class="flex-row">
|
||||
<div
|
||||
v-if="fetched"
|
||||
v-for="(song, idx) in played"
|
||||
:key="song.track.id || idx"
|
||||
class="bg-white border2 shadow1"
|
||||
style="width: 280px"
|
||||
>
|
||||
<img :src="song.track.album.images[0].url" />
|
||||
<p><strong>Song:</strong> {{ song.track.name }}</p>
|
||||
<p><strong>Artist:</strong> {{ song.track.artists[0].name }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="flex-row">
|
||||
<div class="bg-white border2 shadow1 tile1">
|
||||
<img src="/img/Untitled.png" />
|
||||
<p>I ain't listenin to nofin rn :/</p>
|
||||
</div>
|
||||
<div class="bg-white border2 shadow1 tile1">
|
||||
<img src="/img/Untitled.png" />
|
||||
<p>I ain't listenin to nofin rn :/</p>
|
||||
</div>
|
||||
<div class="bg-white border2 shadow1 tile1">
|
||||
<img src="/img/Untitled.png" />
|
||||
<p>I ain't listenin to nofin rn :/</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, onMounted } from "vue";
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
name: "spotify-recent",
|
||||
setup() {
|
||||
const played = ref([]);
|
||||
const fetched = ref(false);
|
||||
|
||||
async function fetchRecent() {
|
||||
try {
|
||||
const res = await axios.get("/api/spotify/recent");
|
||||
played.value = res.data;
|
||||
fetched.value = true;
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchRecent();
|
||||
setInterval(fetchRecent, 120000);
|
||||
});
|
||||
|
||||
return {
|
||||
played,
|
||||
fetched,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user