Compare commits

...

1 Commits

7 changed files with 110 additions and 16 deletions

View File

@ -8,7 +8,7 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.4.3/css/foundation.min.css" />
</head>
<body>
<h2>Admin Page</h2>
<h2><a href="/">DumbYT</a> Admin</h2>
<div id="admin_app"></div>
<script src="./../dist/build.js"></script>
</body>

View File

@ -6,6 +6,7 @@
<th>Title</th>
<th>Description</th>
<th>Tags</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
@ -14,6 +15,7 @@
<td>{{channel.Title}}</td>
<td>{{channel.Description}}</td>
<td>{{channel.User_Tags}}</td>
<td></td>
</tr>
</tbody>
</table>

View File

@ -0,0 +1,60 @@
<template>
<div class="favtable">
<h3>High Priority Videos</h3>
<div class="grid-x large-up-6">
<div v-for="video in Videos" :key="video.ID" class="cell">
<div class="card ytcard">
<a :href="video.URL"><img :src="video.Thumbnail"></a>
<div class="card-section description">
<div class="descriptiontitle">{{ video.Title }}</div>
<div class="descriptionchannel">{{ video.Channel }}</div>
</div>
</div>
</div>
</div >
</div>
</template>
<script lang="ts">
import Vue, {PropOptions} from "vue";
import * as Dyt from "../dumbyt";
// Vue class for keeping state of the videos.
export default Vue.extend({
props: {
Videos: {
type: Array,
} as PropOptions<Dyt.Video[]>,
},
mounted() {
}
});
</script>
<style scoped>
.ytcard {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
background-color:#ddd9d4;
margin: 6px 2px 6px;
}
.description {
padding: 7px 5px 7px;
}
.descriptiontitle {
font-size: 14px;
padding-bottom:10px;
}
.descriptionchannel {
font-size: 10px;
text-align: right;
}
.favtable h3 {
margin-left: 5rem;
}
</style>

View File

@ -1,6 +1,6 @@
<template>
<div>
<input id="searchbox0" class="searchbox" type="text" v-model="searchbox_str"
<input class="searchbox" type="text" v-model="searchbox_str"
placeholder="Search String goes here, for example: >5m,c++"
/>
</div>
@ -25,7 +25,7 @@ export default Vue.extend({
searchbox_str (s: string) {
var v = _.debounce((s) => {
DumbYT.API.search_videos(s).then(videos => {
this.$emit('search_complete', videos)
this.$emit('search_complete', s, videos)
});
}, 400)
v(s);
@ -40,6 +40,5 @@ export default Vue.extend({
max-width: 40em;
margin-left: auto;
margin-right: auto;
margin-top: 2em;
}
</style>

View File

@ -58,12 +58,14 @@ export namespace API {
}
// Search for channels based on a search string.
export async function search_channels(searchstr : string): Promise<Array<Channel>> {
export async function search_channels(searchstr : string, highpriority?: boolean): Promise<Array<Channel>> {
// Temporary holder for data.
let Channels : Array<Channel> = [];
// Ask server for data.
let resp = await Axios.get(API.Base_URL + '/Channels/' + searchstr).catch(e => console.log(e));
let resp = await Axios
.get(API.Base_URL + '/Channels/' + searchstr, {params: {High_Priority: highpriority}})
.catch(e => console.log(e));
// Handle all our nulls.
if (resp == null || resp.data == null)
@ -78,12 +80,14 @@ export namespace API {
}
// Search for videos based on a search string.
export async function search_videos(searchstr : string): Promise<Array<Video>> {
export async function search_videos(searchstr : string, highpriority?: boolean): Promise<Array<Video>> {
// Temporary holder for videos.
let Videos : Array<Video> = [];
// Ask server for videos.
let resp = await Axios.get(API.Base_URL + '/Videos/' + searchstr).catch(e => console.log(e));
let resp = await Axios
.get(API.Base_URL + '/Videos/' + searchstr, {params: {High_Priority: highpriority}})
.catch(e => console.log(e));
// Handle all our nulls.
if (resp == null || resp.data == null)

View File

@ -4,6 +4,7 @@ import SCH from "./components/Search.vue";
import VTBL from "./components/Video_Table.vue";
import CTBL from "./components/Channel_Table.vue";
import CADD from "./components/Channel_Add.vue";
import VFAVS from "./components/Favorite_Channels.vue";
import './index.css';
import * as DumbYT from "./dumbyt";
@ -11,26 +12,46 @@ let MainApp = new Vue({
el: "#app",
template: `
<div>
<VFAVS v-if="VFAVS_Show" v-bind:Videos="Favorite_Videos"/>
<div style="padding-top: 5rem;">
<SCH v-on:search_complete="search_completed"/>
<VGC v-bind:Videos="Videos"/>
</div>
</div>
`,
components: {
VFAVS,
SCH,
VGC
},
data() {
return {
Videos: Array<DumbYT.Video>()
Favorite_Videos: Array<DumbYT.Video>(),
Videos: Array<DumbYT.Video>(),
VFAVS_Show: Boolean()
}
},
methods: {
// Callback for when the search component got results back.
search_completed(videos : Array<DumbYT.Video>) : void {
search_completed(searchstring: string, videos : Array<DumbYT.Video>) : void {
this.VFAVS_Show = searchstring.length == 0;
this.Videos = videos;
}
},
mounted(){
let v: DumbYT.Video = new DumbYT.Video(null);
v.Title = "Test title";
v.Description = "Test description";
v.Thumbnail = "https://i.ytimg.com/vi/LPxqHXyZhNY/mqdefault.jpg";
v.Channel = "Cool Channel"
this.Favorite_Videos.push(v);
this.Favorite_Videos.push(v);
this.Favorite_Videos.push(v);
this.Favorite_Videos.push(v);
this.Favorite_Videos.push(v);
this.Favorite_Videos.push(v);
this.VFAVS_Show = true;
// Populate some Videos immediatly on start up.
DumbYT.API.search_videos("").then(videos => {
// Copy the videos over.
@ -43,9 +64,13 @@ let AdminApp = new Vue({
el: "#admin_app",
template: `
<div>
<SCH v-on:search_complete="search_completed"/>
<CADD/>
<CTBL v-bind:Channels="Channels"/>
<SCH v-on:search_complete="search_completed"/>
<h3 style="padding-top: 3 rem; padding-left: 3rem;">Channels</h3>
<CTBL ID="Channels_All" v-bind:Channels="Channels"/>
<h3 style="padding-top: 3 rem; padding-left: 3rem;">Videos</h3>
<VTBL v-bind:Videos="Videos"/>
</div>
`,

View File

@ -66,9 +66,13 @@ module.exports = {
historyApiFallback: true,
proxy: {
"/api": {
target: "https://dumbyt.hak8or.com",
target: "http://localhost:62214",
changeOrigin: true
}
},
"/hangfire": {
target: "http://localhost:62214",
changeOrigin: true
},
}
},
performance: {