CSGOWTF/csgowtf
3
2
Fork 1
Code Issues 18 Pull Requests Projects Releases 7 Wiki Activity

added info-modal + updated error handling
All checks were successful
CSGOWTF/csgowtf/pipeline/head This commit looks good
Details

Browse Source
This commit is contained in:
vikingowl
2022-02-02 19:18:00 +01:00
parent 7fc45c1bb5
commit 25b05e9b31
11 changed files with 645 additions and 266 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.vue
View File

@@ -4,6 +4,7 @@
</header>
<main>
<div :style="{height: offset + 'px'}"/>
<InfoModal/>
<router-view name="main"/>
</main>
<footer class="mt-auto">
@@ -17,9 +18,10 @@ import Nav from "@/components/Nav";
import Footer from "@/components/Footer";
import CookieConsentBtn from "@/components/CookieConsentBtn";
import {onMounted, ref} from "vue";
import InfoModal from "@/components/InfoModal";
export default {
components: {Footer, Nav, CookieConsentBtn},
components: {InfoModal, Footer, Nav, CookieConsentBtn},
setup() {
const offset = ref(0)

2
src/components/DamageSite.vue
View File

@@ -30,7 +30,7 @@ export default {
})
const getWeaponDamage = async () => {
const resData = await GetWeaponDmg(store.state.matchDetails.match_id)
const resData = await GetWeaponDmg(store, store.state.matchDetails.match_id)
data.equipment_map = resData.equipment_map
data.stats = resData.stats
}

2
src/components/Details.vue
View File

@@ -29,7 +29,7 @@ export default {
})
const getWeaponDamage = async () => {
const resData = await GetWeaponDmg(store.state.matchDetails.match_id)
const resData = await GetWeaponDmg(store, store.state.matchDetails.match_id)
data.spray = resData.spray
}

2
src/components/EqValueGraph.vue
View File

@@ -54,7 +54,7 @@ export default {
}
const parseObject = async () => {
data.rounds = await GetPlayerValue(store.state.matchDetails.match_id)
data.rounds = await GetPlayerValue(store, store.state.matchDetails.match_id)
for (const round in data.rounds) {
for (const player in data.rounds[round]) {

99
src/components/InfoModal.vue Normal file
View File

@@ -0,0 +1,99 @@
<template>
<div v-if="infos.data" id="modal">
<div v-for="(info, id) in infos.data" :key="id" class="custom-modal">
<div :class="info.type === 'error'
? 'bg-danger text-white'
: info.type === 'warning'
? 'bg-warning text-secondary'
: info.type === 'success'
? 'bg-success text-white'
: 'bg-secondary text-white'"
class="card text-end">
<div class="card-header d-flex justify-content-between">
<div>
<span v-if="info.type !== 'success'">
Error <span class="mx-2">-</span> {{ info.statuscode }}
</span>
<span v-else>
Success
</span>
</div>
<button aria-label="Close" class="btn-close" type="button" @click="closeModal(id)"/>
</div>
<div class="card-body">
{{ info.message }}
</div>
</div>
</div>
</div>
</template>
<script>
import {useStore} from "vuex";
import {onMounted, reactive} from "vue";
export default {
name: "InfoModal",
setup() {
const store = useStore()
const infos = reactive({
data: []
})
const closeModal = (id) => {
store.commit('removeInfoState', id)
}
onMounted(() => {
store.subscribe(((mutation, state) => {
if (mutation.type === 'changeInfoState') {
infos.data = state.info
setTimeout(() => {
closeModal(store.state.info.length - 1)
}, 5000)
}
}))
})
return {infos, closeModal}
}
}
</script>
<style lang="scss" scoped>
#modal {
--height: 100px;
.card {
z-index: 10;
position: absolute;
right: 1rem;
opacity: .8;
width: min(100vw - 2rem, 50ch);
.btn-close {
background-color: white;
opacity: .5;
}
}
@for $i from 1 through 10 {
.custom-modal:nth-of-type(#{$i}) {
.card {
@if $i == 1 {
margin: 1rem 0;
} @else {
margin-top: calc(#{$i}rem + (#{$i} - 1) * var(--height));
}
}
}
}
}
@media screen and (max-width: 768px) {
#modal {
--height: 120px;
}
}
</style>

22
src/components/Nav.vue
View File

@@ -40,9 +40,6 @@
>
Search!
</button>
<div v-if="data.error" class="alert alert-warning" role="alert">
{{ data.error }}
</div>
</form>
</div>
@@ -54,6 +51,7 @@
import {reactive} from "vue";
import {useStore} from 'vuex'
import {closeNav, GetUser, GoToPlayer} from '@/utils'
import {StatusCodes as STATUS} from "http-status-codes";
export default {
name: 'Nav',
@@ -61,7 +59,6 @@ export default {
const store = useStore()
const data = reactive({
searchInput: '',
error: ''
})
const parseSearch = async () => {
@@ -70,7 +67,6 @@ export default {
const profileUrlPattern = 'https://steamcommunity.com/profiles/'
const id64Pattern = /^\d{17}$/
const vanityPattern = /^[A-Za-z0-9-_]{3,32}$/
// const shareCodePattern = /.*CSGO(?:-?[ABCDEFGHJKLMNOPQRSTUVWXYZabcdefhijkmnopqrstuvwxyz23456789]{5}){5}.*/
store.commit({
type: 'changeVanityUrl',
@@ -108,15 +104,23 @@ export default {
}
if (store.state.vanityUrl && !vanityPattern.test(store.state.vanityUrl)) {
data.error = 'Only alphanumeric symbols, "_", and "-", between 3-32 characters'
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_ACCEPTABLE,
message: 'Only alphanumeric symbols, "_", and "-", between 3-32 characters',
type: 'warning'
}
})
store.commit({
type: 'changeVanityUrl',
id: ''
})
data.searchInput = ''
}
if (store.state.id64 !== '' || store.state.vanityUrl !== '') {
const resData = await GetUser(store.state.vanityUrl || store.state.id64)
const resData = await GetUser(store, store.state.vanityUrl || store.state.id64)
if (resData) {
data.searchInput = ''
@@ -136,10 +140,6 @@ export default {
}
}
}
setTimeout(() => {
data.error = ''
}, 5000)
}
}

16
src/store/index.js
View File

@@ -7,7 +7,8 @@ export default createStore({
matchDetails: {},
playerDetails: {},
playersArr: [],
scroll_state: 0
scroll_state: 0,
info: []
},
mutations: {
changeId64(state, payload) {
@@ -22,12 +23,15 @@ export default createStore({
changePlayerDetails(state, payload) {
state.playerDetails = payload.data
},
changePlayesArr(state, payload) {
changePlayersArr(state, payload) {
state.playersArr = payload.data
},
changeScrollState(state, payload) {
state.scroll_state = payload
},
changeInfoState(state, payload) {
state.info.push(payload.data)
},
resetId64(state) {
state.id64 = ''
},
@@ -40,11 +44,17 @@ export default createStore({
resetPlayerDetails(state) {
state.playerDetails = {}
},
resetPlayesArr(state) {
resetPlayersArr(state) {
state.playersArr = []
},
resetScrollState(state) {
state.scroll_state = 0
},
resetInfoState(state) {
state.info = []
},
removeInfoState(state, id) {
state.info.splice(id, 1)
}
},
actions: {

680
src/utils/ApiRequests.js
View File

@@ -4,35 +4,8 @@ import {AUTHCODE_REGEX, SHARECODE_REGEX} from "@/constants";
const API_URL = process.env.VUE_APP_API_URL
export const GetMatches = async () => {
let response = null
await axios
.get(`${API_URL}/matches`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetMatches - bad request')
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetMatches - internal server error')
break
default:
// TODO: ERROR
console.log('GetMatches - default error')
}
})
return response
}
export const GetUser = async (id) => {
// /player/<id> GET returns player <id> details (last 10 matches)
export const GetUser = async (store, id) => {
let response = null
await axios
@@ -44,180 +17,52 @@ export const GetUser = async (id) => {
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetUser - bad request')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Bad request',
type: 'error'
}
})
break
case STATUS.NOT_FOUND:
// TODO: ERROR
console.log('GetUser - not found')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_FOUND,
message: 'Player not found',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetUser - internal server error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to get meta-stats or player',
type: 'error'
}
})
break
default:
// TODO: ERROR
console.log('GetUser - default error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
export const TrackMe = async (id64, authcode, sharecode = '') => {
// TODO: NEEDS WORK!!!!!
let statusError = null
let status = 202
if (sharecode !== '' && !SHARECODE_REGEX.test(sharecode)) {
statusError = 'Sharecode is invalid or missing'
status = STATUS.IM_A_TEAPOT
return [status, statusError]
}
if (authcode === '' || !AUTHCODE_REGEX.test(authcode)) {
statusError = 'Authcode is invalid or missing'
status = STATUS.IM_A_TEAPOT
return [status, statusError]
}
await axios
.post({
url: `${API_URL}/player/${id64}/track`,
data: `authcode=${authcode}&sharecode=${sharecode}`
})
.then((res) => {
if (res.status === STATUS.ACCEPTED)
status = res.status
})
.catch((err) => {
status = err.response.status
switch (err.response.status) {
case STATUS.BAD_REQUEST:
statusError = 'Invalid arguments'
break
case STATUS.NOT_FOUND:
statusError = 'Player not found'
break
case STATUS.SERVICE_UNAVAILABLE:
statusError = 'Problem with request'
break
case STATUS.UNAUTHORIZED:
statusError = 'Authcode is invalid'
break
case STATUS.PRECONDITION_FAILED:
statusError = 'Sharecode is invalid or missing'
break
case STATUS.INTERNAL_SERVER_ERROR:
statusError = 'Service currently unavailable - please try again later'
break
default:
statusError = 'An unknown error occured'
console.log('TrackMe - An unknown error occured')
}
})
return [status, statusError]
}
export const GetPlayerValue = async (match_id) => {
let response = null
await axios
.get(`${API_URL}/match/${match_id}/rounds`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetPlayerValue - bad request')
break
case STATUS.NOT_FOUND:
// TODO: ERROR
console.log('GetPlayerValue - not found')
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetPlayerValue - internal server error')
break
default:
// TODO: ERROR
console.log('GetPlayerValue - default error')
}
})
return response
}
export const GetMatchDetails = async (match_id) => {
let response = null
await axios
.get(`${API_URL}/match/${match_id}`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetMatchDetails - bad request')
break
case STATUS.NOT_FOUND:
// TODO: ERROR
console.log('GetMatchDetails - not found')
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetMatchDetails - internal server errror')
break
default:
// TODO: ERROR
console.log('GetMatchDetails - default error')
}
})
return response
}
export const LoadMoreMatches = async (player_id, date) => {
let response = null
await axios
.get(`${API_URL}/player/${player_id}/next/${date}`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetUser - bad request')
break
case STATUS.NOT_FOUND:
// TODO: ERROR
console.log('GetUser - not found')
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetUser - internal server error')
break
default:
// TODO: ERROR
console.log('GetUser - default error')
}
})
return response
}
export const GetPlayerMeta = async (player_id, limit = 4) => {
// /player/<id>/meta/<limit> GET returns player <id> meta-stats with <limit>
export const GetPlayerMeta = async (store, player_id, limit = 4) => {
let response = null
await axios
@@ -229,27 +74,342 @@ export const GetPlayerMeta = async (player_id, limit = 4) => {
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetPlayerMeta - bad request')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Bad request',
type: 'error'
}
})
break
case STATUS.NOT_FOUND:
// TODO: ERROR
console.log('GetPlayerMeta - not found')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Player not found',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetPlayerMeta - internal server error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to get player meta',
type: 'error'
}
})
break
default:
// TODO: ERROR
console.log('GetPlayerMeta - default error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
export const GetWeaponDmg = async (match_id) => {
// /player/<id>/next/<unix> GET returns 20 matches after <unix> for player <id>
export const LoadMoreMatches = async (store, player_id, date) => {
let response = null
await axios
.get(`${API_URL}/player/${player_id}/next/${date}`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Bad request',
type: 'error'
}
})
break
case STATUS.NOT_FOUND:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_FOUND,
message: 'Player not found',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to get meta-stats or player',
type: 'error'
}
})
break
default:
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
// /player/<id>/track POST Track player <id> FORM_DATA: authcode, [sharecode]
export const TrackMe = async (store, id64, authcode, sharecode = '') => {
if (sharecode !== '' && !SHARECODE_REGEX.test(sharecode)) {
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.IM_A_TEAPOT,
message: 'Sharecode is invalid or missing',
type: 'error'
}
})
return STATUS.IM_A_TEAPOT
}
if (authcode === '' || !AUTHCODE_REGEX.test(authcode)) {
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.IM_A_TEAPOT,
message: 'Authcode is invalid or missing',
type: 'error'
}
})
return STATUS.IM_A_TEAPOT
}
await axios
.post({
url: `${API_URL}/player/${id64}/track`,
data: `authcode=${authcode}&sharecode=${sharecode}`
})
.then((res) => {
if (res.status === STATUS.ACCEPTED) {
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.ACCEPTED,
message: 'Tracking successful',
type: 'success'
}
})
return STATUS.ACCEPTED
}
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Invalid arguments',
type: 'error'
}
})
return STATUS.BAD_REQUEST
case STATUS.NOT_FOUND:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_FOUND,
message: 'Player not found',
type: 'error'
}
})
return STATUS.NOT_FOUND
case STATUS.SERVICE_UNAVAILABLE:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.SERVICE_UNAVAILABLE,
message: 'Service currently unavailable - Please try again later',
type: 'error'
}
})
return STATUS.SERVICE_UNAVAILABLE
case STATUS.UNAUTHORIZED:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.UNAUTHORIZED,
message: 'Authcode is invalid',
type: 'error'
}
})
return STATUS.UNAUTHORIZED
case STATUS.PRECONDITION_FAILED:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.PRECONDITION_FAILED,
message: 'Sharecode is invalid or missing',
type: 'error'
}
})
return STATUS.PRECONDITION_FAILED
case STATUS.INTERNAL_SERVER_ERROR:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Service currently unavailable - please try again later',
type: 'error'
}
})
return STATUS.INTERNAL_SERVER_ERROR
default:
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
return err.response.status
}
})
}
// /match/<id> GET returns details for match <id>
export const GetMatchDetails = async (store, match_id) => {
let response = null
await axios
.get(`${API_URL}/match/${match_id}`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Error parsing matchID',
type: 'error'
}
})
break
case STATUS.NOT_FOUND:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_FOUND,
message: 'Match not found',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to get match data',
type: 'error'
}
})
break
default:
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
// /match/<id>/rounds GET returns round-stats for match <id>
export const GetPlayerValue = async (store, match_id) => {
let response = null
await axios
.get(`${API_URL}/match/${match_id}/rounds`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Error parsing matchID',
type: 'error'
}
})
break
case STATUS.NOT_FOUND:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_FOUND,
message: 'Match not found',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to get match data',
type: 'error'
}
})
break
default:
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
// /match/<id>/weapons GET returns weapon-stats for match <id>
export const GetWeaponDmg = async (store, match_id) => {
let response = null
await axios
@@ -261,27 +421,99 @@ export const GetWeaponDmg = async (match_id) => {
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetWeaponDmg - bad request')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Bad request',
type: 'error'
}
})
break
case STATUS.NOT_FOUND:
// TODO: ERROR
console.log('GetWeaponDmg - not found')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.NOT_FOUND,
message: 'Weapon damage not found',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetWeaponDmg - internal server error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to get weapon damage',
type: 'error'
}
})
break
default:
// TODO: ERROR
console.log('GetWeaponDmg - default error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
export const LoadMoreMatchesExplore = async (date) => {
// /matches GET returns last 20 matches in DB
export const GetMatches = async (store) => {
let response = null
await axios
.get(`${API_URL}/matches`)
.then((res) => {
if (res.status === STATUS.OK)
response = res.data
})
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Bad request',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to marshal JSON',
type: 'error'
}
})
break
default:
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})
return response
}
// /matches/next/<unix> GET returns 20 matches after time <unix>
export const LoadMoreMatchesExplore = async (store, date) => {
let response = null
await axios
@@ -293,16 +525,34 @@ export const LoadMoreMatchesExplore = async (date) => {
.catch((err) => {
switch (err.response.status) {
case STATUS.BAD_REQUEST:
// TODO: ERROR
console.log('GetMatches - bad request')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.BAD_REQUEST,
message: 'Bad request',
type: 'error'
}
})
break
case STATUS.INTERNAL_SERVER_ERROR:
// TODO: ERROR
console.log('GetMatches - internal server error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.INTERNAL_SERVER_ERROR,
message: 'Unable to load more matches',
type: 'error'
}
})
break
default:
// TODO: ERROR
console.log('GetMatches - default error')
store.commit({
type: 'changeInfoState',
data: {
statuscode: err.response.status,
message: 'An unknown error occured',
type: 'error'
}
})
}
})

4
src/views/Explore.vue
View File

@@ -43,7 +43,7 @@ export default {
})
const setMoreMatches = async () => {
const res = await LoadMoreMatchesExplore(data.matches[data.matches.length - 1].date)
const res = await LoadMoreMatchesExplore(store, data.matches[data.matches.length - 1].date)
res.forEach(e => data.matches.push(e))
@@ -53,7 +53,7 @@ export default {
}
onMounted(async () => {
data.matches = await GetMatches()
data.matches = await GetMatches(store)
if (data.matches) {
if (data.matches[0].map) {

4
src/views/Match.vue
View File

@@ -194,7 +194,7 @@ export default {
// Functions
const GetMatch = async () => {
if (matchIdPattern.test(props.match_id)) {
const res = await GetMatchDetails(props.match_id)
const res = await GetMatchDetails(store, props.match_id)
if (res) {
if (res.map)
@@ -234,7 +234,7 @@ export default {
LoadImage(data.matchDetails.map ? data.matchDetails.map : 'random')
store.commit({
type: 'changePlayesArr',
type: 'changePlayersArr',
data: CreatePlayersArray(data.stats)
})

76
src/views/Player.vue
View File

@@ -68,17 +68,6 @@
>
Track Me!
</button>
<div v-if="data.statusErrorCode === 202" class="alert alert-success" role="alert">
{{ data.statusError }}
</div>
<div v-if="data.statusErrorCode === 418" class="alert alert-warning" role="alert">
{{ data.statusError }}
</div>
<div v-if="data.statusErrorCode !== 0 && data.statusErrorCode !== 202 && data.statusErrorCode !== 418"
class="alert alert-danger"
role="alert">
{{ data.statusError }}
</div>
<div aria-labelledby="login-dropdown" class="dropdown-menu mt-2 border-2 border-primary bg-body"
style="width: 320px">
<form class="px-4 py-3">
@@ -171,11 +160,12 @@ import {
scrollToPos,
setTitle,
TrackMe
} from "../utils";
} from "@/utils";
import {FOOTER_HEIGHT, NAV_HEIGHT} from "@/constants";
import MatchesTable from "@/components/MatchesTable";
import router from "@/router";
import PlayerSideInfo from "@/components/PlayerSideInfo";
import {StatusCodes as STATUS} from "http-status-codes/build/cjs/status-codes";
export default {
name: 'Player',
@@ -194,8 +184,6 @@ export default {
},
tracked: false,
matches: [],
statusError: '',
statusErrorCode: 0,
match_stats: {
loss: 0,
win: 0,
@@ -268,7 +256,7 @@ export default {
const GetPlayer = async (reset = false) => {
if (props.id) {
const resData = await GetUser(props.id)
const resData = await GetUser(store, props.id)
if (resData) {
if (resData.steamid64 !== store.state.playerDetails.steamid64 || reset) {
@@ -287,7 +275,7 @@ export default {
}
const setMoreMatches = async () => {
const res = await LoadMoreMatches(store.state.playerDetails.steamid64, data.matches[data.matches.length - 1].date)
const res = await LoadMoreMatches(store, store.state.playerDetails.steamid64, data.matches[data.matches.length - 1].date)
await res.matches.forEach(e => data.matches.push(e))
@@ -313,29 +301,59 @@ export default {
}, 2000)
})
data.playerMeta = await GetPlayerMeta(props.id, displayCounter)
data.playerMeta = await GetPlayerMeta(store, props.id, displayCounter)
}
const TrackPlayer = async () => {
if (data.userData.authcode !== '') {
[data.statusErrorCode, data.statusError] = await TrackMe(store.state.playerDetails.steamid64, data.userData.authcode, data.userData.sharecode)
let res
if (data.statusErrorCode === 202) {
data.statusErrorCode = 0
data.statusError = ''
data.tracked = true
if (data.matches === []) {
if (data.userData.sharecode !== '') {
if (data.userData.authcode !== '') {
res = await TrackMe(store, store.state.playerDetails.steamid64, data.userData.authcode, data.userData.sharecode)
} else {
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.IM_A_TEAPOT,
message: 'Authcode is invalid or missing',
type: 'error'
}
})
}
} else {
setTimeout(() => {
data.statusError = ''
data.statusErrorCode = 0
}, 5000)
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.IM_A_TEAPOT,
message: 'Sharecode is invalid or missing',
type: 'error'
}
})
}
} else {
if (data.userData.authcode !== '') {
res = await TrackMe(store, store.state.playerDetails.steamid64, data.userData.authcode, data.userData.sharecode)
} else {
store.commit({
type: 'changeInfoState',
data: {
statuscode: STATUS.IM_A_TEAPOT,
message: 'Authcode is invalid or missing',
type: 'error'
}
})
}
}
if (res === 202) {
location.reload()
}
}
watch(() => props.id, async () => {
await GetPlayer()
data.playerMeta = await GetPlayerMeta(props.id, displayCounter)
data.playerMeta = await GetPlayerMeta(store, props.id, displayCounter)
})
// watch(() => data.playerMeta, () => {
@@ -348,7 +366,7 @@ export default {
wrapper.style.minHeight = height + 'px'
await GetPlayer()
data.playerMeta = await GetPlayerMeta(props.id, displayCounter)
data.playerMeta = await GetPlayerMeta(store, props.id, displayCounter)
scrollToPos(store.state.scroll_state)