jam-cloud/web/app/assets/javascripts/react-components/JamClassStudentScreen.js.js...

154 lines
4.7 KiB
CoffeeScript

context = window
rest = context.JK.Rest()
logger = context.JK.logger
UserStore = context.UserStore
@JamClassStudentScreen = React.createClass({
mixins: [
@ICheckMixin,
Reflux.listenTo(AppStore, "onAppInit"),
Reflux.listenTo(UserStore, "onUserChanged")
]
onAppInit: (@app) ->
@app.bindScreen('jamclass',
{beforeShow: @beforeShow, afterShow: @afterShow, beforeHide: @beforeHide})
onUserChanged: (userState) ->
@setState({user: userState?.user})
componentDidMount: () ->
componentDidUpdate: () ->
getInitialState: () ->
{
user: null,
}
beforeHide: (e) ->
@resetErrors()
beforeShow: (e) ->
afterShow: (e) ->
@setState({updating: true})
rest.getLessonSessions().done((response) => @jamClassLoaded(response)).fail((jqXHR) => @failedJamClassLoad(jqXHR))
resetState: () ->
@setState({updating: false, lesson: null})
jamClassLoaded: (response) ->
@setState({updating: false})
@setState({summary: response})
failedJamClassLoad: (jqXHR) ->
@setState({updating: false})
@setState({summary: response})
if jqXHR.status == 404
@app.layout.notify({title: "Unable to load JamClass info", text: "Try refreshing the web page"})
render: () ->
disabled = @state.updating
classes = []
if @state.updating
classes = [`<tr><td colspan="5">Loading...</td></tr>`]
else
`<div className="content-body-scroller">
<div className="column column-left">
<div className="my-lessons jamclass-section">
<h2>my lessons</h2>
<table className="jamtable">
<thead>
<tr>
<th>TEACHER</th>
<th>DATE/TIME</th>
<th>STATUS</th>
<th></th>
<th>ACTIONS</th>
</tr>
</thead>
<tbody>
{classes}
</tbody>
</table>
<div className="calender-integration-notice">
Don't miss a lesson! <a>Integrate your lessons into your calendar.</a>
</div>
</div>
<div className="search-teachers">
<h2>search teachers</h2>
<p>JamClass instructors are each individually screened to ensure that they are highly qualified music
teachers,
equipped to teach effectively online, and background checked.
</p>
<div className="actions">
<a href="/client#/teachers/search" className="button-orange">SEARCH TEACHERS</a>
</div>
</div>
</div>
<div className="column column-right">
<div className="jamclass-section">
<h2>learn about jamclass</h2>
<p>
JamClass is the best way to make music lessons, offering significant advantadges over both traditional
face-to-face lessons
and online skype lessons.
</p>
<div className="actions">
<a href="/landing/jamclass/students" className="button-orange">LEARN MORE</a>
</div>
</div>
<div className="jamclass-section">
<h2>sign up for testdrive</h2>
<p>
There are two awesome, painless ways to get started with JamClass.
</p>
<p>
Sign up for TestDrive and take 4 full 30-minute lessons - one each from 4 different instructors - for just
$49.99.
You wouldn't marry the first person you date, right? Find the best teacher for you. It's the most important
factor in the success for your lessons!
</p>
<p>
Or take one JamClass lesson free. It's on us! We're confident you'll take more.
</p>
<p>
Sign up for TestDrive using the button below, or to take one free lesson, search our teachers, and click the
Book Free Lesson on your favorite.
</p>
<div className="actions">
<a href="/landing/jamclass/students" className="button-orange">SIGN UP FOR TESTDRIVE</a>
or
<a href="/client#/teachers/search" className="button-orange">SEARCH TEACHERS</a>
</div>
</div>
<div className="jamclass-section">
<h2>get ready for your first lesson</h2>
<p>Be sure to set up and test the JamKazam app in an online music session a few days before
your first lesson! We're happy to help, and we'll even get in a session with you to make sure everything
is working properly. Ping us at <a href="mailto:support@jamkazam.com">support@jamkazam.com anytime</a>, and
read our
<a onClick={alert.bind('not yet')}>JamClass user guide</a> to learn how to use all the lesson features.
</p>
</div>
</div>
<br className="clearall"/>
</div>`
})