mirror of
https://github.com/chaoticbackup/chaoticbackup.github.io.git
synced 2026-03-21 17:24:14 -05:00
Merge pull request #6 from DanudeSandstorm/master
[change] merged portal and collection into single app
This commit is contained in:
commit
aad7c92be9
4
404.html
4
404.html
|
|
@ -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(
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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",
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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
33
src/components/ExampleComponent.js
Normal 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
71
src/components/ExampleTwoDeepComponent.js
Normal 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;
|
||||
|
|
@ -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
19
src/components/collection/Home.js
Normal 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
|
||||
<a style={{textDecoration: "underline"}} href="http://www.tradecardsonline.com/im/editCollection/collection_type/1">Trade Cards Online</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -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 />
|
||||
|
|
@ -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 (
|
||||
|
|
@ -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
30
src/components/portal/Home.js
Normal 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>
|
||||
);
|
||||
}
|
||||
|
|
@ -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>
|
||||
49
src/index.js
49
src/index.js
|
|
@ -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">
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user