aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--cmd/web/Makefile2
-rw-r--r--cmd/web/js/app.js7
-rw-r--r--cmd/web/js/change_password.jsx2
-rw-r--r--cmd/web/js/header_footer.jsx78
-rw-r--r--cmd/web/js/main.jsx37
-rw-r--r--cmd/web/js/password_reset.jsx4
-rw-r--r--cmd/web/js/signin.jsx2
-rw-r--r--cmd/web/js/signup.jsx2
8 files changed, 90 insertions, 44 deletions
diff --git a/cmd/web/Makefile b/cmd/web/Makefile
index c5d5d62..85bba5b 100644
--- a/cmd/web/Makefile
+++ b/cmd/web/Makefile
@@ -4,7 +4,7 @@ export PATH := $(PATH):./node_modules/.bin
4 4
5SRC_DIR=js 5SRC_DIR=js
6BUILD_DIR=build/js 6BUILD_DIR=build/js
7JSX_SRC= main.jsx signup.jsx signin.jsx otp.jsx poloniex.jsx password_reset.jsx change_password.jsx 7JSX_SRC= header_footer.jsx main.jsx signup.jsx signin.jsx otp.jsx poloniex.jsx password_reset.jsx change_password.jsx
8JS_SRC= cookies.js app.js api.js 8JS_SRC= cookies.js app.js api.js
9STATIC_FILES= index.html style.css 9STATIC_FILES= index.html style.css
10JSX_OBJS=$(addprefix $(BUILD_DIR)/,$(JSX_SRC:.jsx=.js)) 10JSX_OBJS=$(addprefix $(BUILD_DIR)/,$(JSX_SRC:.jsx=.js))
diff --git a/cmd/web/js/app.js b/cmd/web/js/app.js
index c24a761..878878d 100644
--- a/cmd/web/js/app.js
+++ b/cmd/web/js/app.js
@@ -4,6 +4,7 @@ import cookies from './cookies.js';
4import page from 'page'; 4import page from 'page';
5import React from 'react'; 5import React from 'react';
6import ReactDOM from 'react-dom'; 6import ReactDOM from 'react-dom';
7import {Header, Footer} from './header_footer.js';
7 8
8var App = {}; 9var App = {};
9var cookieExpire = 60 * 60 * 24 * 7; 10var cookieExpire = 60 * 60 * 24 * 7;
@@ -117,7 +118,11 @@ App.mount = function(app) {
117 var root = React.createElement( 118 var root = React.createElement(
118 'div', 119 'div',
119 {className: 'container'}, 120 {className: 'container'},
120 app 121 [
122 React.createElement(Header, {key: 'header', isLoggedIn: App.isUserSignedIn()}),
123 React.createElement(React.Fragment, {key: 'app'}, app),
124 React.createElement(Footer, {key: 'footer', isLoggedIn: App.isUserSignedIn()})
125 ],
121 ); 126 );
122 127
123 ReactDOM.unmountComponentAtNode(document.getElementById('app')); 128 ReactDOM.unmountComponentAtNode(document.getElementById('app'));
diff --git a/cmd/web/js/change_password.jsx b/cmd/web/js/change_password.jsx
index aedf4af..74cde0f 100644
--- a/cmd/web/js/change_password.jsx
+++ b/cmd/web/js/change_password.jsx
@@ -47,7 +47,7 @@ class ChangePasswordForm extends React.Component {
47 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk}); 47 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk});
48 return ( 48 return (
49 <div className="row sign-in"> 49 <div className="row sign-in">
50 <div className="offset-4 col-4 col-xs-offset-1 col-xs-10 text-center"> 50 <div className="offset-1 col-10 offset-md-4 col-md-4 text-center">
51 <form role="form" onSubmit={this.handleSubmit}> 51 <form role="form" onSubmit={this.handleSubmit}>
52 <input className="form-control" type="password" placeholder="password" onChange={this.handlePasswordChange} /> 52 <input className="form-control" type="password" placeholder="password" onChange={this.handlePasswordChange} />
53 <input className="form-control submit" type="submit" value="Change password" /> 53 <input className="form-control submit" type="submit" value="Change password" />
diff --git a/cmd/web/js/header_footer.jsx b/cmd/web/js/header_footer.jsx
new file mode 100644
index 0000000..3cb9937
--- /dev/null
+++ b/cmd/web/js/header_footer.jsx
@@ -0,0 +1,78 @@
1import React from 'react';
2
3class Signout extends React.Component {
4 render = () => {
5 return <a href="/signout"><u>Logout</u></a>;
6 }
7}
8
9class Logo extends React.Component {
10 render() {
11 return <div id="logo" className="w-100 h-100 align-self-center">
12 <h1><a href="/">CryptoPF</a></h1>
13 </div>;
14 }
15}
16
17class Footer extends React.Component {
18 render = () => {
19 var elements = this.props.elements;
20 if (elements === undefined) {
21 elements = [];
22 }
23
24 if (this.props.isLoggedIn === true) {
25 elements = elements.concat(<Signout />);
26 }
27
28 if (elements.length > 0) {
29 elements = [<hr key="hr"/>].concat(elements);
30 }
31
32 var rows = elements.map(function(element, i) {
33 return <div className="row text-center" key={'footer-el-' + i}>
34 <div className="col-12">
35 {element}
36 </div>
37 </div>;
38 });
39 return <div id="footer" className="row">
40 <div className="offset-4 col-4 d-sm-none">
41 {rows}
42 </div>
43 </div>;
44 }
45}
46
47class Header extends React.Component {
48 render = () => {
49 var elements = this.props.elements;
50 if (elements === undefined) {
51 elements = [];
52 }
53
54 if (this.props.isLoggedIn === true) {
55 elements = elements.concat(<Signout />);
56 }
57
58 elements = elements.map(function(element, i) {
59 return <div className="text-center" key={'header-el-' + i}>
60 {element}
61 </div>;
62 });
63
64 return <div id="header" className="row">
65 <div className="offset-3 col-6 offset-md-4 col-md-4">
66 <Logo />
67 </div>
68 <div className="col-3 col-md-4 align-self-center h-100 d-none d-sm-flex justify-content-end">
69 {elements}
70 </div>
71 </div>;
72 }
73}
74
75export {
76 Header,
77 Footer,
78};
diff --git a/cmd/web/js/main.jsx b/cmd/web/js/main.jsx
index 909f1bd..8a4fce8 100644
--- a/cmd/web/js/main.jsx
+++ b/cmd/web/js/main.jsx
@@ -10,35 +10,6 @@ import cookies from './cookies.js';
10import React from 'react'; 10import React from 'react';
11import qs from 'qs'; 11import qs from 'qs';
12 12
13class Header extends React.Component {
14 render = () => {
15 if (this.props.displayLogout === true) {
16 return <div id="header" className="row">
17 <div className="offset-4 col-4">
18 <Logo />
19 </div>
20 <div className="offset-2 col-2 align-self-center h-100">
21 <a href="/signout"><u>Logout</u></a>
22 </div>
23 </div>;
24 }
25 return <div id="header" className="row">
26 <div className="offset-4 col-4">
27 <Logo />
28 </div>
29 </div>;
30
31 }
32}
33
34class Logo extends React.Component {
35 render() {
36 return <div id="logo" className="w-100 h-100 align-self-center">
37 <h1><a href="/">CryptoPF</a></h1>
38 </div>;
39 }
40}
41
42App.page('/signup', false, function(context) { 13App.page('/signup', false, function(context) {
43 if (App.isUserSignedIn()) { 14 if (App.isUserSignedIn()) {
44 App.go('/me'); 15 App.go('/me');
@@ -46,7 +17,6 @@ App.page('/signup', false, function(context) {
46 } 17 }
47 18
48 App.mount(<div> 19 App.mount(<div>
49 <Header />
50 <SignupForm onSuccess={App.onUserSignUp}/> 20 <SignupForm onSuccess={App.onUserSignUp}/>
51 </div>); 21 </div>);
52}); 22});
@@ -58,7 +28,6 @@ App.page('/signin', false, function(context) {
58 } 28 }
59 29
60 App.mount(<div> 30 App.mount(<div>
61 <Header />
62 <SigninForm onSuccess={App.onUserSignIn}/> 31 <SigninForm onSuccess={App.onUserSignIn}/>
63 </div>); 32 </div>);
64}); 33});
@@ -70,7 +39,6 @@ App.page('/reset-password', false, function(context) {
70 } 39 }
71 40
72 App.mount(<div> 41 App.mount(<div>
73 <Header />
74 <PasswordResetForm /> 42 <PasswordResetForm />
75 </div>); 43 </div>);
76}); 44});
@@ -89,7 +57,6 @@ App.page('/change-password', false, function(context) {
89 } 57 }
90 58
91 App.mount(<div> 59 App.mount(<div>
92 <Header />
93 <ChangePasswordForm token={token} onSuccess={App.go.bind(App, '/signin')}/> 60 <ChangePasswordForm token={token} onSuccess={App.go.bind(App, '/signin')}/>
94 </div>); 61 </div>);
95}); 62});
@@ -102,14 +69,12 @@ App.page('/signout', true, function(context) {
102 69
103App.page('/me', true, function(context) { 70App.page('/me', true, function(context) {
104 App.mount(<div> 71 App.mount(<div>
105 <Header displayLogout={true} />
106 <PoloniexController/> 72 <PoloniexController/>
107 </div>); 73 </div>);
108}); 74});
109 75
110App.page('/not_confirmed', true, function(context) { 76App.page('/not_confirmed', true, function(context) {
111 App.mount(<div> 77 App.mount(<div>
112 <Header displayLogout={true}/>
113 <div className="row"> 78 <div className="row">
114 <div className="box offset-3 col-6 text-center"> 79 <div className="box offset-3 col-6 text-center">
115 <p>Please be patient, you account is being confirmed...</p> 80 <p>Please be patient, you account is being confirmed...</p>
@@ -127,7 +92,6 @@ App.page('/otp/setup', true, function(context) {
127 } 92 }
128 93
129 App.mount(<div> 94 App.mount(<div>
130 <Header displayLogout={true}/>
131 <OtpEnrollForm onSuccess={App.onUserValidateOtp} img={'data:image/png;base64,' + data.base64img} secret={data.secret}/> 95 <OtpEnrollForm onSuccess={App.onUserValidateOtp} img={'data:image/png;base64,' + data.base64img} secret={data.secret}/>
132 </div>); 96 </div>);
133 97
@@ -136,7 +100,6 @@ App.page('/otp/setup', true, function(context) {
136 100
137App.page('/otp/validate', true, function(context) { 101App.page('/otp/validate', true, function(context) {
138 App.mount(<div> 102 App.mount(<div>
139 <Header displayLogout={true}/>
140 <OtpEnrollForm onSuccess={App.onUserValidateOtp} /> 103 <OtpEnrollForm onSuccess={App.onUserValidateOtp} />
141 </div>); 104 </div>);
142}); 105});
diff --git a/cmd/web/js/password_reset.jsx b/cmd/web/js/password_reset.jsx
index 8cbdc60..b6a10ec 100644
--- a/cmd/web/js/password_reset.jsx
+++ b/cmd/web/js/password_reset.jsx
@@ -42,7 +42,7 @@ class PasswordResetForm extends React.Component {
42 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk}); 42 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk});
43 return ( 43 return (
44 <div className="row sign-in"> 44 <div className="row sign-in">
45 <div className="offset-4 col-4 col-xs-offset-1 col-xs-10 text-center"> 45 <div className="offset-1 col-10 offset-md-4 col-md-4 text-center">
46 <form role="form" onSubmit={this.handleSubmit}> 46 <form role="form" onSubmit={this.handleSubmit}>
47 <input className="form-control" type="email" placeholder="email" onChange={this.handleEmailChange} /> 47 <input className="form-control" type="email" placeholder="email" onChange={this.handleEmailChange} />
48 <input className="form-control submit" type="submit" value="Reset" /> 48 <input className="form-control submit" type="submit" value="Reset" />
@@ -54,4 +54,4 @@ class PasswordResetForm extends React.Component {
54 } 54 }
55} 55}
56 56
57export default PasswordResetForm; \ No newline at end of file 57export default PasswordResetForm;
diff --git a/cmd/web/js/signin.jsx b/cmd/web/js/signin.jsx
index bff497e..e0e0f1d 100644
--- a/cmd/web/js/signin.jsx
+++ b/cmd/web/js/signin.jsx
@@ -44,7 +44,7 @@ class SigninForm extends React.Component {
44 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk}); 44 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk});
45 return ( 45 return (
46 <div className="row sign-in"> 46 <div className="row sign-in">
47 <div className="offset-4 col-4 col-xs-offset-1 col-xs-10 text-center"> 47 <div className="offset-1 col-10 offset-md-4 col-md-4 text-center">
48 <form role="form" onSubmit={this.handleSubmit}> 48 <form role="form" onSubmit={this.handleSubmit}>
49 <input className="form-control" type="email" placeholder="email" onChange={this.handleEmailChange} /> 49 <input className="form-control" type="email" placeholder="email" onChange={this.handleEmailChange} />
50 <input className="form-control" type="password" placeholder="password" onChange={this.handlePasswordChange} /> 50 <input className="form-control" type="password" placeholder="password" onChange={this.handlePasswordChange} />
diff --git a/cmd/web/js/signup.jsx b/cmd/web/js/signup.jsx
index affa18e..b7d9287 100644
--- a/cmd/web/js/signup.jsx
+++ b/cmd/web/js/signup.jsx
@@ -51,7 +51,7 @@ class SignupForm extends React.Component {
51 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk}); 51 var cName = classNames('form-message', {'hidden': this.state.hideMsg, 'message-ok': this.state.msgOk});
52 return ( 52 return (
53 <div className="row sign-in"> 53 <div className="row sign-in">
54 <div className="offset-4 col-4 col-xs-offset-1 col-xs-10 text-center"> 54 <div className="offset-1 col-10 offset-md-4 col-md-4 text-center">
55 <form role="form" onSubmit={this.handleSubmit}> 55 <form role="form" onSubmit={this.handleSubmit}>
56 <input className="form-control" type="email" placeholder="email" onChange={this.handleEmailChange} /> 56 <input className="form-control" type="email" placeholder="email" onChange={this.handleEmailChange} />
57 <input className="form-control" type="password" placeholder="password" onChange={this.handlePasswordChange} /> 57 <input className="form-control" type="password" placeholder="password" onChange={this.handlePasswordChange} />