List classes and dummy forum data
This commit is contained in:
parent
9e88608877
commit
5107775913
99
dist/css/dev.css
vendored
Normal file
99
dist/css/dev.css
vendored
Normal file
|
@ -0,0 +1,99 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'LCARS';
|
||||||
|
src: url('./fonts/lcarsgtj3-webfont.eot');
|
||||||
|
src: url('./fonts/lcars.ttf') format('embedded-opentype'), url('/fonts/lcars.ttf') format('truetype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'LCARS Lower';
|
||||||
|
src: url('/web/20160330232832im_/http://lcarssdk.org/lcarssdk/fonts/lcarsunknown.eot');
|
||||||
|
src: url('/web/20160330232832im_/http://lcarssdk.org/lcarssdk/fonts/lcarsunknown.eot#iefix') format('embedded-opentype'), url('/web/20160330232832im_/http://lcarssdk.org/lcarssdk/fonts/lcarsunknown.ttf') format('truetype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'LCARS Block';
|
||||||
|
src: url('/web/20160330232832im_/http://lcarssdk.org/lcarssdk/fonts/LCARS-Block.eot');
|
||||||
|
src: url('/web/20160330232832im_/http://lcarssdk.org/lcarssdk/fonts/LCARS-Block.eot#iefix') format('embedded-opentype'), url('/web/20160330232832im_/http://lcarssdk.org/lcarssdk/fonts/LCARS-Block.ttf') format('truetype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
:root{
|
||||||
|
--space1: 5px;
|
||||||
|
--textpadding1: 5px 10px;
|
||||||
|
--regText: 'Open Sans', sans-serif;
|
||||||
|
--fancyText: 'LCARS', sans-serif;
|
||||||
|
--hoverBack: #cdf;
|
||||||
|
--hoverText: #821;
|
||||||
|
--lcarsFirst: #cc6699;
|
||||||
|
--lcarsSecond: #ff9933;
|
||||||
|
--lcarsThird: #99ccff;
|
||||||
|
--lcarsGrey: #171113;
|
||||||
|
--lcarsMid: #241721;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
html, body{
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
background: var(--lcarsGrey);
|
||||||
|
color:#fff;
|
||||||
|
font-family: var(--fancyText);
|
||||||
|
|
||||||
|
font-size:1.4em;
|
||||||
|
letter-spacing: 0.05em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,h2,h3,h4,h5 {
|
||||||
|
letter-spacing: 0.05em;
|
||||||
|
font-family: var(--regText);
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin: 0.5em;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Layout Related */
|
||||||
|
|
||||||
|
.mainContainer{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
flex: 4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
flex: 5;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Other Shit */
|
||||||
|
|
||||||
|
.heading {
|
||||||
|
margin: 1em;
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-list {
|
||||||
|
margin: 2em;
|
||||||
|
border-radius: 0.6em;
|
||||||
|
border: 1px solid var(--lcarsMid);
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subject {
|
||||||
|
font-family: var(--regText);
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-size: 0.7em;
|
||||||
|
color: var(--lcarsSecond);
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-list:hover {
|
||||||
|
background: var(--lcarsMid);
|
||||||
|
color: var(--hoverBack);
|
||||||
|
}
|
2
dist/index.html
vendored
2
dist/index.html
vendored
|
@ -1,7 +1,7 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>LCARS</title>
|
<title>LCARS</title>
|
||||||
<link rel="stylesheet" type="text/css" href="./css/main.css">
|
<link rel="stylesheet" type="text/css" href="./css/dev.css">
|
||||||
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Orbitron" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Orbitron" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
5
dist/shit/psboard.html
vendored
Normal file
5
dist/shit/psboard.html
vendored
Normal file
File diff suppressed because one or more lines are too long
2109
package-lock.json
generated
2109
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
31
server.js
31
server.js
|
@ -3,12 +3,42 @@ const cheerio = require('cheerio');
|
||||||
const express = require('express')
|
const express = require('express')
|
||||||
const app = 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('/', express.static('dist'))
|
||||||
|
app.use('/psboard', express.static('dist/shit/psboard.html'))
|
||||||
|
|
||||||
app.get('/hello', (req, res) => {
|
app.get('/hello', (req, res) => {
|
||||||
res.send('Hello World!')
|
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')
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
res.setHeader('Content-Type', 'application/json');
|
||||||
|
res.send(psboard);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
app.get('/api/data/classes', (req, res) => {
|
app.get('/api/data/classes', (req, res) => {
|
||||||
request('https://my.protospace.ca/school', (error, response, html) => {
|
request('https://my.protospace.ca/school', (error, response, html) => {
|
||||||
if (!error && response.statusCode == 200) {
|
if (!error && response.statusCode == 200) {
|
||||||
|
@ -29,6 +59,7 @@ app.get('/api/data/classes', (req, res) => {
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
app.listen(3000, function () {
|
app.listen(3000, function () {
|
||||||
console.log('Example app listening on port 3000!')
|
console.log('Example app listening on port 3000!')
|
||||||
})
|
})
|
||||||
|
|
|
@ -14,7 +14,11 @@ class RightBottom extends Component {
|
||||||
|
|
||||||
<div className="dataBottomRight">
|
<div className="dataBottomRight">
|
||||||
<div className="lcarsHorizontalBottom">lcars horiz</div>
|
<div className="lcarsHorizontalBottom">lcars horiz</div>
|
||||||
<div className="dataRightLower">Main Data</div>
|
<div className="dataRightLower">
|
||||||
|
|
||||||
|
Shit.
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
36
src/app.js
36
src/app.js
|
@ -1,21 +1,49 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import LeftColumn from './LeftColumn';
|
import LeftColumn from './LeftColumn';
|
||||||
import RightContainer from './RightContainer';
|
import RightContainer from './RightContainer';
|
||||||
|
const SERVER_URL = 'http://localhost:3000/'
|
||||||
|
|
||||||
export default class Site extends React.Component {
|
export default class Site extends React.Component {
|
||||||
|
|
||||||
constructor(props){
|
constructor(props){
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
this.state = {};
|
this.state = {
|
||||||
|
classesData: [],
|
||||||
|
componentMounted: false
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
fetch(SERVER_URL + 'api/data/classes')
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => this.setState({classesData: data}))
|
||||||
|
}
|
||||||
|
|
||||||
|
// <LeftColumn />}
|
||||||
|
// <RightContainer />
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|
||||||
|
console.log(this.state)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mainContainer">
|
<div className="mainContainer">
|
||||||
<LeftColumn />
|
|
||||||
<RightContainer />
|
<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>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user