Full Empire Editing Functionality
This commit is contained in:
parent
9fdc93be9e
commit
3e2e5a7e63
6 changed files with 162 additions and 90 deletions
|
@ -101,7 +101,7 @@ export const createBlankEmpire = (
|
|||
machine: false,
|
||||
portrait_id: 0,
|
||||
portrait_group_id: 0,
|
||||
ethics: [],
|
||||
ethics: {},
|
||||
discord_user: undefined,
|
||||
name: ""
|
||||
};
|
||||
|
|
|
@ -68,14 +68,11 @@ export type Ethic = {
|
|||
id: number,
|
||||
display: string,
|
||||
gestalt: boolean,
|
||||
fanatic?: boolean,
|
||||
}
|
||||
|
||||
export type EmpireEthic = {
|
||||
ethic_id: number,
|
||||
display: string,
|
||||
gestalt: boolean,
|
||||
fanatic?: boolean,
|
||||
fanatic: boolean,
|
||||
}
|
||||
|
||||
export type Phenotype = {
|
||||
|
|
|
@ -39,7 +39,6 @@
|
|||
let empireList: { [key: number]: ChellarisEmpire } = {};
|
||||
let empireData: ChellarisEmpire;
|
||||
let addingNewEmpire = false;
|
||||
$: console.log("adding:", addingNewEmpire);
|
||||
let loadingEmpireData = true;
|
||||
|
||||
const updateGameData = () => {
|
||||
|
@ -54,17 +53,19 @@
|
|||
groupList = data.groups;
|
||||
empireList = {};
|
||||
Object.values(data.empires).forEach((empire: ChellarisEmpire) => {
|
||||
if ($AdminSelectedGroupStore[$AdminSelectedGameStore] === undefined) {
|
||||
if (typeof $AdminSelectedGroupStore[$AdminSelectedGameStore] === 'undefined') {
|
||||
$AdminSelectedGroupStore[$AdminSelectedGameStore] = {};
|
||||
}
|
||||
if ($AdminSelectedGroupStore[$AdminSelectedGameStore][empire.group]) {
|
||||
if (typeof $AdminSelectedGroupStore[$AdminSelectedGameStore][empire.group] !== 'undefined') {
|
||||
empireList[empire.id] = empire;
|
||||
}
|
||||
});
|
||||
|
||||
delay(200).then(() => (loadingGameData = false));
|
||||
delay(200).then(() => (loaded = true));
|
||||
loadEmpireData();
|
||||
if (typeof $AdminSelectedEmpireStore[$AdminSelectedGameStore] !== 'undefined') {
|
||||
loadEmpireData();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
@ -94,7 +95,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
AdminSelectedGameStore.subscribe(() => {
|
||||
AdminSelectedGameStore.subscribe((game) => {
|
||||
if (typeof game === 'undefined') {
|
||||
game = Object.values(gameList)[0].id;
|
||||
}
|
||||
updateGameData();
|
||||
loadingGameData = true;
|
||||
});
|
||||
|
@ -217,7 +221,9 @@
|
|||
const setActiveEmpire = (empireId: number) => {
|
||||
loadingEmpireData = true;
|
||||
$AdminSelectedEmpireStore[$AdminSelectedGameStore] = empireId;
|
||||
loadEmpireData();
|
||||
if (typeof $AdminSelectedEmpireStore[$AdminSelectedGameStore] !== 'undefined') {
|
||||
loadEmpireData();
|
||||
}
|
||||
};
|
||||
|
||||
const addEmpire = () => {
|
||||
|
@ -228,13 +234,13 @@
|
|||
list2.push(list2.length); */
|
||||
};
|
||||
|
||||
const finishAddNewEmpire = (event: { detail: { new_id: number; }; }) => {
|
||||
const finishAddNewEmpire = (event: { detail: { new_id: number } }) => {
|
||||
$AdminSelectedEmpireStore[$AdminSelectedGameStore] = event.detail.new_id;
|
||||
updateGameData();
|
||||
};
|
||||
|
||||
const deleteEmpire = (empire: ChellarisEmpire) => {
|
||||
fetch(apiBaseUrl + '/v3/empire?game_id=' + empire.game + '&group_id=' + empire.group + '&empire_id=' + empire.id, {
|
||||
fetch(apiBaseUrl + '/v3/empire?game_id=' + empire.game + '&empire_id=' + empire.id, {
|
||||
method: 'DELETE',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
|
@ -358,7 +364,7 @@
|
|||
>
|
||||
<div class="card-content" class:active={empire.id == $AdminSelectedEmpireStore[$AdminSelectedGameStore] ? 'active' : ''}>{empire.name}</div>
|
||||
<div class="card-content" class:active={empire.id == $AdminSelectedEmpireStore[$AdminSelectedGameStore] ? 'active' : ''}>
|
||||
{empire.discord_user || "N/A"}
|
||||
{empire.discord_user || 'N/A'}
|
||||
</div>
|
||||
<button class="delete-box" on:click={() => deleteEmpire(empire)}>
|
||||
<svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
|
@ -375,7 +381,7 @@
|
|||
<div class="list-card loading">
|
||||
<div class="card-content active">{empireData.name}</div>
|
||||
<div class="card-content active">
|
||||
{empireData.discord_user || "N/A"}
|
||||
{empireData.discord_user || 'N/A'}
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
|
@ -388,10 +394,21 @@
|
|||
</div>
|
||||
</List>
|
||||
<List area="details" listTitle="Empire Details">
|
||||
{#if loadingEmpireData || loadingGameData}
|
||||
{#if typeof $AdminSelectedEmpireStore[$AdminSelectedGameStore] === 'undefined'}
|
||||
<div>
|
||||
Select Empire
|
||||
</div>
|
||||
{:else if loadingEmpireData || loadingGameData}
|
||||
<LoadingSpinnerLocal />
|
||||
{:else if addingNewEmpire || typeof empireData.group !== 'undefined'}
|
||||
<EmpireDetails bind:empire={empireData} groups={groupList} {auth} bind:newEmpire={addingNewEmpire} on:updated={updateGameData} on:created={finishAddNewEmpire}/>
|
||||
<EmpireDetails
|
||||
bind:empire={empireData}
|
||||
groups={groupList}
|
||||
{auth}
|
||||
bind:newEmpire={addingNewEmpire}
|
||||
on:updated={updateGameData}
|
||||
on:created={finishAddNewEmpire}
|
||||
/>
|
||||
{/if}
|
||||
</List>
|
||||
{:else}
|
||||
|
|
|
@ -15,6 +15,10 @@ export async function load ({ fetch }) {
|
|||
if (typeof store === 'string') {
|
||||
AdminSelectedGameStore.set(JSON.parse(store));
|
||||
}
|
||||
else {
|
||||
AdminSelectedGameStore.set(Object.values(gameList)[0].id);
|
||||
localStorage.setItem('adminGameSelection', JSON.stringify(Object.values(gameList)[0].id));
|
||||
}
|
||||
|
||||
// Group Selection
|
||||
store = localStorage.getItem('adminGroupSelection');
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
import { MACHINE_GROUP_ID, apiBaseUrl } from '$lib/components/consts';
|
||||
import { LeanChellarisDataStore } from '$lib/stores/ChellarisData';
|
||||
import type { ChellarisEmpire, ChellarisGameGroup } from '$lib/types/chellaris';
|
||||
import type { EmpireEthic } from '$lib/types/stellaris';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
|
||||
export let empire: ChellarisEmpire;
|
||||
|
@ -12,15 +13,47 @@
|
|||
export let auth: string;
|
||||
|
||||
let newEmpirePrepared = false;
|
||||
let newEmpireError: [boolean, string] = [false, ''];
|
||||
|
||||
let oldEmpireData = { ...empire };
|
||||
let ethicsBuffer: { [key: number]: EmpireEthic } = {...empire.ethics};
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
$: {
|
||||
console.log($LeanChellarisDataStore);
|
||||
console.log(empire);
|
||||
}
|
||||
let ethicsIdArray: [boolean, boolean][] = [];
|
||||
Object.values($LeanChellarisDataStore.ethics).map((ethic) => (ethicsIdArray[ethic.id] = [false, false]));
|
||||
Object.values(empire ? ethicsBuffer : []).map((ethic) => (ethicsIdArray[ethic.ethic_id] = [true, false]));
|
||||
Object.values(empire ? ethicsBuffer : [])
|
||||
.filter((ethic) => ethic.fanatic)
|
||||
.map((entry) => (ethicsIdArray[entry.ethic_id][1] = true));
|
||||
|
||||
let oldEmpireData = { ...empire };
|
||||
const updateRegularEthicsSelection = () => {
|
||||
ethicsIdArray.forEach((selected, idx) => {
|
||||
if (selected[0]) {
|
||||
ethicsBuffer[idx] = {
|
||||
ethic_id: idx,
|
||||
fanatic: selected[1]
|
||||
};
|
||||
} else {
|
||||
ethicsIdArray[idx][1] = false;
|
||||
delete ethicsBuffer[idx];
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const updateFanaticEthicsSelection = () => {
|
||||
ethicsIdArray.forEach((selected, idx) => {
|
||||
if (selected[0] || selected[1]) {
|
||||
ethicsBuffer[idx] = {
|
||||
ethic_id: idx,
|
||||
fanatic: selected[1]
|
||||
};
|
||||
ethicsIdArray[idx][0] = true;
|
||||
} else {
|
||||
delete ethicsBuffer[idx];
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const updateEmpire = () => {
|
||||
// Generate Diff:
|
||||
|
@ -42,10 +75,8 @@
|
|||
diffEmpire.gestalt = empire.gestalt;
|
||||
}
|
||||
|
||||
if (JSON.stringify(oldEmpireData.ethics) != JSON.stringify(empire.ethics)) {
|
||||
console.log('A', oldEmpireData.ethics);
|
||||
console.log('B', empire.ethics);
|
||||
diffEmpire.ethics = empire.ethics;
|
||||
if (JSON.stringify(oldEmpireData.ethics) != JSON.stringify(ethicsBuffer)) {
|
||||
diffEmpire.ethics = Object.values(ethicsBuffer);
|
||||
}
|
||||
|
||||
if (oldEmpireData.portrait_id != empire.portrait_id) {
|
||||
|
@ -77,60 +108,51 @@
|
|||
};
|
||||
|
||||
const createEmpire = () => {
|
||||
// Generate Diff:
|
||||
/* let diffEmpire: any = {};
|
||||
let validData = true;
|
||||
let errorMessages = [];
|
||||
|
||||
if (oldEmpireData.name != empire.name) {
|
||||
diffEmpire.empire_name = empire.name;
|
||||
if (empire.name == '') {
|
||||
// Mark Name Input Window Red
|
||||
validData = false;
|
||||
errorMessages.push('Empire Name is invalid!');
|
||||
}
|
||||
|
||||
if (oldEmpireData.discord_user != empire.discord_user) {
|
||||
diffEmpire.discord_user = empire.discord_user;
|
||||
if (Object.values(ethicsBuffer).length == 0) {
|
||||
// Mark Ethics Input Window Red
|
||||
validData = false;
|
||||
errorMessages.push('No Ethics Selected!');
|
||||
}
|
||||
|
||||
if (oldEmpireData.group != empire.group) {
|
||||
diffEmpire.group_id = empire.group;
|
||||
}
|
||||
|
||||
if (oldEmpireData.gestalt != empire.gestalt) {
|
||||
diffEmpire.gestalt = empire.gestalt;
|
||||
}
|
||||
|
||||
if (JSON.stringify(oldEmpireData.ethics) != JSON.stringify(empire.ethics)) {
|
||||
console.log('A', oldEmpireData.ethics);
|
||||
console.log('B', empire.ethics);
|
||||
diffEmpire.ethics = empire.ethics;
|
||||
}
|
||||
|
||||
if (oldEmpireData.portrait_id != empire.portrait_id) {
|
||||
diffEmpire.portrait_id = empire.portrait_id;
|
||||
}
|
||||
|
||||
if (oldEmpireData.portrait_group_id != empire.portrait_group_id) {
|
||||
diffEmpire.portrait_group_id = empire.portrait_group_id;
|
||||
}
|
||||
|
||||
if (Object.values(diffEmpire).length != 0) {
|
||||
diffEmpire.empire_id = empire.id;
|
||||
diffEmpire.game_id = empire.game;
|
||||
if (validData) {
|
||||
let newEmpireData: any = {};
|
||||
newEmpireData.group_id = empire.group;
|
||||
newEmpireData.game_id = empire.game;
|
||||
newEmpireData.empire_name = empire.name;
|
||||
newEmpireData.discord_user = empire.discord_user;
|
||||
newEmpireData.gestalt = empire.gestalt;
|
||||
newEmpireData.portrait_id = empire.portrait_id;
|
||||
newEmpireData.portrait_group_id = empire.portrait_group_id;
|
||||
newEmpireData.ethics = Object.values(ethicsBuffer);
|
||||
fetch(apiBaseUrl + '/v3/empire', {
|
||||
method: 'PUT',
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'x-api-key': auth
|
||||
},
|
||||
body: JSON.stringify(diffEmpire)
|
||||
body: JSON.stringify(newEmpireData)
|
||||
}).then((response) => {
|
||||
response.json().then((result) => {
|
||||
empire = result;
|
||||
oldEmpireData = { ...empire };
|
||||
dispatch('updated');
|
||||
dispatch('created', {
|
||||
new_id: empire.id
|
||||
});
|
||||
});
|
||||
});
|
||||
} */
|
||||
dispatch('created', {
|
||||
new_id: 32
|
||||
});
|
||||
} else {
|
||||
newEmpireError[0] = true;
|
||||
newEmpireError[1] = errorMessages.join(' | ');
|
||||
}
|
||||
};
|
||||
|
||||
// Dropdown UUID to make the Click Event work properly
|
||||
|
@ -155,6 +177,7 @@
|
|||
|
||||
if (!newEmpire) {
|
||||
newEmpirePrepared = false;
|
||||
newEmpireError = [false, ''];
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
@ -216,25 +239,42 @@
|
|||
<label for="text-discord">Discord User:</label>
|
||||
<input id="text-discord" type="text" bind:value={empire.discord_user} />
|
||||
|
||||
<DropDown dropdownTitle={'Ethics*: ' + Object.values(empire.ethics).map((selection) => $LeanChellarisDataStore.ethics[selection.ethic_id].display).join(", ")} dropdownId={ethicsDropdownId}>
|
||||
{#each Object.values($LeanChellarisDataStore.ethics) as ethic}
|
||||
<DropDown
|
||||
dropdownTitle={'Ethics*: ' +
|
||||
Object.values(ethicsBuffer)
|
||||
.map((selection) => (selection.fanatic ? 'Fanatic ' : '') + $LeanChellarisDataStore.ethics[selection.ethic_id].display)
|
||||
.join(', ')}
|
||||
dropdownId={ethicsDropdownId}
|
||||
>
|
||||
{#each Object.values($LeanChellarisDataStore.ethics) as ethic, index}
|
||||
{#if ethic}
|
||||
<DropDownElement dropdownId={ethicsDropdownId}>
|
||||
<input id={'checkbox' + ethic.id} data-dropdown={ethicsDropdownId} type="radio" bind:group={empire.ethics} value={ethic.id} />
|
||||
<input
|
||||
id={'fanatic' + ethic.id}
|
||||
data-dropdown={ethicsDropdownId}
|
||||
type="checkbox"
|
||||
bind:checked={ethicsIdArray[index][1]}
|
||||
on:change={updateFanaticEthicsSelection}
|
||||
value={ethic.id}
|
||||
/>
|
||||
<label for={'fanatic' + ethic.id} data-dropdown={ethicsDropdownId}>Fanatic</label>
|
||||
<input
|
||||
id={'checkbox' + ethic.id}
|
||||
data-dropdown={ethicsDropdownId}
|
||||
type="checkbox"
|
||||
bind:checked={ethicsIdArray[index][0]}
|
||||
on:change={updateRegularEthicsSelection}
|
||||
value={ethic.id}
|
||||
/>
|
||||
<label for={'checkbox' + ethic.id} data-dropdown={ethicsDropdownId}>{ethic.display}</label>
|
||||
</DropDownElement>
|
||||
{/if}
|
||||
{/each}
|
||||
</DropDown>
|
||||
<div>
|
||||
{#if empire.ethics}
|
||||
Ethics*:
|
||||
{#each Object.values(empire.ethics) as ethic}
|
||||
{ethic.fanatic ? ' Fanatic' : ''} {$LeanChellarisDataStore.ethics[ethic.ethic_id].display},
|
||||
{/each}
|
||||
{/if}
|
||||
</div>
|
||||
<button on:click={createEmpire}>Save</button>
|
||||
{#if newEmpireError[0]}
|
||||
<div>{newEmpireError[1]}</div>
|
||||
{/if}
|
||||
{:else if !newEmpire}
|
||||
<div>
|
||||
{#if empire}
|
||||
|
@ -299,24 +339,38 @@
|
|||
<br />
|
||||
<label for="text-discord">Discord User:</label>
|
||||
<input id="text-discord" type="text" bind:value={empire.discord_user} />
|
||||
<DropDown dropdownTitle={'Ethics*: ' + Object.values(empire.ethics).map((selection) => (selection.fanatic ? "Fanatic " : "") + $LeanChellarisDataStore.ethics[selection.ethic_id].display).join(", ")} dropdownId={ethicsDropdownId}>
|
||||
{#each Object.values($LeanChellarisDataStore.ethics) as ethic}
|
||||
<DropDown
|
||||
dropdownTitle={'Ethics*: ' +
|
||||
Object.values(ethicsBuffer)
|
||||
.map((selection) => (selection.fanatic ? 'Fanatic ' : '') + $LeanChellarisDataStore.ethics[selection.ethic_id].display)
|
||||
.join(', ')}
|
||||
dropdownId={ethicsDropdownId}
|
||||
>
|
||||
{#each Object.values($LeanChellarisDataStore.ethics) as ethic, index}
|
||||
{#if ethic}
|
||||
<DropDownElement dropdownId={ethicsDropdownId}>
|
||||
<input id={'checkbox' + ethic.id} data-dropdown={ethicsDropdownId} type="radio" bind:group={empire.ethics} value={ethic.id} />
|
||||
<input
|
||||
id={'fanatic' + ethic.id}
|
||||
data-dropdown={ethicsDropdownId}
|
||||
type="checkbox"
|
||||
bind:checked={ethicsIdArray[index][1]}
|
||||
on:change={updateFanaticEthicsSelection}
|
||||
value={ethic.id}
|
||||
/>
|
||||
<label for={'fanatic' + ethic.id} data-dropdown={ethicsDropdownId}>Fanatic</label>
|
||||
<input
|
||||
id={'checkbox' + ethic.id}
|
||||
data-dropdown={ethicsDropdownId}
|
||||
type="checkbox"
|
||||
bind:checked={ethicsIdArray[index][0]}
|
||||
on:change={updateRegularEthicsSelection}
|
||||
value={ethic.id}
|
||||
/>
|
||||
<label for={'checkbox' + ethic.id} data-dropdown={ethicsDropdownId}>{ethic.display}</label>
|
||||
</DropDownElement>
|
||||
{/if}
|
||||
{/each}
|
||||
</DropDown>
|
||||
<div>
|
||||
{#if empire.ethics}
|
||||
Ethics:
|
||||
{#each Object.values(empire.ethics) as ethic}
|
||||
{ethic.fanatic ? ' Fanatic' : ''} {$LeanChellarisDataStore.ethics[ethic.ethic_id].display},
|
||||
{/each}
|
||||
{/if}
|
||||
</div>
|
||||
{:else}
|
||||
No Empire Selected
|
||||
{/if}
|
||||
|
|
|
@ -118,7 +118,7 @@
|
|||
const tmpEthicPageData = newPageData.ethicsData[ethic.ethic_id];
|
||||
|
||||
if (typeof tmpEthicPageData !== 'undefined') {
|
||||
tmpEthicPageData.display = ethic.display;
|
||||
tmpEthicPageData.display = $ChellarisDataStore.ethics[ethic.ethic_id].display;
|
||||
if (!ethic.fanatic) {
|
||||
tmpEthicPageData.regular = tmpEthicPageData.regular + 1;
|
||||
} else {
|
||||
|
@ -135,8 +135,8 @@
|
|||
fanatic: number;
|
||||
} = {
|
||||
id: ethic.ethic_id,
|
||||
gestalt: ethic.gestalt,
|
||||
display: ethic.display,
|
||||
gestalt: $ChellarisDataStore.ethics[ethic.ethic_id].gestalt,
|
||||
display: $ChellarisDataStore.ethics[ethic.ethic_id].display,
|
||||
regular: 0,
|
||||
fanatic: 0
|
||||
};
|
||||
|
|
Reference in a new issue