add structure for new targets page
parent
3e2c750cf9
commit
8490b58ed1
|
@ -1,6 +1,6 @@
|
||||||
module.exports = {
|
module.exports = {
|
||||||
show: function (req, res) {
|
show: function (req, res) {
|
||||||
res.view('pages/temp', {
|
res.view('pages/targets', {
|
||||||
email: req.user.email
|
email: req.user.email
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
|
@ -9,6 +9,6 @@ module.exports = function (req, res, next) {
|
||||||
if (req.session.authenticated) {
|
if (req.session.authenticated) {
|
||||||
return next()
|
return next()
|
||||||
}
|
}
|
||||||
res.status(403).json({ error: 'You are not permitted to perform this action.' })
|
// res.status(403).json({ error: 'You are not permitted to perform this action.' })
|
||||||
// res.redirect('/login')
|
res.redirect('/login')
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,68 @@
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
import React from 'react'
|
||||||
|
import ReactDOM from 'react-dom'
|
||||||
|
import Progress from './components/Progress'
|
||||||
|
import UriListItem from './containers/UriListItem'
|
||||||
|
|
||||||
|
import '../styles/targets.scss'
|
||||||
|
|
||||||
|
class App extends React.Component {
|
||||||
|
constructor () {
|
||||||
|
super()
|
||||||
|
this.state = {
|
||||||
|
error: '',
|
||||||
|
user: {
|
||||||
|
email: '',
|
||||||
|
password: ''
|
||||||
|
},
|
||||||
|
working: false
|
||||||
|
}
|
||||||
|
|
||||||
|
this.dispatch = this.dispatch.bind(this)
|
||||||
|
this.getRegisteredUris = this.getRegisteredUris.bind(this)
|
||||||
|
}
|
||||||
|
dispatch (action) {
|
||||||
|
if (!action) throw new Error('dispatch: missing action')
|
||||||
|
if (action instanceof Function) {
|
||||||
|
action(this.dispatch, () => this.state)
|
||||||
|
} else {
|
||||||
|
const changes = reducer(this.state, action)
|
||||||
|
if (!changes || !Object.keys(changes).length) return
|
||||||
|
this.setState({
|
||||||
|
...changes
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
getRegisteredUris () {
|
||||||
|
return [1, 2, 3].map((item, i) => {
|
||||||
|
return (<UriListItem key={i} />)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
render () {
|
||||||
|
return (
|
||||||
|
<div className='root-container flex-container'>
|
||||||
|
<aside className='nav nav-left'>
|
||||||
|
<header>
|
||||||
|
<h1>RoE</h1>
|
||||||
|
</header>
|
||||||
|
</aside>
|
||||||
|
<section className='content flex'>
|
||||||
|
<Progress bound />
|
||||||
|
<header className='flex-container'>
|
||||||
|
<div className='flex'>
|
||||||
|
<h1>Push URIs</h1>
|
||||||
|
<h2>Newly published books will be sent to these addresses.</h2>
|
||||||
|
</div>
|
||||||
|
<button className='btn'>New address</button>
|
||||||
|
</header>
|
||||||
|
<ul className='list'>
|
||||||
|
{this.getRegisteredUris()}
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ReactDOM.render(<App />, document.getElementById('root'))
|
|
@ -0,0 +1,34 @@
|
||||||
|
@import 'lib/default';
|
||||||
|
@import 'shared/twopanels';
|
||||||
|
|
||||||
|
.nav {
|
||||||
|
header {
|
||||||
|
height: 50px;
|
||||||
|
line-height: 50px;
|
||||||
|
padding: 0 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
padding: 14px 14px 42px 14px;
|
||||||
|
|
||||||
|
header {
|
||||||
|
h1 {
|
||||||
|
text-shadow: 1px 1px 2px $black-3;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-top: 4px;
|
||||||
|
color: $text-dark-2;
|
||||||
|
text-shadow: 1px 1px 2px $black-4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list {
|
||||||
|
margin: 14px 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,17 @@
|
||||||
|
<% var key, item %>
|
||||||
|
<% htmlWebpackPlugin.options.links = htmlWebpackPlugin.options.links || [] %>
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>RoE - Push Targets</title>
|
||||||
|
<% for (item of htmlWebpackPlugin.options.links) {
|
||||||
|
if (typeof item === 'string' || item instanceof String) { item = { href: item, rel: 'stylesheet' } } %>
|
||||||
|
<link<% for (key in item) { %> <%= key %>="<%= item[key] %>"<% } %> /><%
|
||||||
|
} %>
|
||||||
|
<meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, minimum-scale=1, user-scalable=no" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="root"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1 @@
|
||||||
|
<%- partial('../../.tmp/public/targets.html') %>
|
|
@ -1,2 +0,0 @@
|
||||||
authed: <%- email %><br />
|
|
||||||
<a href="/logout">Logout</a>
|
|
|
@ -9,7 +9,8 @@ module.exports = (env, argv) => {
|
||||||
return {
|
return {
|
||||||
mode: mode || 'development',
|
mode: mode || 'development',
|
||||||
entry: {
|
entry: {
|
||||||
login: './assets/js/login.js'
|
login: './assets/js/login.js',
|
||||||
|
targets: './assets/js/targets.js'
|
||||||
},
|
},
|
||||||
output: {
|
output: {
|
||||||
path: path.join(__dirname, '/.tmp/public'),
|
path: path.join(__dirname, '/.tmp/public'),
|
||||||
|
@ -36,7 +37,14 @@ module.exports = (env, argv) => {
|
||||||
new HtmlWebpackPlugin({
|
new HtmlWebpackPlugin({
|
||||||
template: 'assets/templates/login.html',
|
template: 'assets/templates/login.html',
|
||||||
links: mode === 'production' ? [{ rel: 'stylesheet', type: 'text/css', href: 'login.css' }] : [],
|
links: mode === 'production' ? [{ rel: 'stylesheet', type: 'text/css', href: 'login.css' }] : [],
|
||||||
filename: path.join(__dirname, '/.tmp/public/login.html')
|
filename: path.join(__dirname, '/.tmp/public/login.html'),
|
||||||
|
chunks: ['login']
|
||||||
|
}),
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: 'assets/templates/targets.html',
|
||||||
|
links: mode === 'production' ? [{ rel: 'stylesheet', type: 'text/css', href: 'targets.css' }] : [],
|
||||||
|
filename: path.join(__dirname, '/.tmp/public/targets.html'),
|
||||||
|
chunks: ['targets']
|
||||||
}),
|
}),
|
||||||
new MiniCssExtractPlugin({
|
new MiniCssExtractPlugin({
|
||||||
filename: '[name].css'
|
filename: '[name].css'
|
||||||
|
|
Loading…
Reference in New Issue