mirror of
https://github.com/misenhower/splatoon2.ink.git
synced 2026-09-08 18:45:26 -05:00
Remove the Salmon Run admin dialog
This commit is contained in:
@@ -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;
|
||||
|
||||
@@ -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 }}
|
||||
–
|
||||
{{ 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)">×</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>
|
||||
|
||||
–
|
||||
|
||||
<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>
|
||||
Reference in New Issue
Block a user