mirror of
https://github.com/chaoticbackup/chaoticbackup.github.io.git
synced 2026-04-26 01:02:54 -05:00
refactoring database setup
This commit is contained in:
parent
707e8df333
commit
0680703c5c
|
|
@ -5,6 +5,7 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>Chaotic Backup</title>
|
<title>Chaotic Backup</title>
|
||||||
<meta name="description" content="Chaotic Backup">
|
<meta name="description" content="Chaotic Backup">
|
||||||
|
<link rel="stylesheet" type="text/css" href="/src/css/legacy.css">
|
||||||
<style>
|
<style>
|
||||||
html, body, div, span, a, p, ul, li, h1, code, nav {
|
html, body, div, span, a, p, ul, li, h1, code, nav {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
@ -85,7 +86,6 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
<!-- single page app in bundle.js -->
|
|
||||||
<script src="/build/bundle.js"></script>
|
<script src="/build/bundle.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "chaoticbackup",
|
"name": "chaoticbackup",
|
||||||
"version": "1.0.1",
|
"version": "1.1.0",
|
||||||
"description": "Chaotic Backup",
|
"description": "Chaotic Backup",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "webpack-dev-server -d --inline --host 0.0.0.0 --history-api-fallback --progress",
|
"start": "webpack-dev-server -d --inline --host 0.0.0.0 --history-api-fallback --progress",
|
||||||
|
|
@ -32,6 +32,7 @@
|
||||||
"babel-eslint": "^8.0.0",
|
"babel-eslint": "^8.0.0",
|
||||||
"babel-loader": "^6.2.10",
|
"babel-loader": "^6.2.10",
|
||||||
"babel-plugin-transform-decorators-legacy": "^1.3.4",
|
"babel-plugin-transform-decorators-legacy": "^1.3.4",
|
||||||
|
"babel-polyfill": "^6.26.0",
|
||||||
"babel-preset-es2015": "^6.18.0",
|
"babel-preset-es2015": "^6.18.0",
|
||||||
"babel-preset-react": "^6.16.0",
|
"babel-preset-react": "^6.16.0",
|
||||||
"babel-preset-stage-1": "^6.16.0",
|
"babel-preset-stage-1": "^6.16.0",
|
||||||
|
|
|
||||||
|
|
@ -60,8 +60,8 @@ class API {
|
||||||
|
|
||||||
setupDB() {
|
setupDB() {
|
||||||
try {
|
try {
|
||||||
this.portal = new CollectionDB(this);
|
this.portal = new CollectionDB(this, 'portal');
|
||||||
this.cards = new CollectionDB(this);
|
this.cards = new CollectionDB(this, 'cards');
|
||||||
}
|
}
|
||||||
catch (err) {
|
catch (err) {
|
||||||
console.log('setting up database failed', err);
|
console.log('setting up database failed', err);
|
||||||
|
|
@ -91,20 +91,41 @@ class API {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Input format
|
||||||
|
// [{cards: 'attacks'}, {portal: 'attacks'}]
|
||||||
|
async buildCollection(input) {
|
||||||
|
return await Promise.all(input.map((item) => {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
if ('cards' in item) {
|
||||||
|
// console.log(this.cards[item.cards].data);
|
||||||
|
return this.cards.setupType(item.cards, resolve);
|
||||||
|
}
|
||||||
|
if ('portal' in item) {
|
||||||
|
// console.log(this.portal[item.portal].data);
|
||||||
|
return this.portal.setupType(item.portal, resolve);
|
||||||
|
}
|
||||||
|
console.log('cards or portal');
|
||||||
|
return reject();
|
||||||
|
});
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default API.getInstance();
|
export default API.getInstance();
|
||||||
|
|
||||||
// export default new API();
|
|
||||||
|
|
||||||
class CollectionDB {
|
class CollectionDB {
|
||||||
@observable built = []; // Keeps track of what collections have been populated
|
// Keeps track of what collections have been populated
|
||||||
|
@observable built = [];
|
||||||
|
building = [];
|
||||||
|
|
||||||
constructor(API) {
|
constructor(API, format) {
|
||||||
this.api = API;
|
this.api = API;
|
||||||
// ignoring persistence for now
|
this.format = format;
|
||||||
// this.setupDB();
|
this.setupDB();
|
||||||
//autorun(() => console.log(this.creatures));
|
}
|
||||||
|
|
||||||
|
setupDB() {
|
||||||
let db = new loki("chaotic_portal.db");
|
let db = new loki("chaotic_portal.db");
|
||||||
this.attacks = db.addCollection('attacks');
|
this.attacks = db.addCollection('attacks');
|
||||||
this.battlegear = db.addCollection('battlegear');
|
this.battlegear = db.addCollection('battlegear');
|
||||||
|
|
@ -112,9 +133,10 @@ class CollectionDB {
|
||||||
this.locations = db.addCollection('locations');
|
this.locations = db.addCollection('locations');
|
||||||
this.mugic = db.addCollection('mugic');
|
this.mugic = db.addCollection('mugic');
|
||||||
this.db = db;
|
this.db = db;
|
||||||
}
|
|
||||||
|
|
||||||
// setupDB() {
|
// ignoring persistence for now
|
||||||
|
//autorun(() => console.log(this.creatures));
|
||||||
|
|
||||||
// var self = this;
|
// var self = this;
|
||||||
// let db = new loki("chaotic_portal.db", { autosave: true, autoload: true, autoloadCallback: databaseInitialize, autosaveInterval: 4000, persistenceMethod: 'localStorage' });
|
// let db = new loki("chaotic_portal.db", { autosave: true, autoload: true, autoloadCallback: databaseInitialize, autosaveInterval: 4000, persistenceMethod: 'localStorage' });
|
||||||
// this.db = db;
|
// this.db = db;
|
||||||
|
|
@ -142,7 +164,7 @@ class CollectionDB {
|
||||||
// entries = db.addCollection("mugic");
|
// entries = db.addCollection("mugic");
|
||||||
// self.mugic = entries;
|
// self.mugic = entries;
|
||||||
// };
|
// };
|
||||||
// }
|
}
|
||||||
|
|
||||||
setup(spreadsheet, type, callback) {
|
setup(spreadsheet, type, callback) {
|
||||||
this.api.getSpreadsheet(spreadsheet, (data) => {
|
this.api.getSpreadsheet(spreadsheet, (data) => {
|
||||||
|
|
@ -158,6 +180,20 @@ class CollectionDB {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// example format
|
||||||
|
// this.setup(this.api.urls.Attacks["portal"], "Attack", (data) => {});
|
||||||
|
async setupType(type, resolve) {
|
||||||
|
let uc_type = type.charAt(0).toUpperCase() + type.slice(1);
|
||||||
|
|
||||||
|
console.log(type, uc_type, this.format);
|
||||||
|
|
||||||
|
// this.setup(this.api.urls[uc_type][this.format], uc_type, (data) => {
|
||||||
|
// this[type].insert(data);
|
||||||
|
// this.built.push(type);
|
||||||
|
// }
|
||||||
|
resolve();
|
||||||
|
}
|
||||||
|
|
||||||
setupAttacks(type="portal") {
|
setupAttacks(type="portal") {
|
||||||
this.setup(this.api.urls.Attacks[type], "Attack", (data) => {
|
this.setup(this.api.urls.Attacks[type], "Attack", (data) => {
|
||||||
this.attacks.insert(data);
|
this.attacks.insert(data);
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { render } from 'react-dom';
|
import { render } from 'react-dom';
|
||||||
import { BrowserRouter as Router, Link, Route } from 'react-router-dom';
|
import { BrowserRouter as Router, Link, Route, withRouter } from 'react-router-dom';
|
||||||
import {observer, inject} from 'mobx-react';
|
import {observer, inject} from 'mobx-react';
|
||||||
import s from '../styles/app.style';
|
import s from '../styles/app.style';
|
||||||
|
|
||||||
|
|
@ -11,11 +11,11 @@ import Collection from './collection/index';
|
||||||
import Portal from './portal/index';
|
import Portal from './portal/index';
|
||||||
import Home from './Home';
|
import Home from './Home';
|
||||||
|
|
||||||
|
const BlockAvoider = withRouter(Base)
|
||||||
|
|
||||||
render(
|
render(
|
||||||
<Router>
|
<Router>
|
||||||
<div>
|
<BlockAvoider />
|
||||||
<Route path="*" component={Base}/>
|
|
||||||
</div>
|
|
||||||
</Router>
|
</Router>
|
||||||
, document.getElementById('root'),
|
, document.getElementById('root'),
|
||||||
);
|
);
|
||||||
|
|
@ -42,7 +42,6 @@ function Base(props) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<link rel="stylesheet" type="text/css" href="/src/css/legacy.css" />
|
|
||||||
<div className="fix-pgBkgrnd-repeat-x">
|
<div className="fix-pgBkgrnd-repeat-x">
|
||||||
<div className={"fix-img-bkgrnd fix-img-bkgrnd_"+bkgrnd}></div>
|
<div className={"fix-img-bkgrnd fix-img-bkgrnd_"+bkgrnd}></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import Interactive from 'react-interactive';
|
import Interactive from 'react-interactive';
|
||||||
import { Link, Route } from 'react-router-dom';
|
import { Link, Route } from 'react-router-dom';
|
||||||
|
import {observable} from 'mobx';
|
||||||
import {observer, inject} from 'mobx-react';
|
import {observer, inject} from 'mobx-react';
|
||||||
import s from '../../../styles/app.style';
|
import s from '../../../styles/app.style';
|
||||||
import API from '../../SpreadsheetData';
|
import API from '../../SpreadsheetData';
|
||||||
|
|
@ -8,6 +9,7 @@ import Attack from '../Single/Attack';
|
||||||
|
|
||||||
@inject((stores, props, context) => props) @observer
|
@inject((stores, props, context) => props) @observer
|
||||||
export default class Attacks extends React.Component {
|
export default class Attacks extends React.Component {
|
||||||
|
@observable loaded = false;
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|
||||||
|
|
@ -30,9 +32,15 @@ export default class Attacks extends React.Component {
|
||||||
return (<span>Loading...</span>);
|
return (<span>Loading...</span>);
|
||||||
}
|
}
|
||||||
|
|
||||||
const attacks = API.portal.attacks.data;
|
if (this.loaded == false) {
|
||||||
|
API.buildCollection([{'cards': 'attacks'}, {'portal': 'attacks'}])
|
||||||
|
.then(() => {
|
||||||
|
this.loaded = true;
|
||||||
|
});
|
||||||
|
return (<span>Loading...</span>);
|
||||||
|
}
|
||||||
|
|
||||||
const output = attacks.map((attack, i) => {
|
const output = API.portal.attacks.data.map((attack, i) => {
|
||||||
const card_data = API.cards.attacks.findOne({'gsx$name': attack.gsx$name});
|
const card_data = API.cards.attacks.findOne({'gsx$name': attack.gsx$name});
|
||||||
return (
|
return (
|
||||||
<div key={i}>
|
<div key={i}>
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@ import webpack from 'webpack';
|
||||||
import path from 'path';
|
import path from 'path';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
entry: `${__dirname}/src/components/index.js`,
|
entry: ['babel-polyfill', `${__dirname}/src/components/index.js`],
|
||||||
output: {
|
output: {
|
||||||
path: `${__dirname}/build`,
|
path: `${__dirname}/build`,
|
||||||
publicPath: '/build/',
|
publicPath: '/build/',
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user