diff --git a/public/maps/mp_black_water_canal_lobby.png b/public/maps/mp_black_water_canal_lobby.png new file mode 100644 index 0000000..fa2e6a2 Binary files /dev/null and b/public/maps/mp_black_water_canal_lobby.png differ diff --git a/public/maps/mp_coliseum_lobby.png b/public/maps/mp_coliseum_lobby.png new file mode 100644 index 0000000..68d1f98 Binary files /dev/null and b/public/maps/mp_coliseum_lobby.png differ diff --git a/public/maps/mp_complex3_lobby.png b/public/maps/mp_complex3_lobby.png new file mode 100644 index 0000000..d08a749 Binary files /dev/null and b/public/maps/mp_complex3_lobby.png differ diff --git a/public/maps/mp_crashsite3_lobby.png b/public/maps/mp_crashsite3_lobby.png new file mode 100644 index 0000000..be72f16 Binary files /dev/null and b/public/maps/mp_crashsite3_lobby.png differ diff --git a/public/maps/mp_drydock_lobby.png b/public/maps/mp_drydock_lobby.png new file mode 100644 index 0000000..25bb920 Binary files /dev/null and b/public/maps/mp_drydock_lobby.png differ diff --git a/public/maps/mp_eden_lobby.png b/public/maps/mp_eden_lobby.png new file mode 100644 index 0000000..05afcc4 Binary files /dev/null and b/public/maps/mp_eden_lobby.png differ diff --git a/public/maps/mp_forwardbase_kodai_lobby.png b/public/maps/mp_forwardbase_kodai_lobby.png new file mode 100644 index 0000000..fa62096 Binary files /dev/null and b/public/maps/mp_forwardbase_kodai_lobby.png differ diff --git a/public/maps/mp_grave_lobby.png b/public/maps/mp_grave_lobby.png new file mode 100644 index 0000000..1002bf6 Binary files /dev/null and b/public/maps/mp_grave_lobby.png differ diff --git a/public/maps/mp_homestead_lobby.png b/public/maps/mp_homestead_lobby.png new file mode 100644 index 0000000..96830ad Binary files /dev/null and b/public/maps/mp_homestead_lobby.png differ diff --git a/public/maps/mp_thaw_lobby.png b/public/maps/mp_thaw_lobby.png new file mode 100644 index 0000000..8a0b9c9 Binary files /dev/null and b/public/maps/mp_thaw_lobby.png differ diff --git a/src/App.vue b/src/App.vue index ff5c4bb..2a657b9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -9,6 +9,7 @@
+ Servers Players diff --git a/src/components/List/VirtualList.vue b/src/components/List/VirtualList.vue index 1d17c1f..99df682 100644 --- a/src/components/List/VirtualList.vue +++ b/src/components/List/VirtualList.vue @@ -23,7 +23,7 @@ export default defineComponent({ data () { return { toLoad: 10, - vlistHeight: 0, + vlistHeight: 10, vIndex: 0 } }, @@ -33,7 +33,14 @@ export default defineComponent({ highlighted: String }, emits: ['highlightPlayer'], - + mounted () { + if (this.$props.list) { + this.vlistHeight = (this.$refs.vlist as HTMLElement)?.getBoundingClientRect().height || 0 + if (this.$props.highlighted) { + setTimeout(() => (this.$refs.vlist as HTMLElement)?.scrollBy({ top: ((this.list.findIndex(e => e.id === this.$props.highlighted)) * this.rowHeight) - ((this.$refs.vlist as HTMLElement))?.scrollTop - (this.vlistHeight / 2 - this.$props.rowHeight), behavior: 'smooth' }), 1) + } + } + }, computed: { visibleList () { return this.list.slice(Math.max(this.vIndex, 0), Math.min(this.vIndex + this.visibleCount * 3, this.list.length)) diff --git a/src/components/PlayerChart.vue b/src/components/PlayerChart.vue index bbb7164..b3c5f56 100644 --- a/src/components/PlayerChart.vue +++ b/src/components/PlayerChart.vue @@ -62,7 +62,7 @@ export default defineComponent({ // eslint-disable-next-line no-unused-expressions this.refreshColors const colors = {} as { [key: string]: string } - if (this.$refs.container) { + if (this.$refs?.container) { const style = getComputedStyle(this.$refs.container as Element) colors.fg = style.getPropertyValue('--foreground') colors.bg = style.getPropertyValue('--bg-color') diff --git a/src/components/PlayerList.vue b/src/components/PlayerList.vue index 9e1ba3e..fe6a78a 100644 --- a/src/components/PlayerList.vue +++ b/src/components/PlayerList.vue @@ -94,7 +94,6 @@ export default defineComponent({ return aVal[argument] - bVal[argument] }) } - console.log('Sorting the player object took + ' + ((new Date()).getTime() - date.getTime()) + 'ms') if (this.sortingData.direction < 0) { players.reverse() } diff --git a/src/router/index.ts b/src/router/index.ts index a912bb1..68d00ab 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,5 +1,5 @@ import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router' -import HomeView from '../views/HomeView.vue' +import ServerView from '../views/ServerView.vue' import PlayerView from '../views/PlayerView.vue' const routes: Array = [ @@ -7,6 +7,11 @@ const routes: Array = [ path: '/', name: 'home', component: PlayerView + }, + { + path: '/servers', + name: 'servers', + component: ServerView } // { // path: '/players', diff --git a/src/stores/kill.ts b/src/stores/kill.ts index 53e8a29..28bc8ed 100644 --- a/src/stores/kill.ts +++ b/src/stores/kill.ts @@ -55,6 +55,17 @@ export interface Server extends Kill { host: number; } +export interface NSServer { + name:string; + region:string; + description:string; + playerCount:number; + maxPlayers:number; + map:string; + playlist:string; + hasPassword:boolean; + modInfo:{Mods:[]} +} // define your typings for the store state export interface State { servers: Ref>[]; @@ -63,6 +74,7 @@ export interface State { maps: Ref>[]; gamemodes: Ref>[]; hosts: { [key: number]: string }; + nsServers: NSServer[] | undefined } export const useKillStore = defineStore('kill', { @@ -72,7 +84,8 @@ export const useKillStore = defineStore('kill', { weapons: [], maps: [], gamemodes: [], - hosts: {} + hosts: {}, + nsServers: undefined }), getters: { getPlayerList: (state) => (filters: Filters) => { @@ -81,7 +94,8 @@ export const useKillStore = defineStore('kill', { getWeaponList: (state) => (filters: Filters) => state.weapons.find((e) => objectEqual(unref(e).filter, filters)), getServerList: (state) => (filters: Filters) => - state.servers.find((e) => objectEqual(unref(e).filter, filters)) + state.servers.find((e) => objectEqual(unref(e).filter, filters)), + getNSServers: (state) => state.nsServers }, actions: { fetchPlayers (filter: Filters) { @@ -138,6 +152,13 @@ export const useKillStore = defineStore('kill', { triggerRef(entry!) }) return entry + }, + fetchNSServers () { + fetch( + 'https://northstar.tf/client/servers').then(async response => { + this.nsServers = await response.json() + }) + return this.nsServers || [] } } }) diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue deleted file mode 100644 index 8e628bd..0000000 --- a/src/views/HomeView.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/src/views/PlayerView.vue b/src/views/PlayerView.vue index 6013f66..26912b2 100644 --- a/src/views/PlayerView.vue +++ b/src/views/PlayerView.vue @@ -96,9 +96,8 @@ export default defineComponent({ weaponLocale: weapons as { [key: string]: string } } }, - created () { + beforeCreate () { let server - this.applyRouteFilters() if (this.$route.query.server) server = this.$route.query.server?.toString() this.model = { server, @@ -197,8 +196,11 @@ export default defineComponent({ const { player: _, ...withoutPlayer } = this.$route.query router.push({ query: { player: newValue?.id, ...withoutPlayer } })// .then(e => { console.log(e) }) }, - '$route' () { - this.applyRouteFilters() + $route: { + handler: function () { + this.applyRouteFilters() + }, + immediate: true } }, methods: { diff --git a/src/views/ServerView.vue b/src/views/ServerView.vue new file mode 100644 index 0000000..1546b5f --- /dev/null +++ b/src/views/ServerView.vue @@ -0,0 +1,54 @@ + + + + +