mirror of
https://github.com/ascribe/onion.git
synced 2024-12-22 09:23:13 +01:00
terms and conditions page with accept/deny
Needed: copyright societies in backend
This commit is contained in:
diminator
parent
1611a75036
commit
22aa0139ae
@ -1,14 +1,34 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
import Router from 'react-router';
|
||||
|
||||
import Glyphicon from 'react-bootstrap/lib/Glyphicon';
|
||||
import Button from 'react-bootstrap/lib/Button';
|
||||
|
||||
import Form from '../../../../ascribe_forms/form';
|
||||
import Property from '../../../../ascribe_forms/property';
|
||||
import InputCheckbox from '../../../../ascribe_forms/input_checkbox';
|
||||
|
||||
import NotificationActions from '../../../../../actions/notification_actions';
|
||||
import NotificationStore from '../../../../../stores/notification_store';
|
||||
import WhitelabelStore from '../../../../../stores/whitelabel_store';
|
||||
|
||||
import GlobalNotificationModel from '../../../../../models/global_notification_model';
|
||||
import GlobalNotificationActions from '../../../../../actions/global_notification_actions';
|
||||
|
||||
import apiUrls from '../../../../../constants/api_urls';
|
||||
|
||||
import requests from '../../../../../utils/requests';
|
||||
import { getLangText } from '../../../../../utils/lang_utils';
|
||||
import { mergeOptions } from '../../../../../utils/general_utils';
|
||||
|
||||
let Navigation = Router.Navigation;
|
||||
|
||||
let IkonotvContractNotifications = React.createClass({
|
||||
|
||||
mixins: [Navigation],
|
||||
|
||||
getInitialState() {
|
||||
return mergeOptions(
|
||||
NotificationStore.getState(),
|
||||
@ -19,6 +39,9 @@ let IkonotvContractNotifications = React.createClass({
|
||||
componentDidMount() {
|
||||
NotificationStore.listen(this.onChange);
|
||||
WhitelabelStore.listen(this.onChange);
|
||||
if (this.state.contractAgreementListNotifications === null){
|
||||
NotificationActions.fetchContractAgreementListNotifications();
|
||||
}
|
||||
},
|
||||
|
||||
componentWillUnmount() {
|
||||
@ -30,22 +53,107 @@ let IkonotvContractNotifications = React.createClass({
|
||||
this.setState(state);
|
||||
},
|
||||
|
||||
render() {
|
||||
console.log(this.state)
|
||||
return (
|
||||
<div className='container'>
|
||||
<div className='text-center'>
|
||||
<div>
|
||||
<img src={this.state.whitelabel.logo} />
|
||||
</div>
|
||||
<div>
|
||||
<embed src={this.state.contractAgreementListNotifications[0].contract_agreement.contract.blob}
|
||||
width="600" height="500" alt="pdf"
|
||||
pluginspage="http://www.adobe.com/products/acrobat/readstep2.html" />
|
||||
displayContract(){
|
||||
let notifications = this.state.contractAgreementListNotifications[0];
|
||||
let blob = notifications.contract_agreement.contract.blob;
|
||||
if (blob.mime === 'pdf') {
|
||||
return (
|
||||
<div className='notification-contract-pdf'>
|
||||
<embed src={blob.url_safe} alt="pdf"
|
||||
pluginspage="http://www.adobe.com/products/acrobat/readstep2.html"/>
|
||||
<div className='notification-contract-pdf-download'>
|
||||
<a href={blob.url_safe}>
|
||||
<Glyphicon glyph='download-alt'/>
|
||||
<span style={{padding: '0.3em'}}>
|
||||
Download PDF version
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div className='notification-contract-download'>
|
||||
<a href={blob.url_safe}>
|
||||
<Glyphicon glyph='download-alt'/>
|
||||
Download contract
|
||||
</a>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
||||
handleConfirmSuccess() {
|
||||
let notification = new GlobalNotificationModel(getLangText('You have accepted the conditions'), 'success', 10000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
this.transitionTo('pieces');
|
||||
},
|
||||
|
||||
handleDeny() {
|
||||
let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
|
||||
requests.post(apiUrls.ownership_contract_agreements_deny, {contract_agreement_id: contractAgreement.id}).then(
|
||||
() => this.handleDenySuccess()
|
||||
);
|
||||
},
|
||||
|
||||
handleDenySuccess() {
|
||||
let notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 10000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
this.transitionTo('pieces');
|
||||
},
|
||||
|
||||
render() {
|
||||
|
||||
if (this.state.contractAgreementListNotifications &&
|
||||
this.state.contractAgreementListNotifications.length > 0) {
|
||||
let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
|
||||
return (
|
||||
<div className='container'>
|
||||
<div className='notification-contract-wrapper'>
|
||||
<div className='notification-contract-logo'>
|
||||
<img src={this.state.whitelabel.logo}/>
|
||||
<div className='notification-contract-header'>
|
||||
{getLangText('Production Contract')}
|
||||
</div>
|
||||
</div>
|
||||
{this.displayContract()}
|
||||
<div className='notification-contract-footer'>
|
||||
<h1>{getLangText('Are you a member of any copyright societies?')}</h1>
|
||||
<p>
|
||||
ARS, DACS, Bildkunst, Pictoright, SODRAC, Copyright Agency/Viscopy, SAVA, Bildrecht GmbH,
|
||||
SABAM, AUTVIS, CREAIMAGEN, SONECA, Copydan, EAU, Kuvasto, GCA, HUNGART, IVARO, SIAE, JASPAR-SPDA,
|
||||
AKKA/LAA, LATGA-A, SOMAAP, ARTEGESTION, CARIER, BONO, APSAV, SPA, GESTOR, VISaRTA, RAO, LITA,
|
||||
DALRO, VeGaP, BUS, ProLitteris, AGADU, AUTORARTE, BUBEDRA, BBDA, BCDA, BURIDA, ADAVIS, BSDA
|
||||
</p>
|
||||
<Form
|
||||
ref='form'
|
||||
url={requests.prepareUrl(apiUrls.ownership_contract_agreements_confirm, {contract_agreement_id: contractAgreement.id})}
|
||||
handleSuccess={this.handleConfirmSuccess}
|
||||
buttons={
|
||||
<p style={{marginTop: '1em'}}>
|
||||
<Button type="submit">{getLangText('I agree with the conditions')}</Button>
|
||||
<Button bsStyle="danger" className="btn-delete" bsSize="medium" onClick={this.handleDeny}>
|
||||
{getLangText('I disagree')}
|
||||
</Button>
|
||||
</p>
|
||||
}>
|
||||
<Property
|
||||
name="terms"
|
||||
className="ascribe-settings-property-collapsible-toggle"
|
||||
style={{paddingBottom: 0}}>
|
||||
<InputCheckbox>
|
||||
<span>
|
||||
{' ' + getLangText('Yes') }
|
||||
</span>
|
||||
</InputCheckbox>
|
||||
</Property>
|
||||
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -78,7 +78,7 @@ let ROUTES = {
|
||||
<Route name="piece" path="pieces/:pieceId" handler={IkonotvPieceContainer} />
|
||||
<Route name="edition" path="editions/:editionId" handler={EditionContainer} />
|
||||
<Route name="settings" path="settings" handler={SettingsContainer} />
|
||||
<Route name="contract_notifications" path="verify" handler={IkonotvContractNotifications} />
|
||||
<Route name="contract_notifications" path="contract_notifications" handler={IkonotvContractNotifications} />
|
||||
</Route>
|
||||
)
|
||||
};
|
||||
|
||||
@ -33,6 +33,8 @@ let ApiUrls = {
|
||||
'notification_edition': AppConstants.apiEndpoint + 'notifications/editions/${edition_id}/',
|
||||
'notification_contractagreementlist': AppConstants.apiEndpoint + 'notifications/contract_agreements/',
|
||||
'ownership_contract_agreements': AppConstants.apiEndpoint + 'ownership/contract_agreements/',
|
||||
'ownership_contract_agreements_confirm': AppConstants.apiEndpoint + 'ownership/contract_agreements/${contract_agreement_id}/accept/',
|
||||
'ownership_contract_agreements_deny': AppConstants.apiEndpoint + 'ownership/contract_agreements/${contract_agreement_id}/reject/',
|
||||
'ownership_consigns': AppConstants.apiEndpoint + 'ownership/consigns/',
|
||||
'ownership_consigns_confirm': AppConstants.apiEndpoint + 'ownership/consigns/confirm/',
|
||||
'ownership_consigns_deny': AppConstants.apiEndpoint + 'ownership/consigns/deny/',
|
||||
|
||||
@ -10,7 +10,7 @@ class NotificationStore {
|
||||
constructor() {
|
||||
this.pieceListNotifications = {};
|
||||
this.editionListNotifications = {};
|
||||
this.contractAgreementListNotifications = {};
|
||||
this.contractAgreementListNotifications = null;
|
||||
this.editionNotifications = null;
|
||||
this.pieceNotifications = null;
|
||||
this.bindActions(NotificationActions);
|
||||
|
||||
51
sass/ascribe_notification_page.scss
Normal file
51
sass/ascribe_notification_page.scss
Normal file
@ -0,0 +1,51 @@
|
||||
|
||||
.notification-contract-download {
|
||||
|
||||
}
|
||||
|
||||
.notification-contract-wrapper{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.notification-contract-logo {
|
||||
|
||||
img {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.notification-contract-header {
|
||||
font-size: 2em;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0.8em;
|
||||
}
|
||||
}
|
||||
|
||||
.notification-contract-pdf, .notification-contract-footer {
|
||||
width: 100%;
|
||||
max-width: 750px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.notification-contract-pdf {
|
||||
embed {
|
||||
border: 1px solid #cccccc;
|
||||
width: 100%;
|
||||
height: 60vh;
|
||||
margin-bottom: 0.4em;
|
||||
}
|
||||
.notification-contract-pdf-download {
|
||||
text-align: left;
|
||||
margin-left: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.notification-contract-footer {
|
||||
text-align: left;
|
||||
padding: 1em;
|
||||
h1 {
|
||||
margin-top: 0.4em;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
p {
|
||||
font-size: 0.9em;
|
||||
color: #444444;
|
||||
}
|
||||
}
|
||||
@ -25,6 +25,7 @@ $BASE_URL: '<%= BASE_URL %>';
|
||||
@import 'ascribe_global_action';
|
||||
@import 'ascribe_global_notification';
|
||||
@import 'ascribe_notification_list';
|
||||
@import 'ascribe_notification_page';
|
||||
@import 'ascribe_piece_register';
|
||||
@import 'offset_right';
|
||||
@import 'ascribe_settings';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user