From c57760bb114f920a49ab62bab47e60f6dec3d9cb Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 11 Nov 2017 22:07:16 -0500 Subject: [PATCH] single creature updated stubbed other types --- src/components/CollectionDB.js | 86 +++++++++++++ src/components/SpreadsheetData.js | 9 +- src/components/database/cards.js | 35 ------ src/components/database/portal.js | 86 ------------- src/components/portal/Category/Creatures.js | 54 ++------ src/components/portal/Category/Mugic.js | 27 ++-- src/components/portal/Single/Creature.js | 129 ++++---------------- 7 files changed, 134 insertions(+), 292 deletions(-) create mode 100644 src/components/CollectionDB.js delete mode 100644 src/components/database/cards.js delete mode 100644 src/components/database/portal.js diff --git a/src/components/CollectionDB.js b/src/components/CollectionDB.js new file mode 100644 index 0000000..8ab24be --- /dev/null +++ b/src/components/CollectionDB.js @@ -0,0 +1,86 @@ +import loki from 'lokijs'; +import {observable, autorun} from "mobx"; + +export default class CollectionDB { + @observable built = []; // Keeps track of what collections have been populated + + constructor(API) { + this.api = API; + // ignoring persistence for now + // this.setupDB(); + //autorun(() => console.log(this.creatures)); + let db = new loki("chaotic_portal.db"); + this.attacks = db.addCollection('attacks'); + this.battlegear = db.addCollection('battlegear'); + this.creatures = db.addCollection('creatures'); + this.locations = db.addCollection('locations'); + this.mugic = db.addCollection('mugic'); + this.db = db; + } + + // setupDB() { + // var self = this; + // let db = new loki("chaotic_portal.db", { autosave: true, autoload: true, autoloadCallback: databaseInitialize, autosaveInterval: 4000, persistenceMethod: 'localStorage' }); + // this.db = db; + + // let databaseInitialize = () => { + // var entries; + // if ((entries = db.getCollection("attacks")) === null) + // entries = db.addCollection("attacks"); + // self.attacks = entries; + + // if ((entries = db.getCollection("battlegear")) === null) + // entries = db.addCollection("battlegear"); + // self.battlegear = entries; + + // console.log(db.getCollection("creatures")); + // if ((entries = db.getCollection("creatures")) === null) + // entries = db.addCollection("creatures"); + // self.creatures = db.addCollection('creatures'); + + // if ((entries = db.getCollection("locations")) === null) + // entries = db.addCollection("locations"); + // self.locations = entries + + // if ((entries = db.getCollection("mugic")) === null) + // entries = db.addCollection("mugic"); + // self.mugic = entries; + // }; + // } + + setup(spreadsheet, callback) { + this.api.getSpreadsheet(spreadsheet, (data) => { + callback(data.map((item) => { + let temp = {}; + delete item.content; + for (const key of Object.keys(item)) { + temp[key] = item[key].$t; + } + return temp; + })); + }); + } + + setupAttacks() { + + } + + setupBattleGear() { + + } + + setupCreatures(tribe="Generic") { + this.setup(this.api.urls.Creatures[tribe], (data) => { + this.creatures.insert(data); + this.built.push("creatures_"+tribe); + }); + } + + setupLocations() { + + } + + setupMugic(tribe) { + + } +} diff --git a/src/components/SpreadsheetData.js b/src/components/SpreadsheetData.js index 2eec047..eebf412 100644 --- a/src/components/SpreadsheetData.js +++ b/src/components/SpreadsheetData.js @@ -1,13 +1,12 @@ import 'whatwg-fetch'; -import CardsDB from './database/cards'; -import PortalDB from './database/portal'; +import CollectionDB from './CollectionDB'; import {observable} from "mobx"; class API { @observable portal = null; @observable cards = null; @observable urls = null; - @observable instance = null; + instance = null; static base_url = "https://spreadsheets.google.com/feeds/list/"; static data_format = "/od6/public/values?alt=json"; @@ -54,8 +53,8 @@ class API { setupDB() { try { - this.portal = new PortalDB(this); - this.cards = new CardsDB(this); + this.portal = new CollectionDB(this, "portal"); + this.cards = new CollectionDB(this, "cards"); } catch (err) { console.log('setting up database failed', err); diff --git a/src/components/database/cards.js b/src/components/database/cards.js deleted file mode 100644 index 42425ae..0000000 --- a/src/components/database/cards.js +++ /dev/null @@ -1,35 +0,0 @@ -export default class CardsDB { - constructor(API) { - // this.api = API; - // this.attacks = db.addCollection('attacks'); - // this.battlegear = db.addCollection('battlegear'); - // this.creatures = db.addCollection('creatures'); - // this.locations = db.addCollection('locations'); - // this.mugic = db.addCollection('mugic'); - // this.db = db; - } - - setupCreatures(spreadsheet) { - this.getSpreadsheet(spreadsheet, function(json) { - - }); - } - - setupMugic(spreadsheet) { - this.getSpreadsheet(spreadsheet, function(json) { - - }); - } - - setupBattleGear(spreadsheet) { - this.getSpreadsheet(spreadsheet, function(json) { - - }); - } - - setupLocations(spreadsheet) { - this.getSpreadsheet(spreadsheet, function(json) { - - }); - } -} diff --git a/src/components/database/portal.js b/src/components/database/portal.js deleted file mode 100644 index 5ec5142..0000000 --- a/src/components/database/portal.js +++ /dev/null @@ -1,86 +0,0 @@ -import loki from 'lokijs'; -import {observable, autorun} from "mobx"; - -export default class PortalDB { - @observable built = []; // Keeps track of what collections have been populated - - constructor(API) { - this.api = API; - // ignoring persistence for now - // this.setupDB(); - //autorun(() => console.log(this.creatures)); - let db = new loki("chaotic_portal.db"); - this.attacks = db.addCollection('attacks'); - this.battlegear = db.addCollection('battlegear'); - this.creatures = db.addCollection('creatures'); - this.locations = db.addCollection('locations'); - this.mugic = db.addCollection('mugic'); - this.db = db; - } - - setupDB() { - var self = this; - let db = new loki("chaotic_portal.db", { autosave: true, autoload: true, autoloadCallback: databaseInitialize, autosaveInterval: 4000, persistenceMethod: 'localStorage' }); - this.db = db; - - let databaseInitialize = () => { - var entries; - if ((entries = db.getCollection("attacks")) === null) - entries = db.addCollection("attacks"); - self.attacks = entries; - - if ((entries = db.getCollection("battlegear")) === null) - entries = db.addCollection("battlegear"); - self.battlegear = entries; - - console.log(db.getCollection("creatures")); - if ((entries = db.getCollection("creatures")) === null) - entries = db.addCollection("creatures"); - self.creatures = db.addCollection('creatures'); - - if ((entries = db.getCollection("locations")) === null) - entries = db.addCollection("locations"); - self.locations = entries - - if ((entries = db.getCollection("mugic")) === null) - entries = db.addCollection("mugic"); - self.mugic = entries; - }; - } - - setup(spreadsheet, callback) { - this.api.getSpreadsheet(spreadsheet, (data) => { - callback(data.map((item) => { - let temp = {}; - delete item.content; - for (const key of Object.keys(item)) { - temp[key] = item[key].$t; - } - return temp; - })); - }); - } - - setupAttacks() { - - } - - setupBattleGear() { - - } - - setupCreatures(tribe) { - this.setup(this.api.urls.Creatures[tribe], (data) => { - this.creatures.insert(data); - this.built.push("creatures_"+tribe); - }); - } - - setupLocations() { - - } - - setupMugic(tribe) { - - } -} diff --git a/src/components/portal/Category/Creatures.js b/src/components/portal/Category/Creatures.js index f51e104..b7ea23e 100644 --- a/src/components/portal/Category/Creatures.js +++ b/src/components/portal/Category/Creatures.js @@ -4,54 +4,20 @@ import { Link } from 'react-router'; import PageNotFound from '../../PageNotFound'; import API from '../../SpreadsheetData'; import s from '../../../styles/app.style'; +import UnderConstruction from '../../UnderConstruction'; export default class Creatures extends React.Component { - constructor(props) { - super (props); - this.state = {tribe: '', creatures: {}}; - } - - componentWillReceiveProps(nextProps) { - this.getData(nextProps); - } - - componentDidMount() { - this.getData(this.props); - } - - // ** Process the tribe ** // - // /portal/Creatures/ - // /portal/{Tribe}/Creatures/ - // The first / gets counted - getData(props) { - if (props.children) return this.props = props; - let path = props.location.pathname.split("/"); - if (path[path.length-1] == "") path.pop(); // Remove trailing backslash - - // Set tribe - let tribe = (path.length === 4) ? path[2] : "All"; - this.setState({tribe: tribe}); - - // For each tribe, get its spreadsheet, set the state - var self = this; - let urls = (tribe == "All") ? API.Creatures : {[tribe]: API.Creatures[tribe]}; - Object.keys(urls).map((tribe) => { - API.getSpreadsheet(urls[tribe], (data) => { - self.setState({creatures: - Object.assign(self.state.creatures, {[tribe]: data}) - }); - }); - }); - // self.setState({creatures: this.state.creatures.concat([data])}); - } - - hacks(event) { - console.log(event); - this.setState({click: true}); - } - render() { + if (this.props.children) { + return (
{this.props.children}
); + } + return ( + + ); + } + + fakerender() { if (this.props.children) { return (
{this.props.children}
); } diff --git a/src/components/portal/Category/Mugic.js b/src/components/portal/Category/Mugic.js index e043748..3585e9b 100644 --- a/src/components/portal/Category/Mugic.js +++ b/src/components/portal/Category/Mugic.js @@ -8,25 +8,16 @@ import s from '../../../styles/app.style'; export default class Mugic extends React.Component { - constructor(props) { - super (props); - this.tribe = ''; - this.state = {mugic: {}}; - } - - componentDidMount() { - if (this.props.children) return; - var self = this; - let urls = (this.tribe == "All") ? API.Mugic : {[this.tribe]: API.Mugic[this.tribe]}; - // For each tribe, get its spreadsheet, set the state - Object.keys(urls).map((tribe) => { - API.getSpreadsheet(urls[tribe], function(data) { - self.setState({mugic: Object.assign(self.state.mugic, {[tribe]: data})}); - }); - }); - } - render() { + if (this.props.children) { + return (
{this.props.children}
); + } + return ( + + ); + } + + fakerender() { if (this.props.children) { return (
{this.props.children}
); } diff --git a/src/components/portal/Single/Creature.js b/src/components/portal/Single/Creature.js index 39972b6..5172fac 100644 --- a/src/components/portal/Single/Creature.js +++ b/src/components/portal/Single/Creature.js @@ -1,9 +1,7 @@ import React from 'react'; import Interactive from 'react-interactive'; import { Link } from 'react-router'; -// import {browserHistory} from 'react-router'; import PageNotFound from '../../PageNotFound'; -import UnderConstruction from '../../UnderConstruction'; import API from '../../SpreadsheetData'; import s from '../../../styles/app.style'; import {observer, inject} from 'mobx-react'; @@ -15,37 +13,6 @@ export default class SingleCreature extends React.Component { // /portal/Creatures/{Tribe}/{Name} // /portal/{Tribe}/Creatures/{Name} // The first / gets counted - getData(props) { - - - var name = decodeURIComponent(path[4]); - - var self = this; - var creature = API.portal.creatures.findOne(name); - if (creature) self.setState({"creature": creature}); - else self.setState({creature: "n/a"}); - console.log(creature); - API.getSpreadsheet(API.Creatures[tribe], (data) => { - data.map((item, i) => { - if (item.title.$t == name) - self.setState({creature: item }); - }); - // If no creature set as false - if (!self.state.creature) { - self.setState({creature: "n/a"}); - } - }); - API.getSpreadsheet(API.Creatures_Card_Data, (data) => { - data.map((item, i) => { - if (item.title.$t == name) self.setState({card_data: item }); - }); - // If no card_data set as false - if (!self.state.card_data) { - self.setState({card_data: "n/a"}); - } - }); - } - render() { const store = API; @@ -74,14 +41,18 @@ export default class SingleCreature extends React.Component { // return (Invalid Tribe: {tribe}); // } + if (!store.cards.built.includes("creatures_Cards")) { + store.cards.setupCreatures("Cards"); + return (Loading...); + } + if (!store.portal.built.includes("creatures_"+tribe)) { store.portal.setupCreatures(tribe); return (Loading...); } - // TODO load card data const creature = store.portal.creatures.findOne({'gsx$name': path[4]}); - console.log(creature); + const card_data = store.cards.creatures.findOne({'gsx$name': path[4]}); if (!creature) { return(); } @@ -94,9 +65,12 @@ export default class SingleCreature extends React.Component { return

{item}

; }); + const elements = card_data.gsx$elements.split(/[ ,]+/).map((item, i) => { + return {item}; + }); + return (
-

{creature.gsx$name}

@@ -139,113 +113,60 @@ export default class SingleCreature extends React.Component { Weight (lb):
{creature.gsx$weight}
- - ); - } - - fakerender() { - var self = this; - - const elements = card_data.gsx$elements.$t.split(/[ ,]+/).map((item, i) => { - return {item}; - }); - - const locations = creature.gsx$location.$t.split(/[,]+\s*/).map((item, i) => { - return

{item}

; - }); - - const battlegear = creature.gsx$battlegear.$t.split(/[,]+\s*/).map((item, i) => { - return

{item}

; - }); - - return( -
-

{creature.gsx$name.$t}

- -
-
- Appearance:
- {creature.gsx$appearance.$t} -
-
-
- Background:
- {creature.gsx$background.$t} -
-
-
- Details:
- {creature.gsx$details.$t} -
-
-
- Favorite Battlegear(s):
- {battlegear} -
-
-
- Favorite Location(s):
- {locations} -
-
-
- Height (ft):
- {creature.gsx$height.$t} -
Special Abilities:
- {creature.gsx$specialabilities.$t} + {creature.gsx$specialabilities}
Weight (lb):
- {creature.gsx$weight.$t} + {creature.gsx$weight}
Card ID: - {card_data.gsx$cardid.$t} + {card_data.gsx$cardid}
Set: - {card_data.gsx$set.$t} + {card_data.gsx$set}
Rarity: - {card_data.gsx$rarity.$t} + {card_data.gsx$rarity}
- Tribe: {this.state.tribe} - + Tribe: {tribe} +
Ability:
- {card_data.gsx$ability.$t} + {card_data.gsx$ability}
Courage: - {card_data.gsx$courage.$t} + {card_data.gsx$courage}
Power: - {card_data.gsx$power.$t} + {card_data.gsx$power}
Speed: - {card_data.gsx$speed.$t} + {card_data.gsx$speed}
Wisdom: - {card_data.gsx$wisdom.$t} + {card_data.gsx$wisdom}
@@ -254,17 +175,17 @@ export default class SingleCreature extends React.Component {
Energy: - {card_data.gsx$energy.$t} + {card_data.gsx$energy}
Flavortext:
- {card_data.gsx$flavortext.$t} + {card_data.gsx$flavortext}
Mugic Ability: - {card_data.gsx$mugicability.$t} + {card_data.gsx$mugicability}
);