Cleanup App.vue

- Fix double event listener add in unmount hook
- Remove onUrlChange as it does the same thing as handleUrl
- Merge duplicate mount/unmount hooks
This commit is contained in:
James Lyne 2021-09-10 15:28:12 +01:00
parent cda36db8a5
commit 969e9db5cc

View File

@ -23,7 +23,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import {computed, defineComponent, onBeforeUnmount, onMounted, onUnmounted, ref, watch} from 'vue'; import {computed, defineComponent, onBeforeUnmount, onMounted, ref, watch} from 'vue';
import Map from './components/Map.vue'; import Map from './components/Map.vue';
import Sidebar from './components/Sidebar.vue'; import Sidebar from './components/Sidebar.vue';
import ChatBox from './components/ChatBox.vue'; import ChatBox from './components/ChatBox.vue';
@ -102,12 +102,12 @@ export default defineComponent({
}, },
handleUrl = () => { handleUrl = () => {
const parsedUrl = parseUrl(); const url = new URL(window.location.href),
parsedUrl = parseUrl(url);
if(parsedUrl) { if(parsedUrl) {
//Remove legacy url if one was parsed //Remove legacy url if one was parsed
if(parsedUrl.legacy) { if(parsedUrl.legacy) {
const url = new URL(window.location.href);
url.searchParams.delete('worldname'); //Dynmap url.searchParams.delete('worldname'); //Dynmap
url.searchParams.delete('world'); //Pl3xmap url.searchParams.delete('world'); //Pl3xmap
url.searchParams.delete('mapname'); url.searchParams.delete('mapname');
@ -158,14 +158,6 @@ export default defineComponent({
e.preventDefault(); e.preventDefault();
store.commit(MutationTypes.TOGGLE_UI_ELEMENT_VISIBILITY, element); store.commit(MutationTypes.TOGGLE_UI_ELEMENT_VISIBILITY, element);
},
onUrlChange = () => {
const parsedUrl = parseUrl();
if(parsedUrl) {
store.commit(MutationTypes.SET_PARSED_URL, parsedUrl);
}
}; };
watch(title, (title) => document.title = title); watch(title, (title) => document.title = title);
@ -204,24 +196,23 @@ export default defineComponent({
} }
}); });
onMounted(() => loadConfiguration());
onBeforeUnmount(() => {
store.dispatch(ActionTypes.STOP_UPDATES, undefined);
clearTimeout(loadingTimeout);
});
handleUrl(); handleUrl();
onResize(); onResize();
onMounted(() => { onMounted(() => {
window.addEventListener('resize', onResize); window.addEventListener('resize', onResize);
window.addEventListener('keydown', onKeydown); window.addEventListener('keydown', onKeydown);
window.addEventListener('hashchange', onUrlChange); window.addEventListener('hashchange', handleUrl);
loadConfiguration();
}); });
onUnmounted(() => { onBeforeUnmount(() => {
window.addEventListener('resize', onResize); store.dispatch(ActionTypes.STOP_UPDATES, undefined);
window.addEventListener('keydown', onKeydown); clearTimeout(loadingTimeout);
window.addEventListener('hashchange', onUrlChange);
window.removeEventListener('resize', onResize);
window.removeEventListener('keydown', onKeydown);
window.removeEventListener('hashchange', handleUrl);
}); });
return { return {