75 lines
1.6 KiB
Vue
75 lines
1.6 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<div v-if="codes.length === 0 && !hasError">Loading...</div>
|
||
|
|
<div v-if="codes.length === 0 && hasError">Failed to load codes.</div>
|
||
|
|
<CodeInfo v-for="code in codes" :code="code" :anchor="true" />
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// Components
|
||
|
|
import CodeInfo from './CodeInfo';
|
||
|
|
|
||
|
|
// Data
|
||
|
|
import gameVersions from '../data/gameVersions.json';
|
||
|
|
|
||
|
|
// Util
|
||
|
|
import parseXml from './scripts/parseXml';
|
||
|
|
|
||
|
|
// Libs
|
||
|
|
import axios from 'axios';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
gameVersion: { type: String },
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
if (localStorage.getItem('codes') != null) {
|
||
|
|
try {
|
||
|
|
const data = JSON.parse(localStorage.getItem('codes')).find(
|
||
|
|
c => c.identifier === this.gameVersion,
|
||
|
|
);
|
||
|
|
if (data) {
|
||
|
|
this.codes = data.cheats.sort((a, b) => (a.title > b.title ? 1 : -1));
|
||
|
|
console.log(this.codes);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
} catch {}
|
||
|
|
}
|
||
|
|
|
||
|
|
axios
|
||
|
|
.get(`/codes/${this.gameVersion}.xml`)
|
||
|
|
.then(response => {
|
||
|
|
const xmlData = parseXml(response.data);
|
||
|
|
this.codes = xmlData.sort((a, b) => (a.title > b.title ? 1 : -1));
|
||
|
|
})
|
||
|
|
.catch(() => (this.hasError = true));
|
||
|
|
},
|
||
|
|
updated() {
|
||
|
|
// Scroll to anchor
|
||
|
|
if (window.location.hash) {
|
||
|
|
const anchorElement = document.querySelector(window.location.hash);
|
||
|
|
if (anchorElement) {
|
||
|
|
const topOffset = anchorElement.getBoundingClientRect().top;
|
||
|
|
window.scrollTo({
|
||
|
|
top: topOffset - 100,
|
||
|
|
behavior: 'smooth',
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
codes: [],
|
||
|
|
hasError: false,
|
||
|
|
};
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
overflow-y: scroll;
|
||
|
|
}
|
||
|
|
</style>
|