64 lines
1.8 KiB
JavaScript
Executable File
64 lines
1.8 KiB
JavaScript
Executable File
import React from 'react';
|
|
import Button from '/imports/ui/components/button/component';
|
|
import styles from './styles.scss';
|
|
|
|
export default class PollingComponent extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
}
|
|
|
|
getStyles() {
|
|
const number = this.props.poll.answers.length + 1;
|
|
const buttonStyle =
|
|
{
|
|
width: `calc(75%/ ${number} )`,
|
|
marginLeft: `calc(25%/${number * 2})`,
|
|
marginRight: `calc(25%/${number * 2})`,
|
|
};
|
|
|
|
return buttonStyle;
|
|
}
|
|
|
|
render() {
|
|
const poll = this.props.poll;
|
|
const calculatedStyles = this.getStyles();
|
|
|
|
return (
|
|
<div className={styles.pollingContainer}>
|
|
<div className={styles.pollingTitle}>
|
|
<p>
|
|
Polling Options
|
|
</p>
|
|
</div>
|
|
{poll.answers.map((pollAnswer, index) =>
|
|
<div style={calculatedStyles} className={styles.pollButtonWrapper}>
|
|
<Button
|
|
className={styles.pollingButton}
|
|
label={pollAnswer.key}
|
|
size="lg"
|
|
color="primary"
|
|
key={index}
|
|
onClick={() => this.props.handleVote(poll.pollId, pollAnswer)}
|
|
componentClass="span"
|
|
aria-labelledby={`pollAnswerLabel${pollAnswer.key}`}
|
|
aria-describedby={`pollAnswerDesc${pollAnswer.key}`}
|
|
/>
|
|
<div
|
|
className={styles.hidden}
|
|
id={`pollAnswerLabel${pollAnswer.key}`}
|
|
>
|
|
{`Poll answer ${pollAnswer.key}`}
|
|
</div>
|
|
<div
|
|
className={styles.hidden}
|
|
id={`pollAnswerDesc${pollAnswer.key}`}
|
|
>
|
|
{`Select this option to vote for ${pollAnswer.key}`}
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
};
|