Begin frontend

This commit is contained in:
Elijah Lucian
2018-03-20 22:29:00 -06:00
parent 5107775913
commit 938046c0fd
41 changed files with 10207 additions and 8 deletions

4
backend/.babelrc Normal file
View File

@@ -0,0 +1,4 @@
{
"presets": ["react"],
"plugins": ["react-hot-loader/babel"]
}

32
backend/.gitignore vendored Normal file
View File

@@ -0,0 +1,32 @@
# ---> Node
# Logs
logs
*.log
npm-debug.log*
# Runtime data
pids
*.pid
*.seed
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
# Dependency directory
# https://docs.npmjs.com/misc/faq#should-i-check-my-node-modules-folder-into-git
node_modules
# builds
dist/bundle.js

8
backend/LICENSE Normal file
View File

@@ -0,0 +1,8 @@
MIT License
Copyright (c) <year> <copyright holders>
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

1
backend/README.md Normal file
View File

@@ -0,0 +1 @@
# Hello World

11
backend/dist/index.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<html>
<head>
<title>LCARS</title>
<link rel="stylesheet" type="text/css" href="./css/dev.css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Orbitron" rel="stylesheet">
</head>
<body>
<div id="root"></div>
<script src="./bundle.js"></script>
</body>
</html>

5
backend/dist/shit/psboard.html vendored Normal file

File diff suppressed because one or more lines are too long

18
backend/dist/svg/lcarslbow.svg vendored Normal file
View File

@@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW X8 -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="16.9332mm" height="16.9332mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 1693 1693"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:#FF6600}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M1227 1087l458 0 0 196 -677 0 -555 0c-246,0 -445,-131 -445,-292l0 -580 1000 0 0 474c1,131 95,202 219,202z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 812 B

18
backend/dist/svg/ps-final.svg vendored Normal file
View File

@@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW X8 -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="10.1598mm" height="10.1598mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 1016 1016"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:black}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M744 777c-35,0 -71,0 -113,0 0,31 0,60 0,88 -25,0 -49,0 -74,0 0,-28 0,-57 0,-85 -71,0 -134,0 -205,0 0,28 0,57 0,85 -24,0 -45,0 -70,0 0,-28 0,-57 0,-85 -39,0 -74,0 -109,0 0,-24 0,-49 0,-74 165,0 331,0 497,0 0,-28 0,-53 0,-81 -166,0 -332,0 -505,0 4,-102 -3,-205 11,-300 25,-148 166,-240 321,-222 138,14 247,141 251,282 0,25 0,53 0,81 -166,0 -332,0 -501,0 0,28 0,53 0,85 165,0 328,0 497,0 0,74 0,148 0,226zm-497 -388c141,0 278,0 419,0 -3,-85 -35,-148 -105,-187 -75,-43 -149,-39 -219,3 -64,43 -95,103 -95,184z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

18
backend/dist/svg/ps.svg vendored Normal file
View File

@@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW X8 -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="10.1598mm" height="10.1598mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 1016 1016"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:#F8F23A}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M876 885c-45,0 -90,0 -144,0 0,40 0,76 0,113 -32,0 -64,0 -95,0 0,-37 0,-73 0,-109 -91,0 -172,0 -262,0 0,36 0,72 0,109 -32,0 -59,0 -91,0 0,-37 0,-73 0,-109 -49,0 -95,0 -140,0 0,-32 0,-63 0,-95 213,0 425,0 637,0 0,-36 0,-68 0,-104 -212,0 -424,0 -646,0 5,-131 -4,-262 14,-384 31,-190 212,-307 411,-285 176,18 316,181 321,362 0,31 0,68 0,104 -213,0 -425,0 -642,0 0,36 0,68 0,108 212,0 420,0 637,0 0,95 0,190 0,290zm-637 -498c181,0 357,0 538,0 -5,-108 -45,-189 -136,-239 -95,-54 -189,-50 -280,4 -81,55 -122,131 -122,235z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

5192
backend/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

28
backend/package.json Normal file
View File

@@ -0,0 +1,28 @@
{
"name": "helloworld",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node server.js",
"build": "webpack",
"dev": "webpack-dev-server"
},
"author": "",
"devDependencies": {
"babel-core": "^6.25.0",
"babel-loader": "^7.0.0",
"babel-preset-react": "^6.24.1",
"react-hot-loader": "^3.0.0-beta.6",
"webpack": "^3.0.0",
"webpack-dev-server": "^2.5.0"
},
"dependencies": {
"ajv-keywords": "^2.1.0",
"cheerio": "^1.0.0-rc.1",
"express": "^4.15.3",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"request": "^2.81.0"
}
}

66
backend/server.js Normal file
View File

@@ -0,0 +1,66 @@
const request = require('request');
const cheerio = require('cheerio');
const express = require('express')
const app = express()
app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
next();
});
app.use('/', express.static('dist'))
app.use('/psboard', express.static('dist/shit/psboard.html'))
app.get('/hello', (req, res) => {
res.send('Hello World!')
})
app.get('/api/data/psboard', (req, res) => {
request('http://localhost:3000/psboard', (error, response, html) => {
if (!error && response.statusCode == 200) {
const $ = cheerio.load(html);
let psboard = [];
$('.F0XO1GC-p-w').children().each((i, elem) => {
psboard[i] = {
subject: $(elem).find('.F0XO1GC-p-Q').text(),
author: $(elem).find('.F0XO1GC-rb-b').text(),
last_update: $(elem).find('.F0XO1GC-rb-g').children().attr('title'),
number_of_posts: $(elem).find('.F0XO1GC-rb-r').eq(0).text(),
number_of_views: $(elem).find('.F0XO1GC-rb-r').eq(1).text(),
user_pic: $(elem).find('.gwt-Image').attr('src')
}
});
console.log('sending psboard');
res.setHeader('Content-Type', 'application/json');
res.send(psboard);
}
})
})
app.get('/api/data/classes', (req, res) => {
request('https://my.protospace.ca/school', (error, response, html) => {
if (!error && response.statusCode == 200) {
const $ = cheerio.load(html);
let classes = [];
$('table.grid tbody tr').each((i, elem) => {
classes[i] = {
subject: $(elem).children().eq(0).text(),
date: $(elem).children().eq(2).text(),
available: $(elem).children().eq(6).text()
}
});
res.setHeader('Content-Type', 'application/json');
res.send(classes);
}
});
})
app.listen(3000, function () {
console.log('Example app listening on port 3000!')
})

24
backend/src/InfoLeft.js Normal file
View File

@@ -0,0 +1,24 @@
import React, { Component } from 'react';
// import logo from './svg/ps-final.svg';
class InfoLeft extends Component {
render(){
return(
<div className="infoLeft">
<div className="leftTop"><img src='./svg/ps.svg' alt="brotospace LCARS" className="logo"/></div>
<div className="leftInfo">
<div className="leftItem">make doubl</div>
<div className="leftItem">width like</div>
<div className="leftItem">in that</div>
<div className="leftItem">lcars pic</div>
<div className="leftItem">INSERT CLOCK HERE</div>
<div className="leftItem">here</div>
<div className="leftItem">yet</div>
<div className="leftItem">though</div>
</div>
</div>
);
}
}
export default InfoLeft;

21
backend/src/LCARSLeft.js Normal file
View File

@@ -0,0 +1,21 @@
import React, { Component } from 'react';
class LCARSLeft extends Component {
render(){
return(
<div className="lcarsLeft">
<div className="lcarsLeftItemBig">SYS DIRECTORY</div>
<div className="lcarsLeftItem">AUX DIRECTORY</div>
<div className="lcarsLeftItem">MED DIRECTORY</div>
<div className="lcarsLeftItem">COMMUNICATIONS</div>
<div className="lcarsLeftItemBig">SCI DIRECTORY</div>
<div className="lcarsLeftItem">ENG DIRECTORY</div>
<div className="lcarsLeftItem">STELLAR CHART</div>
<div className="lcarsLeftItem">PERSONNEL</div>
<div className="lcarsLeftItemMed">DATABASE</div>
</div>
);
}
}
export default LCARSLeft;

16
backend/src/LeftColumn.js Normal file
View File

@@ -0,0 +1,16 @@
import React, { Component } from 'react';
import LCARSLeft from './LCARSLeft';
import InfoLeft from './InfoLeft';
class LeftColumn extends Component {
render(){
return(
<div className="leftColumn">
<InfoLeft />
<LCARSLeft />
</div>
);
}
}
export default LeftColumn;

View File

@@ -0,0 +1,28 @@
import React, { Component } from 'react';
class RightBottom extends Component {
render(){
return(
<div className="rightBottom">
<div className="lcarsMiddleBottom">
<div className="lcarsMiddleElbow">Lcars Elbow</div>
<div className="lcarsMiddleItem">Lcars item</div>
<div className="lcarsMiddleItem">Lcars item</div>
<div className="lcarsMiddleItem">Lcars item</div>
</div>
<div className="dataBottomRight">
<div className="lcarsHorizontalBottom">lcars horiz</div>
<div className="dataRightLower">
Shit.
</div>
</div>
</div>
);
}
}
export default RightBottom;

View File

@@ -0,0 +1,16 @@
import React, { Component } from 'react';
import RightTop from './RightTop';
import RightBottom from './RightBottom';
class RightContainer extends Component {
render(){
return(
<div className="rightContainer">
<RightTop />
<RightBottom />
</div>
);
}
}
export default RightContainer;

24
backend/src/RightTop.js Normal file
View File

@@ -0,0 +1,24 @@
import React, { Component } from 'react';
class RightTop extends Component {
render(){
return(
<div className="rightTop">
<div className="lcarsMiddleTop">
<div className="lcarsMiddleItem">Lcars item</div>
<div className="lcarsMiddleItem">Lcars item</div>
<div className="lcarsMiddleItem">Lcars item</div>
<div className="lcarsMiddleElbow">Lcars Elbow</div>
</div>
<div className="dataTopRight">
<div className="datatopRightUpper">Main Data</div>
<div className="lcarsHorizontalTop">lcars horiz</div>
</div>
</div>
);
}
}
export default RightTop;

67
backend/src/app.js Normal file
View File

@@ -0,0 +1,67 @@
import React from 'react';
import LeftColumn from './LeftColumn';
import RightContainer from './RightContainer';
const SERVER_URL = 'http://localhost:3000/'
export default class Site extends React.Component {
constructor(props) {
super(props)
this.state = {
classesData: [],
forumPosts: [],
componentMounted: false
}
}
callAPI = (targetUrl) => {
let apiData
fetch(SERVER_URL + 'api/data/'+ targetUrl)
.then(response => response.json())
.then(data => apiData = data)
return apiData
}
componentDidMount() {
object = {
classes:
}
let classesData = callAPI('classes')
let forumPosts = callAPI('psboard')
this.setState({
classesData: classesData,
forumPosts: forumPosts
})
}
// <LeftColumn />}
// <RightContainer />
render() {
console.log(this.state)
return (
<div className="mainContainer">
<div className="left">
<div className="heading">Upcoming Classes</div>
{this.state.classesData.map((item, i) =>
<div className='course-list'>
<div className='subject'>{item.subject}</div>
<div className='date'>{item.date}</div>
</div>)}
</div>
<div className="right">
<div className="heading">Posts</div>
</div>
</div>
);
}
}

22
backend/src/index.js Normal file
View File

@@ -0,0 +1,22 @@
import React from 'react';
import ReactDOM from 'react-dom';
import 'react-hot-loader/patch';
import { AppContainer } from 'react-hot-loader';
import App from './app';
const render = Component => {
ReactDOM.render(
<AppContainer>
<App />
</AppContainer>,
document.getElementById('root')
)
}
render(App)
if (module.hot) {
module.hot.accept('./app', () => { render(App) })
}

View File

@@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW X8 -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="10.1598mm" height="10.1598mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 1016 1016"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:#F8F23A}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M744 777c-35,0 -71,0 -113,0 0,31 0,60 0,88 -25,0 -49,0 -74,0 0,-28 0,-57 0,-85 -71,0 -134,0 -205,0 0,28 0,57 0,85 -24,0 -45,0 -70,0 0,-28 0,-57 0,-85 -39,0 -74,0 -109,0 0,-24 0,-49 0,-74 165,0 331,0 497,0 0,-28 0,-53 0,-81 -166,0 -332,0 -505,0 4,-102 -3,-205 11,-300 25,-148 166,-240 321,-222 138,14 247,141 251,282 0,25 0,53 0,81 -166,0 -332,0 -501,0 0,28 0,53 0,85 165,0 328,0 497,0 0,74 0,148 0,226zm-497 -388c141,0 278,0 419,0 -3,-85 -35,-148 -105,-187 -75,-43 -149,-39 -219,3 -64,43 -95,103 -95,184z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

27
backend/webpack.config.js Normal file
View File

@@ -0,0 +1,27 @@
const path = require('path');
const webpack = require('webpack');
module.exports = {
entry: './src/index.js',
plugins: [
new webpack.HotModuleReplacementPlugin(),
],
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist'),
publicPath: '/'
},
module: {
rules: [
{ test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }
]
},
stats: "normal",
devServer: {
contentBase: path.join(__dirname, "dist"),
publicPath: '/',
hot: true,
host: '0.0.0.0',
disableHostCheck: true
},
};