adamf/web_server
1
1
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

deleting unused components and restructuring

Browse Source
This commit is contained in:
Adam French
2025-12-09 17:27:26 +00:00
parent 9d9ea9ac53
commit fb47883e59
6 changed files with 63 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
nginx/vue/src/components/admin/Login.vue Normal file
View 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>

21
nginx/vue/src/components/api/Login.vue
View File

@@ -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>

32
nginx/vue/src/components/api/Posts.vue
View File

@@ -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
View 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>

42
nginx/vue/src/components/spotify/Listening.vue
View File

@@ -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>

63
nginx/vue/src/components/spotify/Recent.vue
View File

@@ -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>