Remove the Salmon Run admin dialog

This commit is contained in:
Unknown
2017-11-09 09:34:40 -08:00
parent dd073b6fb3
commit 9f59eb8974
2 changed files with 1 additions and 279 deletions

View File

@@ -144,11 +144,6 @@
:now="now"
@close="splatNetGearOpen = false"
></SplatNetGearDialog>
<SalmonRunAdminDialog
v-if="salmonRunAdminOpen"
:coopCalendar="coopCalendar"
@close="salmonRunAdminOpen = false"
></SalmonRunAdminDialog>
</div>
</template>
@@ -171,13 +166,10 @@ import NewWeaponBox from './splatoon/NewWeaponBox.vue';
import AboutDialog from './AboutDialog.vue';
import SplatNetGearDialog from './splatoon/SplatNetGearDialog.vue';
// Lazy loading since most people won't see this
const SalmonRunAdminDialog = () => import('./splatoon/SalmonRunAdminDialog.vue');
const localStorage = window.localStorage;
export default {
components: { Dropdown, ScheduleBox, SalmonRunBox, SplatfestBox, NewWeaponBox, AboutDialog, SplatNetGearDialog, SalmonRunAdminDialog },
components: { Dropdown, ScheduleBox, SalmonRunBox, SplatfestBox, NewWeaponBox, AboutDialog, SplatNetGearDialog },
data() {
return {
regions: regions.splatoonRegions,
@@ -192,7 +184,6 @@ export default {
salmonruncalendar: null,
aboutOpen: false,
splatNetGearOpen: false,
salmonRunAdminOpen: false,
};
},
computed: {
@@ -272,7 +263,6 @@ export default {
created() {
this.loadRegion(true);
window.addEventListener('storage', this.loadRegion);
window.addEventListener('keydown', this.keydown);
this.updateNow();
this.updateNowTimer = setInterval(() => {
@@ -289,7 +279,6 @@ export default {
clearInterval(this.updateNowTimer);
clearInterval(this.updateDataTimer);
window.removeEventListener('storage', this.loadRegion);
window.removeEventListener('keydown', this.keydown);
},
methods: {
loadRegion(autoDetect = false) {
@@ -305,11 +294,6 @@ export default {
if (autoDetect)
this.actualSelectedRegionKey = regions.detectSplatoonRegion();
},
keydown(event) {
// Ctrl-Alt-Shift-Z
if (event.ctrlKey && event.altKey && event.shiftKey && event.key === 'Z')
this.salmonRunAdminOpen = true;
},
setRegion(key) {
let region = regions.getRegionByKey(key);
key = (region) ? region.key : null;

View File

@@ -1,262 +0,0 @@
<template>
<Modal class="font-splatoon2" @close="$emit('close')">
<div class="modal-content" style="width: 1200px; min-height: 600px">
<div class="columns is-marginless">
<div class="column">
<div class="panel">
<p class="panel-heading">Salmon Run Times</p>
<a class="panel-block" v-for="event in schedules" :class="{'is-active': event == selectedSchedule}" @click="selectedSchedule = event">
<div style="width: 100%">
<div>
{{ event.start_time | date }}
{{ event.start_time | time }}
&ndash;
{{ event.end_time | date }}
{{ event.end_time | time }}
</div>
<div class="columns">
<div class="column is-one-quarter" v-if="event.stage">
<a @click="clearStage(event)">
<Stage :stage="event.stage" :clickable="false"></Stage>
</a>
</div>
<div class="column">
<div class="columns is-multiline" v-if="event.weapons">
<div class="column is-narrow" v-for="weapon in event.weapons">
<div class="image is-64x64 hand" @click="removeWeapon(event, weapon)">
<img :src="weapon.image | localSplatNetImageUrl" :title="weapon.name" />
</div>
</div>
</div>
</div>
</div>
</div>
<button class="button is-small is-danger" @click="removeSchedule(event)">&times;</button>
</a>
<div class="panel-block">
<div class="select">
<select v-model="selectedStartDate">
<option v-for="date in dates" :value="date">{{ date | date }}</option>
</select>
</div>
<div class="select">
<select v-model="selectedStartTime">
<option v-for="time in startTimes" :value="time">{{ time | time }}</option>
</select>
</div>
&nbsp;&ndash;&nbsp;
<div class="select">
<select v-model="selectedEndDate">
<option v-for="date in dates" :value="date">{{ date | date }}</option>
</select>
</div>
<div class="select">
<select v-model="selectedEndTime">
<option v-for="time in endTimes" :value="time">{{ time | time }}</option>
</select>
</div>
<button class="button is-primary" @click="addSchedule">Add</button>
</div>
</div>
<textarea class="textarea" style="height: 100%" :value="output" readonly @focus="$event.target.select()"></textarea>
</div>
<div class="column">
<div class="columns">
<div class="column" v-for="stage in stages">
<a @click="setStage(stage)">
<Stage :stage="stage" :clickable="false"></Stage>
</a>
</div>
</div>
<div class="field">
<div class="control">
<input class="input" placeholder="Search weapons..." v-model="weaponSearchTerm" />
</div>
</div>
<div>
<button class="button" @click="addMysteryWeapon">Add Mystery Weapon</button>
</div>
<div class="columns is-multiline is-mobile" v-if="filteredWeapons">
<div class="column is-narrow" v-for="weapon in filteredWeapons">
<div class="image is-64x64 hand" @click="addWeapon(weapon)">
<img :src="weapon.image | localSplatNetImageUrl" :title="weapon.name" />
</div>
</div>
</div>
</div>
</div>
</div>
</Modal>
</template>
<script>
import axios from 'axios';
import Vue from 'vue';
import Modal from '@/js/components/Modal.vue';
import Stage from '@/js/components/splatoon/Stage.vue';
import SplatoonStages from '@/js/splatoonStages';
function getTimeRange(startDate) {
let times = [];
for (let i = 0; i < 24; i += 6) {
let date = new Date(startDate);
date.setUTCHours(i);
date.setMinutes(0);
date.setSeconds(0);
times.push(Math.floor(date.getTime() / 1000));
}
return times;
}
export default {
components: { Modal, Stage },
props: ['coopCalendar'],
data() {
return {
weapons: null,
stages: [
SplatoonStages.find(stage => stage.id == '999901'),
SplatoonStages.find(stage => stage.id == '999902'),
SplatoonStages.find(stage => stage.id == '999903'),
],
weaponSearchTerm: '',
schedules: null,
selectedSchedule: null,
dates: [],
// times: [],
selectedStartDate: null,
selectedStartTime: null,
selectedEndDate: null,
selectedEndTime: null,
};
},
computed: {
filteredWeapons() {
if (this.weapons)
return Object.values(this.weapons).filter(weapon => weapon.name.toLowerCase().indexOf(this.weaponSearchTerm) > -1);
},
startTimes() {
if (this.selectedStartDate)
return getTimeRange(this.selectedStartDate * 1000);
},
endTimes() {
if (this.selectedEndDate)
return getTimeRange(this.selectedEndDate * 1000);
},
output() {
return JSON.stringify(this.schedules);
},
},
watch: {
startTimes(newValue, oldValue) {
if (newValue) {
let index = (oldValue) ? oldValue.indexOf(this.selectedStartTime) : 0;
this.selectedStartTime = newValue[index];
}
},
endTimes(newValue, oldValue) {
if (newValue) {
let index = (oldValue) ? oldValue.indexOf(this.selectedEndTime) : 0;
this.selectedEndTime = newValue[index];
}
},
selectedStartDate() {
if (this.selectedStartDate) {
let index = this.dates.indexOf(this.selectedStartDate);
this.selectedEndDate = this.dates[index + 1];
}
},
selectedStartTime() {
if (this.selectedStartTime) {
let index = this.startTimes.indexOf(this.selectedStartTime);
this.selectedEndTime = this.endTimes[index];
}
},
},
created() {
// Set up dates
for (let i = 0; i < 20; i++) {
let date = new Date;
date.setUTCHours(0);
date.setUTCMinutes(0);
date.setUTCSeconds(0);
date.setUTCDate(date.getDate() + i);
this.dates.push(Math.floor(date.getTime() / 1000));
}
this.selectedStartDate = this.dates[0];
this.selectedEndDate = this.dates[0];
// Update weapons
this.updateWeapons();
// Load existing weapon/map selections
this.schedules = (this.coopCalendar) ? JSON.parse(JSON.stringify(this.coopCalendar)) : [];
},
methods: {
updateWeapons() {
axios.get('/data/weapons.json')
.then(response => this.weapons = response.data);
},
setStage(stage) {
if (this.selectedSchedule)
Vue.set(this.selectedSchedule, 'stage', stage);
},
clearStage(schedule) {
Vue.delete(schedule, 'stage');
},
addWeapon(weapon) {
if (!this.selectedSchedule)
return;
if (!this.selectedSchedule.weapons)
Vue.set(this.selectedSchedule, 'weapons', []);
this.selectedSchedule.weapons.push(weapon);
this.weaponSearchTerm = '';
},
addMysteryWeapon() {
this.addWeapon({
id: -1,
image: require('@/img/blank-skill-slot.png'),
name: 'Mystery Weapon',
});
},
removeWeapon(schedule, weapon) {
let index = schedule.weapons.indexOf(weapon);
schedule.weapons.splice(index, 1);
if (!schedule.weapons.length)
Vue.delete(schedule, 'weapons');
},
removeSchedule(schedule) {
let index = this.schedules.indexOf(schedule);
this.schedules.splice(index, 1);
},
addSchedule() {
let startTime = new Date(this.selectedStartDate * 1000);
startTime.setHours((new Date(this.selectedStartTime * 1000)).getHours());
let endTime = new Date(this.selectedEndDate * 1000);
endTime.setHours((new Date(this.selectedEndTime * 1000)).getHours());
this.schedules.push({
start_time: Math.floor(startTime.getTime() / 1000),
end_time: Math.floor(endTime.getTime() / 1000),
})
},
},
}
</script>