diff --git a/web/app/assets/javascripts/react-components/CheckBoxList.js.jsx.coffee b/web/app/assets/javascripts/react-components/CheckBoxList.js.jsx.coffee index da12cb587..2364c52c5 100644 --- a/web/app/assets/javascripts/react-components/CheckBoxList.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/CheckBoxList.js.jsx.coffee @@ -44,7 +44,7 @@ logger = context.JK.logger for object in this.props.sourceObjects nm = "check_#{object.id}" checked = @isChecked(object.id) - object_options.push `
` + object_options.push `

` `
diff --git a/web/app/assets/javascripts/react-components/TeacherSearchOptionsScreen.js.jsx.coffee b/web/app/assets/javascripts/react-components/TeacherSearchOptionsScreen.js.jsx.coffee index 4921f7859..06770bd91 100644 --- a/web/app/assets/javascripts/react-components/TeacherSearchOptionsScreen.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/TeacherSearchOptionsScreen.js.jsx.coffee @@ -5,11 +5,25 @@ LocationActions = @LocationActions @TeacherSearchOptionsScreen = React.createClass({ - mixins: [Reflux.listenTo(@AppStore, "onAppInit"), Reflux.listenTo(@UserStore, "onUserChanged"), + mixins: [ICheckMixin, Reflux.listenTo(@AppStore, "onAppInit"), Reflux.listenTo(@UserStore, "onUserChanged"), Reflux.listenTo(@TeacherSearchStore, "onTeacherSearchChanged")] LIMIT: 20 + componentDidMount: () -> + @checkboxes = [ + {selector: 'input.onlyMySchool', stateKey: 'onlyMySchool'}, + {selector: 'input.beginner-level', stateKey: 'beginner-level'}, + {selector: 'input.intermediate-level', stateKey: 'intermediate-level'}, + {selector: 'input.advanced-level', stateKey: 'advanced-level'}] + + @root = $(@getDOMNode()) + + @iCheckify() + + componentDidUpdate: () -> + @iCheckify() + getInitialState: () -> {options: {onlyMySchool: true}} @@ -71,6 +85,20 @@ LocationActions = @LocationActions options.onlyMySchool = checked @setState(options) + checkboxChanged: (e) -> + $target = $(e.target) + + if $target.is('.onlyMySchool') + state = {} + state['onlyMySchool'] = $target.is(':checked') + @setState(state) + @onlyMySchoolChange(e) + else + state = {} + state[$target.attr('name')] = $target.is(':checked') + @setState(state) + @levelChanged(e) + render: () -> if @state.user?.school_id? onlySchoolOption = @@ -114,15 +142,15 @@ LocationActions = @LocationActions

Student Levels Taught:

- +
- +
- +
diff --git a/web/app/assets/javascripts/react-components/TeacherSearchScreen.js.jsx.coffee b/web/app/assets/javascripts/react-components/TeacherSearchScreen.js.jsx.coffee index 5e336f9be..c5a4539e2 100644 --- a/web/app/assets/javascripts/react-components/TeacherSearchScreen.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/TeacherSearchScreen.js.jsx.coffee @@ -215,7 +215,7 @@ ProfileActions = @ProfileActions summary = '' - if searchOptions.onlyMySchool + if searchOptions.onlyMySchool && @state.user?.school_id? summary += "From My School Only" instruments = searchOptions.instruments diff --git a/web/app/assets/javascripts/react-components/mixins/ICheckMixin.js.coffee b/web/app/assets/javascripts/react-components/mixins/ICheckMixin.js.coffee index 0bf3cda13..a1a4eb622 100644 --- a/web/app/assets/javascripts/react-components/mixins/ICheckMixin.js.coffee +++ b/web/app/assets/javascripts/react-components/mixins/ICheckMixin.js.coffee @@ -40,14 +40,18 @@ teacherActions = window.JK.Actions.Teacher enableICheck: (e) -> if !@root? return - checkBoxes = @root.find('input[type="checkbox"]') - if checkBoxes.length > 0 - context.JK.checkbox(checkBoxes) - checkBoxes.on('ifChanged', (e) => @checkIfCanFire(e)) - radioBoxes = @root.find('input[type="radio"]') - if radioBoxes.length > 0 - context.JK.checkbox(radioBoxes) - radioBoxes.on('ifChanged', (e) => @checkIfCanFire(e)) + + for checkbox in @checkboxes + selector = checkbox.selector + + checkBoxes = @root.find(selector + '[type="checkbox"]') + if checkBoxes.length > 0 + context.JK.checkbox(checkBoxes) + checkBoxes.on('ifChanged', (e) => @checkIfCanFire(e)) + radioBoxes = @root.find(selector + '[type="radio"]') + if radioBoxes.length > 0 + context.JK.checkbox(radioBoxes) + radioBoxes.on('ifChanged', (e) => @checkIfCanFire(e)) true diff --git a/web/app/assets/stylesheets/client/react-components/TeacherSearchOptions.css.scss b/web/app/assets/stylesheets/client/react-components/TeacherSearchOptions.css.scss index 3738be5f5..73028e042 100644 --- a/web/app/assets/stylesheets/client/react-components/TeacherSearchOptions.css.scss +++ b/web/app/assets/stylesheets/client/react-components/TeacherSearchOptions.css.scss @@ -9,6 +9,29 @@ .checkbox-scroller { height:100px; margin-top:0; + .checkItem { + clear: both; + margin-bottom:4px; + label { + color: black; + display: inline; + float: left; + font-size: 1em; + } + .icheckbox_minimal { + color: black; + display: inline; + float: left; + font-size: 1em; + margin-right:5px; + } + input { + width: auto; + text-align: left; + float: left; + display: inline; + } + } } min-width:200px; width:25%; @@ -72,6 +95,10 @@ } .student-levels-taught { + .icheckbox_minimal { + top:3px; + margin-right:5px; + } .teaching-level { margin-bottom:10px; }