seth
/
jam-cloud
mirror of https://bitbucket.org/jamkazam/jam-cloud.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

* working on basic

This commit is contained in:
Seth Call 2015-12-28 10:43:14 -06:00
parent fb24f3beae
commit 0fcdb708fc
5 changed files with 104 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/app/assets/javascripts/react-components/AgeRangeList.js.jsx.coffee Normal file
View File

@ -0,0 +1,20 @@
context = window
rest = window.JK.Rest()
logger = context.JK.logger
@AgeRangeList = React.createClass({
ages: [0, 1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100]
componentDidUnmount: () ->
@languages = []
componentDidMount: () ->
@agesJsx = []
for age in @ages
@agesJsx.push(`<option value={age}>{age == 0 ? 'Any' : age}</option>`)
render: () ->
`<select className="AgeRangeList react-component" defaultValue={this.props.defaultValue}>
{this.agesJsx}
</select>`
})

38
web/app/assets/javascripts/react-components/TeacherSetupBasics.js.jsx.coffee
View File

@ -56,6 +56,8 @@ rest = window.JK.Rest()
navTo = this.navDestination(e)
teacherActions.change.trigger(this.state, {navTo: navTo})
studentLevelChanged: (level, e) ->
render: () ->
# Render the following:
# Instruments
@ -65,30 +67,50 @@ rest = window.JK.Rest()
# All lists will take a list of selected keys,
# and will otherwise self-render the available
`<div className="TeacherSetupBasics TeacherSetupComponent">
<div className="teacher-quarter-column left">
<div className="teacher-quarter-column">
<div className="teacher-field" name="instruments">
<strong>Instruments Taught</strong>
<h3>Instruments Taught:</h3>
<InstrumentCheckBoxList onItemChanged={this.handleListChange} selectedInstruments={this.state.instruments}/>
</div>
</div>
<div className="teacher-quarter-column left">
<div className="teacher-quarter-column">
<div className="teacher-field" name="subjects">
<strong>Music Subjects Taught</strong>
<h3>Music Subjects Taught:</h3>
<SubjectCheckBoxList onItemChanged={this.handleListChange} selectedSubjects={this.state.subjects}/>
</div>
</div>
<div className="teacher-quarter-column left">
<div className="teacher-quarter-column">
<div className="teacher-field" name="genres">
<strong>Genres Taught</strong>
<h3>Genres Taught:</h3>
<GenreCheckBoxList onItemChanged={this.handleListChange} selectedGenres={this.state.genres}/>
</div>
</div>
<div className="teacher-quarter-column left">
<div className="teacher-quarter-column">
<div className="teacher-field" name="languages">
<strong>Languages Spoken</strong>
<h3>Languages Spoken:</h3>
<LanguageCheckBoxList onItemChanged={this.handleListChange} selectedLanguages={this.state.languages}/>
</div>
</div>
<div className="teacher-half-column">
<div className="teacher-field" name="student-levels-taught">
<h3>Student Levels Taught:</h3>
<div className="student-levels">
<input type="checkbox" className="student-level" onChanged={this.studentLevelChanged.bind('beginner')}/><span className="student-level">Beginner</span>
<input type="checkbox" className="student-level" onChanged={this.studentLevelChanged.bind('intermediate')}/><span className="student-level">Intermediate</span>
<input type="checkbox" className="student-level" onChanged={this.studentLevelChanged.bind('advanced')}/><span className="student-level">Advanced</span>
</div>
</div>
</div>
<div className="teacher-half-column">
<div className="teacher-field" name="student-ages-taught">
<h3>Student Ages Taught:</h3>
<div className="student-ages">
<AgeRangeList defaultValue={this.state.age_lower} />
<span className="age-to-age">to</span>
<AgeRangeList defaultValue={this.state.age_upper} />
</div>
</div>
</div>
<TeacherSetupNav handleNav={this.handleNav}></TeacherSetupNav>
</div>`

2
web/app/assets/javascripts/react-components/mixins/TeacherProfileMixin.js.coffee
View File

@ -8,7 +8,7 @@ teacherActions = window.JK.Actions.Teacher
'beforeShow': @beforeShow
}
logger.debug("Binding setup to: teachers/setup/#{@screenName()}")
logger.debug("Binding setup to: teachers/profile/#{@screenName()}")
app.bindScreen("teachers/profile/#{@screenName()}", screenBindings)
beforeShow: (data) ->

67
web/app/assets/stylesheets/client/teachers.css.scss
View File

@ -20,6 +20,32 @@
}
}
.TeacherSetupBasics {
.teacher-half-column {
margin-top:20px;
}
.student-levels, .student-ages {
margin-top:20px;
}
input.student-level {
display:inline;
margin-right:10px;
}
span.student-level {
display:inline;
margin-right:30px;
}
select {
width:auto !important;
display:inline !important;
}
.age-to-age {
margin:0 10px;
display:inline;
}
}
label.margined {
margin-top: 1em;
margin-bottom: 0.25em;
@ -30,6 +56,10 @@
//width: auto !important;
}
h3 {
font-size:16px;
}
.teacher-setup-form {
padding: 1em;
.error-text {
@ -47,10 +77,32 @@
.teacher-quarter-column {
@extend .w25;
@include border_box_sizing;
float:left;
padding: 0 10px;
&:first-child {
padding-left:0;
}
&:last-child {
padding-right:0;
}
}
.teacher-half-column {
@extend .w50;
@include border_box_sizing;
float:left;
padding: 0 10px;
&:first-child {
padding-left:0;
}
&:last-child {
padding-right:0;
}
}
.teacher-third-column {
@ -61,7 +113,6 @@
padding-right: 1em;
}
table.form-table {
width: 100%;
margin-bottom: 1em;
@ -77,10 +128,8 @@
width: auto;
}
}
}
.teacher-field {
padding: 0.25em;
@include border_box_sizing;
@ -125,24 +174,13 @@
height: auto;
overflow:hidden;
}
}
}
label {
font-size: 1.05em;
}
label.strong-label {
font-weight: bold;
font-size: 1.1em;
@ -154,5 +192,4 @@
margin: 8px 4px 8px 0px;
text-transform: uppercase;
}
}

2
web/app/views/clients/teachers/profile/_basics.html.slim
View File

@ -9,5 +9,5 @@
.content-body-scroller
form.teacher-setup-form
.teacher-setup-step-0.teacher-step.content-wrapper
h2 edit teacher: basics
h2 edit teacher profile: basics
= react_component 'TeacherProfileBasics', {}