From 4ae73871d38653272fb985540a61cb1dbee00eca Mon Sep 17 00:00:00 2001 From: Cevo Date: Thu, 24 Sep 2015 16:06:53 +0200 Subject: [PATCH 01/54] initial push for version controlling, will be edited --- .../ascribe_buttons/acl_information_button.js | 88 +++++++++++++++++++ js/components/ascribe_detail/edition.js | 81 ++++++++++++++++- js/components/header.js | 2 +- 3 files changed, 168 insertions(+), 3 deletions(-) create mode 100644 js/components/ascribe_buttons/acl_information_button.js diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js new file mode 100644 index 00000000..3fcbb95f --- /dev/null +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -0,0 +1,88 @@ +/** + * Created by cevo on 23.09.15. + */ +'use strict'; + +import React from 'react'; +import CollapsibleButton from '../ascribe_collapsible/collapsible_button'; +import Button from 'react-bootstrap/lib/Button'; + +let aclInformationButton = React.createClass({ + + render: function () { + let titleStyle = { + color: '#02B6A3', + fontSize: '14px' + }; + + let exampleStyle = { + color: '#B2B2B2', + fontSize: '14px' + }; + + let infoStyle = { + color: '#333333', + fontSize: '14px' + }; + + let divStyle = { + color: 'white', + width: 10 + }; + + let titleList = ['TRANSFER', 'CONSIGN', 'LOAN', 'SHARE', 'DELETE']; + + let infoSentenceList = [ + '- Changes ownership of an Edition. As with a physical piece of work, ' + + 'transferring ownership of an Edition does not transfer copyright in the Work.', + + '- Lets someone represent you in dealing with the work, under the terms you agree to.', + + '- Lets someone use or put the Work on display for a limited amount of time.', + + '- Lets someone view the Work or Edition, but does not give rights to publish or display it.', + + '- Removes the Work from your Wallet. Note that the previous registration and transfer ' + + 'history will still exist on the blockchain and cannot be deleted.' + ]; + + let exampleSentenceList = [ + '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', + + '(e.g. an artist Consigns 10 Editions of her new Work to a gallery ' + + 'so the gallery can sell them on her behalf, under the terms the artist and the gallery have agreed to)', + + '(e.g. a collector Loans a Work to a gallery for one month for display in the gallery\'s show)', + + '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', + + '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)' + ]; + let createJSXTextSnippet = function (title, info, example) { + return [

, {title} , + {info} , + {example} ,

]; + }; + + let rows = []; + for (let i = 0; i < titleList.length; i++){ + rows.push(rows, createJSXTextSnippet(titleList[i], infoSentenceList[i], exampleSentenceList[i])); + } + return ( + + ? + + } + panel={ +
+ {rows} +
+ } + /> + ); + } +}); + +export default aclInformationButton; diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 696e5057..f21bcc71 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -31,7 +31,8 @@ import EditionFurtherDetails from './further_details'; import ListRequestActions from './../ascribe_forms/list_form_request_actions'; import AclButtonList from './../ascribe_buttons/acl_button_list'; import UnConsignRequestButton from './../ascribe_buttons/unconsign_request_button'; -import DeleteButton from '../ascribe_buttons/delete_button'; +import DeleteButton from './../ascribe_buttons/delete_button'; +import CollapsibleButton from './../ascribe_collapsible/collapsible_button'; import GlobalNotificationModel from '../../models/global_notification_model'; import GlobalNotificationActions from '../../actions/global_notification_actions'; @@ -242,7 +243,6 @@ let EditionSummary = React.createClass({ handleSuccess={this.showNotification} requestActions={this.props.edition.request_action}/>); } - else { let withdrawButton = null; if (this.props.edition.status.length > 0 && this.props.edition.pending_new_owner && this.props.edition.acl.acl_withdraw_transfer) { @@ -280,6 +280,83 @@ let EditionSummary = React.createClass({ + + ? + + } + panel = { +
+

+ + TRANSFER + + + - Changes ownership of an Edition. As with a physical piece of work, + transferring ownership of an Edition does not transfer copyright in the Work. + +

+ + (e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan) + +

+

+ + CONSIGN + + + - Lets someone represent you in dealing with the work, under the terms + you agree to. + +

+ + (e.g. an artist Consigns 10 Editions of her new Work to a gallery so the gallery can sell + them on her behalf, under the terms the artist and the gallery have agreed to) + +

+

+ + LOAN + + + - Lets someone use or put the Work on display for a limited amount of time. + +

+ + (e.g. a collector Loans a Work to a gallery for one month + for display in the gallery's show) + +

+

+ + SHARE + + + - Lets someone view the Work or Edition, + but does not give rights to publish or display it. + +

+ + (e.g. a photographer Shares proofs of a graduation photo with the graduate's grandparents) + +

+

+ + DELETE + + + -Removes the Work from your Wallet. Note that the previous registration and + transfer history will still exist on the blockchain and cannot be deleted. + +

+ + (e.g. an artist uploaded the wrong file and doesn't want it cluttering his Wallet, so he Deletes it) + +

+
+ } + /> {unconsignRequestButton} diff --git a/js/components/header.js b/js/components/header.js index 0863624f..078c9961 100644 --- a/js/components/header.js +++ b/js/components/header.js @@ -122,7 +122,7 @@ let Header = React.createClass({ {this.getPoweredBy()} From 48f43ac01c003cec50d9966069a287dfb60c7126 Mon Sep 17 00:00:00 2001 From: Cevo Date: Fri, 25 Sep 2015 14:36:27 +0200 Subject: [PATCH 02/54] the real dropdown version second iteration --- .../ascribe_buttons/acl_information_button.js | 80 ++++++++++++------- js/components/ascribe_detail/edition.js | 80 +------------------ 2 files changed, 51 insertions(+), 109 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index 3fcbb95f..6f1919b6 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -4,12 +4,11 @@ 'use strict'; import React from 'react'; -import CollapsibleButton from '../ascribe_collapsible/collapsible_button'; -import Button from 'react-bootstrap/lib/Button'; +import DropdownButton from 'react-bootstrap/lib/Button'; let aclInformationButton = React.createClass({ - - render: function () { + getDefaultProps: function() { + let rows = []; let titleStyle = { color: '#02B6A3', fontSize: '14px' @@ -22,12 +21,8 @@ let aclInformationButton = React.createClass({ let infoStyle = { color: '#333333', - fontSize: '14px' - }; - let divStyle = { - color: 'white', - width: 10 + fontSize: '14px' }; let titleList = ['TRANSFER', 'CONSIGN', 'LOAN', 'SHARE', 'DELETE']; @@ -43,8 +38,7 @@ let aclInformationButton = React.createClass({ '- Lets someone view the Work or Edition, but does not give rights to publish or display it.', '- Removes the Work from your Wallet. Note that the previous registration and transfer ' + - 'history will still exist on the blockchain and cannot be deleted.' - ]; + 'history will still exist on the blockchain and cannot be deleted.']; let exampleSentenceList = [ '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', @@ -56,31 +50,55 @@ let aclInformationButton = React.createClass({ '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', - '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)' - ]; - let createJSXTextSnippet = function (title, info, example) { - return [

, {title} , - {info} , - {example} ,

]; - }; + '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)']; + console.log('Now will initialize the rows prop inside default props'); + let createJSXTextSnippet = function(title, info, example){ + console.log('creating text snippets'); + return (

{title} + {info}

+ {example}

); + }; - let rows = []; for (let i = 0; i < titleList.length; i++){ - rows.push(rows, createJSXTextSnippet(titleList[i], infoSentenceList[i], exampleSentenceList[i])); + rows.push(createJSXTextSnippet(titleList[i], infoSentenceList[i], exampleSentenceList[i], + titleStyle, infoStyle, exampleStyle)); } + return { + rows: rows + }; + }, + getInitialState: function(){ + return {isVisible: false}; + }, + show: function(){ + console.log('now inside the show function'); + this.setState({isVisible: true}); + document.addEventListener('click', this.hide); + }, + hide: function(){ + this.setState({isVisible: false}); + document.removeEventListener('click', this.hide); + }, + showInformation: function(){ + if (this.state.isVisible) { + return this.props.rows; + } + }, + render: function () { + console.log('will start rendering'); return ( - - ? - - } - panel={ -
- {rows} +
+
+ {console.log(this.state.isVisible)} + ? +
+
+
+ {this.showInformation()} +
+
- } - /> ); } }); diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index f21bcc71..f9f77c38 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -32,7 +32,7 @@ import ListRequestActions from './../ascribe_forms/list_form_request_actions'; import AclButtonList from './../ascribe_buttons/acl_button_list'; import UnConsignRequestButton from './../ascribe_buttons/unconsign_request_button'; import DeleteButton from './../ascribe_buttons/delete_button'; -import CollapsibleButton from './../ascribe_collapsible/collapsible_button'; +import AclInformationButton from './../ascribe_buttons/acl_information_button'; import GlobalNotificationModel from '../../models/global_notification_model'; import GlobalNotificationActions from '../../actions/global_notification_actions'; @@ -280,83 +280,7 @@ let EditionSummary = React.createClass({ - - ? - - } - panel = { -
-

- - TRANSFER - - - - Changes ownership of an Edition. As with a physical piece of work, - transferring ownership of an Edition does not transfer copyright in the Work. - -

- - (e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan) - -

-

- - CONSIGN - - - - Lets someone represent you in dealing with the work, under the terms - you agree to. - -

- - (e.g. an artist Consigns 10 Editions of her new Work to a gallery so the gallery can sell - them on her behalf, under the terms the artist and the gallery have agreed to) - -

-

- - LOAN - - - - Lets someone use or put the Work on display for a limited amount of time. - -

- - (e.g. a collector Loans a Work to a gallery for one month - for display in the gallery's show) - -

-

- - SHARE - - - - Lets someone view the Work or Edition, - but does not give rights to publish or display it. - -

- - (e.g. a photographer Shares proofs of a graduation photo with the graduate's grandparents) - -

-

- - DELETE - - - -Removes the Work from your Wallet. Note that the previous registration and - transfer history will still exist on the blockchain and cannot be deleted. - -

- - (e.g. an artist uploaded the wrong file and doesn't want it cluttering his Wallet, so he Deletes it) - -

-
- } - /> + {unconsignRequestButton} From 661cb44b94acb429ae6c985e39193152f79d8db5 Mon Sep 17 00:00:00 2001 From: Cevo Date: Mon, 28 Sep 2015 22:09:25 +0200 Subject: [PATCH 03/54] reached the spec with dirty tricks --- img/tip.svg | 12 +++ .../ascribe_buttons/acl_button_list.js | 82 +++++++++++-------- .../ascribe_buttons/acl_information_button.js | 64 +++++++++------ js/components/ascribe_detail/edition.js | 6 +- sass/main.scss | 7 ++ 5 files changed, 110 insertions(+), 61 deletions(-) create mode 100644 img/tip.svg diff --git a/img/tip.svg b/img/tip.svg new file mode 100644 index 00000000..c079ac14 --- /dev/null +++ b/img/tip.svg @@ -0,0 +1,12 @@ + + + + tip + Created with Sketch. + + + + + + + \ No newline at end of file diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index b9139979..e5207cd9 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -6,6 +6,7 @@ import UserActions from '../../actions/user_actions'; import UserStore from '../../stores/user_store'; import AclButton from '../ascribe_buttons/acl_button'; +import {getLangText} from '../../utils/lang_utils'; let AclButtonList = React.createClass({ propTypes: { @@ -15,13 +16,25 @@ let AclButtonList = React.createClass({ React.PropTypes.array ]), availableAcls: React.PropTypes.object, + actionsLabelStyle: React.PropTypes.object, + buttonsStyle: React.PropTypes.object, handleSuccess: React.PropTypes.func, children: React.PropTypes.oneOfType([ React.PropTypes.arrayOf(React.PropTypes.element), React.PropTypes.element ]) }, - + getDefaultProps(){ + return { + actionsLabelStyle: { + float: 'left', + fontSize: '11.2px' + }, + buttonsStyle: { + marginLeft: '0.25cm' + } + }; + }, getInitialState() { return UserStore.getState(); }, @@ -42,37 +55,42 @@ let AclButtonList = React.createClass({ render() { return (
- - - - - - {this.props.children} + + {getLangText('ACTIONS')} + + + + + + + + {this.props.children} +
); } diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index 6f1919b6..f60a849b 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -6,38 +6,38 @@ import React from 'react'; import DropdownButton from 'react-bootstrap/lib/Button'; -let aclInformationButton = React.createClass({ +let AclInformationButton = React.createClass({ getDefaultProps: function() { let rows = []; let titleStyle = { color: '#02B6A3', - fontSize: '14px' - }; - - let exampleStyle = { - color: '#B2B2B2', - fontSize: '14px' + fontSize: '11px' }; let infoStyle = { color: '#333333', - - fontSize: '14px' + fontSize: '11px' }; + let exampleStyle = { + color: '#B2B2B2', + fontSize: '11px' + }; + + let titleList = ['TRANSFER', 'CONSIGN', 'LOAN', 'SHARE', 'DELETE']; let infoSentenceList = [ - '- Changes ownership of an Edition. As with a physical piece of work, ' + + ' - Changes ownership of an Edition. As with a physical piece of work, ' + 'transferring ownership of an Edition does not transfer copyright in the Work.', - '- Lets someone represent you in dealing with the work, under the terms you agree to.', + ' - Lets someone represent you in dealing with the work, under the terms you agree to.', - '- Lets someone use or put the Work on display for a limited amount of time.', + ' - Lets someone use or put the Work on display for a limited amount of time.', - '- Lets someone view the Work or Edition, but does not give rights to publish or display it.', + ' - Lets someone view the Work or Edition, but does not give rights to publish or display it.', - '- Removes the Work from your Wallet. Note that the previous registration and transfer ' + + ' - Removes the Work from your Wallet. Note that the previous registration and transfer ' + 'history will still exist on the blockchain and cannot be deleted.']; let exampleSentenceList = [ @@ -51,7 +51,9 @@ let aclInformationButton = React.createClass({ '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)']; + console.log('Now will initialize the rows prop inside default props'); + let createJSXTextSnippet = function(title, info, example){ console.log('creating text snippets'); return (

{title} @@ -64,7 +66,21 @@ let aclInformationButton = React.createClass({ titleStyle, infoStyle, exampleStyle)); } return { - rows: rows + rows: rows, + dropdownButtonStyle: { + background: 'none', + color: 'black', + padding: 0, + border: 'none' + }, + dropdownListStyle: { + textAlign: 'left', + border: '1px solid #02B6A3', + borderTop: 'none', + borderBottom: 'none', + float: 'right', + width: '80.8%' + } }; }, getInitialState: function(){ @@ -87,20 +103,18 @@ let aclInformationButton = React.createClass({ render: function () { console.log('will start rendering'); return ( -

-
+ {console.log(this.state.isVisible)} - ? + +

+
+ {this.showInformation()}
-
-
- {this.showInformation()} -
-
-
+ ); } }); -export default aclInformationButton; +export default AclInformationButton; diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index f9f77c38..bd76b0b8 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -175,7 +175,6 @@ let Edition = React.createClass({ url={ApiUrls.note_public_edition} currentUser={this.state.currentUser}/> - - - + - {unconsignRequestButton} + ); diff --git a/sass/main.scss b/sass/main.scss index 56849cdb..b0ad7e1c 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -212,6 +212,7 @@ hr { border: 1px solid $ascribe-brand-danger; } } + .btn-ascribe { border: 1px solid #444; line-height: 2em; @@ -293,6 +294,10 @@ hr { height: 13em !important; } +.textarea-ascribe-info { + text-align: left; +} + .input-checkbox-ascribe { text-align: left; line-height: 1.6; @@ -395,10 +400,12 @@ hr { 0% { -o-transform: rotate(0deg);} 100% { -o-transform: rotate(360deg);} } + @-ms-keyframes spin { 0% { -ms-transform: rotate(0deg);} 100% { -ms-transform: rotate(360deg);} } + @-keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg);} From 196219f106111f993eee2484d345cf8e23ee78d7 Mon Sep 17 00:00:00 2001 From: Cevo Date: Mon, 28 Sep 2015 22:10:00 +0200 Subject: [PATCH 04/54] reached the spec with dirty tricks --- img/tip.svg | 12 ------------ 1 file changed, 12 deletions(-) delete mode 100644 img/tip.svg diff --git a/img/tip.svg b/img/tip.svg deleted file mode 100644 index c079ac14..00000000 --- a/img/tip.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - tip - Created with Sketch. - - - - - - - \ No newline at end of file From df338ac7465a04f067b771a5dabd88583131ae5c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 29 Sep 2015 10:31:13 +0200 Subject: [PATCH 05/54] Fix alignment for AclInformationButton --- .../ascribe_buttons/acl_button_list.js | 15 +------------ .../ascribe_buttons/acl_information_button.js | 21 +++++++++---------- js/components/ascribe_detail/edition.js | 3 ++- sass/main.scss | 9 ++++++++ 4 files changed, 22 insertions(+), 26 deletions(-) diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index e5207cd9..73f00c90 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -24,17 +24,7 @@ let AclButtonList = React.createClass({ React.PropTypes.element ]) }, - getDefaultProps(){ - return { - actionsLabelStyle: { - float: 'left', - fontSize: '11.2px' - }, - buttonsStyle: { - marginLeft: '0.25cm' - } - }; - }, + getInitialState() { return UserStore.getState(); }, @@ -55,9 +45,6 @@ let AclButtonList = React.createClass({ render() { return (
- - {getLangText('ACTIONS')} - - - {console.log(this.state.isVisible)} - -

-
+ +
{this.showInformation()}
diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index bd76b0b8..9b429ca2 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -270,7 +270,7 @@ let EditionSummary = React.createClass({ @@ -300,6 +300,7 @@ let EditionSummary = React.createClass({ label={getLangText('OWNER')} value={ this.props.edition.owner } /> {this.getStatus()} +
{this.getActions()}
diff --git a/sass/main.scss b/sass/main.scss index b0ad7e1c..30156c46 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -265,6 +265,11 @@ hr { .ascribe-detail-property-label { font-size: 0.8em; + +} + +.ascribe-detail-property-label.col-bottom { + vertical-align: top; } .ascribe-detail-property-value { @@ -369,6 +374,10 @@ hr { margin-top: 1px; } +.ascribe-button-list-detail { + margin-top:0; +} + .margin-left-2px{ margin-left: 2px; } From b6cfafc9172d7e8896ee8470ffb0337208ea8227 Mon Sep 17 00:00:00 2001 From: Cevo Date: Tue, 29 Sep 2015 11:04:20 +0200 Subject: [PATCH 06/54] unused css class removed --- sass/main.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/sass/main.scss b/sass/main.scss index 30156c46..880fd448 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -268,10 +268,6 @@ hr { } -.ascribe-detail-property-label.col-bottom { - vertical-align: top; -} - .ascribe-detail-property-value { /* white-space: nowrap; overflow: hidden; */ From 28ab6555053f31565f675f417232866e7e4b0603 Mon Sep 17 00:00:00 2001 From: Cevo Date: Wed, 30 Sep 2015 10:53:52 +0200 Subject: [PATCH 07/54] merged again with master --- .../ascribe_accordion_list/accordion_list_item_edition_widget.js | 1 - .../ascribe_accordion_list/accordion_list_item_wallet.js | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js b/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js index 709160b9..ea3ae451 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js @@ -121,7 +121,6 @@ let AccordionListItemEditionWidget = React.createClass({ ); } else { let editionMapping = piece && piece.first_edition ? piece.first_edition.num_editions_available + '/' + piece.num_editions : ''; - return (
} badge={this.getGlyphicon()}> + badge={this.getGlyphicon()}> {this.getCreateEditionsDialog()} {/* this.props.children is AccordionListItemTableEditions */} {this.props.children} From 70eedbabaf6386bfc7e85542380f4810576b5122 Mon Sep 17 00:00:00 2001 From: Cevo Date: Tue, 6 Oct 2015 10:20:57 +0200 Subject: [PATCH 08/54] line spacing in info text edited --- .../ascribe_buttons/acl_information_button.js | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index bea9808e..d0246ef7 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -15,17 +15,24 @@ let AclInformationButton = React.createClass({ let rows = []; let titleStyle = { color: '#02B6A3', - fontSize: '11px' + fontSize: '11px', + lineHeight: '5px' }; let infoStyle = { color: '#333333', - fontSize: '11px' + fontSize: '11px', + lineHeight: '5px' }; let exampleStyle = { color: '#B2B2B2', - fontSize: '11px' + fontSize: '11px', + lineHeight: '5px' + }; + + let paragraphStyle = { + margin: '0.1em' }; @@ -60,8 +67,8 @@ let AclInformationButton = React.createClass({ let createJSXTextSnippet = function(title, info, example){ console.log('creating text snippets'); - return (

{title} - {info}

+ return (

{title} + {info}
{example}

); }; From bb3670ef4de4ead124ab0694141504797a720fb1 Mon Sep 17 00:00:00 2001 From: Cevo Date: Wed, 7 Oct 2015 13:52:30 +0200 Subject: [PATCH 09/54] padding and border added --- index.html | 1 - js/components/ascribe_buttons/acl_information_button.js | 7 +++++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 743d01dc..edad8700 100644 --- a/index.html +++ b/index.html @@ -26,7 +26,6 @@ - ascribe diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index d0246ef7..7042e086 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -85,8 +85,11 @@ let AclInformationButton = React.createClass({ border: 'none' }, dropdownListStyle: { - textAlign: 'left', - width: '80.8%' + textAlign: 'justify', + width: '80.8%', + border: '1px solid #CCC', + backgroundColor: 'white', + padding: '0.5em' } }; }, From 11b2ab7b126b46a2d9b1128d22225414a880b111 Mon Sep 17 00:00:00 2001 From: Cevo Date: Wed, 7 Oct 2015 13:58:02 +0200 Subject: [PATCH 10/54] title added back in index.html (it was for a different ticket) --- index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/index.html b/index.html index edad8700..743d01dc 100644 --- a/index.html +++ b/index.html @@ -26,6 +26,7 @@ + ascribe From 924b462cc1a4386934db9fada8c3090834fd3c36 Mon Sep 17 00:00:00 2001 From: Cevo Date: Thu, 8 Oct 2015 10:14:06 +0200 Subject: [PATCH 11/54] sharare button moved to the right --- js/components/ascribe_buttons/acl_button_list.js | 12 ++++++------ .../ascribe_buttons/acl_information_button.js | 2 +- js/components/ascribe_detail/edition.js | 3 --- 3 files changed, 7 insertions(+), 10 deletions(-) diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index 73f00c90..ef48dd65 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -46,6 +46,12 @@ let AclButtonList = React.createClass({ return (
+ - {this.props.children}
diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index 7042e086..9d637c70 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -4,7 +4,7 @@ 'use strict'; import React from 'react'; -import classnames from 'classnames'; +import classnames from 'classnames'; import DropdownButton from 'react-bootstrap/lib/Button'; diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 501b4c6b..4c8f8919 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -291,9 +291,6 @@ let EditionSummary = React.createClass({ editions={[this.props.edition]} handleSuccess={this.handleSuccess}> {withdrawButton} - {unconsignRequestButton} From 087884ef3cf76f29c7613aaeaaf1a979ed727ab8 Mon Sep 17 00:00:00 2001 From: Cevo Date: Thu, 8 Oct 2015 10:14:50 +0200 Subject: [PATCH 12/54] sharare button moved to the right --- js/components/ascribe_detail/edition.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 4c8f8919..501b4c6b 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -291,6 +291,9 @@ let EditionSummary = React.createClass({ editions={[this.props.edition]} handleSuccess={this.handleSuccess}> {withdrawButton} + {unconsignRequestButton} From f2d02179a19d9be04890dd1005c81d460d400564 Mon Sep 17 00:00:00 2001 From: Cevo Date: Thu, 8 Oct 2015 13:19:59 +0200 Subject: [PATCH 13/54] pullrequest changes --- .../ascribe_buttons/acl_information_button.js | 49 +++++++++---------- 1 file changed, 24 insertions(+), 25 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index 9d637c70..c9874c95 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -1,38 +1,38 @@ -/** - * Created by cevo on 23.09.15. - */ + 'use strict'; import React from 'react'; import classnames from 'classnames'; -import DropdownButton from 'react-bootstrap/lib/Button'; - +import { getLangText } from '../../utils/lang_utils'; +import Button from 'react-bootstrap/lib/Button'; let AclInformationButton = React.createClass({ - getDefaultProps: function() { + getDefaultProps() { let rows = []; let titleStyle = { color: '#02B6A3', fontSize: '11px', - lineHeight: '5px' + lineHeight: '3px' }; let infoStyle = { color: '#333333', fontSize: '11px', - lineHeight: '5px' + lineHeight: '3px' }; let exampleStyle = { color: '#B2B2B2', fontSize: '11px', - lineHeight: '5px' + lineHeight: '3px' }; let paragraphStyle = { - margin: '0.1em' + margin: '0.1em', + lineHeight: '15px' + }; @@ -66,14 +66,14 @@ let AclInformationButton = React.createClass({ console.log('Now will initialize the rows prop inside default props'); let createJSXTextSnippet = function(title, info, example){ - console.log('creating text snippets'); return (

{title} {info}
{example}

); }; for (let i = 0; i < titleList.length; i++){ - rows.push(createJSXTextSnippet(titleList[i], infoSentenceList[i], exampleSentenceList[i], + rows.push(createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), + getLangText(exampleSentenceList[i]), titleStyle, infoStyle, exampleStyle)); } return { @@ -93,29 +93,28 @@ let AclInformationButton = React.createClass({ } }; }, - getInitialState: function(){ + getInitialState() { return {isVisible: false}; }, - show: function(){ - console.log('now inside the show function'); - this.setState({isVisible: true}); - document.addEventListener('click', this.hide); + onOff() { + if (!this.state.isVisible) { + this.setState({isVisible: true}); + } + else { + this.setState({isVisible: false}); + } }, - hide: function(){ - this.setState({isVisible: false}); - document.removeEventListener('click', this.hide); - }, - showInformation: function(){ + showInformation() { if (this.state.isVisible) { return this.props.rows; } }, - render: function () { + render() { return ( - + className="glyphicon glyphicon-question-sign" onClick={this.onOff} />
From 03680bd83061744ba890b0e12c7fc3ba6979367b Mon Sep 17 00:00:00 2001 From: Cevo Date: Fri, 9 Oct 2015 14:19:43 +0200 Subject: [PATCH 14/54] information button gets the active buttons and shows i only relevant info (Tim I didn't set the arrays as props because it would require more work and fills the memory and are not going to be reused, gc should delete them) --- .../ascribe_buttons/acl_button_list.js | 2 +- .../ascribe_buttons/acl_information_button.js | 41 ++++++++++--------- js/components/ascribe_detail/edition.js | 17 +++++++- 3 files changed, 38 insertions(+), 22 deletions(-) diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index ef48dd65..0e49d589 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -44,7 +44,7 @@ let AclButtonList = React.createClass({ render() { return ( -
+
{title} @@ -71,30 +73,33 @@ let AclInformationButton = React.createClass({ {example}

); }; + this.rows = enabledIndices.map((i)=>{ + return (createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), + getLangText(exampleSentenceList[i]), + titleStyle, infoStyle, exampleStyle)); + }); + + /** for (let i = 0; i < titleList.length; i++){ rows.push(createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), getLangText(exampleSentenceList[i]), titleStyle, infoStyle, exampleStyle)); } - return { - rows: rows, - dropdownButtonStyle: { + */ + + this.dropdownButtonStyle = { background: 'none', color: 'black', padding: 0, border: 'none' - }, - dropdownListStyle: { + }; + this.dropdownListStyle = { textAlign: 'justify', width: '80.8%', border: '1px solid #CCC', backgroundColor: 'white', padding: '0.5em' - } - }; - }, - getInitialState() { - return {isVisible: false}; + }; }, onOff() { if (!this.state.isVisible) { @@ -106,17 +111,15 @@ let AclInformationButton = React.createClass({ }, showInformation() { if (this.state.isVisible) { - return this.props.rows; + return this.rows; } }, render() { return ( -
} - badge={this.getGlyphicon()}> - badge={this.getGlyphicon()}> {this.getCreateEditionsDialog()} {/* this.props.children is AccordionListItemTableEditions */} {this.props.children} - + /> ); } }); From b8f7527a0b7e62dce75a640d84ae2246de22c9a4 Mon Sep 17 00:00:00 2001 From: Cevo Date: Fri, 9 Oct 2015 14:32:45 +0200 Subject: [PATCH 16/54] console.logs removed --- js/components/ascribe_buttons/acl_information_button.js | 8 -------- js/components/ascribe_detail/edition.js | 2 -- 2 files changed, 10 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index 8aa5fcdc..048e1179 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -79,14 +79,6 @@ let AclInformationButton = React.createClass({ titleStyle, infoStyle, exampleStyle)); }); - /** - for (let i = 0; i < titleList.length; i++){ - rows.push(createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), - getLangText(exampleSentenceList[i]), - titleStyle, infoStyle, exampleStyle)); - } - */ - this.dropdownButtonStyle = { background: 'none', color: 'black', diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 0d1218f5..9d96d527 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -254,8 +254,6 @@ let EditionSummary = React.createClass({ verbListIndices.push(index); } }); - console.log('Here are the verbs to open'); - console.log(verbListIndices); return verbListIndices; }, getActions(){ From 434d85266636467f89369564c2d1d4df81907171 Mon Sep 17 00:00:00 2001 From: Cevo Date: Fri, 9 Oct 2015 14:38:18 +0200 Subject: [PATCH 17/54] bug in the collection list handled --- .../ascribe_accordion_list/accordion_list_item_wallet.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js index 4b42b9cc..c8e63faa 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js @@ -143,11 +143,11 @@ let AccordionListItemWallet = React.createClass({ toggleCreateEditionsDialog={this.toggleCreateEditionsDialog} onPollingSuccess={this.onPollingSuccess}/> -
} +
}> {this.getCreateEditionsDialog()} {/* this.props.children is AccordionListItemTableEditions */} {this.props.children} - /> + ); } }); From b4b05b3161c2148536f44af5efb741758dd41497 Mon Sep 17 00:00:00 2001 From: Cevo Date: Tue, 13 Oct 2015 18:33:08 +0200 Subject: [PATCH 18/54] information added to forms and delete form title changed, acl information component created, information text is added to the constants --- js/components/ascribe_buttons/acl_button.js | 4 +- .../ascribe_buttons/acl_information_button.js | 73 +-------------- .../ascribe_buttons/delete_button.js | 4 +- js/components/ascribe_detail/edition.js | 2 +- js/components/ascribe_forms/form.js | 2 - js/components/ascribe_forms/form_consign.js | 3 +- .../ascribe_forms/form_delete_edition.js | 3 +- js/components/ascribe_forms/form_loan.js | 4 +- .../ascribe_forms/form_share_email.js | 4 +- js/components/ascribe_forms/form_transfer.js | 3 +- .../ascribe_information/acl_information.js | 89 +++++++++++++++++++ js/components/ascribe_modal/modal_wrapper.js | 20 ++++- js/constants/information_text.js | 42 +++++++++ js/utils/general_utils.js | 10 +++ sass/main.scss | 6 +- 15 files changed, 183 insertions(+), 86 deletions(-) create mode 100644 js/components/ascribe_information/acl_information.js create mode 100644 js/constants/information_text.js diff --git a/js/components/ascribe_buttons/acl_button.js b/js/components/ascribe_buttons/acl_button.js index e3c7fa1c..21db4bc7 100644 --- a/js/components/ascribe_buttons/acl_button.js +++ b/js/components/ascribe_buttons/acl_button.js @@ -173,8 +173,8 @@ let AclButton = React.createClass({ {this.sanitizeAction()} } - handleSuccess={aclProps.handleSuccess} - title={aclProps.title}> + handleSuccess = {aclProps.handleSuccess} + title = {aclProps.title}> {aclProps.form} ); diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index 048e1179..efca1664 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -4,8 +4,7 @@ import React from 'react'; import classnames from 'classnames'; -import { getLangText } from '../../utils/lang_utils'; - +import AclInformation from '../ascribe_information/acl_information'; import Button from 'react-bootstrap/lib/Button'; let AclInformationButton = React.createClass({ @@ -13,78 +12,14 @@ let AclInformationButton = React.createClass({ return {isVisible: false}; }, componentDidMount() { - //let rows = []; - let titleStyle = { - color: '#02B6A3', - fontSize: '11px', - lineHeight: '3px' - }; - - let infoStyle = { - color: '#333333', - fontSize: '11px', - lineHeight: '3px' - }; - - let exampleStyle = { - color: '#B2B2B2', - fontSize: '11px', - lineHeight: '3px' - }; - - let paragraphStyle = { - margin: '0.1em', - lineHeight: '15px' - - }; - - let enabledIndices = this.props.verbs; - let titleList = ['TRANSFER', 'CONSIGN', 'LOAN', 'SHARE', 'DELETE']; - - let infoSentenceList = [ - ' - Changes ownership of an Edition. As with a physical piece of work, ' + - 'transferring ownership of an Edition does not transfer copyright in the Work.', - - ' - Lets someone represent you in dealing with the work, under the terms you agree to.', - - ' - Lets someone use or put the Work on display for a limited amount of time.', - - ' - Lets someone view the Work or Edition, but does not give rights to publish or display it.', - - ' - Removes the Work from your Wallet. Note that the previous registration and transfer ' + - 'history will still exist on the blockchain and cannot be deleted.']; - - let exampleSentenceList = [ - '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', - - '(e.g. an artist Consigns 10 Editions of her new Work to a gallery ' + - 'so the gallery can sell them on her behalf, under the terms the artist and the gallery have agreed to)', - - '(e.g. a collector Loans a Work to a gallery for one month for display in the gallery\'s show)', - - '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', - - '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)']; - - - let createJSXTextSnippet = function(title, info, example){ - return (

{title} - {info}
- {example}

); - }; - - this.rows = enabledIndices.map((i)=>{ - return (createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), - getLangText(exampleSentenceList[i]), - titleStyle, infoStyle, exampleStyle)); - }); - + console.log('Information button being launched'); this.dropdownButtonStyle = { background: 'none', color: 'black', padding: 0, border: 'none' }; + this.dropdownListStyle = { textAlign: 'justify', width: '80.8%', @@ -103,7 +38,7 @@ let AclInformationButton = React.createClass({ }, showInformation() { if (this.state.isVisible) { - return this.rows; + return (); } }, render() { diff --git a/js/components/ascribe_buttons/delete_button.js b/js/components/ascribe_buttons/delete_button.js index b0b64427..5778fb1b 100644 --- a/js/components/ascribe_buttons/delete_button.js +++ b/js/components/ascribe_buttons/delete_button.js @@ -42,10 +42,10 @@ let DeleteButton = React.createClass({ if(this.props.piece && !this.props.editions) { content = ; - title = getLangText('Remove Piece'); + title = getLangText('Delete Piece'); } else { content = ; - title = getLangText('Remove Edition'); + title = getLangText('Delete Edition'); } btnDelete = ; diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 9d96d527..3086479b 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -251,7 +251,7 @@ let EditionSummary = React.createClass({ Object.keys(acl).forEach((key) => { let index = verbsToCheck.indexOf(key); if (acl[key] === true && index !== -1) { - verbListIndices.push(index); + verbListIndices.push(verbsToCheck[index].slice(4)); } }); return verbListIndices; diff --git a/js/components/ascribe_forms/form.js b/js/components/ascribe_forms/form.js index c5f60b76..fe15f537 100644 --- a/js/components/ascribe_forms/form.js +++ b/js/components/ascribe_forms/form.js @@ -288,10 +288,8 @@ let Form = React.createClass({ {this.renderChildren()} {this.getButtons()} - ); } }); - export default Form; diff --git a/js/components/ascribe_forms/form_consign.js b/js/components/ascribe_forms/form_consign.js index de4a4788..f904fd52 100644 --- a/js/components/ascribe_forms/form_consign.js +++ b/js/components/ascribe_forms/form_consign.js @@ -10,7 +10,7 @@ import InputTextAreaToggable from './input_textarea_toggable'; import AppConstants from '../../constants/application_constants'; import { getLangText } from '../../utils/lang_utils.js'; - +import AclInformation from '../ascribe_information/acl_information'; let ConsignForm = React.createClass({ propTypes: { @@ -45,6 +45,7 @@ let ConsignForm = React.createClass({
}> + diff --git a/js/components/ascribe_forms/form_delete_edition.js b/js/components/ascribe_forms/form_delete_edition.js index 9eb721f6..847db096 100644 --- a/js/components/ascribe_forms/form_delete_edition.js +++ b/js/components/ascribe_forms/form_delete_edition.js @@ -8,7 +8,7 @@ import ApiUrls from '../../constants/api_urls'; import AppConstants from '../../constants/application_constants'; import { getLangText } from '../../utils/lang_utils'; - +import AclInformation from '../ascribe_information/acl_information'; let EditionDeleteForm = React.createClass({ @@ -58,6 +58,7 @@ let EditionDeleteForm = React.createClass({
}> +

{getLangText('Are you sure you would like to permanently delete this edition')}?

{getLangText('This is an irrevocable action%s', '.')}

diff --git a/js/components/ascribe_forms/form_loan.js b/js/components/ascribe_forms/form_loan.js index ef2fbd13..838c09c1 100644 --- a/js/components/ascribe_forms/form_loan.js +++ b/js/components/ascribe_forms/form_loan.js @@ -19,7 +19,7 @@ import AppConstants from '../../constants/application_constants'; import { mergeOptions } from '../../utils/general_utils'; import { getLangText } from '../../utils/lang_utils'; - +import AclInformation from '../ascribe_information/acl_information'; let LoanForm = React.createClass({ propTypes: { @@ -227,6 +227,8 @@ let LoanForm = React.createClass({

{this.props.loanHeading}

+ +

}> + {console.log('hoho')} + diff --git a/js/components/ascribe_forms/form_transfer.js b/js/components/ascribe_forms/form_transfer.js index 8bbcf110..f299406e 100644 --- a/js/components/ascribe_forms/form_transfer.js +++ b/js/components/ascribe_forms/form_transfer.js @@ -9,7 +9,7 @@ import Form from './form'; import Property from './property'; import InputTextAreaToggable from './input_textarea_toggable'; - +import AclInformation from '../ascribe_information/acl_information'; import AppConstants from '../../constants/application_constants'; import { getLangText } from '../../utils/lang_utils.js'; @@ -50,6 +50,7 @@ let TransferForm = React.createClass({
}> + diff --git a/js/components/ascribe_information/acl_information.js b/js/components/ascribe_information/acl_information.js new file mode 100644 index 00000000..80dc5f22 --- /dev/null +++ b/js/components/ascribe_information/acl_information.js @@ -0,0 +1,89 @@ +'use strict'; + +import React from 'react'; +import informationTexts from '../../constants/information_text'; +import { getLangText } from '../../utils/lang_utils'; +import { replaceSubstringAtIndex } from '../../utils/general_utils'; + +let AclInformation = React.createClass({ + render() { + let titleStyle = { + color: '#02B6A3', + fontSize: '11px', + lineHeight: '3px' + }; + + let infoStyle = { + color: '#333333', + fontSize: '11px', + lineHeight: '3px' + }; + + let exampleStyle = { + color: '#B2B2B2', + fontSize: '11px', + lineHeight: '3px' + }; + + let paragraphStyle = { + margin: '0.1em', + lineHeight: '15px', + align: 'justify' + }; + let enabledIndices = this.props.verbs; + let aim = this.props.aim; + let titleList = informationTexts.title; + let infoSentenceList = informationTexts.informationSentence; + let exampleSentenceList = informationTexts.exampleSentence; + let createJSXTextSnippet = function(title, info, example){ + if (aim) { + if (aim === 'form') { + return (

+ {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
+ {example}

); + } + else if (aim === 'button') { + return (

{title} + {info}
+ {example}

); + } + } + else { + console.log('Aim is required when you want to place information text'); + } + }; + let rows = null; + let sortedIndices = ['share', 'transfer', 'consign', 'loan', 'delete']; + let tempIndices = []; + for (let i = 0; i < sortedIndices.length; i++){ + if (enabledIndices.indexOf(sortedIndices[i]) === -1){ + continue; + } + else{ + tempIndices.push(sortedIndices[i]); + } + } + enabledIndices = tempIndices; + if(Array.isArray(enabledIndices)) { + rows = enabledIndices.map((i)=> { + return (createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), + getLangText(exampleSentenceList[i]), + titleStyle, infoStyle, exampleStyle)); + }); + } + else if (typeof enabledIndices === 'string'){ + rows = (createJSXTextSnippet(getLangText(titleList[enabledIndices]), getLangText(infoSentenceList[enabledIndices]), + getLangText(exampleSentenceList[enabledIndices]), + titleStyle, infoStyle, exampleStyle)); + } + else if (typeof enabledIndices === 'undefined'){ + console.log('Verbs come undefined maybe you wrote verb instead of verbs?'); + } + else { + console.log('You need to supply an array of strings or string as verbs to AclInformation'); + } + return ({rows}); + } +}); + +export default AclInformation; diff --git a/js/components/ascribe_modal/modal_wrapper.js b/js/components/ascribe_modal/modal_wrapper.js index f00eee9e..877bb343 100644 --- a/js/components/ascribe_modal/modal_wrapper.js +++ b/js/components/ascribe_modal/modal_wrapper.js @@ -17,7 +17,7 @@ let ModalWrapper = React.createClass({ children: React.PropTypes.oneOfType([ React.PropTypes.arrayOf(React.PropTypes.element), React.PropTypes.element - ]) + ]), }, getInitialState() { @@ -55,17 +55,29 @@ let ModalWrapper = React.createClass({ // this adds the onClick method show of modal_wrapper to the trigger component // which is in most cases a button. let trigger = React.cloneElement(this.props.trigger, {onClick: this.show}); - + let modalHeaderAscribe = { + paddingTop: '15px', + paddingBottom: '0px', + borderBottom: 'none', + minHeight: '16.42857px' + }; + let modalBodyAscribe = { + paddingTop: '5px', + paddingBottom: '10px', + paddingRight: '15px', + paddingLeft: '15px', + position: 'relative' + }; return ( {trigger} - + {this.props.title} -
+
{this.renderChildren()}
diff --git a/js/constants/information_text.js b/js/constants/information_text.js new file mode 100644 index 00000000..91c61183 --- /dev/null +++ b/js/constants/information_text.js @@ -0,0 +1,42 @@ +'use strict'; + +const informationTexts = { + + 'title': { + 'transfer': 'TRANSFER', + 'consign': 'CONSIGN', + 'loan': 'LOAN', + 'share': 'SHARE', + 'delete': 'DELETE'}, + + 'informationSentence': { + + 'transfer': ' - Changes ownership of an Edition. As with a physical piece of work, ' + + 'transferring ownership of an Edition does not transfer copyright in the Work.', + + 'consign': ' - Lets someone represent you in dealing with the work, under the terms you agree to.', + + 'loan': ' - Lets someone use or put the Work on display for a limited amount of time.', + + 'share': ' - Lets someone view the Work or Edition, but does not give rights to publish or display it.', + + 'delete': ' - Removes the Work from your Wallet. Note that the previous registration and transfer ' + + 'history will still exist on the blockchain and cannot be deleted.' + } + + , + 'exampleSentence': { + 'transfer': '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', + + 'consign': '(e.g. an artist Consigns 10 Editions of her new Work to a gallery ' + + 'so the gallery can sell them on her behalf, under the terms the artist and the gallery have agreed to)', + + 'loan': '(e.g. a collector Loans a Work to a gallery for one month for display in the gallery\'s show)', + + 'share': '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', + + 'delete': '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)' + } + }; + +export default informationTexts; \ No newline at end of file diff --git a/js/utils/general_utils.js b/js/utils/general_utils.js index ba2b7752..1dd8895f 100644 --- a/js/utils/general_utils.js +++ b/js/utils/general_utils.js @@ -221,4 +221,14 @@ export function truncateTextAtCharIndex(text, charIndex, replacement = '...') { truncatedText += text.length > charIndex ? replacement : ''; return truncatedText; +} + +/** + * @param index, int, the starting index of the substring to be replaced + * @param character, substring to be replaced + * @returns {string} + */ +export function replaceSubstringAtIndex(baseString, substrToReplace, stringToBePut) { + let index = baseString.indexOf(substrToReplace); + return baseString.substr(0, index) + stringToBePut + baseString.substr(index + substrToReplace.length); } \ No newline at end of file diff --git a/sass/main.scss b/sass/main.scss index 28789f57..9ddb0c36 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -465,7 +465,6 @@ hr { height: 12px; } - .ascribe-piece-list-filter-display { padding-left: 10px; padding-right: 10px; @@ -484,3 +483,8 @@ hr { border-color: #ccc; } } + +.modal-header-ascribe { + padding: 15px; + border-bottom: none; + min-height: 16.42857px; } \ No newline at end of file From 2d8753300985e313be28c32d4fd4433c3444572e Mon Sep 17 00:00:00 2001 From: Cevo Date: Wed, 14 Oct 2015 11:41:16 +0200 Subject: [PATCH 19/54] prop types added --- js/components/ascribe_buttons/acl_information_button.js | 6 ++++++ js/components/ascribe_information/acl_information.js | 7 +++++++ 2 files changed, 13 insertions(+) diff --git a/js/components/ascribe_buttons/acl_information_button.js b/js/components/ascribe_buttons/acl_information_button.js index efca1664..2daba3a9 100644 --- a/js/components/ascribe_buttons/acl_information_button.js +++ b/js/components/ascribe_buttons/acl_information_button.js @@ -8,6 +8,12 @@ import AclInformation from '../ascribe_information/acl_information'; import Button from 'react-bootstrap/lib/Button'; let AclInformationButton = React.createClass({ + propTypes: { + verbs: React.PropTypes.oneOfType([ + React.PropTypes.string, + React.PropTypes.arrayOf(React.PropTypes.string) + ]) + }, getInitialState() { return {isVisible: false}; }, diff --git a/js/components/ascribe_information/acl_information.js b/js/components/ascribe_information/acl_information.js index 80dc5f22..cc379e9c 100644 --- a/js/components/ascribe_information/acl_information.js +++ b/js/components/ascribe_information/acl_information.js @@ -6,6 +6,13 @@ import { getLangText } from '../../utils/lang_utils'; import { replaceSubstringAtIndex } from '../../utils/general_utils'; let AclInformation = React.createClass({ + propTypes: { + verbs: React.PropTypes.oneOfType([ + React.PropTypes.string, + React.PropTypes.arrayOf(React.PropTypes.string) + ]), + aim: React.PropTypes.string + }, render() { let titleStyle = { color: '#02B6A3', From f0761ec36b48f4a7b65fd73e85f76080c8b30e24 Mon Sep 17 00:00:00 2001 From: Cevo Date: Wed, 14 Oct 2015 12:16:49 +0200 Subject: [PATCH 20/54] acl information render refactored --- .../ascribe_information/acl_information.js | 57 ++++++++++--------- js/components/ascribe_modal/modal_wrapper.js | 4 +- 2 files changed, 31 insertions(+), 30 deletions(-) diff --git a/js/components/ascribe_information/acl_information.js b/js/components/ascribe_information/acl_information.js index cc379e9c..27a6faef 100644 --- a/js/components/ascribe_information/acl_information.js +++ b/js/components/ascribe_information/acl_information.js @@ -13,7 +13,7 @@ let AclInformation = React.createClass({ ]), aim: React.PropTypes.string }, - render() { + getInfoText(title, info, example){ let titleStyle = { color: '#02B6A3', fontSize: '11px', @@ -37,29 +37,30 @@ let AclInformation = React.createClass({ lineHeight: '15px', align: 'justify' }; - let enabledIndices = this.props.verbs; + let aim = this.props.aim; + + if (aim) { + if (aim === 'form') { + return (

+ {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
+ {example}

); + } + else if (aim === 'button') { + return (

{title} + {info}
+ {example}

); + } + } + else { + console.log('Aim is required when you want to place information text'); + } + }, + produceInformationBlock(){ + let enabledIndices = this.props.verbs; let titleList = informationTexts.title; let infoSentenceList = informationTexts.informationSentence; let exampleSentenceList = informationTexts.exampleSentence; - let createJSXTextSnippet = function(title, info, example){ - if (aim) { - if (aim === 'form') { - return (

- {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
- {example}

); - } - else if (aim === 'button') { - return (

{title} - {info}
- {example}

); - } - } - else { - console.log('Aim is required when you want to place information text'); - } - }; - let rows = null; let sortedIndices = ['share', 'transfer', 'consign', 'loan', 'delete']; let tempIndices = []; for (let i = 0; i < sortedIndices.length; i++){ @@ -72,16 +73,13 @@ let AclInformation = React.createClass({ } enabledIndices = tempIndices; if(Array.isArray(enabledIndices)) { - rows = enabledIndices.map((i)=> { - return (createJSXTextSnippet(getLangText(titleList[i]), getLangText(infoSentenceList[i]), - getLangText(exampleSentenceList[i]), - titleStyle, infoStyle, exampleStyle)); + return enabledIndices.map((i)=> { + return (this.getInfoText(getLangText(titleList[i]), getLangText(infoSentenceList[i]), + getLangText(exampleSentenceList[i]))); }); } else if (typeof enabledIndices === 'string'){ - rows = (createJSXTextSnippet(getLangText(titleList[enabledIndices]), getLangText(infoSentenceList[enabledIndices]), - getLangText(exampleSentenceList[enabledIndices]), - titleStyle, infoStyle, exampleStyle)); + return (this.getInfoText(getLangText(titleList[enabledIndices]), getLangText(infoSentenceList[enabledIndices]))); } else if (typeof enabledIndices === 'undefined'){ console.log('Verbs come undefined maybe you wrote verb instead of verbs?'); @@ -89,7 +87,10 @@ let AclInformation = React.createClass({ else { console.log('You need to supply an array of strings or string as verbs to AclInformation'); } - return ({rows}); + }, + render() { + console.log('Creation of information block'); + return ({this.produceInformationBlock()}); } }); diff --git a/js/components/ascribe_modal/modal_wrapper.js b/js/components/ascribe_modal/modal_wrapper.js index 877bb343..f66fb5ca 100644 --- a/js/components/ascribe_modal/modal_wrapper.js +++ b/js/components/ascribe_modal/modal_wrapper.js @@ -72,12 +72,12 @@ let ModalWrapper = React.createClass({ {trigger} - + {this.props.title} -
+
{this.renderChildren()}
From a0ab0769431e466a02f440bae52e37e5a17480ae Mon Sep 17 00:00:00 2001 From: Cevo Date: Wed, 14 Oct 2015 13:30:51 +0200 Subject: [PATCH 21/54] acl information render refactored --- js/components/ascribe_information/acl_information.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/ascribe_information/acl_information.js b/js/components/ascribe_information/acl_information.js index 27a6faef..50075532 100644 --- a/js/components/ascribe_information/acl_information.js +++ b/js/components/ascribe_information/acl_information.js @@ -56,7 +56,7 @@ let AclInformation = React.createClass({ console.log('Aim is required when you want to place information text'); } }, - produceInformationBlock(){ + produceInformationBlock() { let enabledIndices = this.props.verbs; let titleList = informationTexts.title; let infoSentenceList = informationTexts.informationSentence; From 2c8f262826f5c2a78e8fdf3eb53c89b263bbc336 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Thu, 15 Oct 2015 10:21:21 +0200 Subject: [PATCH 22/54] Add isRequired to aim prop --- js/components/ascribe_information/acl_information.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/ascribe_information/acl_information.js b/js/components/ascribe_information/acl_information.js index 50075532..878139cd 100644 --- a/js/components/ascribe_information/acl_information.js +++ b/js/components/ascribe_information/acl_information.js @@ -11,7 +11,7 @@ let AclInformation = React.createClass({ React.PropTypes.string, React.PropTypes.arrayOf(React.PropTypes.string) ]), - aim: React.PropTypes.string + aim: React.PropTypes.string.isRequired }, getInfoText(title, info, example){ let titleStyle = { From d77bdb25a5a235b75a36462ac47d106a7c629218 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Thu, 15 Oct 2015 11:17:16 +0200 Subject: [PATCH 23/54] Cleanup code --- .../ascribe_buttons/acl_information.js | 145 ++++++++++++++++++ .../ascribe_buttons/acl_information_button.js | 64 -------- .../ascribe_detail/edition_action_panel.js | 20 +-- .../ascribe_detail/piece_container.js | 6 + js/components/ascribe_forms/form_consign.js | 4 +- .../ascribe_forms/form_delete_edition.js | 4 +- js/components/ascribe_forms/form_loan.js | 4 +- .../ascribe_forms/form_share_email.js | 5 +- js/components/ascribe_forms/form_transfer.js | 4 +- .../ascribe_information/acl_information.js | 97 ------------ js/constants/information_text.js | 71 ++++----- js/utils/acl_utils.js | 2 +- package.json | 2 +- 13 files changed, 201 insertions(+), 227 deletions(-) create mode 100644 js/components/ascribe_buttons/acl_information.js delete mode 100644 js/components/ascribe_buttons/acl_information_button.js delete mode 100644 js/components/ascribe_information/acl_information.js diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js new file mode 100644 index 00000000..f1bce445 --- /dev/null +++ b/js/components/ascribe_buttons/acl_information.js @@ -0,0 +1,145 @@ +'use strict'; + +import React from 'react'; +import classnames from 'classnames'; + +import Button from 'react-bootstrap/lib/Button'; + +import { InformationTexts } from '../../constants/information_text'; +import { replaceSubstringAtIndex, sanitize } from '../../utils/general_utils'; +import { intersectAcls } from '../../utils/acl_utils'; +import { getLangText } from '../../utils/lang_utils'; + + +let AclInformation = React.createClass({ + propTypes: { + verbs: React.PropTypes.arrayOf(React.PropTypes.string), + aim: React.PropTypes.string.isRequired, + aclObject: React.PropTypes.object + }, + + getInitialState() { + return { isVisible: false }; + }, + + componentDidMount() { + this.dropdownButtonStyle = { + background: 'none', + color: 'black', + padding: 0, + border: 'none' + }; + + this.dropdownListStyle = { + textAlign: 'justify', + width: '80.8%', + border: '1px solid #CCC', + backgroundColor: 'white', + padding: '0.5em' + }; + }, + + onOff() { + if(!this.state.isVisible) { + this.setState({ isVisible: true }); + } + else { + this.setState({ isVisible: false }); + } + }, + + getInfoText(title, info, example){ + let titleStyle = { + color: '#02B6A3', + fontSize: '11px', + lineHeight: '3px' + }; + + let infoStyle = { + color: '#333333', + fontSize: '11px', + lineHeight: '3px' + }; + + let exampleStyle = { + color: '#B2B2B2', + fontSize: '11px', + lineHeight: '3px' + }; + + let paragraphStyle = { + margin: '0.1em', + lineHeight: '15px', + align: 'justify' + }; + + let aim = this.props.aim; + + if (aim) { + if (aim === 'form') { + return ( +

+ {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
+ {example} +

+ ); + } + else if (aim === 'button') { + return ( +

{title} + {info}
+ {example} +

+ ); + } + } + else { + console.log('Aim is required when you want to place information text'); + } + }, + + produceInformationBlock() { + const { titles, informationSentences, exampleSentences } = InformationTexts; + const {verbs, aim } = this.props; + + // sorting is not needed, as `this.props.verbs` takes care of sorting already + // So we assume a user of `AclInformationButton` puts an ordered version of + // `verbs` into `propTypes` + let verbsToDisplay = []; + if(aim === 'form') { + verbsToDisplay = verbsToDisplay.concat(verbs); + } else if(aim === 'button' && this.props.aclObject) { + const { aclObject } = this.props; + const sanitizedAclObject = sanitize(aclObject, (val) => !val); + verbsToDisplay = verbsToDisplay.concat(intersectAcls(verbs, Object.keys(sanitizedAclObject))); + } else { + console.warn('AclInformation can only be used with aim === "button" or aim === "form".' + + 'For aim === "button", aclObject needs to be defined.'); + } + + return verbsToDisplay.map((verb) => { + return this.getInfoText(getLangText(titles[verb]), getLangText(informationSentences[verb]), getLangText(exampleSentences[verb])); + }); + }, + + getButton() { + return this.props.aim === 'button' ? +
}> - +

{getLangText('Are you sure you would like to permanently delete this edition')}?

{getLangText('This is an irrevocable action%s', '.')}

diff --git a/js/components/ascribe_forms/form_loan.js b/js/components/ascribe_forms/form_loan.js index 838c09c1..46c49263 100644 --- a/js/components/ascribe_forms/form_loan.js +++ b/js/components/ascribe_forms/form_loan.js @@ -19,7 +19,7 @@ import AppConstants from '../../constants/application_constants'; import { mergeOptions } from '../../utils/general_utils'; import { getLangText } from '../../utils/lang_utils'; -import AclInformation from '../ascribe_information/acl_information'; +import AclInformation from '../ascribe_buttons/acl_information'; let LoanForm = React.createClass({ propTypes: { @@ -227,7 +227,7 @@ let LoanForm = React.createClass({

{this.props.loanHeading}

- +

}> - {console.log('hoho')} - + diff --git a/js/components/ascribe_forms/form_transfer.js b/js/components/ascribe_forms/form_transfer.js index f299406e..816736f1 100644 --- a/js/components/ascribe_forms/form_transfer.js +++ b/js/components/ascribe_forms/form_transfer.js @@ -9,7 +9,7 @@ import Form from './form'; import Property from './property'; import InputTextAreaToggable from './input_textarea_toggable'; -import AclInformation from '../ascribe_information/acl_information'; +import AclInformation from '../ascribe_buttons/acl_information'; import AppConstants from '../../constants/application_constants'; import { getLangText } from '../../utils/lang_utils.js'; @@ -50,7 +50,7 @@ let TransferForm = React.createClass({
}> - + diff --git a/js/components/ascribe_information/acl_information.js b/js/components/ascribe_information/acl_information.js deleted file mode 100644 index 878139cd..00000000 --- a/js/components/ascribe_information/acl_information.js +++ /dev/null @@ -1,97 +0,0 @@ -'use strict'; - -import React from 'react'; -import informationTexts from '../../constants/information_text'; -import { getLangText } from '../../utils/lang_utils'; -import { replaceSubstringAtIndex } from '../../utils/general_utils'; - -let AclInformation = React.createClass({ - propTypes: { - verbs: React.PropTypes.oneOfType([ - React.PropTypes.string, - React.PropTypes.arrayOf(React.PropTypes.string) - ]), - aim: React.PropTypes.string.isRequired - }, - getInfoText(title, info, example){ - let titleStyle = { - color: '#02B6A3', - fontSize: '11px', - lineHeight: '3px' - }; - - let infoStyle = { - color: '#333333', - fontSize: '11px', - lineHeight: '3px' - }; - - let exampleStyle = { - color: '#B2B2B2', - fontSize: '11px', - lineHeight: '3px' - }; - - let paragraphStyle = { - margin: '0.1em', - lineHeight: '15px', - align: 'justify' - }; - - let aim = this.props.aim; - - if (aim) { - if (aim === 'form') { - return (

- {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
- {example}

); - } - else if (aim === 'button') { - return (

{title} - {info}
- {example}

); - } - } - else { - console.log('Aim is required when you want to place information text'); - } - }, - produceInformationBlock() { - let enabledIndices = this.props.verbs; - let titleList = informationTexts.title; - let infoSentenceList = informationTexts.informationSentence; - let exampleSentenceList = informationTexts.exampleSentence; - let sortedIndices = ['share', 'transfer', 'consign', 'loan', 'delete']; - let tempIndices = []; - for (let i = 0; i < sortedIndices.length; i++){ - if (enabledIndices.indexOf(sortedIndices[i]) === -1){ - continue; - } - else{ - tempIndices.push(sortedIndices[i]); - } - } - enabledIndices = tempIndices; - if(Array.isArray(enabledIndices)) { - return enabledIndices.map((i)=> { - return (this.getInfoText(getLangText(titleList[i]), getLangText(infoSentenceList[i]), - getLangText(exampleSentenceList[i]))); - }); - } - else if (typeof enabledIndices === 'string'){ - return (this.getInfoText(getLangText(titleList[enabledIndices]), getLangText(infoSentenceList[enabledIndices]))); - } - else if (typeof enabledIndices === 'undefined'){ - console.log('Verbs come undefined maybe you wrote verb instead of verbs?'); - } - else { - console.log('You need to supply an array of strings or string as verbs to AclInformation'); - } - }, - render() { - console.log('Creation of information block'); - return ({this.produceInformationBlock()}); - } -}); - -export default AclInformation; diff --git a/js/constants/information_text.js b/js/constants/information_text.js index 91c61183..ec87ef73 100644 --- a/js/constants/information_text.js +++ b/js/constants/information_text.js @@ -1,42 +1,37 @@ 'use strict'; -const informationTexts = { - - 'title': { - 'transfer': 'TRANSFER', - 'consign': 'CONSIGN', - 'loan': 'LOAN', - 'share': 'SHARE', - 'delete': 'DELETE'}, - - 'informationSentence': { - - 'transfer': ' - Changes ownership of an Edition. As with a physical piece of work, ' + - 'transferring ownership of an Edition does not transfer copyright in the Work.', - - 'consign': ' - Lets someone represent you in dealing with the work, under the terms you agree to.', - - 'loan': ' - Lets someone use or put the Work on display for a limited amount of time.', - - 'share': ' - Lets someone view the Work or Edition, but does not give rights to publish or display it.', - - 'delete': ' - Removes the Work from your Wallet. Note that the previous registration and transfer ' + - 'history will still exist on the blockchain and cannot be deleted.' - } - - , - 'exampleSentence': { - 'transfer': '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', - - 'consign': '(e.g. an artist Consigns 10 Editions of her new Work to a gallery ' + +export const InformationTexts = { + 'titles': { + 'acl_transfer': 'TRANSFER', + 'acl_consign': 'CONSIGN', + 'acl_loan': 'LOAN', + 'acl_share': 'SHARE', + 'acl_delete': 'DELETE', + 'acl_create_editions': 'CREATE EDITIONS', + 'acl_unconsign': 'UNCONSIGN', + 'acl_request_unconsign': 'REQUEST UNCONSIGN' + }, + 'informationSentences': { + 'acl_transfer': ' - Changes ownership of an Edition. As with a physical piece of work, ' + + 'transferring ownership of an Edition does not transfer copyright in the Work.', + 'acl_consign': ' - Lets someone represent you in dealing with the work, under the terms you agree to.', + 'acl_loan': ' - Lets someone use or put the Work on display for a limited amount of time.', + 'acl_share': ' - Lets someone view the Work or Edition, but does not give rights to publish or display it.', + 'acl_delete': ' - Removes the Work from your Wallet. Note that the previous registration and transfer ' + + 'history will still exist on the blockchain and cannot be deleted.', + 'acl_create_editions': '', + 'acl_unconsign': '', + 'acl_request_unconsign': '' + }, + 'exampleSentences': { + 'acl_transfer': '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', + 'acl_consign': '(e.g. an artist Consigns 10 Editions of her new Work to a gallery ' + 'so the gallery can sell them on her behalf, under the terms the artist and the gallery have agreed to)', - - 'loan': '(e.g. a collector Loans a Work to a gallery for one month for display in the gallery\'s show)', - - 'share': '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', - - 'delete': '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)' + 'acl_loan': '(e.g. a collector Loans a Work to a gallery for one month for display in the gallery\'s show)', + 'acl_share': '(e.g. a photographer Shares proofs of a graduation photo with the graduate\'s grandparents)', + 'acl_delete': '(e.g. an artist uploaded the wrong file and doesn\'t want it cluttering his Wallet, so he Deletes it)', + 'acl_create_editions': '', + 'acl_unconsign': '', + 'acl_request_unconsign': '' } - }; - -export default informationTexts; \ No newline at end of file +}; \ No newline at end of file diff --git a/js/utils/acl_utils.js b/js/utils/acl_utils.js index f0075f55..a3998576 100644 --- a/js/utils/acl_utils.js +++ b/js/utils/acl_utils.js @@ -2,7 +2,7 @@ import { sanitize } from './general_utils'; -function intersectAcls(a, b) { +export function intersectAcls(a, b) { return a.filter((val) => b.indexOf(val) > -1); } diff --git a/package.json b/package.json index 0e41d714..99b7eef1 100644 --- a/package.json +++ b/package.json @@ -73,7 +73,7 @@ "q": "^1.4.1", "raven-js": "^1.1.19", "react": "^0.13.2", - "react-bootstrap": "^0.25.1", + "react-bootstrap": "0.25.1", "react-datepicker": "^0.12.0", "react-router": "^0.13.3", "react-router-bootstrap": "~0.16.0", From c7c83083d3c1293eff8a9223a0d7671884b6f20e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Thu, 15 Oct 2015 11:32:34 +0200 Subject: [PATCH 24/54] change layout of AclButtonList --- js/components/ascribe_detail/edition_action_panel.js | 2 +- js/components/ascribe_detail/piece_container.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/js/components/ascribe_detail/edition_action_panel.js b/js/components/ascribe_detail/edition_action_panel.js index 32fd0d07..d879ae40 100644 --- a/js/components/ascribe_detail/edition_action_panel.js +++ b/js/components/ascribe_detail/edition_action_panel.js @@ -105,7 +105,7 @@ let EditionActionPanel = React.createClass({ diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index 505846b0..017f127c 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -189,7 +189,7 @@ let PieceContainer = React.createClass({ else { return ( From 702f1d29f3ae0a2c954e96ca526a15077ca34d53 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Thu, 15 Oct 2015 11:41:46 +0200 Subject: [PATCH 25/54] Styling --- .../ascribe_accordion_list/accordion_list_item_wallet.js | 3 ++- js/components/ascribe_buttons/acl_information.js | 2 +- sass/main.scss | 7 +++---- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js index c8e63faa..9af40a67 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js @@ -143,7 +143,8 @@ let AccordionListItemWallet = React.createClass({ toggleCreateEditionsDialog={this.toggleCreateEditionsDialog} onPollingSuccess={this.onPollingSuccess}/> - }> + } + badge={this.getGlyphicon()}> {this.getCreateEditionsDialog()} {/* this.props.children is AccordionListItemTableEditions */} {this.props.children} diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js index f1bce445..69133f0a 100644 --- a/js/components/ascribe_buttons/acl_information.js +++ b/js/components/ascribe_buttons/acl_information.js @@ -68,7 +68,7 @@ let AclInformation = React.createClass({ }; let paragraphStyle = { - margin: '0.1em', + margin: '.5em', lineHeight: '15px', align: 'justify' }; diff --git a/sass/main.scss b/sass/main.scss index 98e6a114..2699700d 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -485,10 +485,9 @@ hr { } } -.modal-header-ascribe { - padding: 15px; - border-bottom: none; - min-height: 16.42857px; +.modal-header { + padding: 15px 15px 0 15px; + border-bottom: none; } .error-wrapper { From 22a95f07fd0a1d2b778e645bb0053385dfdc4436 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 20 Oct 2015 15:10:18 +0200 Subject: [PATCH 26/54] Further cleanup --- js/components/ascribe_buttons/acl_button.js | 8 +- .../ascribe_buttons/acl_button_list.js | 2 +- .../ascribe_buttons/acl_information.js | 80 ++++++------------- js/components/ascribe_modal/modal_wrapper.js | 16 +--- sass/ascribe_acl_information.scss | 28 +++++++ sass/lib/buttons.scss | 8 ++ sass/lib/modals.scss | 4 + sass/main.scss | 12 +-- 8 files changed, 77 insertions(+), 81 deletions(-) create mode 100644 sass/ascribe_acl_information.scss create mode 100644 sass/lib/modals.scss diff --git a/js/components/ascribe_buttons/acl_button.js b/js/components/ascribe_buttons/acl_button.js index 21db4bc7..002a91cb 100644 --- a/js/components/ascribe_buttons/acl_button.js +++ b/js/components/ascribe_buttons/acl_button.js @@ -169,12 +169,14 @@ let AclButton = React.createClass({ return ( + } - handleSuccess = {aclProps.handleSuccess} - title = {aclProps.title}> + handleSuccess={aclProps.handleSuccess} + title={aclProps.title}> {aclProps.form} ); diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index 5af40c00..72ee5a2b 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -43,7 +43,7 @@ let AclButtonList = React.createClass({ render() { return ( -
+
- {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
- {example} +

+ + {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
+ + + {example} +

); } else if (aim === 'button') { return ( -

{title} - {info}
- {example} +

+ + {title} + + + {info}
+ + + {example} +

); } @@ -100,7 +68,7 @@ let AclInformation = React.createClass({ produceInformationBlock() { const { titles, informationSentences, exampleSentences } = InformationTexts; - const {verbs, aim } = this.props; + const { verbs, aim } = this.props; // sorting is not needed, as `this.props.verbs` takes care of sorting already // So we assume a user of `AclInformationButton` puts an ordered version of @@ -124,17 +92,21 @@ let AclInformation = React.createClass({ getButton() { return this.props.aim === 'button' ? - } diff --git a/sass/lib/modals.scss b/sass/lib/modals.scss index 3eb45c54..20a720c1 100644 --- a/sass/lib/modals.scss +++ b/sass/lib/modals.scss @@ -1,3 +1,7 @@ +.modal-body { + padding-top:0; +} + .modal-header { padding: 15px 15px 0 15px; border-bottom: none; From 738e94a43d49da0e6635310f5418e4304b1976f5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 20 Oct 2015 17:22:40 +0200 Subject: [PATCH 29/54] Change helper texts --- js/components/ascribe_detail/edition_action_panel.js | 2 +- js/components/ascribe_detail/piece_container.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/js/components/ascribe_detail/edition_action_panel.js b/js/components/ascribe_detail/edition_action_panel.js index d879ae40..9a0c9456 100644 --- a/js/components/ascribe_detail/edition_action_panel.js +++ b/js/components/ascribe_detail/edition_action_panel.js @@ -162,7 +162,7 @@ let EditionActionPanel = React.createClass({ editions={[edition]}/> diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index 017f127c..5eccbb6d 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -204,7 +204,7 @@ let PieceContainer = React.createClass({ piece={this.state.piece}/> ); From 8417c2781e619fd4cbd2a541a310c1b42d150884 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 20 Oct 2015 18:00:59 +0200 Subject: [PATCH 30/54] Making AclInformation more robust by adding checks for if the information to display is available --- js/components/ascribe_buttons/acl_information.js | 12 ++++++++---- js/constants/information_text.js | 4 ---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js index 5a18c2d5..af510d71 100644 --- a/js/components/ascribe_buttons/acl_information.js +++ b/js/components/ascribe_buttons/acl_information.js @@ -32,8 +32,8 @@ let AclInformation = React.createClass({ getInfoText(title, info, example){ let aim = this.props.aim; - if (aim) { - if (aim === 'form') { + if(aim) { + if(aim === 'form') { return (

@@ -45,7 +45,7 @@ let AclInformation = React.createClass({

); } - else if (aim === 'button') { + else if(aim === 'button') { return (

@@ -70,11 +70,15 @@ let AclInformation = React.createClass({ const { titles, informationSentences, exampleSentences } = InformationTexts; const { verbs, aim } = this.props; + const availableInformations = intersectAcls(verbs, Object.keys(titles)); + // sorting is not needed, as `this.props.verbs` takes care of sorting already // So we assume a user of `AclInformationButton` puts an ordered version of // `verbs` into `propTypes` let verbsToDisplay = []; - if(aim === 'form') { + + + if(aim === 'form' && availableInformations.length > 0) { verbsToDisplay = verbsToDisplay.concat(verbs); } else if(aim === 'button' && this.props.aclObject) { const { aclObject } = this.props; diff --git a/js/constants/information_text.js b/js/constants/information_text.js index 679ae8ac..442e481e 100644 --- a/js/constants/information_text.js +++ b/js/constants/information_text.js @@ -2,7 +2,6 @@ export const InformationTexts = { 'titles': { - 'acl_transfer': 'TRANSFER', 'acl_consign': 'CONSIGN', 'acl_loan': 'LOAN', 'acl_share': 'SHARE', @@ -12,8 +11,6 @@ export const InformationTexts = { 'acl_request_unconsign': 'REQUEST UNCONSIGN' }, 'informationSentences': { - 'acl_transfer': ' - Changes ownership of an Edition. As with a physical piece of work, ' + - 'transferring ownership of an Edition does not transfer copyright in the Work.', 'acl_consign': ' - Lets someone represent you in dealing with the work, under the terms you agree to.', 'acl_loan': ' - Lets someone use or put the Work on display for a limited amount of time.', 'acl_share': ' - Lets someone view the Work or Edition, but does not give rights to publish or display it.', @@ -24,7 +21,6 @@ export const InformationTexts = { 'acl_request_unconsign': 'Lets the owner ask the consignee to confirm that they will no longer manage the work.' }, 'exampleSentences': { - 'acl_transfer': '(e.g. a musician Transfers limited edition 1 of 10 of her new album to a very happy fan)', 'acl_consign': '(e.g. an artist Consigns 10 Editions of her new Work to a gallery ' + 'so the gallery can sell them on her behalf, under the terms the artist and the gallery have agreed to)', 'acl_loan': '(e.g. a collector Loans a Work to a gallery for one month for display in the gallery\'s show)', From ddc2e7b919f5643b7d910384e204c82f6669d1e1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 20 Oct 2015 18:10:48 +0200 Subject: [PATCH 31/54] Rename intersectAcls to intersectList and do some clean up --- js/components/ascribe_buttons/acl_information.js | 10 +++------- js/components/ascribe_forms/form_delete_piece.js | 3 +++ js/utils/acl_utils.js | 8 ++------ js/utils/general_utils.js | 10 ++++++++++ 4 files changed, 18 insertions(+), 13 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js index af510d71..2d7533ec 100644 --- a/js/components/ascribe_buttons/acl_information.js +++ b/js/components/ascribe_buttons/acl_information.js @@ -4,8 +4,7 @@ import React from 'react'; import classnames from 'classnames'; import { InformationTexts } from '../../constants/information_text'; -import { replaceSubstringAtIndex, sanitize } from '../../utils/general_utils'; -import { intersectAcls } from '../../utils/acl_utils'; +import { replaceSubstringAtIndex, sanitize, intersectLists } from '../../utils/general_utils'; import { getLangText } from '../../utils/lang_utils'; @@ -70,7 +69,7 @@ let AclInformation = React.createClass({ const { titles, informationSentences, exampleSentences } = InformationTexts; const { verbs, aim } = this.props; - const availableInformations = intersectAcls(verbs, Object.keys(titles)); + const availableInformations = intersectLists(verbs, Object.keys(titles)); // sorting is not needed, as `this.props.verbs` takes care of sorting already // So we assume a user of `AclInformationButton` puts an ordered version of @@ -83,10 +82,7 @@ let AclInformation = React.createClass({ } else if(aim === 'button' && this.props.aclObject) { const { aclObject } = this.props; const sanitizedAclObject = sanitize(aclObject, (val) => !val); - verbsToDisplay = verbsToDisplay.concat(intersectAcls(verbs, Object.keys(sanitizedAclObject))); - } else { - console.warn('AclInformation can only be used with aim === "button" or aim === "form".' + - 'For aim === "button", aclObject needs to be defined.'); + verbsToDisplay = verbsToDisplay.concat(intersectLists(verbs, Object.keys(sanitizedAclObject))); } return verbsToDisplay.map((verb) => { diff --git a/js/components/ascribe_forms/form_delete_piece.js b/js/components/ascribe_forms/form_delete_piece.js index 552c38c0..80b08f37 100644 --- a/js/components/ascribe_forms/form_delete_piece.js +++ b/js/components/ascribe_forms/form_delete_piece.js @@ -4,6 +4,8 @@ import React from 'react'; import Form from '../ascribe_forms/form'; +import AclInformation from '../ascribe_buttons/acl_information'; + import ApiUrls from '../../constants/api_urls'; import AppConstants from '../../constants/application_constants'; @@ -49,6 +51,7 @@ let PieceDeleteForm = React.createClass({

}> +

{getLangText('Are you sure you would like to permanently delete this piece')}?

{getLangText('This is an irrevocable action%s', '.')}

diff --git a/js/utils/acl_utils.js b/js/utils/acl_utils.js index a3998576..fc3987c1 100644 --- a/js/utils/acl_utils.js +++ b/js/utils/acl_utils.js @@ -1,10 +1,6 @@ 'use strict'; -import { sanitize } from './general_utils'; - -export function intersectAcls(a, b) { - return a.filter((val) => b.indexOf(val) > -1); -} +import { sanitize, intersectLists } from './general_utils'; export function getAvailableAcls(editions, filterFn) { let availableAcls = []; @@ -44,7 +40,7 @@ export function getAvailableAcls(editions, filterFn) { } if(editionsCopy.length >= 2) { for(let i = 1; i < editionsCopy.length; i++) { - availableAcls = intersectAcls(availableAcls, editionsCopy[i].acl); + availableAcls = intersectLists(availableAcls, editionsCopy[i].acl); } } diff --git a/js/utils/general_utils.js b/js/utils/general_utils.js index af4cb752..fb1a71fa 100644 --- a/js/utils/general_utils.js +++ b/js/utils/general_utils.js @@ -242,4 +242,14 @@ export function getSubdomain() { let { host } = window.location; let tokens = host.split('.'); return tokens.length > 2 ? tokens[0] : 'www'; +} + +/** + * Takes two lists and returns their intersection as a list + * @param {Array} a + * @param {Array} b + * @return {[Array]} Intersected list of a and b + */ +export function intersectLists(a, b) { + return a.filter((val) => b.indexOf(val) > -1); } \ No newline at end of file From 3f97d0923831e74891eae6fde68fb99408f73530 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Thu, 22 Oct 2015 16:51:49 +0200 Subject: [PATCH 32/54] Readd chrome specific styles --- index.html | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/index.html b/index.html index 28b4d222..284b7dd4 100644 --- a/index.html +++ b/index.html @@ -2,6 +2,12 @@ + + + + + + ascribe From b77beb0b1e7df34e4817674b97cb4714d9f9f735 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Thu, 22 Oct 2015 17:17:38 +0200 Subject: [PATCH 33/54] Replace last occurences of ascribe-spool-chunked --- .../accordion_list_item_table_editions.js | 4 +++- js/components/ascribe_spinner.js | 13 +++++++------ .../wallet/components/cyland/cyland_landing.js | 9 +++++---- 3 files changed, 15 insertions(+), 11 deletions(-) diff --git a/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js b/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js index 7e258267..23cfb239 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js @@ -14,10 +14,12 @@ import { ColumnModel, TransitionModel } from '../ascribe_table/models/table_mode import TableItemText from '../ascribe_table/table_item_text'; import TableItemCheckbox from '../ascribe_table/table_item_checkbox'; import TableItemAclFiltered from '../ascribe_table/table_item_acl_filtered'; +import AscribeSpinner from '../ascribe_spinner'; import { getLangText } from '../../utils/lang_utils'; import { mergeOptions } from '../../utils/general_utils'; + let AccordionListItemTableEditions = React.createClass({ propTypes: { @@ -88,7 +90,7 @@ let AccordionListItemTableEditions = React.createClass({ let showExpandOption = false; let editionsForPiece = this.state.editionList[this.props.parentId]; - let loadingSpinner = ; + let loadingSpinner = ; // here we need to check if all editions of a specific // piece are already defined. Otherwise .length will throw an error and we'll not diff --git a/js/components/ascribe_spinner.js b/js/components/ascribe_spinner.js index ecdf641b..e1daf5b2 100644 --- a/js/components/ascribe_spinner.js +++ b/js/components/ascribe_spinner.js @@ -20,12 +20,13 @@ let AscribeSpinner = React.createClass({ render() { return ( -
-
-
A
+
+
+
A
); } diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_landing.js b/js/components/whitelabel/wallet/components/cyland/cyland_landing.js index 8a6c38b5..63085fc9 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_landing.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_landing.js @@ -3,7 +3,6 @@ import React from 'react'; import { History } from 'react-router'; - import WhitelabelActions from '../../../../../actions/whitelabel_actions'; import WhitelabelStore from '../../../../../stores/whitelabel_store'; @@ -14,10 +13,13 @@ import LinkContainer from 'react-router-bootstrap/lib/LinkContainer'; import UserStore from '../../../../../stores/user_store'; import UserActions from '../../../../../actions/user_actions'; +import AscribeSpinner from '../../../../ascribe_spinner'; + import { mergeOptions } from '../../../../../utils/general_utils'; import { getLangText } from '../../../../../utils/lang_utils'; import { setDocumentTitle } from '../../../../../utils/dom_utils'; + let CylandLanding = React.createClass({ mixins: [History], @@ -61,10 +63,9 @@ let CylandLanding = React.createClass({
- {getLangText('Submissions to Cyland Archive are powered by')} + {getLangText('Submissions to Cyland Archive are powered by') + ' '} - ascribe - +
From e8a9cd89a405f51fcf857a56c9345a79ae80b6a2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Fri, 23 Oct 2015 09:29:17 +0200 Subject: [PATCH 34/54] Add resizing functionality to AclButtonList and AclInformation --- .../ascribe_buttons/acl_button_list.js | 85 +++++++++++++------ .../ascribe_buttons/acl_information.js | 19 ++++- .../ascribe_buttons/delete_button.js | 4 +- js/components/ascribe_detail/edition.js | 28 +++++- .../ascribe_detail/edition_action_panel.js | 2 +- sass/ascribe_acl_information.scss | 7 +- 6 files changed, 107 insertions(+), 38 deletions(-) diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index 72ee5a2b..28b49fa8 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -1,12 +1,14 @@ 'use strict'; -import React from 'react'; +import React from 'react/addons'; import UserActions from '../../actions/user_actions'; import UserStore from '../../stores/user_store'; import AclButton from '../ascribe_buttons/acl_button'; +import { mergeOptions } from '../../utils/general_utils'; + let AclButtonList = React.createClass({ propTypes: { @@ -25,57 +27,90 @@ let AclButtonList = React.createClass({ }, getInitialState() { - return UserStore.getState(); + return mergeOptions( + UserStore.getState(), + { + buttonListSize: 0 + } + ); }, componentDidMount() { UserStore.listen(this.onChange); UserActions.fetchCurrentUser(); + + window.addEventListener('resize', this.handleResize); + window.dispatchEvent(new Event('resize')); }, componentWillUnmount() { UserStore.unlisten(this.onChange); + + window.removeEventListener('resize', this.handleResize); + }, + + handleResize() { + this.setState({ + buttonListSize: this.refs.buttonList.getDOMNode().offsetWidth + }); }, onChange(state) { this.setState(state); }, + renderChildren() { + const { children } = this.props; + const { buttonListSize } = this.state; + + return React.Children.map(children, (child) => { + return React.addons.cloneWithProps(child, { buttonListSize }); + }); + }, + render() { + const { className, + buttonsStyle, + availableAcls, + editions, + handleSuccess } = this.props; + + const { currentUser } = this.state; + return ( -
- +
+ + pieceOrEditions={editions} + currentUser={currentUser} + handleSuccess={handleSuccess} /> + pieceOrEditions={editions} + currentUser={currentUser} + handleSuccess={handleSuccess}/> + pieceOrEditions={editions} + currentUser={currentUser} + handleSuccess={handleSuccess} /> + pieceOrEditions={editions} + currentUser={currentUser} + handleSuccess={handleSuccess} /> - {this.props.children} + pieceOrEditions={editions} + currentUser={currentUser} + handleSuccess={handleSuccess} /> + {this.renderChildren()}
); diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js index 2d7533ec..59ffd561 100644 --- a/js/components/ascribe_buttons/acl_information.js +++ b/js/components/ascribe_buttons/acl_information.js @@ -12,7 +12,16 @@ let AclInformation = React.createClass({ propTypes: { verbs: React.PropTypes.arrayOf(React.PropTypes.string), aim: React.PropTypes.string.isRequired, - aclObject: React.PropTypes.object + aclObject: React.PropTypes.object, + + // Must be inserted from the outside + buttonListSize: React.PropTypes.number.isRequired + }, + + getDefaultProps() { + return { + buttonListSize: 400 + }; }, getInitialState() { @@ -99,13 +108,19 @@ let AclInformation = React.createClass({ }, render() { - const { aim } = this.props; + const { aim, buttonListSize } = this.props; const { isVisible } = this.state; + /* Lets just fucking get this widget out... */ + const aclInformationSize = buttonListSize - 33; + return ( {this.getButton()}
300 ? aclInformationSize : 400 + }} className={classnames({'acl-information-dropdown-list': true, 'hidden': aim === 'button' && !isVisible})}> {this.produceInformationBlock()}
diff --git a/js/components/ascribe_buttons/delete_button.js b/js/components/ascribe_buttons/delete_button.js index 4f85c595..d974a8fa 100644 --- a/js/components/ascribe_buttons/delete_button.js +++ b/js/components/ascribe_buttons/delete_button.js @@ -45,7 +45,7 @@ let DeleteButton = React.createClass({ title = getLangText('Delete Edition'); } - btnDelete = ; + btnDelete = ; } else if(availableAcls.acl_unshare){ @@ -57,7 +57,7 @@ let DeleteButton = React.createClass({ title = getLangText('Remove Piece from Collection'); } - btnDelete = ; + btnDelete = ; } else { return null; diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 9ee858a7..fda3eee8 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -211,10 +211,30 @@ let EditionSummary = React.createClass({ value={ edition.owner } /> {this.getStatus()} - +
+
+
+ { this.props.label } { this.props.separator} +
+
+ {value} +
+
+
+
+
+ Actions +
+
+ +
+
);
); diff --git a/js/components/ascribe_detail/edition_action_panel.js b/js/components/ascribe_detail/edition_action_panel.js index c4732729..6beda543 100644 --- a/js/components/ascribe_detail/edition_action_panel.js +++ b/js/components/ascribe_detail/edition_action_panel.js @@ -124,7 +124,7 @@ let EditionActionPanel = React.createClass({ type="text" value={edition.bitcoin_id} /> - diff --git a/sass/ascribe_acl_information.scss b/sass/ascribe_acl_information.scss index 28c7846c..50bbb4ec 100644 --- a/sass/ascribe_acl_information.scss +++ b/sass/ascribe_acl_information.scss @@ -1,6 +1,5 @@ .acl-information-dropdown-list { text-align: justify; - background-color: white; padding: .5em .5em .5em 0; p { @@ -15,14 +14,14 @@ } .title { - color: #02B6A3; + color: $ascribe-dark-blue; } .info { - color: #333333; + color: #212121; } .example { - color: #B2B2B2; + color: #616161; } } \ No newline at end of file From cd3c8b8f6e7be1bfd56908892b3be2af3817b7f6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Fri, 23 Oct 2015 10:37:23 +0200 Subject: [PATCH 35/54] Complete visual styling --- .../ascribe_buttons/acl_information.js | 11 ++--- .../ascribe_detail/detail_property.js | 38 ++++++++-------- js/components/ascribe_detail/edition.js | 31 +++---------- .../ascribe_detail/piece_container.js | 43 ++++++++++--------- js/components/ascribe_forms/form_loan.js | 1 - sass/ascribe_acl_information.scss | 6 +-- sass/ascribe_edition.scss | 6 +-- sass/lib/buttons.scss | 1 + sass/main.scss | 1 + 9 files changed, 57 insertions(+), 81 deletions(-) diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js index 59ffd561..f40d2ce7 100644 --- a/js/components/ascribe_buttons/acl_information.js +++ b/js/components/ascribe_buttons/acl_information.js @@ -45,7 +45,7 @@ let AclInformation = React.createClass({ return (

- {replaceSubstringAtIndex(info.slice(2), 's ', ' ')}
+ {replaceSubstringAtIndex(info.slice(2), 's ', ' ')} {example} @@ -60,7 +60,7 @@ let AclInformation = React.createClass({ {title} - {info}
+ {info + ' '} {example} @@ -108,18 +108,19 @@ let AclInformation = React.createClass({ }, render() { - const { aim, buttonListSize } = this.props; + const { aim, buttonListSize, verbs } = this.props; const { isVisible } = this.state; /* Lets just fucking get this widget out... */ - const aclInformationSize = buttonListSize - 33; + const aclInformationSize = buttonListSize - 30; return ( {this.getButton()}

300 ? aclInformationSize : 400 + width: aclInformationSize > 300 ? aclInformationSize : 400, + marginLeft: verbs.length === 1 ? '.25em' : null }} className={classnames({'acl-information-dropdown-list': true, 'hidden': aim === 'button' && !isVisible})}> {this.produceInformationBlock()} diff --git a/js/components/ascribe_detail/detail_property.js b/js/components/ascribe_detail/detail_property.js index 828ed81a..9ea37285 100644 --- a/js/components/ascribe_detail/detail_property.js +++ b/js/components/ascribe_detail/detail_property.js @@ -2,6 +2,7 @@ import React from 'react'; + let DetailProperty = React.createClass({ propTypes: { label: React.PropTypes.string, @@ -12,20 +13,29 @@ let DetailProperty = React.createClass({ separator: React.PropTypes.string, labelClassName: React.PropTypes.string, valueClassName: React.PropTypes.string, - ellipsis: React.PropTypes.bool + ellipsis: React.PropTypes.bool, + children: React.PropTypes.oneOfType([ + React.PropTypes.arrayOf(React.PropTypes.element), + React.PropTypes.element + ]) }, getDefaultProps() { return { separator: '', - labelClassName: 'col-xs-3 col-sm-3 col-md-2 col-lg-2 col-xs-height col-bottom ascribe-detail-property-label', + labelClassName: 'col-xs-3 col-sm-3 col-md-2 col-lg-2 col-xs-height ascribe-detail-property-label', valueClassName: 'col-xs-9 col-sm-9 col-md-10 col-lg-10 col-xs-height col-bottom ascribe-detail-property-value' }; }, render() { - let value = this.props.value; let styles = {}; + const { labelClassName, + label, + separator, + valueClassName, + children, + value } = this.props; if(this.props.ellipsis) { styles = { @@ -35,30 +45,16 @@ let DetailProperty = React.createClass({ }; } - - if (this.props.children){ - value = ( -
-
- { this.props.value } -
-
- { this.props.children } -
-
); - } return (
-
- { this.props.label } { this.props.separator} +
+ {label} {separator}
- {value} + {children || value}
diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index fda3eee8..ccab60a0 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -211,30 +211,13 @@ let EditionSummary = React.createClass({ value={ edition.owner } /> {this.getStatus()} -
-
-
- { this.props.label } { this.props.separator} -
-
- {value} -
-
-
-
-
- Actions -
-
- -
-
); + + +
); diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index b03e11ed..f8a2369f 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -190,28 +190,29 @@ let PieceContainer = React.createClass({ currentUser={this.state.currentUser} handleSuccess={this.loadPiece} notifications={this.state.piece.notifications}/>); - } - else { + } else { return ( - - - - - + + + + + + + ); } }, diff --git a/js/components/ascribe_forms/form_loan.js b/js/components/ascribe_forms/form_loan.js index dd9e3b34..d6102f14 100644 --- a/js/components/ascribe_forms/form_loan.js +++ b/js/components/ascribe_forms/form_loan.js @@ -233,7 +233,6 @@ let LoanForm = React.createClass({

{this.props.loanHeading}

-

Date: Fri, 23 Oct 2015 11:24:26 +0200 Subject: [PATCH 36/54] Finalizing behavior of AclInformation --- js/components/ascribe_buttons/acl_button_list.js | 6 ++++++ js/components/ascribe_buttons/acl_information.js | 4 ++-- sass/variables.scss | 2 +- 3 files changed, 9 insertions(+), 3 deletions(-) diff --git a/js/components/ascribe_buttons/acl_button_list.js b/js/components/ascribe_buttons/acl_button_list.js index 28b49fa8..e87a6407 100644 --- a/js/components/ascribe_buttons/acl_button_list.js +++ b/js/components/ascribe_buttons/acl_button_list.js @@ -43,6 +43,12 @@ let AclButtonList = React.createClass({ window.dispatchEvent(new Event('resize')); }, + componentDidUpdate(prevProps) { + if(prevProps.availableAcls && prevProps.availableAcls !== this.props.availableAcls) { + window.dispatchEvent(new Event('resize')); + } + }, + componentWillUnmount() { UserStore.unlisten(this.onChange); diff --git a/js/components/ascribe_buttons/acl_information.js b/js/components/ascribe_buttons/acl_information.js index f40d2ce7..8d412e02 100644 --- a/js/components/ascribe_buttons/acl_information.js +++ b/js/components/ascribe_buttons/acl_information.js @@ -48,7 +48,7 @@ let AclInformation = React.createClass({ {replaceSubstringAtIndex(info.slice(2), 's ', ' ')} - {example} + {' ' + example}

); @@ -119,7 +119,7 @@ let AclInformation = React.createClass({ {this.getButton()}
300 ? aclInformationSize : 400, + width: verbs.length > 1 && aclInformationSize > 300 ? aclInformationSize : verbs.length === 1 ? null : '100%', marginLeft: verbs.length === 1 ? '.25em' : null }} className={classnames({'acl-information-dropdown-list': true, 'hidden': aim === 'button' && !isVisible})}> diff --git a/sass/variables.scss b/sass/variables.scss index ccd48864..ac93a2fb 100644 --- a/sass/variables.scss +++ b/sass/variables.scss @@ -613,7 +613,7 @@ $modal-header-border-color: #e5e5e5 !default; $modal-footer-border-color: $modal-header-border-color !default; $modal-lg: 900px !default; -$modal-md: 600px !default; +$modal-md: 500px !default; $modal-sm: 300px !default; From 1f7addb88699d4029cd91fabf0fd6c0bb9f803e4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Fri, 23 Oct 2015 11:34:58 +0200 Subject: [PATCH 37/54] Adding whitelabel colors for AclInformation --- sass/whitelabel/prize/sluice/sluice_custom_style.scss | 4 ++++ sass/whitelabel/wallet/cc/cc_custom_style.scss | 4 ++++ sass/whitelabel/wallet/cyland/cyland_custom_style.scss | 4 ++++ sass/whitelabel/wallet/ikonotv/ikonotv_custom_style.scss | 4 ++++ 4 files changed, 16 insertions(+) diff --git a/sass/whitelabel/prize/sluice/sluice_custom_style.scss b/sass/whitelabel/prize/sluice/sluice_custom_style.scss index e2ceeeb3..4cfb7c82 100644 --- a/sass/whitelabel/prize/sluice/sluice_custom_style.scss +++ b/sass/whitelabel/prize/sluice/sluice_custom_style.scss @@ -251,3 +251,7 @@ $sluice--button-color: $sluice--nav-fg-prim-color; .client--sluice .ascribe-progress-bar > .progress-bar { background-color: $sluice--button-color; } + +.client--sluice .acl-information-dropdown-list .title { + color: $sluice--button-color; +} \ No newline at end of file diff --git a/sass/whitelabel/wallet/cc/cc_custom_style.scss b/sass/whitelabel/wallet/cc/cc_custom_style.scss index 238937e7..44cb0dd1 100644 --- a/sass/whitelabel/wallet/cc/cc_custom_style.scss +++ b/sass/whitelabel/wallet/cc/cc_custom_style.scss @@ -204,3 +204,7 @@ $cc--button-color: $cc--nav-fg-prim-color; .client--cc .ascribe-progress-bar > .progress-bar { background-color: $cc--button-color; } + +.client--cc .acl-information-dropdown-list .title { + color: $cc--button-color; +} \ No newline at end of file diff --git a/sass/whitelabel/wallet/cyland/cyland_custom_style.scss b/sass/whitelabel/wallet/cyland/cyland_custom_style.scss index c33e247b..eaf45621 100644 --- a/sass/whitelabel/wallet/cyland/cyland_custom_style.scss +++ b/sass/whitelabel/wallet/cyland/cyland_custom_style.scss @@ -179,3 +179,7 @@ $cyland--button-color: $cyland--nav-fg-prim-color; .client--cyland .ascribe-progress-bar > .progress-bar { background-color: $cyland--button-color; } + +.client--cyland .acl-information-dropdown-list .title { + color: $cyland--button-color; +} \ No newline at end of file diff --git a/sass/whitelabel/wallet/ikonotv/ikonotv_custom_style.scss b/sass/whitelabel/wallet/ikonotv/ikonotv_custom_style.scss index 5fc9220b..52affdaf 100644 --- a/sass/whitelabel/wallet/ikonotv/ikonotv_custom_style.scss +++ b/sass/whitelabel/wallet/ikonotv/ikonotv_custom_style.scss @@ -521,3 +521,7 @@ $ikono--font: 'Helvetica Neue', 'Helvetica', sans-serif !important; .client--ikonotv .ascribe-progress-bar > .progress-bar { background-color: $ikono--button-color; } + +.client--ikonotv .acl-information-dropdown-list .title { + color: $ikono--button-color; +} \ No newline at end of file From 2ce0b2417d1a174c6a76de1e2ff307b9f93b52b1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Fri, 23 Oct 2015 15:08:03 +0200 Subject: [PATCH 38/54] Change Readme.md origin in installation guide --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index a3258576..1dc4492b 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ Install some nice extension for Chrom(e|ium): - [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) ```bash -git clone git@bitbucket.org:ascribe/onion.git +git clone git@github.com:ascribe/onion.git cd onion npm install sudo npm install -g gulp From d48da96e3b5430e28e097f751f901da9d5b089a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 26 Oct 2015 11:21:22 +0100 Subject: [PATCH 39/54] Add login-validation to actions DetailProperty in Edition and Piece detail view --- js/components/ascribe_detail/edition.js | 18 +++--- .../ascribe_detail/piece_container.js | 58 ++++++++++--------- 2 files changed, 41 insertions(+), 35 deletions(-) diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index ccab60a0..b7c0205f 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -25,11 +25,11 @@ import LicenseDetail from './license_detail'; import FurtherDetails from './further_details'; import EditionActionPanel from './edition_action_panel'; +import AclProxy from '../acl_proxy'; import Note from './note'; import ApiUrls from '../../constants/api_urls'; -import AppConstants from '../../constants/application_constants'; import AscribeSpinner from '../ascribe_spinner'; import { getLangText } from '../../utils/lang_utils'; @@ -211,13 +211,15 @@ let EditionSummary = React.createClass({ value={ edition.owner } /> {this.getStatus()} - - - + + + + +
); diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index f8a2369f..01edede1 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -28,6 +28,7 @@ import CreateEditionsButton from '../ascribe_buttons/create_editions_button'; import DeleteButton from '../ascribe_buttons/delete_button'; import AclInformation from '../ascribe_buttons/acl_information'; +import AclProxy from '../acl_proxy'; import ListRequestActions from '../ascribe_forms/list_form_request_actions'; @@ -181,38 +182,41 @@ let PieceContainer = React.createClass({ }, getActions() { - if (this.state.piece && - this.state.piece.notifications && - this.state.piece.notifications.length > 0) { + const { piece, currentUser } = this.state; + + if (piece && piece.notifications && piece.notifications.length > 0) { return ( ); + notifications={piece.notifications}/>); } else { return ( - - - - - - - + + + + + + + + + ); } }, From da895bb434c8688330b2e0ffbd05b83fb4fd41ef Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 26 Oct 2015 15:13:02 +0100 Subject: [PATCH 40/54] Add alberto's suggestion on currentUser's login status to refactor.md --- docs/refactor-todo.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/refactor-todo.md b/docs/refactor-todo.md index f7a5917b..91c0fa21 100644 --- a/docs/refactor-todo.md +++ b/docs/refactor-todo.md @@ -8,6 +8,7 @@ queryParams of the piece_list_store should all be reflected in the url and not a single component each should manipulate the URL bar (refactor pagination, use actions and state) - Refactor string-templating for api_urls - Use classNames plugin instead of if-conditional-classes +- Instead of using `currentUser && currentUser.email` in an validation that checks whether we user is logged in or now, in the `UserStore` on login we set a boolean property called `isLoggedIn` that can then be used instead of `email` # Refactor DONE - Refactor forms to generic-declarative form component ✓ From 1207522266b8cb59bc5a67b7e23e1786db3c9bd8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 26 Oct 2015 15:39:33 +0100 Subject: [PATCH 41/54] Fix correct year extraction from date-string in edition and piece detial view --- js/components/ascribe_detail/edition.js | 2 +- js/components/ascribe_detail/piece_container.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index ccab60a0..fccf6118 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -85,7 +85,7 @@ let Edition = React.createClass({

{this.props.edition.title}

- +

{this.state.piece.title}

- + {this.state.piece.num_editions > 0 ? : null}
From 42733740db8b7629041c1e42fd3ef4598db05751 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 26 Oct 2015 16:07:31 +0100 Subject: [PATCH 42/54] Fix correct year extraction from date-string in AccordionListItemPrize PrizePieceContainer CylandAccordionListItem IkonotvAccordionListItem --- .../ascribe_accordion_list/accordion_list_item_prize.js | 2 +- .../prize/components/ascribe_detail/prize_piece_container.js | 2 +- .../cyland/cyland_accordion_list/cyland_accordion_list_item.js | 2 +- .../ikonotv_accordion_list/ikonotv_accordion_list_item.js | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/js/components/whitelabel/prize/components/ascribe_accordion_list/accordion_list_item_prize.js b/js/components/whitelabel/prize/components/ascribe_accordion_list/accordion_list_item_prize.js index abda8a1b..caef504b 100644 --- a/js/components/whitelabel/prize/components/ascribe_accordion_list/accordion_list_item_prize.js +++ b/js/components/whitelabel/prize/components/ascribe_accordion_list/accordion_list_item_prize.js @@ -182,7 +182,7 @@ let AccordionListItemPrize = React.createClass({ artistName={artistName} subsubheading={
- {this.props.content.date_created.split('-')[0]} + {new Date(this.props.content.date_created).getFullYear()}
} buttons={this.getPrizeButtons()} badge={this.getPrizeBadge()}> diff --git a/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js b/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js index a5f9838f..07e84b0e 100644 --- a/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js +++ b/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js @@ -141,7 +141,7 @@ let PieceContainer = React.createClass({

{this.state.piece.title}

- + {artistEmail} {this.getActions()}
diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_accordion_list/cyland_accordion_list_item.js b/js/components/whitelabel/wallet/components/cyland/cyland_accordion_list/cyland_accordion_list_item.js index ae96db98..755e550b 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_accordion_list/cyland_accordion_list_item.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_accordion_list/cyland_accordion_list_item.js @@ -100,7 +100,7 @@ let CylandAccordionListItem = React.createClass({ piece={this.props.content} subsubheading={
- {this.props.content.date_created.split('-')[0]} + {new Date(this.props.content.date_created).getFullYear()}
} buttons={this.getSubmitButtons()}> {this.props.children} diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_accordion_list/ikonotv_accordion_list_item.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_accordion_list/ikonotv_accordion_list_item.js index 00e7f318..7445eb36 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_accordion_list/ikonotv_accordion_list_item.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_accordion_list/ikonotv_accordion_list_item.js @@ -106,7 +106,7 @@ let IkonotvAccordionListItem = React.createClass({ piece={this.props.content} subsubheading={
- {this.props.content.date_created.split('-')[0]} + {new Date(this.props.content.date_created).getFullYear()}
} buttons={this.getSubmitButtons()}> {this.props.children} From 384ec0f445205c5b5f2652e9e085762aea7846cb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 26 Oct 2015 16:20:33 +0100 Subject: [PATCH 43/54] Fix correct year extraction from date-string in AccordionListItemWallet WalletPieceContainer --- .../ascribe_accordion_list/accordion_list_item_wallet.js | 2 +- .../wallet/components/ascribe_detail/wallet_piece_container.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js index 9af40a67..185f6e05 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js @@ -129,7 +129,7 @@ let AccordionListItemWallet = React.createClass({ piece={this.props.content} subsubheading={
- {this.props.content.date_created.split('-')[0]} + {new Date(this.props.content.date_created).getFullYear()} {this.getLicences()}
} buttons={ diff --git a/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js b/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js index 8a38f02e..5644b5b0 100644 --- a/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js +++ b/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js @@ -39,7 +39,7 @@ let WalletPieceContainer = React.createClass({

{this.props.piece.title}

- +
} From 29e422d16ad9ea65e13b612c9fd1bbd2ea9b2eb2 Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Mon, 26 Oct 2015 16:53:48 +0100 Subject: [PATCH 44/54] Add suggestion to refactor AclProxy to readme --- docs/refactor-todo.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/refactor-todo.md b/docs/refactor-todo.md index 91c0fa21..c0329bc2 100644 --- a/docs/refactor-todo.md +++ b/docs/refactor-todo.md @@ -9,6 +9,7 @@ queryParams of the piece_list_store should all be reflected in the url and not a - Refactor string-templating for api_urls - Use classNames plugin instead of if-conditional-classes - Instead of using `currentUser && currentUser.email` in an validation that checks whether we user is logged in or now, in the `UserStore` on login we set a boolean property called `isLoggedIn` that can then be used instead of `email` +- Refactor AclProxy to be a generic hide/show element component. Have it take data input and a validation function to assess whether it should show or hide child elements. Move current Acl checks to another place, eg. acl_utils.js. # Refactor DONE - Refactor forms to generic-declarative form component ✓ From fc4d4dbe17c33812559be1258984cbdc606a4f1b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 26 Oct 2015 17:09:16 +0100 Subject: [PATCH 45/54] Change input type in PieceListToolbarOrderWidget from "checkbox" to "radio" --- .../piece_list_toolbar_filter_widget.js | 4 ++-- .../piece_list_toolbar_order_widget.js | 2 +- js/components/piece_list.js | 2 -- 3 files changed, 3 insertions(+), 5 deletions(-) diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js index 16886def..8d22848a 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js @@ -7,7 +7,7 @@ import DropdownButton from 'react-bootstrap/lib/DropdownButton'; import { getLangText } from '../../utils/lang_utils.js'; -let PieceListToolbarFilterWidgetFilter = React.createClass({ +let PieceListToolbarFilterWidget = React.createClass({ propTypes: { filterParams: React.PropTypes.arrayOf( React.PropTypes.shape({ @@ -139,4 +139,4 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({ } }); -export default PieceListToolbarFilterWidgetFilter; \ No newline at end of file +export default PieceListToolbarFilterWidget; \ No newline at end of file diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js index a3615aec..a2d388c7 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js @@ -72,7 +72,7 @@ let PieceListToolbarOrderWidget = React.createClass({ -1} /> diff --git a/js/components/piece_list.js b/js/components/piece_list.js index e9e5d497..3d4309f8 100644 --- a/js/components/piece_list.js +++ b/js/components/piece_list.js @@ -22,8 +22,6 @@ import PieceListToolbar from './ascribe_piece_list_toolbar/piece_list_toolbar'; import AscribeSpinner from './ascribe_spinner'; -import AppConstants from '../constants/application_constants'; - import { mergeOptions } from '../utils/general_utils'; import { getLangText } from '../utils/lang_utils'; import { setDocumentTitle } from '../utils/dom_utils'; From 576fa3916794f5fe88782bbe749628db73e156a2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 27 Oct 2015 09:59:46 +0100 Subject: [PATCH 46/54] Fix wrong pushState invocation --- js/components/ascribe_detail/edition_action_panel.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/ascribe_detail/edition_action_panel.js b/js/components/ascribe_detail/edition_action_panel.js index 6beda543..7b075ce0 100644 --- a/js/components/ascribe_detail/edition_action_panel.js +++ b/js/components/ascribe_detail/edition_action_panel.js @@ -68,7 +68,7 @@ let EditionActionPanel = React.createClass({ let notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState('/collection'); + this.history.pushState(null, '/collection'); }, refreshCollection() { From 7e438dcaf5c6b23c9a48b0884c33dcff4103c347 Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Tue, 27 Oct 2015 11:44:40 +0100 Subject: [PATCH 47/54] Add link to /collection to ascribe branding on navbar --- js/components/header.js | 10 ++++++++-- sass/ascribe_custom_style.scss | 19 ++++++++++++++++--- 2 files changed, 24 insertions(+), 5 deletions(-) diff --git a/js/components/header.js b/js/components/header.js index bcdabd31..fa32440d 100644 --- a/js/components/header.js +++ b/js/components/header.js @@ -2,6 +2,8 @@ import React from 'react'; +import { Link } from 'react-router'; + import Nav from 'react-bootstrap/lib/Nav'; import Navbar from 'react-bootstrap/lib/Navbar'; import CollapsibleNav from 'react-bootstrap/lib/CollapsibleNav'; @@ -71,12 +73,16 @@ let Header = React.createClass({ } if (whitelabel.subdomain && whitelabel.subdomain !== 'www' && whitelabel.logo){ - return (); + return ( + + Whitelabel brand + + ); } return ( - + ); }, diff --git a/sass/ascribe_custom_style.scss b/sass/ascribe_custom_style.scss index 51281d91..fc7012c5 100644 --- a/sass/ascribe_custom_style.scss +++ b/sass/ascribe_custom_style.scss @@ -91,12 +91,25 @@ hr { } } - .navbar-brand, - .navbar-brand:hover { + .navbar-brand { font-size: 23px; padding: 12px 15px; - color: $ascribe--nav-fg-prim-color; + + .icon-ascribe-logo { + color: $ascribe--nav-fg-prim-color; + + &:hover, + &:focus { + color: $ascribe--nav-fg-sec-color; + text-decoration: none; + } + } + + .img-brand { + height: 100%; + } } + .img-brand .navbar-brand { width: 0; height: 0; From c362b960dd006d8cba27232dede7be21698e9f6f Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Tue, 27 Oct 2015 16:04:28 +0100 Subject: [PATCH 48/54] Change focused styling of logo to be normal --- sass/ascribe_custom_style.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/sass/ascribe_custom_style.scss b/sass/ascribe_custom_style.scss index fc7012c5..914a981c 100644 --- a/sass/ascribe_custom_style.scss +++ b/sass/ascribe_custom_style.scss @@ -98,11 +98,13 @@ hr { .icon-ascribe-logo { color: $ascribe--nav-fg-prim-color; - &:hover, - &:focus { + &:hover { color: $ascribe--nav-fg-sec-color; text-decoration: none; } + &:focus { + text-decoration: none; + } } .img-brand { From 12c7fa7ba474108a33ac160e312de8ca319f6617 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 27 Oct 2015 16:32:26 +0100 Subject: [PATCH 49/54] Change delete button back to old styling --- js/components/ascribe_buttons/delete_button.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/ascribe_buttons/delete_button.js b/js/components/ascribe_buttons/delete_button.js index d974a8fa..f2367bc3 100644 --- a/js/components/ascribe_buttons/delete_button.js +++ b/js/components/ascribe_buttons/delete_button.js @@ -45,7 +45,7 @@ let DeleteButton = React.createClass({ title = getLangText('Delete Edition'); } - btnDelete = ; + btnDelete = ; } else if(availableAcls.acl_unshare){ From 9765ed040b20fcafe259066a3a91910c1ccb9169 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 27 Oct 2015 17:15:23 +0100 Subject: [PATCH 50/54] Add tertiary button style --- .../ascribe_buttons/delete_button.js | 2 +- sass/ascribe_custom_style.scss | 23 +++++++++++++++++++ 2 files changed, 24 insertions(+), 1 deletion(-) diff --git a/js/components/ascribe_buttons/delete_button.js b/js/components/ascribe_buttons/delete_button.js index f2367bc3..ac4ec182 100644 --- a/js/components/ascribe_buttons/delete_button.js +++ b/js/components/ascribe_buttons/delete_button.js @@ -45,7 +45,7 @@ let DeleteButton = React.createClass({ title = getLangText('Delete Edition'); } - btnDelete = ; + btnDelete = ; } else if(availableAcls.acl_unshare){ diff --git a/sass/ascribe_custom_style.scss b/sass/ascribe_custom_style.scss index 51281d91..a0d652cf 100644 --- a/sass/ascribe_custom_style.scss +++ b/sass/ascribe_custom_style.scss @@ -327,6 +327,29 @@ fieldset[disabled] .btn-secondary.active { } } +.btn-tertiary { + background-color: transparent; + border-color: transparent; + color: #888; + + &:focus, + &:active:focus, + &:active.focus { + background-color: transparent; + border-color: transparent; + color: #888; + } + + &:hover, + &:active, + &:active:hover, + &.active:hover{ + background-color: $ascribe-pink; + border-color: $ascribe-pink; + color: $ascribe-white; + } +} + .ascribe-piece-list-toolbar-filter-widget button { background-color: transparent; border: 1px solid transparent; From 6217663fe09367dc6b955892866c642f057af5a7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 27 Oct 2015 17:34:31 +0100 Subject: [PATCH 51/54] Pull DropdownButtons in collection to the right, to make them work also on mobile --- .../piece_list_toolbar_filter_widget.js | 1 + .../piece_list_toolbar_order_widget.js | 1 + 2 files changed, 2 insertions(+) diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js index 8d22848a..38de2af6 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js @@ -83,6 +83,7 @@ let PieceListToolbarFilterWidget = React.createClass({ return ( {/* We iterate over filterParams, to receive the label and then for each diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js index a2d388c7..c38144b0 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js @@ -54,6 +54,7 @@ let PieceListToolbarOrderWidget = React.createClass({ return (
  • From 9db85e719170c774b72ff85d5c1db931fcec3c09 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 27 Oct 2015 18:02:52 +0100 Subject: [PATCH 52/54] Change default font color to ascribe-dark-blue --- sass/ascribe_custom_style.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/sass/ascribe_custom_style.scss b/sass/ascribe_custom_style.scss index a0d652cf..58f3446f 100644 --- a/sass/ascribe_custom_style.scss +++ b/sass/ascribe_custom_style.scss @@ -330,14 +330,14 @@ fieldset[disabled] .btn-secondary.active { .btn-tertiary { background-color: transparent; border-color: transparent; - color: #888; + color: $ascribe-dark-blue; &:focus, &:active:focus, &:active.focus { background-color: transparent; border-color: transparent; - color: #888; + color: $ascribe-dark-blue; } &:hover, From 906ef7c37e3dceabfbc95227cd0317757e120760 Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Wed, 28 Oct 2015 19:19:14 +0100 Subject: [PATCH 53/54] Refactor InputTextAreaToggable's required property to take a bool instead --- js/components/ascribe_forms/form_consign.js | 4 ++-- js/components/ascribe_forms/form_loan.js | 4 ++-- js/components/ascribe_forms/form_piece_extradata.js | 2 +- js/components/ascribe_forms/form_share_email.js | 4 ++-- js/components/ascribe_forms/form_submit_to_prize.js | 4 ++-- js/components/ascribe_forms/form_transfer.js | 4 ++-- js/components/ascribe_forms/form_unconsign.js | 4 ++-- js/components/ascribe_forms/input_textarea_toggable.js | 9 ++++++--- .../whitelabel/prize/components/prize_register_piece.js | 4 ++-- 9 files changed, 21 insertions(+), 18 deletions(-) diff --git a/js/components/ascribe_forms/form_consign.js b/js/components/ascribe_forms/form_consign.js index 5f6e2fc8..da40f009 100644 --- a/js/components/ascribe_forms/form_consign.js +++ b/js/components/ascribe_forms/form_consign.js @@ -65,7 +65,7 @@ let ConsignForm = React.createClass({ rows={1} defaultValue={this.props.message} placeholder={getLangText('Enter a message...')} - required="required"/> + required /> + required={this.props.showPersonalMessage ? true : false}/> {this.getContractCheckbox()} {this.getAppendix()} @@ -304,4 +304,4 @@ let LoanForm = React.createClass({ } }); -export default LoanForm; \ No newline at end of file +export default LoanForm; diff --git a/js/components/ascribe_forms/form_piece_extradata.js b/js/components/ascribe_forms/form_piece_extradata.js index 45f684ad..f6ee4177 100644 --- a/js/components/ascribe_forms/form_piece_extradata.js +++ b/js/components/ascribe_forms/form_piece_extradata.js @@ -50,7 +50,7 @@ let PieceExtraDataForm = React.createClass({ rows={1} defaultValue={defaultValue} placeholder={getLangText('Fill in%s', ' ') + this.props.title} - required="required"/> + required />
    diff --git a/js/components/ascribe_forms/form_share_email.js b/js/components/ascribe_forms/form_share_email.js index 53ca87c1..920df0da 100644 --- a/js/components/ascribe_forms/form_share_email.js +++ b/js/components/ascribe_forms/form_share_email.js @@ -71,11 +71,11 @@ let ShareForm = React.createClass({ rows={1} defaultValue={this.props.message} placeholder={getLangText('Enter a message...')} - required="required"/> + required /> ); } }); -export default ShareForm; \ No newline at end of file +export default ShareForm; diff --git a/js/components/ascribe_forms/form_submit_to_prize.js b/js/components/ascribe_forms/form_submit_to_prize.js index d9850ef7..5818a9ce 100644 --- a/js/components/ascribe_forms/form_submit_to_prize.js +++ b/js/components/ascribe_forms/form_submit_to_prize.js @@ -52,7 +52,7 @@ let PieceSubmitToPrizeForm = React.createClass({ + required /> + required /> + required /> + required /> + required /> + required /> Date: Thu, 29 Oct 2015 15:45:00 +0100 Subject: [PATCH 54/54] Remove redundant truth check for required prop --- js/components/ascribe_forms/form_loan.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/ascribe_forms/form_loan.js b/js/components/ascribe_forms/form_loan.js index eb5d60cf..7a0af7fd 100644 --- a/js/components/ascribe_forms/form_loan.js +++ b/js/components/ascribe_forms/form_loan.js @@ -285,7 +285,7 @@ let LoanForm = React.createClass({ rows={1} defaultValue={this.props.message} placeholder={getLangText('Enter a message...')} - required={this.props.showPersonalMessage ? true : false}/> + required={this.props.showPersonalMessage}/> {this.getContractCheckbox()} {this.getAppendix()}