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

added abilities and flavor text

Browse Source
This commit is contained in:
Daniel 2017-11-30 20:53:08 -05:00
parent 3c1c8e1f61
commit 95e80ae22e
7 changed files with 74 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
build/bundle.js
View File

File diff suppressed because one or more lines are too long

11
src/components/collection/Attack.js
View File

@ -16,8 +16,8 @@ export default class Attack extends React.Component {
return(
<div style={{textAlign: 'left', display: 'flex'}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (attack.gsx$thumb||API.thumb_missing)}></img>
<div style={{verticalAlign: 'text-top', float: 'left', width: "50%"}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (attack.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(creature.gsx$image)} />
<div style={{verticalAlign: 'text-top', float: 'left', width: "220px"}}>
<span>{attack.gsx$name}</span><br />
<span>{API.sets[attack.gsx$set]} | {attack.gsx$rarity}</span><br />
<span>Build Points: {attack.gsx$bp}</span><br />
@ -27,8 +27,13 @@ export default class Attack extends React.Component {
{attack.gsx$air}<img height="16" className="icon" src={"/src/img/icons/elements/air.png"} /> |&nbsp;
{attack.gsx$earth}<img height="16" className="icon" src={"/src/img/icons/elements/earth.png"} /> |&nbsp;
{attack.gsx$water}<img height="16" className="icon" src={"/src/img/icons/elements/water.png"} />
</span><br />
</span>
</div>
<br />
<div style={{float: 'left', width: 'calc(100% - (100px + 230px))', borderLeft: '1px solid white', paddingLeft: '10px'}} >
<span>{attack.gsx$ability}</span><br />
<span><i>{attack.gsx$flavortext}</i></span>
</div>
</div>
);
}

8
src/components/collection/Battlegear.js
View File

@ -13,11 +13,15 @@ export default class Battlegear extends React.Component {
return(
<div style={{textAlign: 'left', display: 'flex'}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (battlegear.gsx$thumb||API.thumb_missing)}></img>
<div style={{verticalAlign: 'text-top', float: 'left', width: "50%"}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (battlegear.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(battlegear.gsx$image)} />
<div style={{verticalAlign: 'text-top', float: 'left', width: "220px"}}>
<span>{battlegear.gsx$name}</span><br />
<span>{API.sets[battlegear.gsx$set]} | {battlegear.gsx$rarity}</span><br />
</div>
<div style={{float: 'left', width: 'calc(100% - (100px + 230px))', borderLeft: '1px solid white', paddingLeft: '10px'}} >
<span>{battlegear.gsx$ability}</span><br />
<span><i>{battlegear.gsx$flavortext}</i></span>
</div>
</div>
);
}

47
src/components/collection/Creature.js
View File

@ -16,28 +16,39 @@ export default class Creature extends React.Component {
let mugic = [];
for (let i = 0; i < creature.gsx$mugicability; i++) {
mugic.push(<img className="icon" src={"/src/img/icons/mugic/"+(creature.gsx$tribe.toLowerCase()||"generic")+".png"} alt={creature.gsx$tribe.toLowerCase() + " Mugic counter"} key={i} />);
mugic.push(<img className="icon" src={"/src/img/icons/mugic/"+(creature.gsx$tribe.toLowerCase()||"generic")+".png"} alt="MC" key={i} />);
}
// const ability = creature.gsx$ability.replace(/{{mc}}/i,
// <img className="icon" src={"/src/img/icons/mugic/"+(creature.gsx$tribe.toLowerCase()||"generic")+".png"} alt="MC" />
// );
return(
<div style={{textAlign: 'left', display: 'flex'}} onClick={() => this.props.setImage(creature.gsx$image)}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (creature.gsx$thumb||API.thumb_missing)}></img>
<div style={{verticalAlign: 'text-top', float: 'left', width: 'calc(100% - 50px)'}}>
<img height="20" className="icon" src={"/src/img/icons/tribes/"+creature.gsx$tribe.toLowerCase()+".png"}></img>
<span>{creature.gsx$name}</span><br />
<span>{API.sets[creature.gsx$set]} | {creature.gsx$rarity}</span><br />
<span>Creature - {creature.gsx$tribe} {creature.gsx$types}</span><br />
<span>{elements}</span><br />
<span>{mugic}</span><br />
</div>
<div style={{verticalAlign: 'text-top', float: 'left', width: '50px', textAlign: 'right'}}>
<span>{creature.gsx$courage}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/courage.png"}></img></span><br />
<span>{creature.gsx$power}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/power.png"}></img></span><br />
<span>{creature.gsx$wisdom}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/wisdom.png"}></img></span><br />
<span>{creature.gsx$speed}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/speed.png"}></img></span><br />
</div>
<div className="creature" style={{textAlign: 'left', display: 'flex'}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (creature.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(creature.gsx$image)} />
<div style={{verticalAlign: 'text-top', float: 'left', width: '220px'}}>
<span>{creature.gsx$name}</span><br />
<span>{API.sets[creature.gsx$set]} | {creature.gsx$rarity}</span><br />
<img height="20" className="icon" src={"/src/img/icons/tribes/"+creature.gsx$tribe.toLowerCase()+".png"}></img>
<span>{creature.gsx$tribe} {creature.gsx$types}</span><br />
<span>{elements}</span><br />
<span>{mugic}</span>
</div>
<br />
<div style={{float: 'left', width: 'calc(100% - (100px + 230px + 50px))', borderLeft: '1px solid white', paddingLeft: '10px'}} >
<span>{creature.gsx$ability}</span><br />
<span>{creature.gsx$brainwashed}</span><br />
<span><i>{creature.gsx$flavortext}</i></span>
</div>
<br />
<div style={{verticalAlign: 'text-top', float: 'left', width: '50px', textAlign: 'right'}}>
<span>{creature.gsx$courage}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/courage.png"}></img></span><br />
<span>{creature.gsx$power}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/power.png"}></img></span><br />
<span>{creature.gsx$wisdom}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/wisdom.png"}></img></span><br />
<span>{creature.gsx$speed}&nbsp;<img height="16" className="icon" src={"/src/img/icons/disciplines/speed.png"}></img></span><br />
<span>{creature.gsx$energy}</span>
</div>
</div>
);
}
}

9
src/components/collection/Location.js
View File

@ -13,12 +13,17 @@ export default class Location extends React.Component {
return(
<div style={{textAlign: 'left', display: 'flex'}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (location.gsx$thumb||API.thumb_missing)}></img>
<div style={{verticalAlign: 'text-top', float: 'left', width: "50%"}}>
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (location.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(location.gsx$image)} />
<div style={{verticalAlign: 'text-top', float: 'left', width: "220px"}}>
<span>{location.gsx$name}</span><br />
<span>{API.sets[location.gsx$set]} | {location.gsx$rarity}</span><br />
<span>{location.gsx$initiative}</span>
</div>
<br />
<div style={{float: 'left', width: 'calc(100% - (100px + 230px))', borderLeft: '1px solid white', paddingLeft: '10px'}} >
<span>{location.gsx$ability}</span><br />
<span><i>{location.gsx$flavortext}</i></span>
</div>
</div>
);
}

9
src/components/collection/Mugic.js
View File

@ -18,13 +18,18 @@ export default class Attack extends React.Component {
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 className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (mugic.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(mugic.gsx$image)} />
<div style={{verticalAlign: 'text-top', float: 'left', width: "220px"}}>
<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>
<br />
<div style={{float: 'left', width: 'calc(100% - (100px + 230px))', borderLeft: '1px solid white', paddingLeft: '10px'}} >
<span>{mugic.gsx$ability}</span><br />
<span><i>{mugic.gsx$flavortext}</i></span>
</div>
</div>
);
}

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

@ -107,7 +107,8 @@ export default class SearchForm extends React.Component {
<div className="SearchForm">
<form onSubmit={this.search}>
<p>
Since not all data has been entered not all cards are listed, to see incomplete cards, click&nbsp;
Since not all data has been entered not all <br />cards are listed, to see incomplete cards, click
<br />
<label>"Show all cards":<input type="checkbox" ref={(input) => this.stones.allCards = input}/></label>
</p>
<br />