diff --git a/js/components/ascribe_panel/action_panel.js b/js/components/ascribe_panel/action_panel.js index a63af530..1aaef6f7 100644 --- a/js/components/ascribe_panel/action_panel.js +++ b/js/components/ascribe_panel/action_panel.js @@ -48,20 +48,23 @@ let ActionPanel = React.createClass({ render() { return ( -
-
- {this.props.title} -
-
- - {this.props.content} - - - {this.props.buttons} - +
+
+
+
+
+ {this.props.title} +
+
+ {this.props.content} +
+
+
+
+
+ {this.props.buttons} +
+
); diff --git a/js/components/whitelabel/prize/actions/prize_jury_actions.js b/js/components/whitelabel/prize/actions/prize_jury_actions.js index e2fe1a96..bd0a25af 100644 --- a/js/components/whitelabel/prize/actions/prize_jury_actions.js +++ b/js/components/whitelabel/prize/actions/prize_jury_actions.js @@ -8,7 +8,9 @@ import PrizeJuryFetcher from '../fetchers/prize_jury_fetcher'; class PrizeJuryActions { constructor() { this.generateActions( - 'updatePrizeJury' + 'updatePrizeJury', + 'removePrizeJury', + 'activatePrizeJury' ); } @@ -26,6 +28,49 @@ class PrizeJuryActions { }); }); } + + activateJury(email) { + return Q.Promise((resolve, reject) => { + PrizeJuryFetcher + .activate(email) + .then((res) => { + resolve(res); + }) + .catch((err) => { + console.logGlobal(err); + reject(err); + }); + }); + } + + revokeJury(email) { + return Q.Promise((resolve, reject) => { + PrizeJuryFetcher + .delete(email) + .then((res) => { + this.actions.removePrizeJury(email); + resolve(res); + }) + .catch((err) => { + console.logGlobal(err); + reject(err); + }); + }); + } + + resendJuryInvitation(email) { + return Q.Promise((resolve, reject) => { + PrizeJuryFetcher + .resend(email) + .then((res) => { + resolve(res); + }) + .catch((err) => { + console.logGlobal(err); + reject(err); + }); + }); + } } export default alt.createActions(PrizeJuryActions); \ No newline at end of file diff --git a/js/components/whitelabel/prize/components/settings_container.js b/js/components/whitelabel/prize/components/settings_container.js index fecc1fd0..bd426a9c 100644 --- a/js/components/whitelabel/prize/components/settings_container.js +++ b/js/components/whitelabel/prize/components/settings_container.js @@ -144,36 +144,138 @@ let PrizeJurySettings = React.createClass({ this.refs.form.refs.email.refs.input.getDOMNode().value = null; }, - render() { + handleActivate(event) { + let email = event.target.getAttribute('data-id'); + PrizeJuryActions.activateJury(email).then((response) => { + PrizeJuryActions.fetchJury(); + let notification = new GlobalNotificationModel(response.notification, 'success', 5000); + GlobalNotificationActions.appendGlobalNotification(notification); + }); + }, + + handleRevoke(event) { + let email = event.target.getAttribute('data-id'); + PrizeJuryActions.revokeJury(email).then((response) => { + let notification = new GlobalNotificationModel(response.notification, 'success', 5000); + GlobalNotificationActions.appendGlobalNotification(notification); + }); + }, + + handleResend(event) { + let email = event.target.getAttribute('data-id'); + PrizeJuryActions.resendJuryInvitation(email).then((response) => { + let notification = new GlobalNotificationModel(response.notification, 'success', 5000); + GlobalNotificationActions.appendGlobalNotification(notification); + }); + }, + + getMembersPending() { + return this.state.membersPending.map(function(member, i) { + return ( + + + +
+ }/> + ); + }, this); + }, + getMembersActive() { + return this.state.membersActive.map(function(member, i) { + return ( + + +
+ }/> + ); + + }, this); + }, + getMembersInactive() { + return this.state.membersInactive.map(function(member, i) { + return ( + + + + }/> + ); + + }, this); + }, + getMembers() { let content = (
); if (this.state.members.length > -1) { - content = this.state.members.map(function(member, i) { - return ( - - {getLangText('RESEND INVITATION')} - } - />); - }, this); content = ( -
- {content} +
+ + {this.getMembersActive()} + + + {this.getMembersPending()} + + + {this.getMembersInactive()} +
); } + return content; + }, + render() { return (
@@ -190,7 +292,7 @@ let PrizeJurySettings = React.createClass({
- {content} + {this.getMembers()}
); } diff --git a/js/components/whitelabel/prize/constants/api_urls.js b/js/components/whitelabel/prize/constants/api_urls.js index f9030794..3e7260bb 100644 --- a/js/components/whitelabel/prize/constants/api_urls.js +++ b/js/components/whitelabel/prize/constants/api_urls.js @@ -11,7 +11,10 @@ function getApiUrls(subdomain) { 'piece_submit_to_prize': AppPrizeConstants.prizeApiEndpoint + subdomain + '/pieces/${piece_id}/submit/', 'piece': AppPrizeConstants.prizeApiEndpoint + subdomain + '/pieces/${piece_id}/', 'prize': AppPrizeConstants.prizeApiEndpoint + subdomain + '/', - 'jury': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/' + 'jurys': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/', + 'jury': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/${email}/', + 'jury_activate': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/${email}/activate/', + 'jury_resend': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/${email}/resend/' }; } diff --git a/js/components/whitelabel/prize/fetchers/prize_jury_fetcher.js b/js/components/whitelabel/prize/fetchers/prize_jury_fetcher.js index be00e930..1c5b0a0d 100644 --- a/js/components/whitelabel/prize/fetchers/prize_jury_fetcher.js +++ b/js/components/whitelabel/prize/fetchers/prize_jury_fetcher.js @@ -5,7 +5,19 @@ import requests from '../../../../utils/requests'; let PrizeJuryFetcher = { fetch() { - return requests.get('jury'); + return requests.get('jurys'); + }, + + activate(email) { + return requests.post('jury_activate', {'email': email}); + }, + + delete(email) { + return requests.delete('jury', {'email': email}); + }, + + resend(email) { + return requests.post('jury_resend', {'email': email}); } }; diff --git a/js/components/whitelabel/prize/stores/prize_jury_store.js b/js/components/whitelabel/prize/stores/prize_jury_store.js index 59a54329..88ed21ac 100644 --- a/js/components/whitelabel/prize/stores/prize_jury_store.js +++ b/js/components/whitelabel/prize/stores/prize_jury_store.js @@ -7,11 +7,28 @@ import PrizeJuryActions from '../actions/prize_jury_actions'; class PrizeJuryStore { constructor() { this.members = []; + this.membersActive = []; + this.membersPending = []; + this.membersInactive = []; this.bindActions(PrizeJuryActions); } onUpdatePrizeJury( members ) { this.members = members; + this.splitJuryMembers(); + } + + onRemovePrizeJury( email ) { + let memberInactive = this.members.filter((item)=> item.email === email ); + this.membersActive = this.membersActive.filter((item)=> item.email !== email ); + this.membersPending = this.membersPending.filter((item)=> item.email !== email ); + this.membersInactive = this.membersInactive.concat(memberInactive); + } + + splitJuryMembers(){ + this.membersActive = this.members.filter((item)=> item.status === 'Invitation accepted' ); + this.membersPending = this.members.filter((item)=> item.status === 'Invitation pending' ); + this.membersInactive = this.members.filter((item)=> item.status === 'Deactivated' ); } } diff --git a/sass/ascribe_button.scss b/sass/ascribe_button.scss new file mode 100644 index 00000000..2b366ab1 --- /dev/null +++ b/sass/ascribe_button.scss @@ -0,0 +1,9 @@ +.ascribe-btn-gray { + border-color: #CCCCCC; + background-color: #CCCCCC; + + &:hover{ + border-color: #AAAAAA; + background-color: #AAAAAA; + } +} \ No newline at end of file diff --git a/sass/ascribe_panel.scss b/sass/ascribe_panel.scss index 43f8f15f..8ad4249c 100644 --- a/sass/ascribe_panel.scss +++ b/sass/ascribe_panel.scss @@ -1,13 +1,18 @@ .ascribe-panel-wrapper { - border: 1px solid #F5F5F5; + border: 1px solid #DDD; + padding: 1.4em; + margin: 1em 0 1em 0; } .ascribe-panel-title { - padding: 1em 0 1em 1.5em; + margin-bottom: 0.5em; } .ascribe-panel-content { - padding: .75em 0 .75em 1em; - font-size: 1em; - color: #616161; + font-size: 0.9em; + color: rgba(0,0,0,0.5); +} + +.ascribe-panel-buttons { + margin-top: 0.5em; } \ No newline at end of file diff --git a/sass/main.scss b/sass/main.scss index 5f00d2c9..d2c05afa 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -28,6 +28,7 @@ $BASE_URL: '<%= BASE_URL %>'; @import 'ascribe_slides_container'; @import 'ascribe_form'; @import 'ascribe_panel'; +@import 'ascribe_button'; @import 'whitelabel/index'; @@ -325,6 +326,10 @@ hr { margin-top: 1px; } +.margin-left-2px{ + margin-left: 2px; +} + .spin { display:inline-block; -webkit-animation: spin 1s infinite linear;