Skip to content

Commit

Permalink
more fixing acitvity
Browse files Browse the repository at this point in the history
  • Loading branch information
@Vino4
Vino4 committed Jun 5, 2017
1 parent 97f265b commit 94c8d28
Show file tree
Hide file tree
Showing 14 changed files with 355 additions and 383 deletions.
128 changes: 106 additions & 22 deletions src/components/utils/QuestionType.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,17 +7,101 @@ import {Map, List} from 'immutable';


let QuestionTypes = Map({
TimeAvailability: Map({
type:'TimeAvailability',
display:'Time Availability',
description:'This type allows participants to select days of the week',
options:Map({
'tooltip':true,
'tooltipHint':'Descripe the question to your participants',
'tooltipLabel':'Description',

'answersEnableMaximum':true,
'answersEnableMaximumHint':'This toggle enables the maximum answers limit',
'answersEnableMaximumTrueLabel':'Enabled',
'answersEnableMaximumFalseLabel':'Disabled',

'answersMaximum':true,
'answersMaximumHint':'Maximum amount of answers allowed.',
'answersMaximumLabel':'Maximum Answers Limit',

'answersEnableMinimum':true,
'answersEnableMinimumHint':'This toggle enables the minimum answers limit',
'answersEnableMinimumTrueLabel':'Enabled',
'answersEnableMinimumFalseLabel':'Disabled',

'answersMinimum':true,
'answersMinimumHint':'Minimum amount of answers allowed. (Must be less than 8)',
'answersMinimumLabel':'Minimum Answers Limit',

'answersEnableFilter':false,
'answersEnableFilterHint':'When filter is enabeled, only options in this list can be selected',
'answersEnableFilterTrueLabel':'Enabled',
'answersEnableFilterFalseLabel':'Disabled',

'answersFilter':false,
'answersFilterHint':'When filter is enabeled, participant will only be able to select answers from this field',
'answersFilterLabel':'Limit Options',

'answersFilterEnableBlacklistMode':false,
'answersFilterEnableBlacklistModeHint':'Blacklist: block filter entries. Whitelist: allow filter entries.',
'answersFilterEnableBlacklistModeTrueLabel':'Blacklist',
'answersFilterEnableBlacklistModeFalseLabel':'Whitelist',
})
}),
ProgrammingLanguages: Map({
type:'ProgrammingLanguages',
display:'Programming Languages',
description:'This type allows participants select programming languages',
options:Map({
'tooltip':true,
'tooltipHint':'Descripe the question to your participants',
'tooltipLabel':'Description',

'answersEnableMaximum':true,
'answersEnableMaximumHint':'This toggle enables the maximum answers limit',
'answersEnableMaximumTrueLabel':'Enabled',
'answersEnableMaximumFalseLabel':'Disabled',

'answersMaximum':true,
'answersMaximumHint':'Maximum amount of answers allowed.',
'answersMaximumLabel':'Maximum Answers Limit',

'answersEnableMinimum':true,
'answersEnableMinimumHint':'This toggle enables the minimum answers limit',
'answersEnableMinimumTrueLabel':'Enabled',
'answersEnableMinimumFalseLabel':'Disabled',

'answersMinimum':true,
'answersMinimumHint':'Minimum amount of answers allowed.',
'answersMinimumLabel':'Minimum Answers Limit',

'answersEnableFilter':false,
'answersEnableFilterHint':'Toggles between Limited and Unlimited answers. In Limited mode, studennts can only choose from this list of options. in Unlimited mode, Students may add their own answers',
'answersEnableFilterTrueLabel':'Limited',
'answersEnableFilterFalseLabel':'Unlimited',

'answersFilter':false,
'answersFilterHint':'When filter is enabeled, participant will only be able to select answers from this field',
'answersFilterLabel':'Options',

'answersFilterEnableBlacklistMode':false,
'answersFilterEnableBlacklistModeHint':'Blacklist: block filter entries. Whitelist: allow filter entries.',
'answersFilterEnableBlacklistModeTrueLabel':'Blacklist',
'answersFilterEnableBlacklistModeFalseLabel':'Whitelist',
})
}),
CircleSelection: Map({
type:'CircleSelection',
display:'Circle Selection',
description:'This type allows participants to selected multiple answers from a list of options',
display:'Radio Button Selection',
description:'This type allows participants to toggle choises from a set of radio buttons representing options',
options:Map({
'tooltip':true,
'tooltipHint':'Descripe the question to your participants',
'tooltipLabel':'Description',

'answersEnableMaximum':true,
'answersEnableMaximumHint':'',
'answersEnableMaximumHint':'This toggle enables the maximum answers limit',
'answersEnableMaximumTrueLabel':'Enabled',
'answersEnableMaximumFalseLabel':'Disabled',

Expand All @@ -26,7 +110,7 @@ let QuestionTypes = Map({
'answersMaximumLabel':'Maximum Answers Limit',

'answersEnableMinimum':true,
'answersEnableMinimumHint':'',
'answersEnableMinimumHint':'This toggle enables the minimum answers limit',
'answersEnableMinimumTrueLabel':'Enabled',
'answersEnableMinimumFalseLabel':'Disabled',

Expand Down Expand Up @@ -59,7 +143,7 @@ let QuestionTypes = Map({
'tooltipLabel':'Description',

'answersEnableMaximum':true,
'answersEnableMaximumHint':'',
'answersEnableMaximumHint':'This toggle enables the maximum answers limit',
'answersEnableMaximumTrueLabel':'Enabled',
'answersEnableMaximumFalseLabel':'Disabled',

Expand All @@ -68,7 +152,7 @@ let QuestionTypes = Map({
'answersMaximumLabel':'Maximum Answers Limit',

'answersEnableMinimum':true,
'answersEnableMinimumHint':'',
'answersEnableMinimumHint':'This toggle enables the minimum answers limit',
'answersEnableMinimumTrueLabel':'Enabled',
'answersEnableMinimumFalseLabel':'Disabled',

Expand All @@ -77,57 +161,57 @@ let QuestionTypes = Map({
'answersMinimumLabel':'Minimum Answers Limit',

'answersEnableFilter':true,
'answersEnableFilterHint':'Limit the answers allowed to answers seperated by comma in this field.',
'answersEnableFilterHint':'When filter is enabeled, only options in this list can be selected',
'answersEnableFilterTrueLabel':'Enabled',
'answersEnableFilterFalseLabel':'Disabled',

'answersFilter':true,
'answersFilterHint':'When filter is enabeled, only optiosn in this list can be selected',
'answersFilterLabel':'Filter',
'answersFilterHint':'When filter is enabeled, participant will only be able to select answers from this field',
'answersFilterLabel':'Limit Options',

'answersFilterEnableBlacklistMode':true,
'answersFilterEnableBlacklistMode':false,
'answersFilterEnableBlacklistModeHint':'Blacklist: block filter entries. Whitelist: allow filter entries.',
'answersFilterEnableBlacklistModeTrueLabel':'Blacklist',
'answersFilterEnableBlacklistModeFalseLabel':'Whitelist',
})
}),
'SingleInputTextField': Map({
type:'SingleInputTextField',
display:'Single Answer Text-Field',
description:'This type allows participants to enter a single textual answer',
display:'Text Field',
description:'This type allows participants to enter information into an Open-Ended Text Field',
options:Map({
'tooltip':true,
'tooltipHint':'Descripe the question to your participants',
'tooltipLabel':'Description',

'answersEnableMaximum':true,
'answersEnableMaximum':false,
'answersEnableMaximumHint':'',
'answersEnableMaximumTrueLabel':'Enabled',
'answersEnableMaximumFalseLabel':'Disabled',

'answersMaximum':true,
'answersMaximum':false,
'answersMaximumHint':'Maximum amount of characters allowed.',
'answersMaximumLabel':'Maximum Character Limit',

'answersEnableMinimum':true,
'answersEnableMinimum':false,
'answersEnableMinimumHint':'',
'answersEnableMinimumTrueLabel':'Enabled',
'answersEnableMinimumFalseLabel':'Disabled',

'answersMinimum':true,
'answersMinimum':false,
'answersMinimumHint':'Minimum amount of characters allowed.',
'answersMinimumLabel':'Minimum Characters Limit',
'answersMinimumLabel':'Minimum Character Limit',

'answersEnableFilter':true,
'answersEnableFilterHint':'Limit the answers allowed to answers seperated by comma in this field.',
'answersEnableFilter':false,
'answersEnableFilterHint':'Limit the answers allowed to only these options.',
'answersEnableFilterTrueLabel':'Enabled',
'answersEnableFilterFalseLabel':'Disabled',

'answersFilter':true,
'answersFilterHint':'When filter is enabeled, only optiosn in this list can be selected',
'answersFilter':false,
'answersFilterHint':'When filter is enabeled, only options in this list can be selected',
'answersFilterLabel':'Filter',

'answersFilterEnableBlacklistMode':true,
'answersFilterEnableBlacklistMode':false,
'answersFilterEnableBlacklistModeHint':'Blacklist: block filter entries. Whitelist: allow filter entries.',
'answersFilterEnableBlacklistModeTrueLabel':'Blacklist',
'answersFilterEnableBlacklistModeFalseLabel':'Whitelist',
Expand Down
132 changes: 26 additions & 106 deletions src/routes/Activity/components/ActivityView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,13 @@
* Additions made by Joseph 5/28/17
*/
import React from 'react'
import {Grid, Segment} from 'semantic-ui-react'
import {Grid, Segment, Button} from 'semantic-ui-react'
import {DragDropContext} from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import ParticipantListSidebar from "./ParticipantListSidebar"

import {Map, List, Set} from 'immutable';

import GroupCard from "./GroupCard/GroupCard"
import FilterMenu from "./FilterMenu"

Expand Down Expand Up @@ -36,104 +38,37 @@ export class ActivityCardViewWrapper extends React.Component {
export class ActivityView extends React.Component {
constructor(props) {
super(props);

this.state = ({filters: []});
this.toggleLock = this.toggleLock.bind(this);

}

componentWillMount() {
this.props.fetchParticipantList(this.props.activityId);
}
toggleLock(group) {
this.props.toggleLock(group);
}

setFilterValues = (input, event) => {
console.log('---------------------------');
console.log('SET FILTER VALUES');
console.log(input);
console.log(event.target);
console.log('---------------------------');
let field = this.state[input];
if(event.target.getAttribute('class') === "delete icon") {
let item = event.target.parentNode.getAttribute('value');
let index = field.indexOf(item)
if(index >= 0) {
field.splice(index, 1); // remove item from filter
}
} else {
if(event.target.getAttribute('name') !== "-search") {
if(event.target.getAttribute('name') === null) {
field.push(event.target.parentNode.getAttribute('name')); // add item to filter
} else {
field.push(event.target.getAttribute('name')); // add item to filter
}
}
}
this.setState({field:field});
}

setCurrentlySelected(id) { this.props.filterParticipantsMatch(id); }

render() {
render (){
const itemsPerRow = 10;
const cardsPerRow = 1;
let numOfGroups = this.props.totalCapacity / this.props.groupCapacity;
const refilterParticipants = (participants) => {
const hasSkills = (filterSkills, skills) => {
skills = skills.map( (skill) => (skill.name));

let result = true;
for (let i = 0; i < filterSkills.length; i++) {
result &= skills.includes(filterSkills[i]);
}
return result;
}

const hasFilterValues = (filter, participant) => {
if (filter.length === 0) {
return true;
}

const skills = participant.skills,
availiblity = participant.availability;

return hasSkills(filter, skills);
}

return participants.filter(
(participant) => {
return hasFilterValues(this.props.filter, participant);
}
)
}

/* the master participants list is filtered here it is just a hacky implementation*/
let participants = refilterParticipants(this.props.participants);

let separateIntoGroups = (participants) => {

let separateParticipantsIntoGroups = () => {
let groups = [];
for (let i = 0; i < numOfGroups; i++) {
groups.push({
groupNumber: i,
participants: []
})
}

for (let i = 0; i < participants.length; i++) {
let participantGroupNumber = participants[i].groupNumber;
this.props.participants.forEach((participant) => {
console.log(participant);
let participantGroupNumber = participant.get('groupNumber');
if (participantGroupNumber >= 0 && participantGroupNumber < numOfGroups) {
groups[participantGroupNumber].participants.push(participants[i]);
groups[participantGroupNumber].participants.push(participant);
}
}
});

return groups;
};

let dragging = (this.props.matching.get("current").length > 0);

let getGroupCards = (groups) => {
console.log(this.props.activityId)
return (
groups.map(
(group, i) => (
Expand All @@ -144,45 +79,30 @@ export class ActivityView extends React.Component {
itemsPerRow={ itemsPerRow }
updateParticipantGroupNumber={ this.props.updateParticipantGroupNumber }
activityId={ this.props.activityId }
setCurrentlySelected={ this.setCurrentlySelected.bind(this) }
toggleLock={ this.toggleLock.bind(this) }
matching={ this.props.matching.get("matchingCriteria") }
draggedUser={ this.props.matching.get("current") }
setCurrentlySelected={(v) => console.log(v) }
toggleLock={(v) => console.log(v) }
group={ i }
unlocked={ this.props.unlocked.get(i) }
filters={ this.state.filters }
dragging={dragging}
unlocked={ this.props.lockedGroups.get(i)}
/>
</Grid.Column>
)
)
)
};

return (
<div>
<ParticipantListSidebar participants={ participants }
updateParticipantGroupNumber={ this.props.updateParticipantGroupNumber }
activityId={ this.props.activityId }
setCurrentlySelected={this.setCurrentlySelected.bind(this)}
dragging = { dragging }
/>
<ActivityCardViewWrapper>
{
(this.props.participants.length > 0) &&
<FilterMenu activityId={ this.props.activityId }
generateGroupAssignment={ this.props.generateGroupAssignment }
filterValues={ this.props.matching.get("attributes") }
setFilterValues={ this.setFilterValues }
filterParticipants = { this.props.filterParticipants }
/>
}

<Grid columns={ cardsPerRow }>
{ getGroupCards(separateIntoGroups(participants)) }
</Grid>
<ParticipantListSidebar
key={"ParticipantListSidebar_" + this.props.participants.size}
participants={ this.props.participants }
updateParticipantGroupNumber={ this.props.updateParticipantGroupNumber }
activityId={ this.props.activityId }
/>
<ActivityCardViewWrapper setCurrentlySelected={(v) => console.log(v) }>
<Grid columns={ cardsPerRow }>
{ getGroupCards(separateParticipantsIntoGroups()) }
</Grid>
</ActivityCardViewWrapper>
</div>
</div>
)
}
}
Expand Down
Loading

0 comments on commit 94c8d28

Please sign in to comment.