Account information panel.

[perso/Immae/Projets/Cryptomonnaies/Cryptoportfolio/Front.git] / cmd / web / js / main.jsx

diff --git a/cmd/web/js/main.jsx b/cmd/web/js/main.jsx
index eb530577fa2ae53e4a075cde960f109fea702d19..7fa2d2601c2331b896c47e520431ba6634a69104 100644 (file)
--- a/cmd/web/js/main.jsx
+++ b/cmd/web/js/main.jsx
@@ -1,18 +1,15 @@
-var SignupForm    = require('./signup.js').SignupForm;
-var SigninForm    = require('./signin.js').SigninForm;
-var OtpEnrollForm = require('./otp.js').OtpEnrollForm;
-var PoloniexForm  = require('./poloniex.js').PoloniexForm;
-var App           = require('./app.js');
-var Api           = require('./api.js').Api;
-var cookies       = require('./cookies.js');
-
-var Logo = React.createClass({
-  render: function() {
-    return (<div id='logo'>
-              <a href='/'>Cryptoportfolio</a>
-            </div>);
-  }
-});
+import SignupForm from './signup.js';
+import SigninForm from './signin.js';
+import PasswordResetForm from './password_reset.js';
+import ChangePasswordForm from './change_password.js';
+import OtpEnrollForm from './otp.js';
+import PoloniexController from './poloniex.js';
+import UserAccount from './account.js';
+import App from './app.js';
+import Api from './api.js';
+import cookies from './cookies.js';
+import React from 'react';
+import qs from 'qs';
 
 App.page('/signup', false, function(context) {
   if (App.isUserSignedIn()) {
@@ -20,12 +17,9 @@ App.page('/signup', false, function(context) {
     return;
   }
 
-  App.mount(
-    <div>
-      <Logo />
+  App.mount(<div>
       <SignupForm onSuccess={App.onUserSignUp}/>
-    </div>
-  );
+    </div>);
 });
 
 App.page('/signin', false, function(context) {
@@ -34,11 +28,58 @@ App.page('/signin', false, function(context) {
     return;
   }
 
-  App.mount(
-    <div>
-      <Logo />
+  App.mount(<div>
       <SigninForm onSuccess={App.onUserSignIn}/>
-    </div>
+    </div>);
+});
+
+App.page('/reset-password', false, function(context) {
+  if (App.isUserSignedIn()) {
+    App.go('/me');
+    return;
+  }
+
+  App.mount(<div>
+      <PasswordResetForm />
+    </div>);
+});
+
+App.page('/change-password', false, function(context) {
+  if (App.isUserSignedIn()) {
+    App.go('/me');
+    return;
+  }
+
+  var token = qs.parse(context.querystring).token;
+
+  if (token === undefined) {
+    App.go('/');
+    return;
+  }
+
+  App.mount(<div>
+      <ChangePasswordForm token={token} onSuccess={App.go.bind(App, '/signin')}/>
+    </div>);
+});
+
+App.page('/confirm', false, function(context) {
+  var token = qs.parse(context.querystring).token;
+
+  if (token === undefined) {
+    App.go('/');
+    return;
+  }
+
+  Api.Call(
+    'CONFIRM_EMAIL',
+    {'token': token},
+    function(err, status, data) {
+      if (err) {
+        console.error(err, data);
+      }
+
+      App.go('/me');
+    }
   );
 });
 
@@ -49,21 +90,26 @@ App.page('/signout', true, function(context) {
 });
 
 App.page('/me', true, function(context) {
-  Api.Call('MARKET', {'name': 'poloniex'}, function(err, status, data) {
-    if (err) {
-      console.error(err, data);
-      return;
-    }
+  App.mount(<div>
+      <PoloniexController/>
+    </div>);
+});
 
-    App.mount(
-      <div>
-        <Logo />
-        <p>Poloniex</p>
-        <PoloniexForm apiKey={data.key} apiSecret={data.secret}/>
-      </div>
-    );
+App.page('/account', true, function(context) {
+  App.mount(<div>
+      <UserAccount/>
+    </div>);
+});
 
-  }.bind(this));
+App.page('/not_confirmed', true, function(context) {
+  App.mount(<div>
+      <div className="row">
+        <div className="box offset-3 col-6 text-center">
+          <p>An email has now been sent to your email address.</p>
+          <p>{'Please click the \'Confirm your account\' button to validate your email.'}</p>
+        </div>
+      </div>
+    </div>);
 });
 
 App.page('/otp/setup', true, function(context) {
@@ -73,23 +119,17 @@ App.page('/otp/setup', true, function(context) {
       return;
     }
 
-    App.mount(
-      <div>
-        <Logo />
+    App.mount(<div>
         <OtpEnrollForm onSuccess={App.onUserValidateOtp} img={'data:image/png;base64,' + data.base64img} secret={data.secret}/>
-      </div>
-    );
+      </div>);
 
-  }.bind(this));
+  });
 });
 
 App.page('/otp/validate', true, function(context) {
-  App.mount(
-    <div>
-      <Logo />
+  App.mount(<div>
       <OtpEnrollForm onSuccess={App.onUserValidateOtp} />
-    </div>
-  );
+    </div>);
 });
 
 App.page('/', false, function(context) {