Merge remote-tracking branch 'origin/AD-368-harmonize-functionality-of-ascrib' into AD-496-add-control-buttons-to-fineupload

gulpfile.js

@@ -93,8 +93,7 @@ gulp.task('browser-sync', function() {
     browserSync({
         files: config.filesToWatch,
         proxy: 'http://localhost:4000',
-        port: 3000,
-        browser: "chromium-browser"
+        port: 3000
     });
 });
 

js/actions/whitelabel_actions.js

@@ -0,0 +1,25 @@
+'use strict';
+
+import alt from '../alt';
+import WhitelabelFetcher from '../fetchers/whitelabel_fetcher';
+
+
+class WhitelabelActions {
+    constructor() {
+        this.generateActions(
+            'updateWhitelabel'
+        );
+    }
+
+    fetchWhitelabel() {
+        WhitelabelFetcher.fetch()
+            .then((res) => {
+                this.actions.updateWhitelabel(res.whitelabel);
+            })
+            .catch((err) => {
+                console.log(err);
+            });
+    }
+}
+
+export default alt.createActions(WhitelabelActions);

js/components/edition.js

@@ -518,7 +518,7 @@ let FileUploader = React.createClass({
                     bitcoinId: this.props.edition.bitcoin_id
                 }}
                 createBlobRoutine={{
-                    url: apiUrls.blob_digitalworks
+                    url: apiUrls.blob_otherdatas
                 }}
                 validation={{
                     itemLimit: 100000,

js/components/header.js

@@ -6,6 +6,9 @@ import Router from 'react-router';
 import UserActions from '../actions/user_actions';
 import UserStore from '../stores/user_store';
 
+import WhitelabelActions from '../actions/whitelabel_actions';
+import WhitelabelStore from '../stores/whitelabel_store';
+
 import Alt from '../alt';
 
 import Nav from 'react-bootstrap/lib/Nav';
@@ -17,6 +20,7 @@ import MenuItemLink from 'react-router-bootstrap/lib/MenuItemLink';
 import NavItemLink from 'react-router-bootstrap/lib/NavItemLink';
 
 
+import { mergeOptions } from '../utils/general_utils';
 import { getLangText } from '../utils/lang_utils';
 
 let Link = Router.Link;
@@ -25,22 +29,47 @@ let Header = React.createClass({
     mixins: [Router.Navigation],
 
     getInitialState() {
-        return UserStore.getState();
+        return mergeOptions(WhitelabelStore.getState(), UserStore.getState());
     },
 
     componentDidMount() {
         UserActions.fetchCurrentUser();
         UserStore.listen(this.onChange);
+        WhitelabelActions.fetchWhitelabel();
+        WhitelabelStore.listen(this.onChange);
     },
 
     componentWillUnmount() {
         UserStore.unlisten(this.onChange);
+        WhitelabelStore.unlisten(this.onChange);
     },
     handleLogout(){
         UserActions.logoutCurrentUser();
         Alt.flush();
         this.transitionTo('login');
     },
+    getLogo(){
+        let logo = (
+            <span>
+                <span>ascribe </span>
+                <span className="glyph-ascribe-spool-chunked ascribe-color"></span>
+            </span>);
+        if (this.state.whitelabel.logo){
+            logo = <img className="img-brand" src={this.state.whitelabel.logo} />;
+        }
+        return logo;
+    },
+
+    getPoweredBy(){
+        return (
+            <div className="row no-margin ascribe-subheader">
+                <a className="pull-right" href="https://www.ascribe.io/" target="_blank">
+                    <span id="powered">powered by </span>
+                    <span>ascribe </span>
+                    <span className="glyph-ascribe-spool-chunked ascribe-color"></span>
+                </a>
+            </div>);
+    },
     onChange(state) {
         this.setState(state);
     },
@@ -64,13 +93,15 @@ let Header = React.createClass({
             account = <NavItemLink to="login">LOGIN</NavItemLink>;
             signup = <NavItemLink to="signup">SIGNUP</NavItemLink>;
         }
-        let brand = (<Link className="navbar-brand" to="pieces" path="/?page=1">
-                        <span>ascribe </span>
-                        <span className="glyph-ascribe-spool-chunked ascribe-color"></span>
-                    </Link>);
-        return (
 
-            <Navbar brand={brand} toggleNavKey={0}>
+        return (
+            <div>
+                <Navbar
+                    brand={
+                        <Link className="navbar-brand" to="pieces" path="/?page=1">
+                            {this.getLogo()}
+                        </Link>}
+                    toggleNavKey={0}>
                     <CollapsibleNav eventKey={0}>
                         <Nav navbar right>
                             {account}
@@ -78,6 +109,8 @@ let Header = React.createClass({
                         </Nav>
                     </CollapsibleNav>
                 </Navbar>
+                {this.getPoweredBy()}
+            </div>
         );
     }
 });

js/constants/api_urls.js

@@ -6,6 +6,7 @@ let apiUrls = {
     'applications': AppConstants.apiEndpoint + 'applications/',
     'application_token_refresh': AppConstants.apiEndpoint + 'applications/refresh_token/',
     'blob_digitalworks': AppConstants.apiEndpoint + 'blob/digitalworks/',
+    'blob_otherdatas': AppConstants.apiEndpoint + 'blob/otherdatas/',
     'coa': AppConstants.apiEndpoint + 'coa/${id}/',
     'coa_create': AppConstants.apiEndpoint + 'coa/',
     'coa_verify': AppConstants.apiEndpoint + 'coa/verify_coa/',
@@ -37,7 +38,8 @@ let apiUrls = {
     'users_password_reset_request': AppConstants.apiEndpoint + 'users/request_reset_password/',
     'users_signup': AppConstants.apiEndpoint + 'users/',
     'users_username': AppConstants.apiEndpoint + 'users/username/',
-    'wallet_settings': AppConstants.apiEndpoint + 'users/wallet_settings/'
+    'wallet_settings': AppConstants.apiEndpoint + 'users/wallet_settings/',
+    'whitelabel_settings': AppConstants.apiEndpoint + 'whitelabel/settings/${subdomain}/'
 };
 
 export default apiUrls;

js/fetchers/whitelabel_fetcher.js

@@ -0,0 +1,14 @@
+'use strict';
+
+import requests from '../utils/requests';
+
+let WhitelabelFetcher = {
+    /**
+     * Fetch the custom whitelabel data from the API.
+     */
+    fetch() {
+        return requests.get('whitelabel_settings', {'subdomain': window.location.host.split('.')[0]});
+    }
+};
+
+export default WhitelabelFetcher;

js/stores/whitelabel_store.js

@@ -0,0 +1,18 @@
+'use strict';
+
+import alt from '../alt';
+import WhitelabelActions from '../actions/whitelabel_actions';
+
+
+class WhitelabelStore {
+    constructor() {
+        this.whitelabel = {};
+        this.bindActions(WhitelabelActions);
+    }
+
+    onUpdateWhitelabel(whitelabel) {
+        this.whitelabel = whitelabel;
+    }
+}
+
+export default alt.createStore(WhitelabelStore, 'WhitelabelStore');

sass/main.scss

@@ -60,6 +60,20 @@ body {
     color: $ascribe-color;
 }
 
+.img-brand{
+    height: 25px;
+}
+
+.ascribe-subheader{
+    padding-bottom: 10px;
+    margin-top: -10px;
+    a {
+        cursor: pointer;
+        font-size: 0.8em;
+        color: #222;
+    }
+}
+
 .tooltip-inner{
     max-width: 300px;
     padding: 3px 8px;