Leahnaya/chaoticbackup.github.io
1
0
Fork 0
mirror of https://github.com/chaoticbackup/chaoticbackup.github.io.git synced 2026-04-22 08:37:22 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

closes #20

Browse Source
This commit is contained in:
Daniel 2017-11-24 21:23:29 -05:00
parent 4019d161b6
commit 5541d0a47a
5 changed files with 132 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
build/bundle.js
View File

File diff suppressed because one or more lines are too long

14
src/components/SpreadsheetData.js
View File

@ -156,8 +156,11 @@ class CollectionDB {
});
}
setupBattlegear() {
setupBattlegear(tribe="Generic") {
this.setup(this.api.urls.Battlegear[tribe], "Battlegear", (data) => {
this.battlegear.insert(data);
this.built.push("battlegear_"+tribe);
});
}
setupCreatures(tribe="Generic") {
@ -167,8 +170,11 @@ class CollectionDB {
});
}
setupLocations() {
setupLocations(tribe="Generic") {
this.setup(this.api.urls.Locations[tribe], "Locations", (data) => {
this.locations.insert(data);
this.built.push("locations_"+tribe);
});
}
setupMugic(tribe="Generic") {

46
src/components/collection/Home.js
View File

@ -3,8 +3,9 @@ import API from '../SpreadsheetData';
import s from '../../styles/app.style';
import {observable} from "mobx";
import {observer, inject} from 'mobx-react';
import Creature from './Creature';
import Attack from './Attack';
import Creature from './Creature';
import Mugic from './Mugic';
import SearchForm from './Search';
@inject((stores, props, context) => props) @observer
@ -36,11 +37,21 @@ export default class CollectionHome extends React.Component {
return (<span>Loading...</span>);
}
if (!store.cards.built.includes("battlegear_Cards")) {
store.cards.setupBattlegear("Cards");
return (<span>Loading...</span>);
}
if (!store.cards.built.includes("creatures_Cards")) {
store.cards.setupCreatures("Cards");
return (<span>Loading...</span>);
}
if (!store.cards.built.includes("locations_Cards")) {
store.cards.setupLocations("Cards");
return (<span>Loading...</span>);
}
if (!store.cards.built.includes("mugic_Cards")) {
store.cards.setupMugic("Cards");
return (<span>Loading...</span>);
@ -51,21 +62,6 @@ export default class CollectionHome extends React.Component {
this.content = store.cards.creatures.chain().where((obj) => {return (!obj.gsx$thumb == '');}).simplesort('gsx$name').data();
}
const output = () => {
let elements = this.content.slice(this.n * (this.p-1), this.n * this.p);
if (elements.length == 1 && elements[0].text) {
return (
<div style={{textAlign: 'left'}}>{elements[0].text}</div>
);
}
return elements.map((element, i) => {
if (element.gsx$type == "Creature") return (<Creature creature={element} key={i} />);
if (element.gsx$type == "Attack") return (<Attack attack={element} key={i} />);
else return (<div>Empty</div>);
});
}
return (
<div>
<p>
@ -77,12 +73,28 @@ export default class CollectionHome extends React.Component {
<SearchForm handleContent={this.handleContent.bind(this)} />
<hr />
{this.navigation()}<br />
{output()}
{this.output()}
{this.navigation()}<br />
</div>
);
}
output = () => {
let elements = this.content.slice(this.n * (this.p-1), this.n * this.p);
if (elements.length == 1 && elements[0].text) {
return (
<div style={{textAlign: 'left'}}>{elements[0].text}</div>
);
}
return elements.map((element, i) => {
if (element.gsx$type == "Attack") return (<Attack attack={element} key={i} />);
if (element.gsx$type == "Creature") return (<Creature creature={element} key={i} />);
if (element.gsx$type == "Mugic") return (<Mugic mugic={element} key={i} />);
else return (<div key={i}>Empty</div>);
});
}
navigation() {
let numpages = Math.ceil(this.content.length / this.n);

32
src/components/collection/Mugic.js Normal file
View File

@ -0,0 +1,32 @@
import React from 'react';
import Interactive from 'react-interactive';
import API from '../SpreadsheetData';
import s from '../../styles/app.style';
import {observable} from "mobx";
import {observer, inject} from 'mobx-react';
@inject((stores, props, context) => props) @observer
export default class Attack extends React.Component {
render() {
let mugic = this.props.mugic;
let mugicCounters = [];
for (let i = 0; i < mugic.gsx$cost; i++) {
mugicCounters.push(<img className="icon" src={"/src/img/icons/mugic/"+(mugic.gsx$tribe.toLowerCase()||"generic")+".png"} alt={mugic.gsx$tribe.toLowerCase() + " Mugic counter"} key={i} />);
}
return(
<div style={{textAlign: 'left', display: 'flex'}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (mugic.gsx$thumb||API.thumb_missing)}></img>
<div style={{verticalAlign: 'text-top', float: 'left', width: "50%"}}>
<img height="20" className="icon" src={"/src/img/icons/tribes/"+(mugic.gsx$tribe.toLowerCase()||"generic")+".png"}></img>
<span>{mugic.gsx$name}</span><br />
<span>{API.sets[mugic.gsx$set]} | {mugic.gsx$rarity}</span><br />
<span>Cost: {mugicCounters}</span><br />
</div>
</div>
);
}
}

66
src/components/collection/Search.js
View File

@ -50,11 +50,25 @@ export default class SearchForm extends React.Component {
<select onChange={(e) => {this.type = e.target.value}} >
<option value=""></option>
<option value="Attack">Attack</option>
<option value="Battlegear">Battlegear</option>
<option value="Creature">Creature</option>
<option value="Locations">Locations</option>
<option value="Mugic">Mugic</option>
</select>
</label>&nbsp;&nbsp;
<label>Subtypes: <input type="text" ref={(input) => this.stones.subtypes = input} /></label>
<br /><br />
<div>{setsInput}</div>
<br />
<div>
<label><input type="checkbox" ref={(input) => this.rarity["Common"] = input}/>Common</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Uncommon"] = input}/>Uncommon</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Rare"] = input}/>Rare</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Super Rare"] = input}/>Super Rare</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Ultra Rare"] = input}/>Ultra Rare</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Promo"] = input}/>Promo</label>
</div>
<br />
<div>
<input type="checkbox" ref={(input) => this.tribes.danian = input}/><img height="16" className="icon" src={"/src/img/icons/tribes/danian.png"} />&nbsp;
<input type="checkbox" ref={(input) => this.tribes.mipedian = input}/><img height="16" className="icon" src={"/src/img/icons/tribes/mipedian.png"} />&nbsp;
@ -73,17 +87,6 @@ export default class SearchForm extends React.Component {
<input type="checkbox" ref={(input) => this.stones.noElements = input}/><span>No Elements</span>
</div>
<br />
<div>
<label><input type="checkbox" ref={(input) => this.rarity["Common"] = input}/>Common</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Uncommon"] = input}/>Uncommon</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Rare"] = input}/>Rare</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Super Rare"] = input}/>Super Rare</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Ultra Rare"] = input}/>Ultra Rare</label>&nbsp;
<label><input type="checkbox" ref={(input) => this.rarity["Promo"] = input}/>Promo</label>
</div>
<br />
<div>{setsInput}</div>
<br />
<div>
<label>Min Mugic Counters: <input type="text" style={{width: '20px'}} ref={(input) => this.mc.min = input} /></label>&nbsp;
<label>Max Mugic Counters: <input type="text" style={{width: '20px'}} ref={(input) => this.mc.max = input} /></label>
@ -136,15 +139,18 @@ export default class SearchForm extends React.Component {
pview.applySimpleSort('gsx$name');
// begin data filtering
// TODO add other types
let creatureResults = API.cards.creatures.chain();
let attackResults = API.cards.attacks.chain();
let battlegearResults = API.cards.battlegear.chain();
let creatureResults = API.cards.creatures.chain();
let locationResults = API.cards.locations.chain();
let mugicResults = API.cards.mugic.chain();
// ignores cards without thumbnails
// TODO eventually remove
if (!this.stones.allCards.checked){
creatureResults = creatureResults.where((obj) => {return (!obj.gsx$thumb == '');});
attackResults = attackResults.where((obj) => {return (!obj.gsx$thumb == '');});
mugicResults = mugicResults.where((obj) => {return (!obj.gsx$thumb == '');});
}
// Search by name
@ -157,6 +163,10 @@ export default class SearchForm extends React.Component {
{'gsx$name': {'$regex': new RegExp(this.stones.name.value, 'i')}},
{'gsx$tags': {'$regex': new RegExp(this.stones.name.value, 'i')}},
]});
mugicResults = mugicResults.find({'$or': [
{'gsx$name': {'$regex': new RegExp(this.stones.name.value, 'i')}},
{'gsx$tags': {'$regex': new RegExp(this.stones.name.value, 'i')}},
]});
}
if (this.stones.text.value) {
@ -171,6 +181,11 @@ export default class SearchForm extends React.Component {
{'gsx$ability': {'$regex': new RegExp(this.stones.text.value, 'i')}},
{'gsx$flavortext': {'$regex': new RegExp(this.stones.text.value, 'i')}}
]});
mugicResults = mugicResults.find({'$or': [
{'gsx$tags': {'$regex': new RegExp(this.stones.text.value, 'i')}},
{'gsx$ability': {'$regex': new RegExp(this.stones.text.value, 'i')}},
{'gsx$flavortext': {'$regex': new RegExp(this.stones.text.value, 'i')}}
]});
}
// Search by tribe
@ -182,6 +197,7 @@ export default class SearchForm extends React.Component {
}
if (tribesList.length > 0) {
creatureResults = creatureResults.find({'gsx$tribe': {'$or': tribesList} });
mugicResults = mugicResults.find({'gsx$tribe': {'$or': tribesList} });
}
// no elements
@ -227,6 +243,7 @@ export default class SearchForm extends React.Component {
if (rarityList.length > 0) {
creatureResults = creatureResults.find({'gsx$rarity': {'$or': rarityList} });
attackResults = attackResults.find({'gsx$rarity': {'$or': rarityList} });
mugicResults = mugicResults.find({'gsx$rarity': {'$or': rarityList} });
}
let setsList = [];
@ -238,6 +255,7 @@ export default class SearchForm extends React.Component {
if (setsList.length > 0) {
creatureResults = creatureResults.find({'gsx$set': {'$or': setsList} });
attackResults = attackResults.find({'gsx$set': {'$or': setsList} });
mugicResults = mugicResults.find({'gsx$set': {'$or': setsList} });
}
let genderList = [];
@ -259,9 +277,11 @@ export default class SearchForm extends React.Component {
if (this.mc.min.value > 0) {
creatureResults = creatureResults.find({'gsx$mugicability': {'$gte': this.mc.min.value}});
mugicResults = mugicResults.find({'gsx$cost': {'$gte': this.mc.min.value}});
}
if (this.mc.max.value > 0 && this.mc.max.value >= this.mc.min.value) {
creatureResults = creatureResults.find({'gsx$mugicability': {'$lte': this.mc.max.value}});
mugicResults = mugicResults.find({'gsx$cost': {'$gte': this.mc.min.value}});
}
if (this.energy.min.value > 0) {
@ -287,32 +307,40 @@ export default class SearchForm extends React.Component {
if (this.stones.unique.checked) {
creatureResults = creatureResults.find({'gsx$unique': {'$gt': 0}});
attackResults = attackResults.find({'gsx$unique': {'$gt': 0}});
mugicResults = mugicResults.find({'gsx$unique': {'$gt': 0}});
}
if (this.stones.loyal.checked) {
creatureResults = creatureResults.find({'gsx$loyal': {'$gt': 0}});
attackResults = attackResults.find({'gsx$loyal': {'$gt': 0}});
mugicResults = mugicResults.find({'gsx$unique': {'$gt': 0}});
}
if (this.stones.legendary.checked) {
creatureResults = creatureResults.find({'gsx$legendary': {'$gt': 0}});
attackResults = attackResults.find({'gsx$legendary': {'$gt': 0}});
mugicResults = mugicResults.find({'gsx$unique': {'$gt': 0}});
}
// Merge data
if (!this.type || this.type=="Creature") {
let temp = creatureResults.data()
temp.forEach(function(v){ delete v.$loki });
filter.insert(temp);
}
if (!this.type || this.type=="Attack") {
let temp = attackResults.data();
temp.forEach(function(v){ delete v.$loki });
filter.insert(temp);
}
if (!this.type || this.type=="Creature") {
let temp = creatureResults.data()
temp.forEach(function(v){ delete v.$loki });
filter.insert(temp);
}
if (!this.type || this.type=="Mugic") {
let temp = mugicResults.data()
temp.forEach(function(v){ delete v.$loki });
filter.insert(temp);
}
let results = pview.data();
this.filter.removeCollection('filter');
if (results.length > 0) this.props.handleContent(results);
else this.props.handleContent([{'text': 'No Results Found'}]);
}