rust/lootalot
1
0
Fork 0
Code Issues 3 Pull Requests Releases Wiki Activity

removes obsolete AppStorage.js

Browse Source
This commit is contained in:
Arthur Gerbaud
2019-10-19 14:23:55 +02:00
parent b0441f3402
commit 622d746446
5 changed files with 44 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
lootalot_front/src/App.vue
View File

@@ -1,11 +1,11 @@
<template>
<PlayerView
:id="state.player_id"
:id="player_id"
v-slot="{ player, loot, notifications, actions, claims }"
>
<main id="app" class="container">
<header>
<HeaderBar :app_state="state">
<HeaderBar>
<template v-slot:title>
{{ player.name }}
</template>
@@ -19,7 +19,7 @@
</template>
<hr class="navbar-divider">
<div class="navbar-item heading">Changer</div>
<a v-for="(p,i) in state.player_list" :key="i"
<a v-for="(p,i) in playerList" :key="i"
@click="setActivePlayer(i)"
href="#" class="navbar-item">
{{ p.name }}</a>
@@ -57,14 +57,14 @@
<main class="section">
<template v-if="isAdding">
<Loot v-if="playerIsGroup"
:inventory="state.inventory"
:inventory="itemsInventory"
@addItem="item => pending_loot.push(item)"
@confirmAction="addNewLoot"
></Loot>
<AddingChest
:player="player.id"
:claims="claims"
:items="playerIsGroup ? pending_loot : state.inventory"
:items="playerIsGroup ? pending_loot : itemsInShop"
:perms="playerIsGroup ? {} : { canBuy: true }"
@buy="(data) => { switchView('player'); actions.buyItems(data); }">
</AddingChest>
@@ -72,7 +72,7 @@
<Chest v-else
:player="player.id"
:claims="claims"
:items="showPlayerChest ? loot : state.group_loot"
:items="showPlayerChest ? loot : groupLoot"
:perms="{
canGrab: !(showPlayerChest || playerIsGroup),
canSell: showPlayerChest || playerIsGroup
@@ -92,7 +92,7 @@ import HeaderBar from './components/HeaderBar.vue'
import Wealth from './components/Wealth.vue'
import Chest from './components/Chest.vue'
import Loot from './components/Loot.vue'
import { Api, AppStorage } from './AppStorage'
import { api } from './lootalot.js'
function getCookie(cname) {
var name = cname + "=";
@@ -114,10 +114,14 @@ export default {
name: 'app',
data () {
return {
state: AppStorage.state,
player_id: 0,
playerList: [],
activeView: 'group',
shopInventory: [{id: 1, name: "Item from shop #1", base_price: 2000}],
groupLoot: [],
itemsInventory: [],
itemsInShop: [{id: 1, name: "Item from shop #1", base_price: 2000}],
pending_loot: [],
initiated: false,
};
},
components: {
@@ -129,21 +133,26 @@ export default {
Loot,
},
created () {
// Initiate with active player set to value found in cookie
// or as group by default.
const cookie = getCookie("player_id");
let playerId;
if (cookie == "") {
playerId = 0;
} else {
playerId = Number(cookie);
}
AppStorage.initStorage(playerId);
const cookie = getCookie("player_id");
this.player_id = cookie ? Number(cookie) : 0;
Promise.all([
api.fetch("players/", "GET", null),
api.fetch("players/0/loot", "GET", null),
api.fetch("items", "GET", null),
])
.then(([players, loot, items]) => {
this.playerList = players.value;
this.groupLoot = loot.value;
this.itemsInventory = items.value;
})
.catch(r => alert("Error ! \n" + r))
.then(() => this.initiated = true);
},
methods: {
setActivePlayer (idx) {
if (idx == 0) this.switchView('group');
AppStorage.setActivePlayer(idx);
this.player_id = Number(idx)
document.cookie = `player_id=${idx};`;
},
switchView (viewId) {
if (!['group', 'player', 'adding'].includes(viewId)) {
@@ -151,21 +160,19 @@ export default {
}
this.activeView = viewId;
},
switchPlayerChestVisibility () {
AppStorage.switchPlayerChestVisibility();
},
addNewLoot () {
Api.newLoot(this.pending_loot)
.then(_ => {
api.fetch("admin/add-loot", "POST", this.pending_loot)
.then(() => {
this.pending_loot = []
this.switchView('group');
});
})
.catch(r => alert("Error: " + r));
}
},
computed: {
showPlayerChest () { return this.activeView == 'player' },
isAdding () { return this.activeView == 'adding' },
playerIsGroup () { return this.state.player_id == 0 },
playerIsGroup () { return this.player_id == 0 },
}
}
</script>

149
lootalot_front/src/AppStorage.js
View File

@@ -1,149 +0,0 @@
import Vue from 'vue'
const API_BASEURL = "http://localhost:8088/api/"
const API_ENDPOINT = function (tailString) {
return API_BASEURL + tailString;
}
export const Api = {
__doFetch (endpoint, method, payload) {
return fetch(API_ENDPOINT(endpoint),
{
method,
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(payload)
})
.then(r => r.json())
},
fetchPlayerList () {
return fetch(API_ENDPOINT("players/"))
.then(r => r.json())
},
fetchInventory () {
return fetch(API_ENDPOINT("items"))
.then(r => r.json())
},
fetchClaims () {
return fetch(API_ENDPOINT("claims"))
.then(r => r.json())
},
fetchLoot (playerId) {
return fetch(API_ENDPOINT("players/" + playerId + "/loot"))
.then(r => r.json())
},
putClaim (player_id, item_id) {
const payload = item_id;
return this.__doFetch("players/" + player_id + "/claims", 'PUT', payload);
},
unClaim (player_id, item_id) {
const payload = item_id;
return this.__doFetch("players/" + player_id + "/claims", 'DELETE', payload);
},
updateWealth (player_id, value_in_gp) {
const payload = Number(value_in_gp);
return this.__doFetch("players/" + player_id + "/wealth", 'PUT', payload);
},
buyItems (player_id, items) {
const payload = items;
return this.__doFetch("players/" + player_id + "/loot", 'PUT', payload);
},
sellItems (player_id, items) {
const payload = items;
return this.__doFetch("players/" + player_id + "/loot", 'DELETE', payload);
},
newLoot (items) {
return this.__doFetch("admin/add-loot", 'POST', items);
},
};
export const AppStorage = {
debug: true,
state: {
player_id: 0,
player_list: {},
group_loot: [],
player_claims: {},
inventory: [],
initiated: false,
show_player_chest: false,
},
// Initiate the state
initStorage (playerId) {
if (this.debug) console.log('Initiates with player : ', playerId)
this.state.player_id = playerId;
// Fetch initial data
return Promise
.all([
Api.fetchPlayerList(),
Api.fetchClaims(),
Api.fetchInventory(),
Api.fetchLoot(0)
])
.then(data => {
const [players, claims, inventory, group_loot] = data;
this.__initPlayerList(players.value);
this.__initClaimsStore(claims.value);
Vue.set(this.state, 'group_loot', group_loot.value);
Vue.set(this.state, 'inventory', inventory.value);
})
.then(_ => this.state.initiated = true)
.catch(e => { alert(e); this.state.initiated = false });
},
__initClaimsStore(data) {
for (var idx in data) {
var claimDesc = data[idx];
this.state.player_claims[claimDesc.player_id].push(claimDesc.loot_id);
}
},
__initPlayerList(data) {
for (var idx in data) {
var playerDesc = data[idx];
const playerId = Number(playerDesc.id);
if (this.debug) console.log("Creates", playerId, playerDesc.name)
// Initiate data for a single Player.
Vue.set(this.state.player_list, playerId, playerDesc);
Vue.set(this.state.player_claims, playerId, []);
}
},
// User actions
// Sets a new active player by id
setActivePlayer (newPlayerId) {
if (this.debug) console.log('setActivePlayer to ', newPlayerId)
this.state.player_id = Number(newPlayerId)
document.cookie = `player_id=${newPlayerId};`;
},
// Show/Hide player's chest
switchPlayerChestVisibility () {
if (this.debug) console.log('switchPlayerChestVisibility', !this.state.show_player_chest)
this.state.show_player_chest = !this.state.show_player_chest
},
// Put a claim on an item from group chest.
putRequest (itemId) {
const playerId = this.state.player_id
return Api.putClaim(playerId, itemId)
.then(done => {
// Update cliend-side state
this.state.player_claims[playerId].push(itemId);
});
},
// Withdraws a claim.
cancelRequest(itemId) {
const playerId = this.state.player_id
return Api.unClaim(playerId, itemId)
.then(_ => {
var idx = this.state.player_claims[playerId].indexOf(itemId);
if (idx > -1) {
this.state.player_claims[playerId].splice(idx, 1);
} else {
if (this.debug) console.log("cancel a non-existent request")
}
});
},
addNewLoot (items) {
return Api.newLoot(items);
},
}

10
lootalot_front/src/components/HeaderBar.vue
View File

@@ -4,10 +4,10 @@
<p class="navbar-item is-size-4"><slot name="title">...</slot></p>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false"
@click="switchMobileVisibility">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="menu" class="navbar-menu" :class="{'is-active': showOnMobile }">
<div class="navbar-end">
@@ -17,7 +17,7 @@
<slot name="links">
<a class="navbar-item">History of Loot</a>
</slot>
</div>
</div>
</div>
</div>
</div>

7
lootalot_front/src/components/Request.vue
View File

@@ -25,7 +25,6 @@
</template>
<script>
import { AppStorage } from '../AppStorage'
export default {
props: {
// Id of active player
@@ -47,7 +46,11 @@
computed: {
// Check if item is requested by active player
isRequested () {
return this.claims[this.id].includes(this.item);
if (this.claims[this.id]) {
return this.claims[this.id].includes(this.item);
} else {
return false;
}
},
// Check if item is requested by multiple players including active one
isInConflict () {

2
lootalot_front/src/lootalot.js
View File

@@ -1,5 +1,3 @@
import Vue from 'vue'
const API_BASEURL = "http://localhost:8088/api/"
const API_ENDPOINT = function (tailString) {
return API_BASEURL + tailString;