Merge remote-tracking branch 'origin/AD-419-decouple-piece-registration-from-' into AD-499-whitelabel-prize-with-sluice-as-k

js/components/ascribe_detail/detail_property.js

@@ -38,8 +38,8 @@ let DetailProperty = React.createClass({
         return (
             <div className="row ascribe-detail-property">
                 <div className="row-same-height">
-                    <div className={this.props.labelClassName + ' col-xs-height col-bottom'}>
+                    <div className={this.props.labelClassName + ' col-xs-height col-bottom ascribe-detail-property-label'}>
-                        <div>{ this.props.label + this.props.separator}</div>
+                        { this.props.label + this.props.separator}
                     </div>
                     <div className={this.props.valueClassName + ' col-xs-height col-bottom'}>
                         {value}

js/components/ascribe_detail/piece.js

@@ -135,7 +135,7 @@ let Piece = React.createClass({
                         <EditionDetailProperty label="TITLE" value={<div className="ascribe-detail-title">{this.props.piece.title}</div>} />
                         <EditionDetailProperty label="BY" value={this.props.piece.artist_name} />
                         <EditionDetailProperty label="DATE" value={ this.props.piece.date_created.slice(0, 4) } />
-                        {this.props.piece.num_editions > 0 ? <EditionDetailProperty label="NUMBER OF EDITIONS" value={ this.props.piece.num_editions } /> : null}
+                        {this.props.piece.num_editions > 0 ? <EditionDetailProperty label="EDITIONS" value={ this.props.piece.num_editions } /> : null}
                         <hr/>
                     </div>
                     <div className="ascribe-detail-header">

js/components/ascribe_forms/create_editions_form.js

@@ -52,7 +52,7 @@ let CreateEditionsForm = React.createClass({
                     <input
                         type="number"
                         placeholder="(e.g. 32)"
-                        min={0}/>
+                        min={1}/>
                 </Property>
             </Form>
         );

js/components/password_reset_container.js

@@ -5,7 +5,7 @@ import Router from 'react-router';
 
 import Form from './ascribe_forms/form';
 import Property from './ascribe_forms/property';
-
+import FormPropertyHeader from './ascribe_forms/form_property_header';
 import apiUrls from '../constants/api_urls';
 
 import GlobalNotificationModel from '../models/global_notification_model';
@@ -25,9 +25,6 @@ let PasswordResetContainer = React.createClass({
         if (this.props.query.email && this.props.query.token) {
             return (
                 <div>
-                    <div className="ascribe-login-text ascribe-login-header">
-                        {getLangText('Reset the password for')} {this.props.query.email}
-                    </div>
                     <PasswordResetForm
                         email={this.props.query.email}
                         token={this.props.query.token}/>
@@ -38,9 +35,6 @@ let PasswordResetContainer = React.createClass({
             if (this.state.isRequested === false) {
                 return (
                     <div>
-                        <div className="ascribe-login-text ascribe-login-header">
-                            {getLangText('Reset your password')}
-                        </div>
                         <PasswordRequestResetForm
                             handleRequestSuccess={this.handleRequestSuccess}/>
                     </div>
@@ -86,6 +80,9 @@ let PasswordRequestResetForm = React.createClass({
                         <img src="https://s3-us-west-2.amazonaws.com/ascribe0/media/thumbnails/ascribe_animated_medium.gif" />
                     </span>
                     }>
+                <FormPropertyHeader>
+                    <h3>{getLangText('Reset your password')}</h3>
+                </FormPropertyHeader>
                 <Property
                     name='email'
                     label={getLangText('Email')}>
@@ -133,6 +130,9 @@ let PasswordResetForm = React.createClass({
                         <img src="https://s3-us-west-2.amazonaws.com/ascribe0/media/thumbnails/ascribe_animated_medium.gif" />
                     </span>
                     }>
+                <FormPropertyHeader>
+                    <h3>{getLangText('Reset the password for')} {this.props.email}</h3>
+                </FormPropertyHeader>
                 <Property
                     name='password'
                     label={getLangText('Password')}>

js/components/settings_container.js

@@ -32,7 +32,7 @@ let SettingsContainer = React.createClass({
 
     render() {
         return (
-            <div>
+            <div className="settings-container">
                 <AccountSettings />
                 <APISettings />
                 <BitcoinWalletSettings />
@@ -297,10 +297,10 @@ let APISettings = React.createClass({
                         name={app.name}
                         label={app.name}>
                         <div className="row-same-height">
-                            <div className="no-padding col-xs-6 col-xs-height col-middle">
+                            <div className="no-padding col-xs-6 col-sm-10 col-xs-height col-middle">
                             {'Bearer ' + app.bearer_token.token}
                             </div>
-                            <div className="col-xs-6 col-xs-height">
+                            <div className="col-xs-6 col-sm-2 col-xs-height">
                                 <button
                                     className="pull-right btn btn-default btn-sm"
                                     onClick={this.handleTokenRefresh}

js/components/whitelabel/prize/components/ascribe_detail/piece_container.js

@@ -52,6 +52,27 @@ let PieceContainer = React.createClass({
                 <Piece
                     piece={this.state.piece}
                     loadPiece={this.loadPiece}>
+                    <PrizePieceDetails piece={this.state.piece}/>
+                </Piece>
+            );
+        } else {
+            return (
+                <div className="fullpage-spinner">
+                    <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
+                </div>
+            );
+        }
+    }
+});
+
+
+let PrizePieceDetails = React.createClass({
+    propTypes: {
+        piece: React.PropTypes.object
+    },
+    render() {
+        if (this.props.piece.prize && this.props.piece.prize.name){
+            return (
                 <CollapsibleParagraph
                         title="Prize Details"
                         show={true}
@@ -70,15 +91,9 @@ let PieceContainer = React.createClass({
                             <hr />
                         </Form>
                 </CollapsibleParagraph>
-                </Piece>
-            );
-        } else {
-            return (
-                <div className="fullpage-spinner">
-                    <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
-                </div>
             );
         }
+        return null;
     }
 });
 

js/constants/api_urls.js

@@ -27,7 +27,7 @@ let apiUrls = {
     'ownership_loans': AppConstants.apiEndpoint + 'ownership/loans/',
     'ownership_loans_confirm': AppConstants.apiEndpoint + 'ownership/loans/confirm/',
     'ownership_loans_deny': AppConstants.apiEndpoint + 'ownership/loans/deny/',
-    'ownership_loans_contract': AppConstants.apiEndpoint + 'ownership/loans/contract/',
+    'ownership_loans_contract': AppConstants.apiEndpoint + 'ownership/loans/editions/contract/',
     'ownership_shares_editions': AppConstants.apiEndpoint + 'ownership/shares/editions/',
     'ownership_shares_pieces': AppConstants.apiEndpoint + 'ownership/shares/pieces/',
     'ownership_transfers': AppConstants.apiEndpoint + 'ownership/transfers/',

sass/ascribe_settings.scss

@@ -1,3 +1,7 @@
+.settings-container{
+    max-width: 600px;
+    margin: auto;
+}
 
 .ascribe-settings-wrapper {
     width: 100%;

sass/main.scss

@@ -44,6 +44,11 @@ hr {
     margin-bottom: 15px;
 }
 
+form{
+    max-width: 600px;
+    margin: auto;
+}
+
 #main {
     height: 100%;
 }
@@ -217,6 +222,10 @@ hr {
     padding-bottom: 0.4em;
 }
 
+.ascribe-detail-property-label{
+    font-size: 0.8em;
+}
+
 ::-webkit-input-placeholder { /* WebKit browsers */
     font-size: 0.9em;
     font-style: italic;

sass/whitelabel/prize/landing.scss

@@ -1,6 +1,7 @@
 .wp {
     height: 100%;
-
+    max-width: 90%;
+    margin: auto;
     /* We need this, otherwise piece list will have a scrollbar */
     overflow-x: hidden;
 }