Leahnaya/chaoticbackup.github.io
1
0
Fork 0
mirror of https://github.com/chaoticbackup/chaoticbackup.github.io.git synced 2026-03-21 17:24:14 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

[change] merged portal and collection into single app

Browse Source
This commit is contained in:
Daniel 2017-10-12 18:26:53 -04:00
parent 5fd64dbf32
commit 12be47568c
23 changed files with 250 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
404.html
View File

@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8">
<title>Chaotic Backup Collection</title>
<title>Chaotic Backup</title>
<script type="text/javascript">
// Single Page Apps for GitHub Pages
// https://github.com/rafrex/spa-github-pages
@ -23,7 +23,7 @@
// https://username.github.io/repo-name/one/two?a=b&c=d#qwe becomes
// https://username.github.io/repo-name/?p=/one/two&q=a=b~and~c=d#qwe
// Otherwise, leave segmentCount as 0.
var segmentCount = 1;
var segmentCount = 0;
var l = window.location;
l.replace(

18
build/bundle.js
View File

File diff suppressed because one or more lines are too long

8
index.html
View File

@ -3,9 +3,8 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Chaotic Backup Collection</title>
<meta name="description" content="Chaotic Backup Collection">
<link rel="stylesheet" href="/collection/src/css/legacy.css">
<title>Chaotic Backup</title>
<meta name="description" content="Chaotic Backup">
<link rel="stylesheet" href="/src/css/legacy.css">
<style>
html, body, div, span, a, p, ul, li, h1, code, nav {
@ -31,7 +30,7 @@
horizontally based on vw to prevent content jump when vertical scroll bar show/hide.*/
body { overflow-x: hidden; }
</style>
<link rel="shortcut icon" type="image/x-icon" href="/collection/favicon.ico"/>
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"/>
<!-- Start Single Page Apps for GitHub Pages -->
<script type="text/javascript">
@ -88,7 +87,6 @@
<body>
<div id="root"></div>
<!-- single page app in bundle.js -->
<script src="/collection/build/bundle.js"></script>
<script src="/build/bundle.js"></script>
</body>
</html>

6
package.json
View File

@ -1,14 +1,14 @@
{
"name": "chaoticbackup-collection",
"name": "chaoticbackup",
"version": "0.0.2",
"description": "Chaotic Backup Collection",
"description": "Chaotic Backup",
"scripts": {
"start": "webpack-dev-server -d --inline --host 0.0.0.0 --history-api-fallback --progress",
"build": "webpack -p"
},
"repository": {
"type": "git",
"url": "git+https://github.com/chaoticbackup/collection.git"
"url": "git+https://github.com/chaoticbackup/chaoticbackup.github.io.git"
},
"author": "Danude Sandstorm",
"license": "MIT",

4
src/components/App.js
View File

@ -2,7 +2,7 @@ import React, { PropTypes } from 'react';
import Interactive from 'react-interactive';
import { Link } from 'react-router';
import s from '../styles/app.style';
import {ChangePage, language, bkgrnd } from './Helper';
import {ChangePage, language, bkgrnd } from './AppHelper';
const propTypes = {
children: PropTypes.element.isRequired,
@ -55,7 +55,7 @@ function App({ children, routes }) {
<li id="unity-nav4" className={language}><a href={ChangePage('trade')}><span>Trade</span></a></li>
<li id="unity-nav5" className={language}><a href={ChangePage('centerOval')}><span>Home</span></a></li>
<li id="unity-nav6" className={language}><a href={ChangePage('forum')}><span>Forums</span></a></li>
<li id="unity-nav7" className={language}><a href={ChangePage('portal')}><span>Collection</span></a></li>
<li id="unity-nav7" className={language}><a href={ChangePage('portal')}><span>Portal</span></a></li>
<li id="unity-nav8" className={language}><a href={ChangePage('playNow')}><span>Play</span></a></li>
<li id="unity-nav9" className={language}></li>
</ul>

12
src/components/Helper.js → src/components/AppHelper.js
View File

@ -7,15 +7,15 @@ export function ChangePage(asParams) {
let location = "#";
switch (asParams) {
case 'collect':
location = 'http://www.tradecardsonline.com/im/editCollection/collection_type/1';
location = '/collection/';
break;
case 'register':
break;
// case 'register' :
// location ='/Registration.aspx';
// break;
case 'build':
location = 'http://www.tradecardsonline.com/?action=selectCard&goal=DK&game_id=82';
break;
case 'centerOval':
location = '/';
break;
case 'enterTheCode':
break;
@ -23,7 +23,7 @@ export function ChangePage(asParams) {
location = 'http://www.tradecardsonline.com/?action=selectCard&goal=&game_id=82';
break;
case 'portal':
location = ('/collection/')
location = '/portal/';
break;
case 'forum':
location = 'http://chaoticbackup.forumotion.com';
@ -32,7 +32,7 @@ export function ChangePage(asParams) {
location = 'http://www.tradecardsonline.com/?action=selectCard&goal=DK&game_id=82';
break;
default:
location = '/collection/UnderConstruction/';
location = '/construction/';
break;
}
return location;

33
src/components/ExampleComponent.js Normal file
View File

@ -0,0 +1,33 @@
import React, { PropTypes } from 'react';
import Interactive from 'react-interactive';
import { Link } from 'react-router';
import s from '../styles/exampleComponent.style';
const propTypes = {
children: PropTypes.element,
};
function ExampleComponent({ children }) {
return (
<div>
<p style={s.p}>
This is an example page. Refresh the page or copy/paste the url to
test out the redirect functionality (this same page should load
after the redirect).
</p>
{children ||
<div style={s.pageLinkContainer}>
<Interactive
as={Link}
{...s.link}
to="/example/two-deep?field1=foo&field2=bar#boom!"
>Example two deep with query and hash</Interactive>
</div>
}
</div>
);
}
ExampleComponent.propTypes = propTypes;
export default ExampleComponent;

71
src/components/ExampleTwoDeepComponent.js Normal file
View File

@ -0,0 +1,71 @@
import React, { PropTypes } from 'react';
import Interactive from 'react-interactive';
import { Link } from 'react-router';
import s from '../styles/exampleTwoDeepComponent.style';
const propTypes = {
location: PropTypes.object.isRequired,
};
function ExampleTwoDeepComponent({ location }) {
const queryPresent = Object.keys(location.query).length !== 0;
const hashPresent = location.hash !== '';
function queryStringTitle() {
if (queryPresent) return 'The query string field-value pairs are:';
return 'No query string in the url';
}
function hashFragmentTitle() {
if (hashPresent) return 'The hash fragment is:';
return 'No hash fragment in the url';
}
function linkToShowQueryAndOrHash() {
if (queryPresent && hashPresent) return null;
const queryString = (queryPresent ? location.search : '?field1=foo&field2=bar');
const hashFragment = (hashPresent ? location.hash : '#boom!');
let linkText = '';
if (queryPresent && !hashPresent) linkText = 'Show with hash fragment';
if (!queryPresent && hashPresent) linkText = 'Show with query string';
if (!queryPresent && !hashPresent) linkText = 'Show with query string and hash fragment';
return (
<div style={s.lineContainer}>
<Interactive
as={Link}
to={`/example/two-deep${queryString}${hashFragment}`}
{...s.link}
>{linkText}</Interactive>
</div>
);
}
return (
<div>
<div style={s.lineContainer}>
<div>{queryStringTitle()}</div>
<ul>
{
Object.keys(location.query).map((field, index) => (
s.li(`${field}: ${location.query[field]}`, { key: index })
))
}
</ul>
</div>
<div style={s.lineContainer}>
<div>{hashFragmentTitle()}</div>
<ul>
{hashPresent ? s.li(location.hash.slice(1)) : undefined}
</ul>
</div>
{linkToShowQueryAndOrHash()}
</div>
);
}
ExampleTwoDeepComponent.propTypes = propTypes;
export default ExampleTwoDeepComponent;

33
src/components/Home.js
View File

@ -6,25 +6,20 @@ import s from '../styles/home.style';
function Home() {
return (
<div>
<Interactive as={Link} {...s.link}
to="/collection/Creatures"
>Creatures</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/collection/Danian/Creatures"
>Danian</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/collection/Overworld/Creatures"
>Overworld</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/collection/Underworld/Creatures"
>Underworld</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/collection/Mipedian/Creatures"
>Mipedian</Interactive>
<div style={s.pageLinkContainer}>
<Interactive
as={Link}
{...s.link}
to="/example"
>Example page</Interactive>
</div>
<div style={s.pageLinkContainer}>
<Interactive
as={Link}
{...s.link}
to="/example/two-deep?field1=foo&field2=bar#boom!"
>Example two deep with query and hash</Interactive>
</div>
</div>
);
}

19
src/components/collection/Home.js Normal file
View File

@ -0,0 +1,19 @@
import React from 'react';
import UnderConstruction from '../UnderConstruction';
export default class SingleCreature extends React.Component {
render() {
return (
<div>
<UnderConstruction location={this.props.location}/>
<p>
In the meantime, you can check out&nbsp;
<a style={{textDecoration: "underline"}} href="http://www.tradecardsonline.com/im/editCollection/collection_type/1">Trade Cards Online</a>
.
</p>
</div>
);
}
}

0
src/components/Category/Attacks.js → src/components/portal/Category/Attacks.js
View File

0
src/components/Category/Battlegear.js → src/components/portal/Category/Battlegear.js
View File

12
src/components/Category/Creatures.js → src/components/portal/Category/Creatures.js
View File

@ -1,9 +1,9 @@
import React from 'react';
import Interactive from 'react-interactive';
import { Link } from 'react-router';
import PageNotFound from '../PageNotFound';
import API from '../Spreadsheet';
import s from '../../styles/app.style';
import PageNotFound from '../../PageNotFound';
import API from '../../Spreadsheet';
import s from '../../../styles/app.style';
export default class Creatures extends React.Component {
@ -21,8 +21,8 @@ export default class Creatures extends React.Component {
}
// ** Process the tribe ** //
// /collection/Creatures/
// /collection/{Tribe}/Creatures/
// /portal/Creatures/
// /portal/{Tribe}/Creatures/
// The first / gets counted
getData(props) {
if (props.children) return this.props = props;
@ -75,7 +75,7 @@ export default class Creatures extends React.Component {
return (
<div key={i}>
<Interactive as={Link} {...s.link}
to={"/collection/"+tribe}
to={"/portal/"+tribe}
><span style={s.title}>{tribe}</span></Interactive>
{list_creatures(tribe, "Creatures/"+tribe+"/")}
<hr />

0
src/components/Category/Locations.js → src/components/portal/Category/Locations.js
View File

12
src/components/Category/Mugic.js → src/components/portal/Category/Mugic.js
View File

@ -1,10 +1,10 @@
import React from 'react';
import Interactive from 'react-interactive';
import { Link } from 'react-router';
import UnderConstruction from '../UnderConstruction';
import PageNotFound from '../PageNotFound';
import API from '../Spreadsheet';
import s from '../../styles/app.style';
import UnderConstruction from '../../UnderConstruction';
import PageNotFound from '../../PageNotFound';
import API from '../../Spreadsheet';
import s from '../../../styles/app.style';
export default class Mugic extends React.Component {
@ -34,8 +34,8 @@ export default class Mugic extends React.Component {
if (path[path.length-1] == "") path.pop(); // Remove trailing backslash
// ** Process the tribe ** //
// /collection/Mugic/
// /collection/{Tribe}/Mugic/
// /portal/Mugic/
// /portal/{Tribe}/Mugic/
// The first / gets counted
return (

2
src/components/Category/Tribes.js → src/components/portal/Category/Tribes.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import UnderConstruction from '../UnderConstruction';
import UnderConstruction from '../../UnderConstruction';
// This module handles tribe pages and subpages
// Allows for urls such as

30
src/components/portal/Home.js Normal file
View File

@ -0,0 +1,30 @@
import React from 'react';
import Interactive from 'react-interactive';
import { Link } from 'react-router';
import s from '../../styles/home.style';
export default function PortalHome() {
return (
<div>
<Interactive as={Link} {...s.link}
to="/portal/Creatures"
>Creatures</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/portal/Danian/Creatures"
>Danian</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/portal/Overworld/Creatures"
>Overworld</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/portal/Underworld/Creatures"
>Underworld</Interactive>
<br />
<Interactive as={Link} {...s.link}
to="/portal/Mipedian/Creatures"
>Mipedian</Interactive>
</div>
);
}

0
src/components/Single/Attack.js → src/components/portal/Single/Attack.js
View File

0
src/components/Single/Battlegear.js → src/components/portal/Single/Battlegear.js
View File

20
src/components/Single/Creature.js → src/components/portal/Single/Creature.js
View File

@ -2,10 +2,10 @@ 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 '../Spreadsheet';
import s from '../../styles/app.style';
import PageNotFound from '../../PageNotFound';
import UnderConstruction from '../../UnderConstruction';
import API from '../../Spreadsheet';
import s from '../../../styles/app.style';
export default class SingleCreature extends React.Component {
@ -23,8 +23,8 @@ export default class SingleCreature extends React.Component {
}
// ** Process the tribe ** //
// /collection/Creatures/{Tribe}/{Name}
// /collection/{Tribe}/Creatures/{Name}
// /portal/Creatures/{Tribe}/{Name}
// /portal/{Tribe}/Creatures/{Name}
// The first / gets counted
getData(props) {
let path = props.location.pathname.split("/");
@ -91,15 +91,15 @@ export default class SingleCreature extends React.Component {
);
const elements = card_data.gsx$elements.$t.split(/[ ,]+/).map((item, i) => {
return <img className="icon" src={"/collection/src/img/icons/elements/"+item.toLowerCase()+".png"} alt={item} key={i}></img>;
return <img className="icon" src={"/portal/src/img/icons/elements/"+item.toLowerCase()+".png"} alt={item} key={i}></img>;
});
const locations = creature.gsx$location.$t.split(/[,]+\s*/).map((item, i) => {
return <p key={i}><Interactive as={Link} {...s.link} to={"/collection/Locations/"+item}><span>{item}</span></Interactive></p>;
return <p key={i}><Interactive as={Link} {...s.link} to={"/portal/Locations/"+item}><span>{item}</span></Interactive></p>;
});
const battlegear = creature.gsx$battlegear.$t.split(/[,]+\s*/).map((item, i) => {
return <p key={i}><Interactive as={Link} {...s.link} to={"/collection/Battlegear/"+item}><span>{item}</span></Interactive></p>;
return <p key={i}><Interactive as={Link} {...s.link} to={"/portal/Battlegear/"+item}><span>{item}</span></Interactive></p>;
});
return(
@ -164,7 +164,7 @@ export default class SingleCreature extends React.Component {
<hr />
<div>
<strong>Tribe: </strong>{this.state.tribe}
<img className="icon" src={"/collection/src/img/icons/tribes/"+this.state.tribe.toLowerCase()+".png"}></img>
<img className="icon" src={"/portal/src/img/icons/tribes/"+this.state.tribe.toLowerCase()+".png"}></img>
</div>
<hr />
<div>

0
src/components/Single/Location.js → src/components/portal/Single/Location.js
View File

0
src/components/Single/Mugic.js → src/components/portal/Single/Mugic.js
View File

49
src/index.js
View File

@ -6,23 +6,44 @@ import App from './components/App';
import Home from './components/Home';
import PageNotFound from './components/PageNotFound';
import UnderConstruction from './components/UnderConstruction';
import ExampleComponent from './components/ExampleComponent';
import ExampleTwoDeepComponent from './components/ExampleTwoDeepComponent';
// import Attacks from './component/Category/Attacks';
// import Battlegear from './component/Category/Battlegear';
import Creatures from './components/Category/Creatures';
// import Locations from './component/Category/Locations';
import Mugic from './components/Category/Mugic';
import Tribes from './components/Category/Tribes';
// import SingleAttack from './component/Category/Attacks';
// import SingleBattlegear from './component/Category/Battlegear';
import SingleCreature from './components/Single/Creature';
// import SingleLocation from './component/Category/Locations';
// import SingleMugic from './component/Category/Mugic';
import CollectionHome from './components/collection/Home';
import PortalHome from './components/portal/Home';
// import Attacks from './components/portal/Category/Attacks';
// import Battlegear from './components/portal/Category/Battlegear';
import Creatures from './components/portal/Category/Creatures';
// import Locations from './components/portal/Category/Locations';
import Mugic from './components/portal/Category/Mugic';
import Tribes from './components/portal/Category/Tribes';
// import SingleAttack from './components/portal/Category/Attacks';
// import SingleBattlegear from './components/portal/Category/Battlegear';
import SingleCreature from './components/portal/Single/Creature';
// import SingleLocation from './components/portal/Category/Locations';
// import SingleMugic from './components/portal/Category/Mugic';
const routes = (
<Route path="/" component={App}>
<Route path="collection/" mapMenuTitle="Home">
<IndexRoute component={Home} />
<Route path="/" component={App} mapMenuTitle="Home">
<IndexRoute component={Home} />
{/* Test */}
<Route path="example" mapMenuTitle="Example" component={ExampleComponent}>
<Route path="two-deep" mapMenuTitle="Two Deep" component={ExampleTwoDeepComponent} />
</Route>
{/* Construction */}
<Route path="construction/" component={UnderConstruction} />
{/* Collection */}
<Route path="collection/" mapMenuTitle="Collection">
<IndexRoute component={CollectionHome} />
</Route>
{/* Portal */}
<Route path="portal/" mapMenuTitle="Portal">
<IndexRoute component={PortalHome} />
{/* Attacks */}
<Route path="Attacks" component={UnderConstruction} mapMenuTitle="Attacks">