ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00
Code Issues Releases Wiki Activity

jury dashboard + rating WIP

Browse Source
This commit is contained in:
diminator 2015-08-10 15:23:13 +02:00
parent 36aa5b1891
commit a27415eb86
3 changed files with 21 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
js/components/whitelabel/prize/components/ascribe_detail/piece_container.js
View File

@ -14,6 +14,8 @@ import Property from '../../../../../components/ascribe_forms/property';
import InputTextAreaToggable from '../../../../../components/ascribe_forms/input_textarea_toggable';
import CollapsibleParagraph from '../../../../../components/ascribe_collapsible/collapsible_paragraph';
import StarRating from 'react-star-rating';
/**
* This is the component that implements resource/data specific functionality
*/
@ -70,6 +72,10 @@ let PrizePieceDetails = React.createClass({
propTypes: {
piece: React.PropTypes.object
},
onRatingClick(event, position, rating, caption, name) {
console.log(rating);
},
render() {
if (this.props.piece.prize
&& this.props.piece.prize.name
@ -79,6 +85,13 @@ let PrizePieceDetails = React.createClass({
title="Prize Details"
show={true}
defaultExpanded={true}>
<StarRating
name="airbnb-rating"
caption=""
step={1}
size='lg'
onRatingClick={this.onRatingClick}
ratingAmount={5} />
<Form ref='form'>
{Object.keys(this.props.piece.extra_data).map((data) => {
let label = data.replace('_', ' ');

3
package.json
View File

@ -84,7 +84,8 @@
"vinyl-buffer": "^1.0.0",
"vinyl-source-stream": "^1.1.0",
"watchify": "^3.1.2",
"yargs": "^3.10.0"
"yargs": "^3.10.0",
"react-star-rating": "~1.3.2"
},
"jest": {
"scriptPreprocessor": "node_modules/babel-jest",

6
sass/main.scss
View File

@ -6,6 +6,7 @@ $BASE_URL: '<%= BASE_URL %>';
@import 'ascribe_variables';
@import 'variables';
@import '../node_modules/bootstrap-sass/assets/stylesheets/bootstrap';
@import '../node_modules/react-star-rating/dist/css/react-star-rating.min';
@import '../node_modules/react-datepicker/dist/react-datepicker';
@import 'glyphicons-social';
@import 'ascribe_theme';
@ -382,3 +383,8 @@ hr {
font-size: 2em;
}
}
.rating-container .rating-stars {
width: 25px;
color: #000;
}