At Oxford Royale Academy, we do our best to help customers and students find the right course for them.
To assist us in doing that, we will store the information you enter into our Checkout form (excluding payment card information), and if you do not or are not able to complete your enrolment we will get in touch with you by email. If you object to this, please do not enter any information into the form.
For more information, please see our Privacy Notices. Thank you.
\";\r\n}\r\n\r\nif (!global.OraWidgets.Options.checkoutMarketingOptInText) { global.OraWidgets.Options.checkoutMarketingOptInText = \"Please tick this box if you would like to receive information about our courses in the future.\" }\r\nif (!global.OraWidgets.Options.checkoutMarketingOptInTextAdmin) { global.OraWidgets.Options.checkoutMarketingOptInTextAdmin = \"Please tick if the customer would like to receive updates and information regarding other courses, products and services from Oxford Royale Academy\" }\r\nif (!global.OraWidgets.Options.checkoutPrivacyPolicy) { global.OraWidgets.Options.checkoutPrivacyPolicy = \"
Thank you.\r\n {is3rdPerson \r\n ? \" How would \" + wizard.state.Student.FirstName + \" like to study with Oxford Royale?\" \r\n : \" How would you like to study with Oxford Royale?\"}\r\n
\r\n \r\n
\r\n
\r\n {methodChooser.call(this, \"onsite\", \"On Campus\", \"/images/on-campus.jpg\", \"Award-winning educational experiences on the campuses of the world's leading universities and schools - Oxford, Cambridge, Yale and Uppingham School.\")}\r\n
\r\n {methodChooser.call(this, \"online\", \"Online\", \"/images/on-line.jpg\", \"Live tutorials and seminars with academics from the world's top universities, and alongside students from across the globe. Delivered to your home using Microsoft Teams.\")}\r\n
: false }\r\n { showOnDemand\r\n ?
\r\n {methodChooser.call(this, \"ondemand\", \"On Demand\", \"/images/on-demand.jpg\", \"Our suite of on-demand courses in a range of subjects. Click to go through to our ORA Prep Online Learning store.\")}\r\n
\r\n : false\r\n }\r\n
\r\n \r\n
;\r\n},\r\n isValid: function() {\r\n var isValid = true;\r\n if (this.props.wizard.state.StudyMethod !== \"onsite\" && this.props.wizard.state.StudyMethod !== \"online\") {\r\n isValid = false;\r\n }\r\n this.setState({\r\n isValid: isValid\r\n });\r\n return isValid\r\n }\r\n});\r\n\r\nexport default HowToStudy;","import Dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport extend from 'lodash/extend';\r\nimport create from 'lodash/create';\r\nimport Store from './Store.js';\r\n\r\nvar courseAvailability = {};\r\nvar courseSuggestions = [];\r\nvar agentAvailability = {};\r\nvar availabilitySelections = {};\r\nvar dateSelections = {};\r\nvar enquiryRequests = {};\r\nvar regionSessionGroups = {};\r\n\r\nfunction AvailabilityStore() {\r\n Store.call(this);\r\n}\r\n\r\nAvailabilityStore.prototype = create(Store.prototype, {\r\n 'constructor': AvailabilityStore,\r\n\r\n getCourseAvailability: function (courseId, agentId) {\r\n var key = courseId + '-' + agentId;\r\n if (courseAvailability.hasOwnProperty(key)) {\r\n return courseAvailability[key];\r\n }\r\n\r\n return false;\r\n },\r\n\r\n getCourseSuggestions: function () {\r\n return courseSuggestions;\r\n },\r\n\r\n getAgentAvailability: function (courseId, agentId) {\r\n var key = courseId + '-' + agentId;\r\n if (agentAvailability.hasOwnProperty(key)) {\r\n return agentAvailability[key];\r\n }\r\n\r\n return false;\r\n },\r\n\r\n getSelection: function(context) {\r\n var key = JSON.stringify(context);\r\n if (availabilitySelections.hasOwnProperty(key)) {\r\n return availabilitySelections[key];\r\n }\r\n\r\n return false;\r\n },\r\n\r\n getDatesState: function(context) {\r\n var key = JSON.stringify(context);\r\n if (dateSelections.hasOwnProperty(key)) {\r\n return dateSelections[key];\r\n }\r\n\r\n return {\r\n date: '',\r\n weeks: undefined,\r\n hours: undefined\r\n };\r\n },\r\n\r\n getEnquiryRequest: function(context) {\r\n var key = JSON.stringify(context);\r\n if (enquiryRequests.hasOwnProperty(key)) {\r\n return enquiryRequests[key];\r\n }\r\n\r\n return false;\r\n },\r\n\r\n getRegionSessionGroups: function() {\r\n return regionSessionGroups;\r\n }\r\n});\r\n\r\nvar availabilityStore = new AvailabilityStore();\r\navailabilityStore.dispatchToken = Dispatcher.register(function (payload) {\r\n switch (payload.type) {\r\n case ActionTypes.GET_AVAILABILITY:\r\n var courseAvailabilityKey = payload.courseId + '-' + payload.agentId;\r\n courseAvailability[courseAvailabilityKey] = payload.availability;\r\n break;\r\n\r\n case ActionTypes.GET_COURSE_SUGGESTIONS:\r\n courseSuggestions = payload.suggestions;\r\n break;\r\n\r\n case ActionTypes.BEGIN_COURSE_SUGGESTIONS:\r\n courseSuggestions = [];\r\n break;\r\n\r\n case ActionTypes.GET_AGENT_AVAILABILITY:\r\n var agentAvailabilityKey = payload.courseId + '-' + payload.agentId;\r\n agentAvailability[agentAvailabilityKey] = payload.agentAvailability;\r\n break;\r\n\r\n case ActionTypes.SEARCH_SUCCESS:\r\n // TODO think about caching results from the search results in here (as they may be the same)\r\n break;\r\n\r\n case ActionTypes.SELECTION_CHOSEN:\r\n availabilitySelections[JSON.stringify(payload.context)] = {\r\n course: payload.course,\r\n intensity: payload.intensity,\r\n dates: payload.dates\r\n };\r\n break;\r\n\r\n case ActionTypes.SELECTION_CLEARED:\r\n var key = JSON.stringify(payload.context);\r\n delete availabilitySelections[key];\r\n break;\r\n\r\n case ActionTypes.DATES_UPDATED:\r\n dateSelections[JSON.stringify(payload.context)] = {\r\n date: payload.date,\r\n weeks: payload.weeks,\r\n hours: payload.hours\r\n };\r\n break;\r\n\r\n case ActionTypes.BEGIN_ENQUIRY:\r\n enquiryRequests[JSON.stringify(payload.context)] = payload;\r\n break;\r\n\r\n case ActionTypes.SEND_ENQUIRY_START:\r\n enquiryRequests[JSON.stringify(payload.context)].isInTransit = true;\r\n break;\r\n\r\n case ActionTypes.SEND_ENQUIRY_SENT:\r\n enquiryRequests[JSON.stringify(payload.context)].isSent = true;\r\n break;\r\n\r\n case ActionTypes.GET_REGION_SESSION_GROUPS:\r\n regionSessionGroups = payload.regionSessionGroups;\r\n break;\r\n\r\n default:\r\n return;\r\n }\r\n\r\n availabilityStore.emitChange(payload.context);\r\n});\r\n\r\nexport default availabilityStore;","import Dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport AvailabilityService from '../utilities/AvailabilityService.js';\r\nimport AvailabilityStore from '../stores/AvailabilityStore.js';\r\n\r\nexport default {\r\n getAvailability: function (courseId, agentId, context) {\r\n // does the store already have this availability?\r\n var cachedAvailability = AvailabilityStore.getCourseAvailability(courseId, agentId);\r\n if (cachedAvailability) {\r\n // yes, issue another dispatch so that any views get notified of the new request finishing\r\n setTimeout(function() {\r\n dispatchGetAvailability(cachedAvailability, context, agentId, courseId);\r\n }, 1);\r\n } else {\r\n // doesn't have it, go to the web api\r\n AvailabilityService.getCourseAvailability(courseId, agentId).done(function (availability) {\r\n dispatchGetAvailability(availability, context, agentId, courseId);\r\n });\r\n }\r\n },\r\n\r\n getAgentAvailability: function(courseId, agentId, context) {\r\n var cached = AvailabilityStore.getAgentAvailability(courseId, agentId);\r\n if (!cached) {\r\n AvailabilityService\r\n .getAgentAvailability(courseId, agentId)\r\n .done(function(result) {\r\n Dispatcher.dispatch({\r\n type: ActionTypes.GET_AGENT_AVAILABILITY,\r\n agentAvailability: result,\r\n courseId: courseId,\r\n agentId: agentId,\r\n context: context\r\n });\r\n });\r\n }\r\n },\r\n\r\n getTimeZones: function(course, sessions) {\r\n AvailabilityService.getTimeZones(course, sessions).then(function(d) {\r\n Dispatcher.dispatch({\r\n type: ActionTypes.GET_TIMEZONES,\r\n course: course,\r\n sessions: sessions,\r\n timeZones: d\r\n });\r\n });\r\n },\r\n\r\n getOptions: function (course, intensity, region, sessions, startDate) {\r\n AvailabilityService.getOptions(course, sessions, region.RegionId).then(function (d) {\r\n Dispatcher.dispatch({\r\n type: ActionTypes.GET_OPTIONS,\r\n lineItem: d,\r\n course: course,\r\n intensity: intensity,\r\n region: region,\r\n sessions: sessions,\r\n startDate: startDate\r\n });\r\n });\r\n },\r\n\r\n makeSelection: function (course, intensity, dates, context) {\r\n Dispatcher.dispatch({ type: ActionTypes.SELECTION_CHOSEN, course: course, intensity: intensity, dates: dates, context: context });\r\n },\r\n\r\n clearSelection: function(context) {\r\n Dispatcher.dispatch({ type: ActionTypes.SELECTION_CLEARED, context: context });\r\n },\r\n\r\n updateDates: function(date, weeks, hours, context) {\r\n Dispatcher.dispatch({ type: ActionTypes.DATES_UPDATED, context: context, date: date, weeks: weeks, hours: hours });\r\n },\r\n\r\n goToEnquiry: function(course, intensity, options, context) {\r\n Dispatcher.dispatch({ type: ActionTypes.BEGIN_ENQUIRY, course: course, intensity: intensity, options: options, context: context });\r\n },\r\n\r\n sendEnquiry: function (customer, course, intensity, options, message, context) {\r\n //var selectedRegions = OptionsStore.getSelectedRegions(context);\r\n //Dispatcher.dispatch({ type: ActionTypes.SEND_ENQUIRY_START, context: context });\r\n //AvailabilityService.sendEnquiry(customer, course, intensity, options, message, selectedRegions).done(function () {\r\n // Dispatcher.dispatch({ type: ActionTypes.SEND_ENQUIRY_SENT, context: context });\r\n //});\r\n },\r\n\r\n sendNotifyRequest: function (course, intensity, options, region, emailAddress, phoneNumber, studentName, studentGender) {\r\n Dispatcher.dispatch({\r\n type: ActionTypes.BEGIN_COURSE_SUGGESTIONS\r\n });\r\n AvailabilityService.sendNotifyRequest(course, intensity, options, region, emailAddress, phoneNumber, studentName, studentGender).done(function (suggestions) {\r\n Dispatcher.dispatch({\r\n type: ActionTypes.GET_COURSE_SUGGESTIONS,\r\n suggestions: suggestions\r\n });\r\n });\r\n },\r\n\r\n selectRegion: function (region, context) {\r\n Dispatcher.dispatch({ type: ActionTypes.SELECT_REGION, region: region, context: context });\r\n },\r\n\r\n deselectRegion: function (region, context) {\r\n Dispatcher.dispatch({ type: ActionTypes.DESELECT_REGION, region: region, context: context });\r\n }\r\n};\r\n\r\nfunction dispatchGetAvailability(availability, context, agentId, courseId) {\r\n Dispatcher.dispatch({\r\n type: ActionTypes.GET_AVAILABILITY,\r\n availability: availability,\r\n courseId: courseId,\r\n agentId: agentId,\r\n context: context\r\n });\r\n}","import dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport create from 'lodash/create';\r\nimport map from 'lodash/map';\r\nimport Store from './Store.js';\r\n\r\nvar timeZonesLookup = {};\r\n\r\nfunction TimeZonesStore() {\r\n Store.call(this);\r\n};\r\n\r\nTimeZonesStore.prototype = create(Store.prototype, {\r\n 'constructor': TimeZonesStore,\r\n\r\n getTimeZones: function (course, sessions) {\r\n var key = this.getKey(course, sessions);\r\n if (timeZonesLookup.hasOwnProperty(key)) {\r\n return timeZonesLookup[key];\r\n }\r\n\r\n return [];\r\n },\r\n \r\n getKey: function (course, sessions) {\r\n var key = course.CourseId + '|';\r\n key += map(sessions, 'SessionId').join(',');\r\n return key;\r\n }\r\n});\r\n\r\nvar timeZonesStore = new TimeZonesStore();\r\ntimeZonesStore.dispatchToken = dispatcher.register(function (payload) {\r\n switch (payload.type) {\r\n case ActionTypes.GET_TIMEZONES:\r\n // take the list of course availabilities and map in to a sensible structure for displaying options\r\n var key = timeZonesStore.getKey(\r\n payload.course,\r\n payload.sessions);\r\n timeZonesLookup[key] = payload.timeZones;\r\n\r\n break;\r\n \r\n default:\r\n return;\r\n }\r\n\r\n timeZonesStore.emitChange();\r\n});\r\n\r\nexport default timeZonesStore;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport AvailabilityActionCreators from '../../actions/AvailabilityActionCreators.js';\r\nimport TimeZonesStore from '../../stores/TimeZonesStore.js';\r\nimport partial from 'lodash/partial';\r\nimport map from 'lodash/map';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport NavigationButtons from './navigation-buttons.jsx';\r\n\r\nfunction calcTime(currentTime, offset) {\r\n // convert to msec\r\n // add local time zone offset\r\n // get UTC time in msec\r\n var utc = currentTime.getTime() + (currentTime.getTimezoneOffset() * 60000);\r\n\r\n // create new Date object for different city\r\n // using supplied offset\r\n var nd = new Date(utc + (3600000 * offset));\r\n\r\n // return time as a string\r\n return nd.toLocaleTimeString();\r\n\r\n}\r\n\r\nvar TimeZone = createReactClass({\r\n displayName: \"TimeZone\",\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n\r\n getInitialState: function() {\r\n var data = this.props.wizard.state;\r\n return {\r\n time: new Date(),\r\n timeZones: TimeZonesStore.getTimeZones(data.Course, data.Sessions)\r\n };\r\n },\r\n\r\n updateTime: function() {\r\n this.setState({\r\n time: new Date()\r\n });\r\n },\r\n\r\n componentDidMount: function() {\r\n var data = this.props.wizard.state;\r\n AvailabilityActionCreators.getTimeZones(data.Course, data.Sessions);\r\n TimeZonesStore.addChangeListener(this.updateTimeZones);\r\n this.setState({\r\n intervalId: global.setInterval(this.updateTime, 1000)\r\n });\r\n },\r\n\r\n componentWillUnmount: function () {\r\n TimeZonesStore.removeChangeListener(this.updateTimeZones);\r\n if (this.state.intervalId) {\r\n global.clearInterval(this.state.intervalId);\r\n }\r\n },\r\n \r\n updateTimeZones: function () {\r\n var data = this.props.wizard.state;\r\n this.setState({\r\n timeZones: TimeZonesStore.getTimeZones(data.Course, data.Sessions)\r\n });\r\n },\r\n\r\n render: function() {\r\n var wizard = this.props.wizard;\r\n var is3rdPerson = wizard.state.IsUserCustomer;\r\n\r\n function getClassNameForButton(isSelected) {\r\n return \"btn \" + (isSelected ? \"btn-selected\" : \"btn-default\");\r\n }\r\n\r\n var inner = this.state.timeZones.length\r\n ? \r\n { global.OraWidgets.Options.showTimesInTimezone\r\n ?
Your local time: {this.state.time.toLocaleTimeString()}
Current time: {calcTime(this.state.time, timeZone.Offset)\r\n }
\r\n : false }\r\n
;\r\n }.bind(this))}\r\n
\r\n \r\n :
Finding available time zones...
;\r\n\r\n return
\r\n
Course Information
\r\n
{is3rdPerson ? \"In which time zone would \" + wizard.state.Student.FirstName + \" like to study?\" : \"In which time zone would you like to study?\"}
\r\n {inner}\r\n
\r\n ;\r\n },\r\n\r\n updateTimeZone: function (timeZone) {\r\n this.props.wizard.set({ TimeZone: timeZone });\r\n this.props.wizard.nextQuestion(true);\r\n },\r\n\r\n isValid: function() {\r\n if (this.props.wizard.state.TimeZone) {\r\n return true;\r\n }\r\n\r\n this.setState({ showError: true });\r\n return false;\r\n }\r\n});\r\n\r\nexport default TimeZone;","export default {\r\n Oxford: \"Oxford\",\r\n Cambridge: \"Cambridge\",\r\n \"Ascot, Berkshire\": \"St Mary's School, Ascot\",\r\n London: \"Imperial College London\",\r\n Uppingham: \"Uppingham School\",\r\n \"Yale University, USA\": \"Yale University\",\r\n \"UC Berkeley, USA\": \"UC Berkeley\",\r\n \"St Andrews, Scotland\": \"University of St Andrews\"\r\n};","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport CourseStore from '../../stores/CourseStore.js';\r\nimport BasketStore from '../../stores/BasketStore.js';\r\nimport Loading from '../common/loading.jsx';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport NavigationButtons from './navigation-buttons.jsx';\r\nimport RegionPrettyNameLookup from './region-pretty-name-lookup';\r\nimport any from 'lodash/some';\r\nimport map from 'lodash/map';\r\nimport filter from 'lodash/filter';\r\nimport flatten from 'lodash/flatten';\r\nimport uniqBy from 'lodash/uniqBy';\r\nimport sortBy from 'lodash/sortBy.js';\r\nimport partial from 'lodash/partial';\r\nimport BasketUtilities from '../../utilities/BasketUtilities.js';\r\n\r\nvar WhatRegion = createReactClass({\r\n displayName: \"WhatRegion\",\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n getInitialState: function () {\r\n var wizard = this.props.wizard;\r\n var isAdditionalCourse = any(BasketStore.getCourses(), function (course) {\r\n return BasketUtilities.studentEquals(course.Student, wizard.state.Student);\r\n });\r\n\r\n return {\r\n courses: CourseStore.getCourses(),\r\n isAdditionalCourse: isAdditionalCourse\r\n }\r\n },\r\n\r\n componentDidMount: function () {\r\n CourseStore.addChangeListener(this.updateCourses);\r\n this.skipIfPreselected();\r\n },\r\n\r\n componentWillUnmount: function () {\r\n CourseStore.removeChangeListener(this.updateCourses);\r\n },\r\n\r\n updateCourses: function () {\r\n var courses = CourseStore.getCourses();\r\n this.setState({\r\n courses: courses,\r\n }, this.skipIfPreselected)\r\n },\r\n\r\n updateRegion: function (region) {\r\n this.props.wizard.set({ Region: region }, this.props.wizard.nextQuestion);\r\n },\r\n\r\n\r\n skipIfPreselected: function () {\r\n // if a region has been preselected, then we can skip this step, \r\n // but we want to be able to visit this step later, so unset the preselection flag\r\n const wizard = this.props.wizard;\r\n const region = wizard.state.Region;\r\n if (region && region.IsPreselected) {\r\n region.IsPreselected = false;\r\n this.updateRegion(region)\r\n }\r\n },\r\n\r\n render: function () {\r\n var allCourses = this.state.courses;\r\n var loading = !any(allCourses);\r\n if (loading) return ;\r\n\r\n var wizard = this.props.wizard;\r\n var is3rdPerson = wizard.state.IsUserCustomer;\r\n\r\n var isAfterSeptember = moment.utc().month() >= 8;\r\n var studentAgeInSummer =\r\n isAfterSeptember\r\n ? moment([moment.utc().year() + 1, 7, 1]).diff(wizard.state.Student.DateOfBirth, 'years')\r\n : moment([moment.utc().year(), 7, 1]).diff(wizard.state.Student.DateOfBirth, 'years');\r\n\r\n var regionsForStudentAge = getRegions(allCourses, wizard.state.Student.DateOfBirth);\r\n\r\n return
\r\n
Great. {is3rdPerson\r\n ? \"On which campus would \" + wizard.state.Student.FirstName + \" like to study?\"\r\n : \"On which campus would you like to study?\"}\r\n
If you would like to study at more than one campus, you can come back and add another after completing this booking
\r\n
;\r\n },\r\n isValid: function () {\r\n var wizard = this.props.wizard;\r\n var hasError = false;\r\n\r\n if (!this.state.courses.length) {\r\n hasError = true;\r\n }\r\n else if (!wizard.state.Region) {\r\n hasError = true;\r\n\r\n } else {\r\n var allowedRegions = getRegions(this.state.courses, wizard.state.Student.DateOfBirth);\r\n\r\n // if Region Id isn't in the list\r\n if (!any(allowedRegions, function (r) { return r.RegionId === wizard.state.Region.RegionId })) {\r\n hasError = true;\r\n }\r\n }\r\n\r\n this.setState({ hasError: hasError });\r\n return !hasError;\r\n }\r\n});\r\n\r\nfunction getRegions(courses, studentDob) {\r\n var coursesInAgeGroup = filter(courses, function (c) {\r\n return any(c.Dates, function (cd) {\r\n var studentAgeOnDate = moment.utc(cd.From).diff(studentDob, 'years');\r\n\r\n function isStudentAgeEligible(ag) {\r\n return (!ag.LowerBound || ag.LowerBound <= studentAgeOnDate) && (!ag.UpperBound || studentAgeOnDate <= ag.UpperBound);\r\n }\r\n\r\n return any(c.AgeGroups, isStudentAgeEligible);\r\n });\r\n });\r\n\r\n return sortBy(regionsFromCourses(coursesInAgeGroup), function (r) { return r.RegionDisplayOrder; });\r\n\r\n\r\n function regionsFromCourses(courses) {\r\n return uniqBy(flatten(map(courses, function (c) { return c.Sites || [] })), function (r) { return r.RegionId });\r\n }\r\n}\r\n\r\nexport default WhatRegion;","import min from 'lodash/min';\r\nimport max from 'lodash/max';\r\nimport moment from 'moment';\r\nimport flatten from 'lodash/flatten';\r\nimport { DATE_FORMAT } from '../constants/Constants.js';\r\nimport map from 'lodash/map';\r\n\r\nfunction datesFromSessions(sessions) {\r\n var from = moment.utc(min(sessions, function (session) {\r\n return moment.utc(session.From).unix();\r\n }).From);\r\n var to = moment.utc(max(sessions, function (session) {\r\n return moment.utc(session.To).unix();\r\n }).To);\r\n\r\n var dates;\r\n if (from.format('YY') != to.format('YY')) {\r\n dates = from.format('Do MMM \\'YY') + ' - ' + to.format('Do MMM \\'YY');\r\n }\r\n else if (from.format('MMM') != to.format('MMM')) {\r\n dates = from.format('Do MMM') + ' - ' + to.format('Do MMM \\'YY');\r\n }\r\n else {\r\n dates = from.format('Do') + ' - ' + to.format('Do MMM \\'YY');\r\n }\r\n\r\n return dates;\r\n}\r\n\r\nfunction datesFromCourseItem(courseItem) {\r\n var description = '';\r\n if (courseItem.Course.CourseType.AvailabilityModel === 1) {\r\n description = moment.utc(courseItem.Options[0].StartDate).format(DATE_FORMAT);\r\n if (courseItem.Intensity.Weeks && courseItem.Intensity.Hours) {\r\n description += ' - ' + courseItem.Intensity.Weeks + ' week' + (courseItem.Intensity.Weeks > 1 ? 's' : '') + ', ' +\r\n courseItem.Intensity.Hours + ' hour' + (courseItem.Intensity.Hours > 1 ? 's' : '');\r\n } else if (courseItem.Intensity.Weeks) {\r\n description += ' - ' + courseItem.Intensity.Weeks + ' week' + (courseItem.Intensity.Weeks > 1 ? 's' : '');\r\n } else if (courseItem.Intensity.Hours) {\r\n description += ' - ' + courseItem.Intensity.Hours + ' hour' + (courseItem.Intensity.Hours > 1 ? 's' : '');\r\n }\r\n } else if (courseItem.Course.CourseType.AvailabilityModel === 0) {\r\n description = datesFromSessions(map(courseItem.Options, function (option) { return option.Session; }));\r\n } else {\r\n if (courseItem.Intensity.Weeks && courseItem.Intensity.Hours) {\r\n description = courseItem.intensity.Weeks + ' week' + (courseItem.Intensity.Weeks > 1 ? 's' : '') + ', ' +\r\n courseItem.Intensity.Hours + ' hour' + (courseItem.Intensity.Hours > 1 ? 's' : '');\r\n } else if (courseItem.Intensity.Weeks) {\r\n description = courseItem.Intensity.Weeks + ' week' + (courseItem.Intensity.Weeks > 1 ? 's' : '');\r\n } else if (courseItem.Intensity.Hours) {\r\n description = courseItem.Intensity.Hours + ' hour' + (courseItem.Intensity.Hours > 1 ? 's' : '');\r\n }\r\n }\r\n\r\n return description;\r\n}\r\n\r\nfunction descriptionFromCourseItem(courseItem) {\r\n var description = datesFromCourseItem(courseItem);\r\n if (courseItem.Course.HasCourseBreakdown) {\r\n if (description.length) {\r\n description += ' ';\r\n }\r\n\r\n description += flatten(map(courseItem.Options, function (option) {\r\n return map(option.Options, function (slotOption) {\r\n return slotOption.CourseOption.Name;\r\n });\r\n })).join(', ');\r\n }\r\n\r\n return description;\r\n}\r\n\r\nfunction to2Dp(number, precision) {\r\n // first bit does rounding\r\n var multiplier = Math.pow(10, precision + 1),\r\n wholeNumber = Math.floor(number * multiplier);\r\n var num = Math.round(wholeNumber / 10) * 10 / multiplier;\r\n\r\n // this bit converts to string with guaranteed 2dp\r\n return num.toFixed(2).toString();\r\n}\r\n\r\nfunction formatWithCommas(x) {\r\n // https://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript\r\n\r\n var str = x.toString();\r\n var bits = str.split('.');\r\n if (bits.length === 2) {\r\n var formatted = maybeFormat2Dp(str);\r\n var formattedBits = formatted.split('.');\r\n if (formattedBits.length === 1) {\r\n return formatted.replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n }\r\n\r\n return formattedBits[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\") + '.' + formattedBits[1];\r\n }\r\n\r\n return maybeFormat2Dp(x.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\"));\r\n}\r\n\r\nfunction maybeFormat2Dp(str) {\r\n var bits = str.split('.');\r\n if (bits.length === 2) {\r\n return Number(str).toFixed(2);\r\n }\r\n\r\n return str;\r\n}\r\n\r\nexport default {\r\n datesFromSessions: datesFromSessions,\r\n datesFromCourseItem: datesFromCourseItem,\r\n descriptionFromCourseItem: descriptionFromCourseItem,\r\n to2Dp: to2Dp,\r\n formatWithCommas: formatWithCommas,\r\n maybeFormat2Dp: maybeFormat2Dp\r\n};","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport AdManagerService from '../../utilities/AdManagerService.js';\r\nimport Loading from '../common/loading.jsx';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport NavigationButtons from './navigation-buttons.jsx';\r\nimport AvailabilityStore from '../../stores/AvailabilityStore.js';\r\nimport AvailabilityActionCreators from '../../actions/AvailabilityActionCreators.js';\r\nimport CourseStore from '../../stores/CourseStore.js';\r\n\r\nimport first from 'lodash/find';\r\nimport last from 'lodash/findLast';\r\nimport sortBy from 'lodash/sortBy';\r\nimport groupBy from 'lodash/groupBy';\r\nimport map from 'lodash/map';\r\nimport filter from 'lodash/filter';\r\nimport any from 'lodash/some';\r\nimport all from 'lodash/every';\r\nimport size from 'lodash/size';\r\nimport partial from 'lodash/partial';\r\nimport distinct from 'lodash/uniq';\r\nimport omit from 'lodash/omit';\r\nimport Ui from '../../utilities/Ui.js';\r\nimport uniqBy from 'lodash/uniqBy.js';\r\n\r\n\r\nvar WhatSession = createReactClass({\r\n displayName: \"WhatSession\",\r\n props: {\r\n wizard: PropTypes.object,\r\n course: PropTypes.object\r\n },\r\n\r\n getInitialState: function () {\r\n return {\r\n availability: AvailabilityStore.getCourseAvailability(this.props.course.CourseId, null),\r\n courses: CourseStore.getCourses(),\r\n isValid: true,\r\n sentWaitlistDates: []\r\n };\r\n },\r\n\r\n componentDidMount: function () {\r\n AvailabilityActionCreators.getAvailability(this.props.course.CourseId, null, null);\r\n AvailabilityStore.addChangeListener(this.updateAvailability);\r\n CourseStore.addChangeListener(this.updateCourses);\r\n AdManagerService.sessionOptionsTag(\r\n this.props.course.CourseId,\r\n this.props.course.Name,\r\n this.props.course.CourseType.Name,\r\n this.props.wizard.state.Region ? this.props.wizard.state.Region.RegionName : null);\r\n },\r\n\r\n componentWillUnmount: function () {\r\n AvailabilityStore.removeChangeListener(this.updateAvailability);\r\n CourseStore.removeChangeListener(this.updateCourses);\r\n },\r\n\r\n updateAvailability: function () {\r\n var availability = AvailabilityStore.getCourseAvailability(this.props.course.CourseId, null);\r\n var selectedIntensity = this.props.wizard.state.Intensity;\r\n var intensityId =\r\n selectedIntensity && selectedIntensity.IntensityId\r\n ? selectedIntensity.IntensityId\r\n : availability.length\r\n ? first(sortBy(distinct(map(availability, function (a) { return a.Intensity }),\r\n function (i) { return i.IntensityId; }),\r\n function (i) { return i.NumberOfSessions })).IntensityId\r\n : null;\r\n this.setState({ availability: availability, intensityId: intensityId });\r\n },\r\n\r\n updateCourses: function () {\r\n this.setState({ courses: CourseStore.getCourses() });\r\n },\r\n\r\n render: function () {\r\n var wizard = this.props.wizard;\r\n var student = wizard.state.Student;\r\n var course = this.props.course;\r\n var imageStyleSrc = { backgroundImage: \"url('\" + course.ImageUrl + \"')\" };\r\n \r\n var isLoading = !this.state.availability.length || !this.state.courses.length;\r\n if (isLoading) {\r\n return
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n {this.props.course.Name}\r\n
\r\n\r\n \r\n
\r\n
\r\n
\r\n
\r\n }\r\n\r\n var hasIntensities = course.Intensities.length > 1;\r\n var intensitiesWithAnySessions = filter(course.Intensities, function (i) {\r\n // include only intensities that have a non-zero amount of sessions (in the same region)\r\n return any(this.state.availability, function (a) {\r\n var isSelectedRegion = !wizard.state.Region || a.Region.RegionId === wizard.state.Region.RegionId;\r\n var isSameIntensity = a.Intensity.IntensityId == i.IntensityId;\r\n return isSameIntensity && isSelectedRegion;\r\n });\r\n }.bind(this));\r\n \r\n var region = wizard.state.Region;\r\n var sessionsByPrice = uniqBy(filter(this.state.availability, s => s.Region.RegionId === region.RegionId), a => a.Price);\r\n var hasJustOnePrice = sessionsByPrice.length === 1;\r\n var intensitySessions = map(intensitiesWithAnySessions, function(intensity) {\r\n var sessions = filterAvailabilities.call(this, intensity);\r\n var seasonSessions = groupBy(sessions, function (session) {\r\n return session.Season.SeasonId;\r\n });\r\n\r\n return {intensity: intensity, seasonSessions: seasonSessions};\r\n }.bind(this));\r\n\r\n\r\n var allUnavailable = all(intensitySessions, function(pair) {\r\n return all(pair.seasonSessions, function(availabilities) {\r\n return all(availabilities, function(availability) {\r\n var dates = getStartAndEndDates(availability.Sessions);\r\n var start = dates.start;\r\n var studentAgeOnSession = start.diff(student.DateOfBirth, 'years');\r\n var isStudentAgeOutOfRange = studentAgeOnSession < availability.MinAge || availability.MaxAge < studentAgeOnSession;\r\n return isStudentAgeOutOfRange;\r\n });\r\n });\r\n });\r\n\r\n if (allUnavailable) { // no sessions can be picked because ages out of range, therefore, this course shouldn't be on the list\r\n return false;\r\n }\r\n \r\n return
\r\n },\r\n\r\n selectSession: function (availability, intensity) {\r\n var sessions = availability.Sessions;\r\n this.props.wizard.set({\r\n SessionIds: map(sessions, function (s) { return s.SessionId }),\r\n SessionDates: map(getStartAndEndDates(sessions), function (d) { return d }),\r\n Sessions: sessions,\r\n Intensity: availability.Intensity,\r\n Course: this.props.course,\r\n SessionPricing: omit(availability, [\"Seasons\", \"Sessions\", \"Region\", \"Intensity\", \"Male\", \"Female\", \"Total\"]),\r\n }, this.props.wizard.nextQuestion);\r\n AdManagerService.bookTag(\r\n this.props.course.CourseId,\r\n this.props.course.Name,\r\n this.props.course.CourseType.Name,\r\n this.props.wizard.state.Region ? this.props.wizard.state.Region.RegionName : null,\r\n availability.Intensity.Name,\r\n availability.Price,\r\n map(sessions, function (s) { return s.Name; }).join(','));\r\n },\r\n\r\n joinWaitlist: function (availability) {\r\n var wizard = this.props.wizard;\r\n var student = wizard.state.Student;\r\n var is3rdPerson = wizard.state.IsUserCustomer;\r\n var course = this.props.course;\r\n\r\n var options = map(availability.Sessions, function (s) {\r\n return {\r\n Session: s\r\n };\r\n });\r\n\r\n AvailabilityActionCreators.sendNotifyRequest(course,\r\n availability.Intensity,\r\n options,\r\n availability.Region,\r\n is3rdPerson ? wizard.state.Customer.Email : student.Email,\r\n student.Mobile,\r\n student.FirstName + ' ' + student.LastName,\r\n student.Gender);\r\n this.setState({ isSent: true, errorMessage: '' });\r\n\r\n var currentNotifyDates = this.state.sentWaitlistDates;\r\n currentNotifyDates.push(getStartAndEndDates(availability.Sessions));\r\n this.setState({ sentWaitlistDates: currentNotifyDates });\r\n },\r\n\r\n updateIntensity: function (intensity) {\r\n this.setState({\r\n intensityId: intensity.IntensityId\r\n });\r\n },\r\n\r\n isValid: function () {\r\n var isValid = true;\r\n var availabilities = filterAvailabilities.call(this);\r\n var wizard = this.props.wizard;\r\n if (!wizard.state.SessionIds || !wizard.state.SessionIds.length || !any(availabilities, function (a) {\r\n return all(a.Sessions, function (s, i) { return s.SessionId === wizard.state.SessionIds[i] });\r\n })) {\r\n isValid = false;\r\n }\r\n\r\n this.setState({\r\n isValid: isValid\r\n });\r\n return isValid;\r\n }\r\n});\r\n\r\nfunction getStartAndEndDates(sessions) {\r\n\r\n var dateOrderedSessions = sortBy(sessions, function (s) { return s.StartDate }); // lexical sorting is FINE because it's ISO format :)\r\n return { start: moment.utc(first(dateOrderedSessions).From), end: moment.utc(last(dateOrderedSessions).To) };\r\n}\r\n\r\nfunction filterAvailabilities(intensity) {\r\n var sessions = this.state.availability;\r\n if (intensity) {\r\n sessions = filter(sessions, function (s) { return s.Intensity.IntensityId === intensity.IntensityId }.bind(this));\r\n }\r\n if (this.props.wizard.state.Region) {\r\n sessions = filter(sessions, function (s) { return s.Region.RegionId === this.props.wizard.state.Region.RegionId }.bind(this));\r\n }\r\n return sessions;\r\n}\r\n\r\nexport default WhatSession;\r\n","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\n\r\nimport CourseStore from '../../stores/CourseStore.js';\r\nimport Loading from '../common/loading.jsx';\r\nimport RegionPrettyNameLookup from './region-pretty-name-lookup';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport PressEnter from './press-enter-to-continue.jsx';\r\nimport NavigationButtons from './navigation-buttons.jsx';\r\n\r\nimport CourseSessionPicker from './course-session-picker.jsx';\r\n\r\nimport any from 'lodash/some';\r\nimport map from 'lodash/map';\r\nimport sortBy from 'lodash/sortBy';\r\nimport filter from 'lodash/filter';\r\nimport find from 'lodash/find';\r\nimport flatten from 'lodash/flatten';\r\nimport partial from 'lodash/partial';\r\nimport uniqBy from 'lodash/uniqBy';\r\nimport some from 'lodash/some';\r\nimport groupBy from 'lodash/groupBy';\r\nimport size from 'lodash/size';\r\n\r\nvar WhatCourse = createReactClass({\r\n displayName: \"WhatCourse\",\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n\r\n getInitialState: function () {\r\n return {\r\n courses: CourseStore.getCourses()\r\n };\r\n },\r\n\r\n componentDidMount: function () {\r\n CourseStore.addChangeListener(this.change);\r\n },\r\n\r\n componentWillUnmount: function () {\r\n CourseStore.removeChangeListener(this.change);\r\n },\r\n\r\n change: function () {\r\n var courses = CourseStore.getCourses();\r\n this.setState({\r\n courses: courses,\r\n });\r\n },\r\n\r\n\r\n updateRegion: function (region) {\r\n this.props.wizard.set({ Region: region });\r\n },\r\n\r\n resetCourse: function() {\r\n this.props.wizard.set({Course: null});\r\n },\r\n\r\n render: function () {\r\n var isLoading = !this.state.courses.length;\r\n if (isLoading) {\r\n return ;\r\n }\r\n\r\n var wizard = this.props.wizard;\r\n var is3rdPerson = wizard.state.IsUserCustomer;\r\n var student = wizard.state.Student;\r\n\r\n var allCourses = this.state.courses;\r\n var region = false;\r\n var excludeCoursesByStudyMethodAndAgeRange = function (c) {\r\n // does the selected study method match the course type?\r\n return c.CourseType.StudyMethod === (wizard.state.StudyMethod === \"onsite\" ? 0 : 1)\r\n // are there any sessions for this course where the student will be within the age bound?\r\n && any(c.Dates, function (s) {\r\n var studentAge = moment.utc(s.From).diff(student.DateOfBirth, 'years');\r\n return any(c.AgeGroups, function (ag) {\r\n return (!ag.LowerBound || ag.LowerBound <= studentAge)\r\n && (!ag.UpperBound || studentAge <= ag.UpperBound);\r\n });\r\n });\r\n }\r\n var courses = filter(allCourses, excludeCoursesByStudyMethodAndAgeRange);\r\n if (wizard.state.Region) {\r\n region = this.props.wizard.state.Region;\r\n\r\n var isSelectedRegion = function (s) { return s.RegionId === wizard.state.Region.RegionId };\r\n courses = filter(courses, function (c) { return any(c.Sites, isSelectedRegion) });\r\n }\r\n\r\n var regionsForStudentAge = getRegions(allCourses, wizard.state.Student.DateOfBirth);\r\n\r\n courses = sortBy(courses,\r\n (course) => wizard.state.Course && wizard.state.Course.CourseId === course.CourseId ? 0 : 1,\r\n (course) => !course.HasCourseBreakdown,\r\n (course) => course.Name);\r\n\r\n // maybe we have preselected an incompatible course, if so, don't be preselected!\r\n var isPreselected = wizard.state.Course && wizard.state.Course.IsPreselected && some(courses, c => c.CourseId === wizard.state.Course.CourseId);\r\n if (isPreselected) {\r\n courses = filter(courses, c => c.CourseId === wizard.state.Course.CourseId);\r\n }\r\n\r\n return \r\n
\r\n
\r\n {isPreselected\r\n ? \"Which session would \" + student.FirstName + \" like to attend?\"\r\n : \"Which Programme would \" + student.FirstName + \" like to study?\"\r\n }\r\n
\r\n\r\n {isPreselected // don't show mini region select if preselected\r\n ? false\r\n :\r\n
\r\n {map(regionsForStudentAge, function (region) {\r\n var isSelected = wizard.state.Region && wizard.state.Region.RegionId === region.RegionId;\r\n var containerClassNames = \"border border-brand-primary rounded-md text-brand-primary cursor-pointer shadow hover:shadow-lg hover:bg-brand-primary hover:text-white focus:outline-2 focus:outline-blue-500\"\r\n + (isSelected ? \" text-white bg-brand-primary\" : \"\");\r\n var regionName = GetRegionName(region);\r\n var id = \"region-\" + region.RegionId;\r\n\r\n return
\r\n If you would like {student.FirstName} to study a different programme, please click here to see all our programmes in {GetRegionName(wizard.state.Region)}. Or, to see all our programmes:\r\n
\r\n : false}\r\n \r\n \r\n\r\n
\r\n \r\n\r\n function renderCourses() {\r\n return
\r\n {map(courses, function (c) {\r\n return
\r\n \r\n
\r\n }.bind(this))}\r\n
\r\n }\r\n\r\n function countCourseOptions(course) {\r\n return size(groupBy(flatten(map(course.Slots, \"Options\")), \"CourseOptionId\"));\r\n }\r\n },\r\n\r\n isValid: function () {\r\n var hasError = false;\r\n if (!this.state.courses.length || !this.props.wizard.state.Course) {\r\n hasError = true;\r\n } else {\r\n var course = find(this.state.courses, function (c) { return c.CourseId === this.props.wizard.state.Course.CourseId }.bind(this));\r\n if (!course) {\r\n hasError = true;\r\n } else if (this.props.wizard.state.Region) {\r\n if (!any(course.Sites, function (s) { return s.RegionId === this.props.wizard.state.Region.RegionId }.bind(this))) {\r\n hasError = true;\r\n }\r\n }\r\n }\r\n\r\n this.setState({\r\n hasError: hasError\r\n });\r\n\r\n return !hasError;\r\n }\r\n});\r\n\r\nfunction GetRegionName(region) {\r\n return RegionPrettyNameLookup.hasOwnProperty(region.RegionName)\r\n ? RegionPrettyNameLookup[region.RegionName]\r\n : region.RegionName;\r\n}\r\n\r\nfunction isFlagshipCourse(c) {\r\n return c.Name === \"Broadening Horizons\" ||\r\n c.Name === \"New Perspectives\" ||\r\n c.Name === \"Ivy League Experience\";\r\n}\r\n\r\nfunction getRegions(courses, studentDob) {\r\n var coursesInAgeGroup = filter(courses, function (c) {\r\n return any(c.Dates, function (cd) {\r\n var studentAgeOnDate = moment.utc(cd.From).diff(studentDob, 'years');\r\n\r\n function isStudentAgeEligible(ag) {\r\n return (!ag.LowerBound || ag.LowerBound <= studentAgeOnDate) && (!ag.UpperBound || studentAgeOnDate <= ag.UpperBound);\r\n }\r\n\r\n return any(c.AgeGroups, isStudentAgeEligible);\r\n });\r\n });\r\n\r\n return sortBy(regionsFromCourses(coursesInAgeGroup), function (r) { return r.RegionDisplayOrder; });\r\n\r\n\r\n function regionsFromCourses(courses) {\r\n return uniqBy(flatten(map(courses, function (c) { return c.Sites || [] })), function (r) { return r.RegionId });\r\n }\r\n}\r\n\r\nexport default WhatCourse;","import Dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport groupBy from 'lodash/groupBy';\r\nimport sortBy from 'lodash/sortBy';\r\nimport create from 'lodash/create';\r\nimport map from 'lodash/map';\r\nimport Store from './Store.js';\r\n\r\nvar optionsLookup = {};\r\nvar optionsAvailabilitiesLookup = {};\r\n\r\nfunction OptionsStore() {\r\n Store.call(this);\r\n}\r\n\r\nOptionsStore.prototype = create(Store.prototype, {\r\n 'constructor': OptionsStore,\r\n\r\n getOptions: function (course, intensity, region, sessions, startDate) {\r\n var key = this.getKey(course, intensity, region, sessions, startDate);\r\n if (optionsLookup.hasOwnProperty(key)) {\r\n return optionsLookup[key];\r\n }\r\n\r\n return [];\r\n },\r\n\r\n getAvailabilities: function(course, intensity, region, sessions, startDate) {\r\n var key = this.getKey(course, intensity, region, sessions, startDate);\r\n if (optionsAvailabilitiesLookup.hasOwnProperty(key)) {\r\n return optionsAvailabilitiesLookup[key];\r\n }\r\n\r\n return [];\r\n },\r\n\r\n getKey: function (course, intensity, region, sessions, startDate) {\r\n var key = course.CourseId + '|' + intensity.IntensityId + '|' + region.RegionId + '|';\r\n if (startDate) {\r\n key += startDate;\r\n } else {\r\n key += map(sessions, 'SessionId').join(',');\r\n }\r\n\r\n return key;\r\n }\r\n});\r\n\r\nvar optionsStore = new OptionsStore();\r\noptionsStore.dispatchToken = Dispatcher.register(function (payload) {\r\n switch (payload.type) {\r\n case ActionTypes.GET_OPTIONS:\r\n // take the list of course availabilities and map in to a sensible structure for displaying options\r\n var key = optionsStore.getKey(\r\n payload.course,\r\n payload.intensity,\r\n payload.region,\r\n payload.sessions,\r\n payload.startDate);\r\n if (payload.course.HasCourseBreakdown) {\r\n optionsLookup[key] = mapOptions(payload);\r\n }\r\n\r\n optionsAvailabilitiesLookup[key] = payload.lineItem.Availabilities;\r\n\r\n break;\r\n\r\n case ActionTypes.GET_LINEITEM_OPTIONS_SUCCESS:\r\n optionsLookup[optionsStore.getKey(\r\n payload.lineItem.Course,\r\n payload.lineItem.Intensity,\r\n payload.lineItem.Region,\r\n payload.lineItem.Sessions)] =\r\n mapOptions(payload);\r\n break;\r\n\r\n default:\r\n return;\r\n }\r\n\r\n optionsStore.emitChange();\r\n});\r\n\r\nfunction mapOptions(payload) {\r\n // takes a list of OptionAvailalibity and maps to [{ Session: xxx, Slots: [{ CourseScheduleSlot: yyy, Options: [{ CourseOption: zzz, CourseAvailabilities: [CourseAvailabilities]}]}]}]\r\n return map(\r\n groupBy(\r\n payload.lineItem.Availabilities, \r\n function (option) {\r\n return option.Session.SessionId;\r\n }),\r\n function (options) {\r\n return {\r\n Session: options[0].Session,\r\n Slots: map(\r\n groupBy(\r\n options,\r\n function (options) {\r\n return options.CourseScheduleSlot.CourseScheduleSlotId;\r\n }),\r\n function (options) {\r\n return {\r\n CourseScheduleSlot: options[0].CourseScheduleSlot,\r\n Options: map(\r\n groupBy(\r\n options,\r\n function (option) {\r\n return option.CourseOption.CourseOptionId;\r\n }),\r\n function (options) {\r\n return {\r\n CourseOption: options[0].CourseOption,\r\n CourseAvailabilies: options\r\n };\r\n })\r\n };\r\n })\r\n };\r\n }\r\n );\r\n}\r\n\r\nfunction oldMapOptions(payload) {\r\n // takes a list of courseavailability and maps to [{ Session: xxx, Slots: [{ CourseScheduleSlot: yyy, Options: [{ CourseOption: zzz, CourseAvailabilities: [CourseAvailabilities]}]}]}]\r\n var courseAvailabilities = payload.options;\r\n return map(\r\n groupBy(\r\n courseAvailabilities,\r\n function (courseAvailabilty) {\r\n return courseAvailabilty.Session ? courseAvailabilty.Session.SessionId : courseAvailabilty.StartDate;\r\n }\r\n ),\r\n function (courseAvailabilities) {\r\n return {\r\n Session: courseAvailabilities[0].Session,\r\n StartDate: courseAvailabilities[0].StartDate,\r\n Slots: sortBy(\r\n map(\r\n groupBy(\r\n courseAvailabilities,\r\n function (courseAvailability) {\r\n return courseAvailability.CourseScheduleSlot.CourseScheduleSlotId;\r\n }),\r\n function (courseAvailabilities) {\r\n return {\r\n CourseScheduleSlot: courseAvailabilities[0].CourseScheduleSlot,\r\n Options: sortBy(\r\n map(\r\n groupBy(\r\n courseAvailabilities,\r\n function (courseAvailability) {\r\n return courseAvailability.CourseOption.CourseOptionId;\r\n }),\r\n function (courseAvailabilities) {\r\n return {\r\n CourseOption: courseAvailabilities[0].CourseOption,\r\n CourseAvailabilities: courseAvailabilities\r\n };\r\n }\r\n ),\r\n function (option) { return option.CourseOption.Name; })\r\n };\r\n }\r\n ),\r\n function (slot) {\r\n return slot.CourseScheduleSlot.DisplayOrder;\r\n })\r\n };\r\n });\r\n}\r\n\r\n//function getCourse(key) {\r\n// for (var i = 0; i < optionsLookup[key].length; i++) {\r\n// if (optionsLookup[key][i].Course) {\r\n// return optionsLookup[key][i].Course;\r\n// }\r\n// }\r\n\r\n// alert('There was an unknown error. Please contact customer support at admin@oxford-royale.co.uk');\r\n//}\r\n\r\n//function getSelectedRegions(key) {\r\n// if (selectedRegionsLookup.hasOwnProperty(key)) {\r\n// return selectedRegionsLookup[key];\r\n// }\r\n\r\n// return [];\r\n//}\r\n\r\n//function mapChoicesToOptions(key) {\r\n// var selectedRegions = getSelectedRegions(key);\r\n// var options = filter(optionsLookup[key], function (option) {\r\n// return any(selectedRegions, function (selectedRegion) {\r\n// return option.Site && option.Site.Region && option.Site.Region.RegionId == selectedRegion.RegionId;\r\n// });\r\n// });\r\n\r\n// var choices = choicesLookup.hasOwnProperty(key) ? choicesLookup[key] : [];\r\n// var course = getCourse(key);\r\n// var intersectedSiteIds = [];\r\n// var isSessionBased = options[0].CourseType.AvailabilityModel === 0;\r\n// var isDatesBased = options[0].CourseType.AvailabilityModel === 1;\r\n\r\n// if (isDatesBased) {\r\n// intersectedSiteIds = intersection.apply(global, map(choices, function (choice) {\r\n// return map(choice.courseAvailabilities, function(courseAvailability) {\r\n// return courseAvailability.Site.SiteId;\r\n// });\r\n// }));\r\n// } else if (isSessionBased) {\r\n// var sessionIds = uniq(map(options, function(option) {\r\n// return option.Session.SessionId;\r\n// }));\r\n\r\n// intersectedSiteIds = zipObject(map(sessionIds, function(sessionId) { return 'SessionId' + sessionId; }), map(sessionIds, function(sessionId) {\r\n// return intersection.apply(global, map(filter(choices, function(choice) {\r\n// return choice.session.SessionId == sessionId;\r\n// }), function(choice) {\r\n// return map(filter(choice.courseAvailabilities, function(courseAvailability) {\r\n// return courseAvailability.Male > 0 || courseAvailability.Female > 0;\r\n// }), \r\n// function(courseAvailability) {\r\n// return courseAvailability.Site.SiteId;\r\n// });\r\n// }));\r\n// }));\r\n// }\r\n\r\n// for (var i = 0; i < options.length; i++) {\r\n// var courseAvailabilityOption = options[i];\r\n// var isInChoices = inChoices(choices, courseAvailabilityOption);\r\n// courseAvailabilityOption.Selected = isInChoices;\r\n// courseAvailabilityOption.Disabled = !isInChoices\r\n// && ((courseAvailabilityOption.Male === 0 && courseAvailabilityOption.Female === 0)\r\n// || choiceMadeInSlot(choices, courseAvailabilityOption)\r\n// || (!course.AreOptionsBookablePerSlot && optionAlreadySelected(choices, courseAvailabilityOption))\r\n// || ((isDatesBased && choices.length && nonApplicableSite(courseAvailabilityOption, intersectedSiteIds))\r\n// || (isSessionBased && intersectedSiteIds['SessionId' + courseAvailabilityOption.Session.SessionId].length && nonApplicableSite(courseAvailabilityOption, intersectedSiteIds))));\r\n// }\r\n\r\n// return options;\r\n//}\r\n\r\n//function inChoices(choices, courseAvailabilityOption) {\r\n// for (var i = 0; i < choices.length; i++) {\r\n// if (choices[i].courseAvailabilities[0].CourseOption.CourseOptionId == courseAvailabilityOption.CourseOption.CourseOptionId\r\n// && choices[i].courseScheduleSlot.CourseScheduleSlotId == courseAvailabilityOption.CourseScheduleSlot.CourseScheduleSlotId\r\n// && (!choices[i].session || choices[i].session.SessionId == courseAvailabilityOption.Session.SessionId)) {\r\n// return true;\r\n// }\r\n// }\r\n\r\n// return false;\r\n//}\r\n\r\n//function choiceMadeInSlot(choices, courseAvailabilityOption) {\r\n// for (var i = 0; i < choices.length; i++) {\r\n// if (choices[i].courseScheduleSlot.CourseScheduleSlotId == courseAvailabilityOption.CourseScheduleSlot.CourseScheduleSlotId\r\n// && (!choices[i].session || choices[i].session.SessionId == courseAvailabilityOption.Session.SessionId)) {\r\n// return true;\r\n// }\r\n// }\r\n\r\n// return false;\r\n//}\r\n\r\n//function optionAlreadySelected(choices, courseAvailabilityOption) {\r\n// for (var i = 0; i < choices.length; i++) {\r\n// if (choices[i].courseAvailabilities[0].CourseOption.CourseOptionId == courseAvailabilityOption.CourseOption.CourseOptionId) {\r\n// return true;\r\n// }\r\n// }\r\n\r\n// return false;\r\n//}\r\n\r\n//function allOptionsSelectedForContext(key) {\r\n// var options = mapChoicesToOptions(key);\r\n// var choices = choicesLookup.hasOwnProperty(key) ? choicesLookup[key] : [];\r\n\r\n// // we need to group by options by session and slot and then see if we have a choice in each section\r\n// return all(options, function(option) {\r\n// var courseScheduleSlotId = option.CourseScheduleSlot.CourseScheduleSlotId;\r\n// return some(choices, function(choice) {\r\n// return (!option.Session || choice.session.SessionId == option.Session.SessionId)\r\n// && choice.courseScheduleSlot.CourseScheduleSlotId == courseScheduleSlotId;\r\n// });\r\n// });\r\n//}\r\n\r\n//function nonApplicableSite(courseAvailabilityOption, intersectedSiteIds) {\r\n// if (courseAvailabilityOption.Session) {\r\n// return indexOf(intersectedSiteIds['SessionId' + courseAvailabilityOption.Session.SessionId], courseAvailabilityOption.Site.SiteId) === -1;\r\n// }\r\n\r\n// return indexOf(intersectedSiteIds, courseAvailabilityOption.Site.SiteId) === -1;\r\n//}\r\n\r\nexport default optionsStore;","/*\r\n * React FitText v0.0.3\r\n * https://github.com/gianu/react-fittext\r\n *\r\n * A port of the jQuery plugin: http://github.com/davatron5000/FitText.js\r\n *\r\n * Released under the MIT license\r\n * http://gianu.mit-license.org\r\n */\r\n\r\n// MJ I've grabbed this as we're on older react\r\n'use strict';\r\n\r\nimport ReactDOM from 'react-dom';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nvar ReactPropTypes = PropTypes;\r\n\r\nexport default createReactClass({\r\n displayName: 'ReactFitText',\r\n\r\n propTypes: {\r\n children: ReactPropTypes.element.isRequired,\r\n compressor: ReactPropTypes.number,\r\n minFontSize: ReactPropTypes.number,\r\n maxFontSize: ReactPropTypes.number\r\n },\r\n\r\n getDefaultProps: function () {\r\n return {\r\n compressor: 1.0,\r\n minFontSize: Number.NEGATIVE_INFINITY,\r\n maxFontSize: Number.POSITIVE_INFINITY\r\n };\r\n },\r\n\r\n componentDidMount: function () {\r\n window.addEventListener(\"resize\", this._onBodyResize);\r\n this._onBodyResize();\r\n },\r\n\r\n componentWillUnmount: function () {\r\n window.removeEventListener(\"resize\", this._onBodyResize);\r\n },\r\n\r\n _onBodyResize: function () {\r\n var element = ReactDOM.findDOMNode(this);\r\n var width = element.offsetWidth;\r\n element.style.fontSize = Math.max(\r\n Math.min((width / (this.props.compressor * 10)),\r\n parseFloat(this.props.maxFontSize)),\r\n parseFloat(this.props.minFontSize)) + 'px';\r\n },\r\n\r\n render: function () {\r\n return this.props.children;\r\n }\r\n});\r\n","export default function permute(permutation) {\r\n var length = permutation.length,\r\n result = [permutation.slice()],\r\n c = new Array(length).fill(0),\r\n i = 1, k, p;\r\n\r\n while (i < length) {\r\n if (c[i] < i) {\r\n k = i % 2 && c[i];\r\n p = permutation[i];\r\n permutation[i] = permutation[k];\r\n permutation[k] = p;\r\n ++c[i];\r\n i = 1;\r\n result.push(permutation.slice());\r\n } else {\r\n c[i] = 0;\r\n ++i;\r\n }\r\n }\r\n return result;\r\n};","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport ReactFitText from '../common/react-fit-text.jsx';\r\nimport UI from '../../utilities/Ui.js';\r\nimport intersection from 'lodash/intersection';\r\nimport map from 'lodash/map';\r\nimport mapValues from 'lodash/mapValues';\r\nimport uniq from 'lodash/uniq';\r\nimport some from 'lodash/some';\r\nimport every from 'lodash/every';\r\nimport filter from 'lodash/filter';\r\nimport find from 'lodash/find';\r\nimport groupBy from 'lodash/groupBy';\r\nimport sortBy from 'lodash/sortBy';\r\nimport clone from 'lodash/clone';\r\nimport reduce from 'lodash/reduce';\r\nimport partial from 'lodash/partial';\r\nimport assign from 'lodash/assign';\r\nimport flatten from 'lodash/flatten';\r\nimport size from 'lodash/size';\r\nimport moment from 'moment';\r\nimport classNames from 'classnames';\r\nimport permute from '../../utilities/permute.js';\r\n\r\nvar OptionsPicker = createReactClass({\r\n propTypes: {\r\n agentAvailability: PropTypes.array,\r\n course: PropTypes.object.isRequired,\r\n intensity: PropTypes.object.isRequired,\r\n options: PropTypes.array,\r\n startDate: PropTypes.instanceOf(moment),\r\n availabilities: PropTypes.array.isRequired,\r\n defaultSelectedOptions: PropTypes.array, // allows you to specify an option to auto select, might (/does) not include the course availabilities for that selection\r\n onValid: PropTypes.func, // triggered when all options have been made (and the form can be submitted)\r\n onInvalid: PropTypes.func // triggered whenever an option is deselected and the picker is in a valid state\r\n },\r\n\r\n getInitialState: function () {\r\n // { CourseScheduleSlotGroupId: [Option, ... ]} \r\n var availabilityGroupedInToCourseScheduleSlotGroups = groupBy(\r\n this.props.availabilities,\r\n function (option) {\r\n if (option.CourseScheduleSlot.CourseScheduleSlotGroup) {\r\n return option.CourseScheduleSlot.CourseScheduleSlotGroup.CourseScheduleSlotGroupId;\r\n }\r\n\r\n return -1;\r\n });\r\n\r\n // { CourseScheduleSlotGroupId: [{ CourseScheduleSlotGroup: {}, Session: {}, CourseScheduleSlot: {} }]}\r\n var courseScheduleSlotGroups = mapValues(\r\n availabilityGroupedInToCourseScheduleSlotGroups,\r\n function (optionsArray, courseScheduleSlotGroupId) {\r\n var indicator = optionsArray[0];\r\n return uniq(\r\n map(\r\n optionsArray,\r\n function (option) {\r\n return {\r\n CourseScheduleSlotGroup: indicator.CourseScheduleSlot.CourseScheduleSlotGroup,\r\n Session: option.Session,\r\n CourseScheduleSlot: option.CourseScheduleSlot\r\n };\r\n }),\r\n function (mappedOption) {\r\n var sessionId = mappedOption.Session.SessionId;\r\n var slotId = mappedOption.CourseScheduleSlot.CourseScheduleSlotId;\r\n return sessionId + '|' + slotId;\r\n });\r\n });\r\n\r\n var selectedOptions = mapValues(\r\n availabilityGroupedInToCourseScheduleSlotGroups,\r\n function(options, courseScheduleSlotGroupId) {\r\n return map(\r\n filter(\r\n this.props.defaultSelectedOptions,\r\n function(selectedOption) {\r\n return courseScheduleSlotGroupId == -1 &&\r\n !selectedOption.CourseScheduleSlot.CourseScheduleSlotGroup ||\r\n (selectedOption.CourseScheduleSlot.CourseScheduleSlotGroup &&\r\n selectedOption.CourseScheduleSlot.CourseScheduleSlotGroup.CourseScheduleSlotGroupId ==\r\n courseScheduleSlotGroupId);\r\n }),\r\n function(selectedOption) {\r\n return selectedOption.CourseOption;\r\n });\r\n }.bind(this));\r\n\r\n return {\r\n availabilityInCourseScheduleSlotGroups: availabilityGroupedInToCourseScheduleSlotGroups,\r\n courseScheduleSlotGroups: courseScheduleSlotGroups,\r\n selectedOptions: selectedOptions\r\n };\r\n },\r\n\r\n // returns { permutation: [Slot/Session, ...], solution: [AvailabilityItem, ...] }\r\n getSolution: function (courseScheduleSlotGroups, selectedOptions, candidateCourseOption) {\r\n var solutions = this.innerGetSolutions(courseScheduleSlotGroups, selectedOptions, candidateCourseOption, true);\r\n if (!solutions.length) {\r\n return null;\r\n }\r\n\r\n return solutions[0];\r\n },\r\n\r\n // returns [{ permutation: [Slot/Session, ...], solution: [AvailabilityItem, ...] }]\r\n getSolutions: function(courseScheduleSlotGroups, selectedOptions) {\r\n return this.innerGetSolutions(courseScheduleSlotGroups, selectedOptions);\r\n },\r\n\r\n // returns [{ permutation: [Slot/Session, ...], solution: [AvailabilityItem, ...] }]\r\n innerGetSolutions: function (courseScheduleSlotGroups, selectedOptions, candidateCourseOption, returnFirst) {\r\n // let's flatten out our selectedOptions (which is {group1: [CourseOption, ...]}) \r\n var flattenedSelectedOptions = flatten(map(selectedOptions,\r\n function(groupCourseOptions) {\r\n return groupCourseOptions;\r\n }));\r\n\r\n // there's a shortcut here ... if the options can only be picked once across the booking then we can bail out if the candidate is a dupe\r\n if (!this.props.course.AreOptionsBookablePerSlot && candidateCourseOption) {\r\n if (some(flattenedSelectedOptions,\r\n function(courseOption) {\r\n return courseOption.CourseOptionId == candidateCourseOption.CourseOptionId;\r\n })) {\r\n return [];\r\n }\r\n }\r\n\r\n if (candidateCourseOption) {\r\n flattenedSelectedOptions.push(candidateCourseOption);\r\n }\r\n\r\n // this functions tries to find a solution to the selections that have been made\r\n // i.e. it is possible to solve which options go in which slots in multiple different ways\r\n // but we must have at least one way to do\r\n // this also lets us figure out which options we still have left to choose\r\n // What we do is this:\r\n // Get all the session/slot combinations\r\n // Generate the permutations of all those combinations\r\n // Then work our way through each selected course option and generate the different possible assignments for that option\r\n var slotSessionCombos = flatten(map(courseScheduleSlotGroups, function (courseScheduleSlotGroup) { return courseScheduleSlotGroup; })); // all the session/slot pairs\r\n var permutedSlotSessionCombos = permute(slotSessionCombos); // all the session/slot pairs in all the permutations\r\n var solutions = [];\r\n for (var permIdx = 0; permIdx < permutedSlotSessionCombos.length; permIdx++) {\r\n var permutation = permutedSlotSessionCombos[permIdx]; // [{Session1, Slot1}, {Session2: Slot2} ...]\r\n var permutationSolutionsArray = []; // we build this up as we go (array of arrays i.e. each possible solution for this permutation is an entry in the array)\r\n\r\n for (var selIdx = 0; selIdx < flattenedSelectedOptions.length; selIdx++) {\r\n var courseOption = flattenedSelectedOptions[selIdx];\r\n var slotSession = permutation[selIdx];\r\n\r\n // we need to find the availability items that would allow us to satisfy the selected options\r\n // availabilities must have Total > 0\r\n // availabilities must match site with existing sessions\r\n if (selIdx === 0) {\r\n // we don't need to consider our previous selections\r\n var matchingAvailability = getAvailabilityForCourseOptionAndSessionSlot(\r\n this.props.availabilities,\r\n courseOption,\r\n slotSession.Session,\r\n slotSession.CourseScheduleSlot);\r\n if (!matchingAvailability.length) {\r\n break;;\r\n }\r\n\r\n if (flattenedSelectedOptions.length === 1) {\r\n if (returnFirst) {\r\n return [{ permutation: permutation, solution: [matchingAvailability[0]] }];\r\n }\r\n\r\n solutions.push.apply(solutions,\r\n map(matchingAvailability, function(availability) {\r\n return {\r\n permutation: permutation,\r\n solution: [availability]\r\n };\r\n })\r\n );\r\n\r\n break; // goes round to next permutation\r\n }\r\n\r\n permutationSolutionsArray = map(matchingAvailability,\r\n function(availabilityItem) {\r\n return [availabilityItem];\r\n });\r\n } else {\r\n // we need to loop through the current solutions and make sure we have another solution\r\n var nextPermutationSolutionsArray = [];\r\n for (var solIdx = 0; solIdx < permutationSolutionsArray.length; solIdx++) {\r\n var currentPossibleSolution = permutationSolutionsArray[solIdx];\r\n var previousSessionSelection = find(currentPossibleSolution,\r\n function(availabilityItem) {\r\n return availabilityItem.Session.SessionId === slotSession.Session.SessionId;\r\n }); // this will be null if we've not been constrained to a particular site for this session yet\r\n var matchingAvailability = getAvailabilityForCourseOptionAndSessionSlot(\r\n this.props.availabilities,\r\n courseOption,\r\n slotSession.Session,\r\n slotSession.CourseScheduleSlot,\r\n previousSessionSelection ? previousSessionSelection.Site : null);\r\n if (!matchingAvailability.length) {\r\n continue;\r\n }\r\n\r\n if (selIdx === flattenedSelectedOptions.length - 1) {\r\n // we're at the end of our selections and we have a solution!\r\n if (returnFirst) {\r\n return [{\r\n permutation: permutation,\r\n solution: currentPossibleSolution.concat(matchingAvailability[0])\r\n }];\r\n }\r\n\r\n solutions.push.apply(solutions,\r\n map(matchingAvailability, function (availability) {\r\n return {\r\n permutation: permutation,\r\n solution: currentPossibleSolution.concat(availability)\r\n };\r\n })\r\n );\r\n\r\n break;\r\n }\r\n\r\n for (var mIdx = 0; mIdx < matchingAvailability.length; mIdx++) {\r\n nextPermutationSolutionsArray.push(\r\n currentPossibleSolution.concat(matchingAvailability[mIdx]));\r\n }\r\n }\r\n\r\n if (!nextPermutationSolutionsArray.length) {\r\n break;\r\n }\r\n\r\n permutationSolutionsArray = nextPermutationSolutionsArray;\r\n }\r\n }\r\n }\r\n\r\n return solutions;\r\n\r\n function getAvailabilityForCourseOptionAndSessionSlot(availabilities, courseOption, session, courseScheduleSlot, site) {\r\n // returns those options that match the option, slot and session\r\n return filter(\r\n availabilities,\r\n function (availabilityItem) {\r\n return availabilityItem.CourseScheduleSlot.CourseScheduleSlotId === courseScheduleSlot.CourseScheduleSlotId\r\n && availabilityItem.Session.SessionId === session.SessionId\r\n && availabilityItem.CourseOption.CourseOptionId === courseOption.CourseOptionId\r\n && (!site || availabilityItem.Site.SiteId === site.SiteId)\r\n && availabilityItem.Total > 0\r\n && !availabilityItem.IsClosed;\r\n });\r\n } \r\n },\r\n\r\n // indicates if all slots have an option selected\r\n isValid: function (selectedOptions) {\r\n selectedOptions = selectedOptions || this.state.selectedOptions;\r\n return every(selectedOptions,\r\n function(groupSelections, key) {\r\n return groupSelections.length === this.state.courseScheduleSlotGroups[key].length;\r\n }.bind(this));\r\n },\r\n \r\n isDisabledForAgent: function (session, courseOption, courseScheduleSlot) {\r\n // TODO come back to this\r\n if (!this.props.agentAvailability || this.props.agentAvailability.length === 0) {\r\n return false;\r\n }\r\n\r\n var match = find(this.props.agentAvailability,\r\n function (availability) {\r\n return availability.SessionId === session.SessionId &&\r\n availability.CourseOptionId === courseOption.CourseOptionId &&\r\n availability.CourseScheduleSlotId === courseScheduleSlot.CourseScheduleSlotId;\r\n });\r\n\r\n return match == undefined ? true : match.Allocated >= match.Capacity;\r\n },\r\n\r\n chooseOption: function (courseScheduleSlotGroupId, // may be -1 if no slot group\r\n idx, // the index in to the list of choices that has been selected\r\n event // the course option that has been chosen\r\n ) {\r\n var courseOptionId = event.target.value;\r\n var courseOption = find(this.props.availabilities,\r\n function(option) { return option.CourseOption.CourseOptionId == courseOptionId; }).CourseOption;\r\n var selectedOptions = this.state.selectedOptions;\r\n selectedOptions[courseScheduleSlotGroupId].push(courseOption);\r\n this.setState({\r\n selectedOptions: selectedOptions\r\n });\r\n\r\n if (this.isValid()) {\r\n // take the first solution and provide those options as the selection\r\n this.props.onValid(map(this.getSolutions(this.state.courseScheduleSlotGroups, selectedOptions), function (solution) {\r\n return solution.solution;\r\n }));\r\n }\r\n },\r\n\r\n clearOption: function (courseScheduleSlotGroupId, idx) {\r\n var wasValid = this.isValid();\r\n var selectedOptions = this.state.selectedOptions;\r\n var groupSelectedOptions = selectedOptions[courseScheduleSlotGroupId];\r\n var oIdx = groupSelectedOptions.length - 1;\r\n while (oIdx >= idx) {\r\n groupSelectedOptions.pop();\r\n oIdx--;\r\n }\r\n\r\n this.setState({\r\n selectedOptions: selectedOptions\r\n });\r\n\r\n if (wasValid) {\r\n this.props.onInvalid();\r\n }\r\n },\r\n\r\n getSelectedOption: function(courseScheduleSlotGroup, idx) {\r\n var optionsArray = this.state.selectedOptions[courseScheduleSlotGroup];\r\n if (optionsArray.length <= idx) {\r\n return false;\r\n }\r\n\r\n return optionsArray[idx];\r\n },\r\n\r\n renderChoice: function(title, choiceElement) {\r\n return (\r\n
\r\n \r\n
\r\n {choiceElement}\r\n
\r\n
);\r\n },\r\n \r\n render: function () {\r\n var userAgent = navigator.userAgent;\r\n var removeDisabledOptions = some(['iPhone', 'iPad'], function (word) { return userAgent.indexOf(word) >= 0; });\r\n\r\n return
Please note that the selection you make in one list may determine the availability in another list.
\r\n : false}\r\n {map(this.state.courseScheduleSlotGroups, function (options, courseScheduleSlotGroupId) {\r\n var indicatorGroup = options[0].CourseScheduleSlotGroup;\r\n var name = indicatorGroup ? indicatorGroup.Name : false;\r\n\r\n var choiceElements = [];\r\n for (var i = 0; i < options.length; i++) {\r\n // we show selections where they've been made\r\n // we show a select box for the next choice they need to make\r\n // we show help text where they've not chosen a predecessor\r\n var selectedOptionForIdx = this.getSelectedOption(courseScheduleSlotGroupId, i);\r\n var optionTitle = (!!name\r\n ? name + ' '\r\n : 'Subject ') + (i + 1);\r\n\r\n if (selectedOptionForIdx) { // choice already made, just show it\r\n choiceElements.push(this.renderChoice(\r\n {optionTitle},\r\n \r\n ✕\r\n {selectedOptionForIdx.Name}\r\n ));\r\n } else {\r\n if (i === 0 || this.getSelectedOption(courseScheduleSlotGroupId, i - 1)) { // it's the first slot in the group or it's the next slot after the last selected\r\n // show a selected box\r\n var groupAvailability = this.state.availabilityInCourseScheduleSlotGroups[courseScheduleSlotGroupId];\r\n var courseOptionAvailability = groupBy(\r\n groupAvailability,\r\n function(option) {\r\n return option.CourseOption.CourseOptionId;\r\n }); // { courseOptionId: [Availability, ...] }\r\n courseOptionAvailability = map(\r\n courseOptionAvailability,\r\n function (availability, courseOptionId) { //[Availability, ...]\r\n var courseOption = availability[0].CourseOption;\r\n return {\r\n CourseOption: courseOption,\r\n IsDisabled: this.getSolution(this.state.courseScheduleSlotGroups, this.state.selectedOptions, courseOption) === null,\r\n Options: availability\r\n };\r\n }.bind(this));\r\n\r\n if (removeDisabledOptions) {\r\n courseOptionAvailability = filter(courseOptionAvailability,\r\n function (courseOptionOption) {\r\n return !courseOptionOption.IsDisabled;\r\n });\r\n }\r\n\r\n choiceElements.push(this.renderChoice(\r\n {optionTitle},\r\n ));\r\n } else {\r\n // show a hint\r\n choiceElements.push(this.renderChoice(\r\n {optionTitle},\r\n ));\r\n }\r\n }\r\n }\r\n\r\n return
{choiceElements}
;\r\n }.bind(this))}\r\n
;\r\n }\r\n});\r\n\r\nexport default OptionsPicker;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport AvailabilityStore from '../../stores/AvailabilityStore.js';\r\nimport AvailabilityActionCreators from '../../actions/AvailabilityActionCreators.js';\r\nimport OptionsStore from '../../stores/OptionsStore.js';\r\nimport OptionsPicker from '../optionspicker/options-picker.jsx';\r\nimport NavigationButtons from './navigation-buttons.jsx';\r\nimport Loading from '../common/loading.jsx';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport PressEnter from './press-enter-to-continue.jsx';\r\nimport clone from 'lodash/clone';\r\nimport first from 'lodash/first';\r\nimport isArray from 'lodash/isarray';\r\n\r\nvar WhatSessionOptions = createReactClass({\r\n displayName: \"WhatSessionOptions\",\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n\r\n getInitialState: function() {\r\n var data = this.props.wizard.state;\r\n return {\r\n isValid: true,\r\n options: OptionsStore.getOptions(data.Course, data.Intensity, data.Region, data.Sessions),\r\n optionsAvailabilities: OptionsStore.getAvailabilities(data.Course, data.Intensity, data.Region, data.Sessions)\r\n };\r\n },\r\n\r\n componentDidMount: function() {\r\n var data = this.props.wizard.state;\r\n AvailabilityActionCreators.getOptions(data.Course, data.Intensity, data.Region, data.Sessions);\r\n OptionsStore.addChangeListener(this.updateOptions);\r\n },\r\n\r\n componentWillUnmount: function() {\r\n OptionsStore.removeChangeListener(this.updateOptions);\r\n },\r\n\r\n updateOptions: function() {\r\n var data = this.props.wizard.state;\r\n this.setState({\r\n options: OptionsStore.getOptions(data.Course, data.Intensity, data.Region, data.Sessions),\r\n optionsAvailabilities: OptionsStore.getAvailabilities(data.Course, data.Intensity, data.Region, data.Sessions)\r\n });\r\n },\r\n\r\n render: function() {\r\n var isLoading = !this.state.options.length;\r\n if (isLoading) { return ; }\r\n\r\n var wizard = this.props.wizard;\r\n var is3rdPerson = wizard.state.IsUserCustomer;\r\n var region = clone(wizard.state.Region);\r\n region.Name = null;\r\n region.SiteId = null;\r\n\r\n return
\r\n
Great - just a couple more questions.
\r\n \r\n \r\n \r\n \r\n\r\n \r\n
\r\n ; \r\n },\r\n\r\n updateCourseOptions: function(results) {\r\n // if there is only one option to choose from, the options picker returns the solution [ { solution }]\r\n // usually it returns an array of arrays of solutions\r\n // and elsewhere, we assume the solutions are of the form [ [ {solution A}, ... ], [ {Solution B}, ... ]]\r\n if (!isArray(first(results))) {\r\n results = [results];\r\n }\r\n\r\n this.props.wizard.set({\r\n CourseOptionSolutions: results\r\n });\r\n },\r\n\r\n updateCourseOnInvalid: function() {\r\n this.props.wizard.set({\r\n CourseOptionSolutions: []\r\n });\r\n },\r\n\r\n isValid: function() {\r\n var isValid = true;\r\n if (!this.props.wizard.state.CourseOptionSolutions || !this.props.wizard.state.CourseOptionSolutions.length) { \r\n isValid = false;\r\n }\r\n\r\n this.setState({\r\n isValid: isValid\r\n });\r\n return isValid;\r\n }\r\n});\r\n\r\nexport default WhatSessionOptions;","import isArray from 'lodash/isarray';\r\nimport uri from 'urijs';\r\n\r\nvar search = global.location.search;\r\nvar params = {};\r\nif (search) {\r\n search = search.substring(1);\r\n var parts = search.split('&');\r\n for (var i = 0; i < parts.length; i++) {\r\n var bits = parts[i].split('=');\r\n var key = bits[0].toLowerCase();\r\n var value = bits.length > 1 ? tryParseValue(bits[1]) : true;\r\n if (params.hasOwnProperty(key)) {\r\n if (isArray(params[key])) {\r\n params[key].push(value);\r\n } else {\r\n var newValue = [params[key]];\r\n newValue.push(value);\r\n params[key] = newValue;\r\n }\r\n } else {\r\n params[key] = value;\r\n }\r\n }\r\n}\r\n\r\nfunction tryParseValue(value) {\r\n if (value) {\r\n switch (value.toLowerCase()) {\r\n case 'true':\r\n case 'on':\r\n case 'yes':\r\n value = true;\r\n break;\r\n\r\n case 'false':\r\n case 'off':\r\n case 'no':\r\n value = false;\r\n break;\r\n\r\n default:\r\n value = uri.decodeQuery(value);\r\n break;\r\n }\r\n }\r\n\r\n return value;\r\n}\r\n\r\nexport default params;","import Dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport create from 'lodash/create';\r\nimport indexOf from 'lodash/indexOf';\r\nimport isArray from 'lodash/isarray';\r\nimport Store from './Store.js';\r\nimport uri from 'urijs';\r\nimport query from '../utilities/QueryStringParser.js';\r\n\r\nvar multipleFilters = ['selectedRegionIds', 'selectedCourseTypeIds'];\r\nvar state = {};\r\nvar courseTypes = [];\r\nvar sites = [];\r\n\r\n// handle initial load and setting filters from the url\r\nmaybeAddFilterFromUrl('subject');\r\nmaybeAddFilterFromUrl('regionid', 'selectedRegionIds', true);\r\nmaybeAddFilterFromUrl('age', 'selectedAge');\r\nmaybeAddFilterFromUrl('coursetypeid', 'selectedCourseTypeIds', true);\r\nmaybeAddFilterFromUrl('month', 'selectedMonth');\r\n\r\nfunction maybeAddFilterFromUrl(queryName, stateKey, isNumeric) {\r\n stateKey = stateKey || queryName;\r\n if (query.hasOwnProperty(queryName)) {\r\n var value = query[queryName];\r\n if (indexOf(multipleFilters, stateKey) > -1) {\r\n if (isArray(value)) {\r\n if (isNumeric) {\r\n for (var i = 0; i < value.length; i++) {\r\n value[i] = value[i] * 1.0;\r\n }\r\n }\r\n\r\n state[stateKey] = value;\r\n } else {\r\n if (isNumeric) {\r\n value = value * 1.0;\r\n }\r\n\r\n state[stateKey] = [value];\r\n }\r\n } else {\r\n if (isNumeric) {\r\n value = value * 1.0;\r\n }\r\n\r\n state[stateKey] = value;\r\n }\r\n }\r\n}\r\n\r\nfunction syncUrl() {\r\n var lookup = {\r\n selectedRegionIds: 'regionid',\r\n selectedAge: 'age',\r\n selectedCourseTypeIds: 'coursetypeid',\r\n selectedMonth: 'month',\r\n subject: 'subject'\r\n };\r\n if (window.history) {\r\n var newUrl = uri(location);\r\n for (var key in lookup) {\r\n if (lookup.hasOwnProperty(key)) {\r\n newUrl.removeSearch(lookup[key]);\r\n }\r\n }\r\n\r\n for (var key in state) {\r\n if (state.hasOwnProperty(key)) {\r\n var queryName = lookup[key];\r\n var value = state[key];\r\n if (isArray(value)) {\r\n for (var i = 0; i < value.length; i++) {\r\n newUrl.addSearch(queryName, value[i]);\r\n }\r\n } else {\r\n newUrl.addSearch(queryName, value);\r\n }\r\n }\r\n }\r\n\r\n window.history.replaceState({}, '', newUrl);\r\n }\r\n}\r\n\r\nfunction FiltersStore() {\r\n Store.call(this);\r\n}\r\n\r\nFiltersStore.prototype = create(Store.prototype, {\r\n 'constructor': FiltersStore,\r\n\r\n get: function (key) {\r\n if (state.hasOwnProperty(key)) {\r\n return state[key];\r\n }\r\n\r\n return indexOf(multipleFilters, key) > -1 ? [] : null;\r\n },\r\n\r\n getCourseTypes: function () {\r\n return courseTypes;\r\n },\r\n\r\n getSites: function() {\r\n return sites;\r\n }\r\n});\r\n\r\nvar filtersStore = new FiltersStore();\r\nfiltersStore.dispatchToken = Dispatcher.register(function (payload) {\r\n switch (payload.type) {\r\n case ActionTypes.UPDATE_FILTER:\r\n state[payload.key] = payload.value;\r\n break;\r\n\r\n case ActionTypes.CLEAR_FILTERS:\r\n state = {};\r\n break;\r\n\r\n case ActionTypes.GET_ALL_COURSE_TYPES:\r\n courseTypes = payload.courseTypes;\r\n break;\r\n\r\n case ActionTypes.GET_ALL_SITES:\r\n sites = payload.sites;\r\n break;\r\n\r\n default:\r\n return;\r\n }\r\n\r\n syncUrl();\r\n filtersStore.emitChange();\r\n});\r\n\r\nexport default filtersStore;","import options from './WidgetOptions.js';\r\nimport http from './Http.js';\r\n\r\nexport default {\r\n getAll: function() {\r\n return http.get(options.apiEndpoint() + '/Site?take=999');\r\n }\r\n};","import Dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport SiteService from '../utilities/SiteService.js';\r\n\r\nexport default {\r\n getAll: function() {\r\n SiteService.getAll().done(function (sites) {\r\n Dispatcher.dispatch({ type: ActionTypes.GET_ALL_SITES, sites: sites.Items });\r\n });\r\n }\r\n};","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport Linkify from 'react-linkify';\r\nimport Loading from '../common/loading.jsx';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport NavigationButtons from './navigation-buttons.jsx';\r\nimport PressEnter from './press-enter-to-continue.jsx';\r\nimport FiltersStore from '../../stores/FiltersStore.js';\r\nimport OptionsStore from '../../stores/OptionsStore.js';\r\nimport SiteActionCreators from '../../actions/SiteActionCreators.js';\r\nimport AvailabilityActionCreators from '../../actions/AvailabilityActionCreators.js';\r\nimport groupBy from 'lodash/groupBy';\r\nimport map from 'lodash/map';\r\nimport find from 'lodash/find';\r\nimport first from 'lodash/first';\r\nimport forOwn from 'lodash/forOwn';\r\nimport reduce from 'lodash/reduce';\r\nimport flatten from 'lodash/flatten';\r\nimport distinct from 'lodash/uniq';\r\nimport partial from 'lodash/partial';\r\nimport clone from 'lodash/clone';\r\nimport any from 'lodash/some';\r\nimport size from 'lodash/size';\r\nimport omit from 'lodash/omit';\r\nimport mapValues from 'lodash/mapValues';\r\nimport filter from 'lodash/filter';\r\nimport reject from 'lodash/reject';\r\n\r\nvar WhatSite = createReactClass({\r\n displayName: \"WhatSite\",\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n\r\n getInitialState: function () {\r\n var state = {\r\n isValid: true,\r\n sites: FiltersStore.getSites(),\r\n forbiddenSitesBySession: {}\r\n };\r\n\r\n var wizardState = this.props.wizard.state;\r\n if (!wizardState.Course.hasCourseBreakdown) {\r\n state.availabilities = OptionsStore.getAvailabilities(wizardState.Course, wizardState.Intensity, wizardState.Region, wizardState.Sessions);\r\n }\r\n\r\n return state;\r\n },\r\n\r\n componentDidMount: function () {\r\n var wizardState = this.props.wizard.state;\r\n if (!wizardState.Course.hasCourseBreakdown) {\r\n AvailabilityActionCreators.getOptions(wizardState.Course, wizardState.Intensity, wizardState.Region, wizardState.Sessions);\r\n OptionsStore.addChangeListener(this.updateAvailability);\r\n }\r\n\r\n SiteActionCreators.getAll();\r\n FiltersStore.addChangeListener(this.updateSites);\r\n },\r\n\r\n componentWillUnmount: function() {\r\n FiltersStore.removeChangeListener(this.updateSites);\r\n OptionsStore.removeChangeListener(this.updateAvailability);\r\n },\r\n\r\n updateAvailability: function () {\r\n var wizardState = this.props.wizard.state;\r\n this.setState({\r\n availabilities: OptionsStore.getAvailabilities(wizardState.Course,\r\n wizardState.Intensity,\r\n wizardState.Region,\r\n wizardState.Sessions)\r\n });\r\n },\r\n \r\n updateSites: function() {\r\n var sites = FiltersStore.getSites();\r\n this.setState({\r\n sites: sites\r\n });\r\n },\r\n\r\n skipIfOnlyOneOption: function() {\r\n if (!this.state.sites || !this.state.availabilities.length) return;\r\n\r\n if (this.props.wizard.state.SessionPricing.IsNonResidentialAvailable) return; \r\n\r\n var sessionSitePairs = getPossibleSitesBySession(this.props.wizard.state, this.state.availabilities);\r\n if (Object.keys(sessionSitePairs).length === 1) {\r\n var sessionId = Object.keys(sessionSitePairs)[0];\r\n if (sessionSitePairs[sessionId].length === 1) {\r\n var session = find(this.props.wizard.state.Sessions, function (s) { return s.SessionId == Object.keys(sessionSitePairs) });\r\n var site = sessionSitePairs[session.SessionId];\r\n this.chooseSite(session, site, this.props.wizard.nextQuestion);\r\n }\r\n }\r\n },\r\n\r\n render: function() {\r\n var isLoading = !this.state.sites.length || (!this.props.wizard.state.Course.HasCourseBreakdown && !this.state.availabilities.length);\r\n if (isLoading) { return ; }\r\n\r\n var wizard = this.props.wizard;\r\n var is3rdPerson = wizard.state.IsUserCustomer;\r\n var student = wizard.state.Student;\r\n var isNonResidentialAvailable = wizard.state.SessionPricing.IsNonResidentialAvailable;\r\n var sessionSitePairs = getPossibleSitesBySession(wizard.state, this.state.availabilities);\r\n var isMultiSessionCourse = size(sessionSitePairs) > 1;\r\n\r\n var nonRezOption = (!isNonResidentialAvailable \r\n ? false \r\n :
\r\n
\r\n
\r\n
Non-Residential (no accommodation)
\r\n
For this course, you can arrange your own accommodation and live off campus.\r\n For full details on what's included and what isn't in our non-residential packages,\r\n please contact us on admin@oxford-royale.co.uk or using our live chat facility.\r\n The price to take this course as non-residential is GBP {wizard.state.SessionPricing.NonResidentialPriceIncludingDiscount}\r\n
\r\n \r\n
\r\n
\r\n
);\r\n\r\n return
\r\n
{is3rdPerson\r\n ? \"In which accommodation would \" + student.FirstName + \" like to stay?\"\r\n : \"In which accommodation would you like to stay?\"}\r\n
\r\n\r\n \r\n {map(sessionSitePairs, function (sites, sessionId, self) {\r\n var session = find(wizard.state.Sessions, function (s) { return s.SessionId == sessionId });\r\n var isFirstInLoop = Object.keys(self)[0] === sessionId;\r\n\r\n var from = moment.utc(session.From).format(\"Do MMMM\");\r\n var to = moment.utc(session.To).format(\"Do MMMM YYYY\");\r\n\r\n return \r\n
\r\n {isMultiSessionCourse\r\n ? \r\n
For {from} - {to}
\r\n
\r\n We have the following accommodation options for {wizard.state.Course.Name} in {wizard.state.Region.RegionName}:\r\n
\r\n \r\n :
\r\n We have the following accommodation options for {wizard.state.Course.Name} in {wizard.state.Region.RegionName} for {from} - {to}:\r\n
}\r\n\r\n
\r\n {map(sites, function(basicSite) {\r\n var site = find(this.state.sites, function (s) { return s.SiteId === basicSite.SiteId });\r\n var currentAccommodation = wizard.state.Accommodation;\r\n \r\n var isSelected = !currentAccommodation.IsNonResidential && currentAccommodation[sessionId] && currentAccommodation[sessionId].SiteId == site.SiteId;\r\n var isForbidden = this.state.forbiddenSitesBySession[sessionId] && any(this.state.forbiddenSitesBySession[sessionId], function (s) { return s.SiteId == basicSite.SiteId });\r\n\r\n var buttonClass = \"btn \" + (isSelected ? \"btn-primary\" : \"btn-default\"); \r\n\r\n var hasEnsuite = any(this.state.availabilities, function (availability) { return availability.Site.SiteId === site.SiteId && availability[wizard.state.Student.Gender + 'Ensuite'] > 0 });\r\n \r\n return
\r\n {\r\n map(flatten(map(upsellOption.Options, \"Options\")), function (option) {\r\n return
\r\n {option.LineItem.Course.Name}\r\n \r\n
;\r\n }.bind(this))\r\n }\r\n
\r\n
;\r\n }.bind(this))}\r\n \r\n\r\n \r\n
\r\n ;\r\n }\r\n});\r\n\r\nexport default Upsells;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport moment from 'moment';\r\nimport BasketStore from '../../stores/BasketStore.js';\r\nimport BasketActionCreators from '../../actions/BasketActionCreators.js';\r\nimport Ui from '../../utilities/Ui.js';\r\nimport RegionPrettyNameLookup from './region-pretty-name-lookup';\r\nimport first from 'lodash/first';\r\nimport last from 'lodash/last';\r\nimport isEmpty from 'lodash/isEmpty';\r\nimport map from 'lodash/map';\r\nimport uniq from 'lodash/uniq';\r\nimport sortBy from 'lodash/sortBy';\r\nimport groupBy from 'lodash/groupBy';\r\nimport flatten from 'lodash/flatten';\r\nimport filter from 'lodash/filter';\r\nimport some from 'lodash/some';\r\nimport partial from 'lodash/partial';\r\nimport partialRight from 'lodash/partialRight';\r\nimport reduce from 'lodash/reduce';\r\nvar sum = partialRight(reduce, function (total, n) { return total + n; });\r\n\r\nvar Summary = createReactClass({\r\n displayName: \"Summary\",\r\n getInitialState: function () {\r\n var totals = BasketStore.getBasketTotals();\r\n var bookings = BasketStore.getCourses();\r\n return {\r\n bookings: bookings,\r\n totalIncludingCourseDiscounts: totals.totalIncludingCourseDiscounts,\r\n totalIncludingBasketDiscounts: totals.totalIncludingBasketDiscounts,\r\n basketDeposit: totals.deposit,\r\n showUpsells: false,\r\n };\r\n },\r\n\r\n getDepositFromWizard: function () {\r\n var booking = this.props.wizard.state;\r\n var deposit = false;\r\n if (booking.SessionPricing) {\r\n deposit += booking.SessionPricing.Deposit;\r\n }\r\n\r\n if (booking.SelectedUpsellOptions && booking.SelectedUpsellOptions.length) {\r\n deposit += sum(map(booking.SelectedUpsellOptions, \"Deposit\"));\r\n }\r\n\r\n return deposit;\r\n },\r\n\r\n getTotalFromWizard: function () {\r\n var booking = this.props.wizard.state;\r\n return this.getPriceFromBooking(booking) + this.getPriceFromUpsells(booking);\r\n },\r\n\r\n getPriceFromBooking: function (booking) {\r\n return booking.SessionPricing &&\r\n booking.Accommodation &&\r\n booking.Accommodation.IsNonResidential\r\n ? booking.SessionPricing.NonResidentialPriceIncludingDiscount\r\n : (booking.SessionPricing ? booking.SessionPricing.PriceIncludingDiscount : false);\r\n },\r\n\r\n getPriceFromUpsells: function (booking) {\r\n if (booking.SelectedUpsellOptions && booking.SelectedUpsellOptions.length) {\r\n return sum(map(booking.SelectedUpsellOptions, function (option) { return option.Price; }));\r\n }\r\n\r\n if (booking.Course && booking.Course.CourseType.AvailabilityModel === 2) { // it's an upsell from the basket\r\n return booking.PriceExcludingDiscount;\r\n }\r\n\r\n return false;\r\n },\r\n\r\n componentDidMount: function () {\r\n BasketStore.addChangeListener(this.change);\r\n },\r\n\r\n componentWillUnmount: function () {\r\n BasketStore.removeChangeListener(this.change);\r\n },\r\n\r\n change: function () {\r\n var bookings = BasketStore.getCourses();\r\n var change = {};\r\n if (bookings !== this.state.bookings) {\r\n change.bookings = bookings;\r\n }\r\n\r\n var totals = BasketStore.getBasketTotals();\r\n var totalFromWizard = this.getTotalFromWizard();\r\n if (totals.totalIncludingBasketDiscounts !== this.state.totalIncludingBasketDiscounts ||\r\n totals.totalIncludingCourseDiscounts !== this.state.totalIncludingCourseDiscounts ||\r\n totals.deposit !== this.state.basketDeposit) {\r\n change.totalIncludingCourseDiscounts = totals.totalIncludingCourseDiscounts;\r\n change.totalIncludingBasketDiscounts = totals.totalIncludingBasketDiscounts;\r\n change.basketDeposit = totals.deposit;\r\n }\r\n\r\n if (!isEmpty(change)) {\r\n this.setState(change);\r\n }\r\n },\r\n\r\n handleRemove: function (booking) {\r\n var message = \"Are you sure you want to remove \" + booking.Course.Name + \" for \" + booking.Student.FirstName + \" \" + booking.Student.LastName + \"?\";\r\n\r\n if (confirm(message)) {\r\n BasketActionCreators.removeCourse(booking.ItemId);\r\n }\r\n },\r\n\r\n handleRemoveUpsell: function (upsell) {\r\n var message = \"Are you sure you want to remove \" + upsell.LineItem.Course.Name + \"?\";\r\n\r\n if (confirm(message)) {\r\n this.props.wizard.set({\r\n SelectedUpsellOptions: filter(this.props.wizard.state.SelectedUpsellOptions, function (u) { return u !== upsell })\r\n });\r\n }\r\n },\r\n\r\n handleChange: function (booking) {\r\n var course = BasketStore.getCourseByItemId(booking.ItemId);\r\n this.props.wizard.resetCourse();\r\n this.props.wizard.set({ \r\n CurrentItemId: booking.ItemId,\r\n Student: course.Student,\r\n Region: booking.Region\r\n }, () => this.props.wizard.jump('WhatCourse'));\r\n },\r\n\r\n jumpToCustomer: function () {\r\n this.props.wizard.jump('Customer');\r\n },\r\n\r\n jumpToStudent: function (itemId) {\r\n var course = BasketStore.getCourseByItemId(itemId);\r\n this.props.wizard.set({ \r\n CurrentItemId: itemId,\r\n Student: course.Student },\r\n () => this.props.wizard.jump('Student')); \r\n },\r\n\r\n clearBasket: function () {\r\n if (confirm('Are you sure you want to clear your basket?')) {\r\n BasketActionCreators.clearBasket();\r\n this.props.wizard.reset();\r\n }\r\n },\r\n\r\n render: function () {\r\n var wizard = this.props.wizard;\r\n\r\n var data = this.props.wizard.state;\r\n var basketBookings = this.getBookingDataFromBasket();\r\n var basketUpsells = filter(this.state.bookings, function (b) { return b.Course.CourseType.AvailabilityModel === 2 });\r\n var upsellsBasketTotal = isEmpty(basketUpsells) ? 0 : sum(map(basketUpsells, this.getPriceFromUpsells));\r\n\r\n var bookings = basketBookings;\r\n\r\n var depositTotal = this.state.basketDeposit;\r\n var upsellsTotal = upsellsBasketTotal;\r\n\r\n var renderBookings = partialRight(map, function (booking, index, bookingsCollection) {\r\n // don't render any booking stuff if all I have is student data\r\n if (!booking.IsBasketCase && !data.Region && !data.Course) {\r\n return false;\r\n }\r\n\r\n var price = this.getPriceFromBooking(booking);\r\n\r\n return \r\n
\r\n }.bind(this))}\r\n ;\r\n }.bind(this));\r\n\r\n var bookingsByStudent = groupBy(bookings, function (booking) {\r\n return getStudentKey(booking.Student);\r\n });\r\n\r\n return
\r\n
\r\n \r\n \r\n
\r\n
\r\n {!data.HasStartedWizard\r\n ? Watch your live summary update here as you make your selections!\r\n : \r\n {data.IsUserCustomer || data.IsUserCustomer === null\r\n ?
);\r\n }\r\n});\r\n\r\nexport default CheckoutPay;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport BasketActionCreators from '../../actions/BasketActionCreators.js';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport TelephoneInput from '../common/react-telephone-input.jsx';\r\nimport map from 'lodash/map';\r\nimport filter from 'lodash/filter';\r\nimport uniq from 'lodash/uniq';\r\nimport partial from 'lodash/partial';\r\nimport min from 'lodash/min';\r\nimport max from 'lodash/max';\r\n\r\nfunction getStudentKey(student) {\r\n return student.FirstName + '|' + student.LastName + '|' + student.DateOfBirth + '|' + student.Gender;\r\n}\r\n\r\nvar CustomerForm = createReactClass({\r\n propTypes: {\r\n showCustomerFields: PropTypes.bool,\r\n customer: PropTypes.object,\r\n errorState: PropTypes.object,\r\n onUpdate: PropTypes.func, // called whenever a field is blurred or changed considerably (for validation purposes), not called when text is being input for example\r\n courses: PropTypes.object,\r\n isThirdParty: PropTypes.bool,\r\n countries: PropTypes.array,\r\n },\r\n\r\n getDefaultProps: function () {\r\n return {\r\n countries: [],\r\n }\r\n },\r\n\r\n onChange: function (e) {\r\n BasketActionCreators.updateCustomer(e.target.name, e.target.value);\r\n if (this.props.isThirdParty) {\r\n if (e.target.name === 'Email') {\r\n BasketActionCreators.updateCustomer('ConfirmEmail', e.target.value);\r\n }\r\n }\r\n },\r\n\r\n onChangePhoneNumber: function (number) {\r\n BasketActionCreators.updateCustomer('Mobile', number);\r\n },\r\n\r\n onChooseStudent: function (student) {\r\n BasketActionCreators.chooseCustomer(student);\r\n },\r\n\r\n render: function () {\r\n var confirm = !this.props.isThirdParty ?
\r\n \r\n \r\n \r\n
: false;\r\n\r\n var mobile =
\r\n \r\n \r\n \r\n
;\r\n\r\n var adultStudents = uniq(\r\n map(\r\n filter(\r\n this.props.courses,\r\n function (lineItem) {\r\n // find min of items in the age groups\r\n var minAge = (min(lineItem.Course.AgeGroups, function (ageGroup) {\r\n return ageGroup.LowerBound;\r\n })).LowerBound;\r\n\r\n return lineItem.Student\r\n && lineItem.Student.FirstName\r\n && lineItem.Student.LastName\r\n && lineItem.Student.DateOfBirth\r\n && lineItem.Student.Gender\r\n && minAge > 18;\r\n }\r\n ),\r\n function (lineItem) {\r\n return lineItem.Student;\r\n }\r\n ),\r\n getStudentKey);\r\n\r\n return (\r\n
\r\n );\r\n }\r\n});\r\n\r\nexport default CustomerForm;","import Dispatcher from '../utilities/OraDispatcher.js';\r\nimport { ActionTypes } from '../constants/Constants.js';\r\nimport create from 'lodash/create';\r\nimport Store from './Store.js';\r\n\r\nvar user;\r\n\r\nfunction UserStore() {\r\n Store.call(this);\r\n}\r\n\r\nUserStore.prototype = create(Store.prototype, {\r\n 'constructor': UserStore,\r\n\r\n getUser: function() {\r\n return user;\r\n },\r\n\r\n isWebAdmin: function() {\r\n return location.href.indexOf('https://localhost:44300') === 0\r\n || location.href.indexOf('https://ora-app-uat.azurewebsites.net') === 0\r\n || location.href.indexOf('https://webadmin.oxford-royale.co.uk') === 0\r\n || location.href.indexOf('https://webadmin.oxford-royale.com') === 0\r\n || global.OraWidgets.Options.IsWebAdmin;\r\n }\r\n});\r\n\r\nvar userStore = new UserStore();\r\nuserStore.dispatchToken = Dispatcher.register(function (payload) {\r\n switch (payload.type) {\r\n case ActionTypes.WHO_AM_I_SUCCESS:\r\n user = payload.me;\r\n break;\r\n\r\n default:\r\n return;\r\n }\r\n\r\n userStore.emitChange(payload.context);\r\n});\r\n\r\nexport default userStore;","import options from './WidgetOptions.js';\r\nimport http from './Http.js';\r\n\r\nexport default {\r\n searchAgents: function (searchTerm) {\r\n return http.get(options.apiEndpoint() + '/Agent?take=30&search=' + searchTerm);\r\n }\r\n};","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport map from 'lodash/map';\r\nimport isString from 'lodash/isstring';\r\nimport debounce from 'lodash/debounce';\r\n\r\nvar TypeAhead = createReactClass({\r\n propTypes: {\r\n dataSource: PropTypes.string,\r\n onChange: PropTypes.func,\r\n onSelect: PropTypes.func,\r\n placeHolder: PropTypes.string,\r\n value: PropTypes.string,\r\n autoSuggestEnabled: PropTypes.bool,\r\n className: PropTypes.string,\r\n func: PropTypes.func\r\n },\r\n\r\n getDefaultProps: function() {\r\n return {\r\n value: ''\r\n };\r\n },\r\n\r\n getInitialState: function() {\r\n return {\r\n selectedIdx: -1,\r\n items: [],\r\n isFocussed: false\r\n };\r\n },\r\n\r\n componentWillMount: function() {\r\n this.isMouseDown = false;\r\n this.func = this.props.autoSuggestEnabled ? this.props.func || generateFuncForUrl(this.props.dataSource) : function() {};\r\n jQuery(window).on('mousedown', this.pageClick);\r\n },\r\n\r\n componentWillUnmount: function() {\r\n jQuery(window).off('mousedown', this.pageClick);\r\n },\r\n\r\n pageClick: function() {\r\n if (this.isMouseDown) {\r\n return;\r\n }\r\n\r\n this.setState({ isFocussed: false });\r\n },\r\n\r\n mouseDown: function() {\r\n this.isMouseDown = true;\r\n },\r\n\r\n mouseUp: function() {\r\n this.isMouseDown = false;\r\n },\r\n\r\n onFocus: function() {\r\n this.setState({ isFocussed: true });\r\n },\r\n\r\n onBlur: function() {\r\n if (!this.isMouseDown) {\r\n this.setState({ isFocussed: false });\r\n }\r\n },\r\n\r\n onKeyDown: function(e) {\r\n var code = e.which ? e.which : e.keyCode;\r\n if (code === 40) {\r\n // down\r\n e.preventDefault();\r\n if (this.state.selectedIdx < this.state.items.length - 1) {\r\n\r\n //This looks odd, but we need to pass the whole \"e.target.value\" up a chain for the onChange event.\r\n e.target.value = this.state.items[this.state.selectedIdx + 1].Text;\r\n this.setState({ selectedIdx: (this.state.selectedIdx + 1) });\r\n\r\n this.props.onChange && this.props.onChange(e);\r\n }\r\n } else if (code === 38) {\r\n // up\r\n e.preventDefault();\r\n if (this.state.selectedIdx > -1) {\r\n\r\n //This looks odd, but we need to pass the whole \"e.target.value\" up a chain for the onChange event.\r\n e.target.value = this.state.items[this.state.selectedIdx - 1].Text;\r\n this.setState({ selectedIdx: this.state.selectedIdx - 1 });\r\n\r\n this.props.onChange && this.props.onChange(e);\r\n }\r\n }\r\n\r\n if (code === 13 || code === 9) {\r\n // enter or tab\r\n if (this.state.selectedIdx > -1) {\r\n this.select(this.state.items[this.state.selectedIdx]);\r\n } else {\r\n this.select(this.props.value);\r\n }\r\n } else {\r\n this.setState({ isFocussed: true });\r\n }\r\n\r\n this.lastKeyPress = code;\r\n },\r\n\r\n lastKeyPress: false,\r\n callback: function (items) {\r\n var newState = { items: items, selectedIdx: -1 };\r\n\r\n // if there's only one item and they've not pressed backspace set the text to the single result - SCRAP THAT, I DON'T LIKE IT\r\n //if (items.length === 1 && (!this.lastKeyPress || (this.lastKeyPress !== 8 && this.lastKeyPress !== 46))) {\r\n // newState.text = items[0];\r\n // this.props.onChange && this.props.onChange(items[0]);\r\n //}\r\n\r\n this.setState(newState);\r\n },\r\n\r\n onChange: function (e) {\r\n // update the search box\r\n this.setState({ text: e.target.value });\r\n\r\n // perform the search\r\n this.func(e.target.value, this.callback);\r\n\r\n // signal consumer\r\n this.props.onChange && this.props.onChange(e);\r\n },\r\n\r\n select: function (selectedItem) {\r\n //calling setState is not guaranteed to update synchronously\r\n var item;\r\n if (!selectedItem) {\r\n item = { Text: this.props.value };\r\n } else {\r\n if (isString(selectedItem)) {\r\n item = { Text: selectedItem };\r\n } else {\r\n item = selectedItem;\r\n }\r\n }\r\n\r\n var fakeEvent = { target: { value: this.props.value } };\r\n this.props.onChange && this.props.onChange(fakeEvent);\r\n this.props.onSelect && this.props.onSelect(item);\r\n this.setState({ isFocussed: false });\r\n },\r\n\r\n render: function () {\r\n var lists = map(this.state.items, function (item, idx) {\r\n var className = idx === this.state.selectedIdx ? 'active' : '';\r\n var click = function() {\r\n this.select(item);\r\n }.bind(this);\r\n\r\n var mouseOver = function() {\r\n this.setState({ selectedIdx: idx });\r\n }.bind(this);\r\n\r\n return
{item.Text}
;\r\n }.bind(this));\r\n\r\n var div = false;\r\n if (this.state.isFocussed && this.props.value && this.props.value.length && this.props.autoSuggestEnabled) {\r\n div =
\r\n
{lists}\r\n
\r\n
;\r\n }\r\n\r\n return (\r\n
\r\n \r\n {div}\r\n
\r\n\t\t);\r\n }\r\n});\r\n\r\nfunction generateFuncForUrl(url) {\r\n return debounce(function(word, callback) {\r\n jQuery.get(url + '?query=' + encodeURIComponent(word),\r\n function(response) {\r\n callback(response);\r\n });\r\n },\r\n 250);\r\n}\r\n\r\nfunction generateFuncForArrayOfStrings(array) {\r\n return function (word, callback) {\r\n var results = [];\r\n for (var i = 0; i < array.length; i++) {\r\n if (array[i].indexOf(word) > -1) {\r\n results.push(array[i]);\r\n }\r\n }\r\n\r\n callback(results);\r\n }\r\n}\r\n\r\nexport default TypeAhead;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport FormGroup from '../common/form-group.jsx';\r\nimport UserStore from '../../stores/UserStore.js';\r\nimport map from 'lodash/map';\r\nimport some from 'lodash/some';\r\nimport sortBy from 'lodash/sortBy';\r\nimport AgentService from '../../utilities/AgentService.js';\r\nimport TypeAhead from '../common/typeahead.jsx';\r\n\r\nvar AgentForm = createReactClass({\r\n propTypes: {\r\n isWebAdminUser: PropTypes.bool,\r\n isAgentBooking: PropTypes.bool,\r\n onUpdateIsAgentBooking: PropTypes.func,\r\n agentId: PropTypes.number,\r\n onUpdateAgentId: PropTypes.func,\r\n agentName: PropTypes.string,\r\n onUpdateAgentName: PropTypes.func,\r\n onUpdateAreFinancialsVisibleToCustomer: PropTypes.func,\r\n areFinancialsVisibleToCustomer: PropTypes.bool\r\n },\r\n\r\n getInitialState: function () {\r\n return {\r\n agentSearchValue: '',\r\n areFinancialsVisibleToCustomerAgentDefault: false\r\n }\r\n },\r\n\r\n doAgentSearch: function (word, callback) {\r\n AgentService.searchAgents(word)\r\n .done(function (response) {\r\n callback(map(response.Items,\r\n function (item) {\r\n return {\r\n Text: item.Organisation.Name,\r\n Agent: item\r\n };\r\n }));\r\n });\r\n },\r\n\r\n agentSearchChange: function(e) {\r\n this.setState({ agentSearchValue: e.target.value });\r\n },\r\n\r\n agentSelectionChange: function (e) {\r\n this.setState({ agentSearchValue: e.Agent.Organisation.Name, areFinancialsVisibleToCustomerAgentDefault: e.Agent.AreFinancialsVisibleToCustomer });\r\n this.props.onUpdateAgentId(e);\r\n },\r\n\r\n agentCreateChange: function (e) {\r\n this.setState({ agentSearchValue: '' });\r\n this.props.onUpdateAgentName(e);\r\n },\r\n\r\n render: function () {\r\n if (this.props.isWebAdminUser) {\r\n var inner = [\r\n
\r\n \r\n
];\r\n\r\n if (this.props.isAgentBooking) {\r\n inner.push(
\r\n );\r\n }\r\n }\r\n }\r\n\r\n var thirdParty = [];\r\n if (this.props.isWebAdminUser) {\r\n thirdParty.push(\r\n
\r\n \r\n
\r\n );\r\n }\r\n\r\n if (this.props.isWebAdminUser) {\r\n thirdParty.push();\r\n } else if (this.props.agentId) {\r\n //TODO - make this a component\r\n thirdParty.push(\r\n
\r\n \r\n
);\r\n }\r\n \r\n var alumniMessage = \"It looks like you've booked with us before. Your Alumni discount will be applied once you click 'Pay' and will appear in the Portal. Any problems just get in contact with us.\";\r\n\r\n return (\r\n
Full Fees. As you are enrolling less than 90 days before your programme, the full fees must be paid immediately after your enrolment is completed. If you elect to pay just the Enrolment Fee now, please settle the balance immediately afterwards via the Oxford Royale Portal. You may receive a reminder from our friendly team via telephone and/or email.
Pay in full now for a saving of GBP {Ui.maybeFormat2Dp(discount.toFixed(2))}
\r\n : false\r\n }\r\n
\r\n Prefer to pay by Bank Transfer or another payment method? Click to Contact Us\r\n
\r\n\r\n
\r\n ;\r\n },\r\n\r\n onUpdate: function () {\r\n if (this.state.isCustomerFormValidationEnabled) {\r\n this.isValid();\r\n }\r\n },\r\n\r\n isValid: function() {\r\n // if validation isn't enabled, it is now\r\n if (!this.state.isCustomerFormValidationEnabled) {\r\n this.setState({ isCustomerFormValidationEnabled: true });\r\n }\r\n\r\n //validate\r\n var customerErrorState = CustomerValidator(this.state.customer, true);\r\n if (!this.state.isWebAdminUser\r\n && !this.props.agentId\r\n && ((!this.props.skipTermsAndConditions\r\n && (this.state.termsAndConditions === false || (this.state.termsAndConditions.length && !this.state.hasAcceptedTermsAndConditions)))\r\n || (!this.props.skipPrivacyPolicy && !this.state.hasAcceptedPrivacyPolicy))) {\r\n customerErrorState.termsAndConditionsState = 'invalid';\r\n customerErrorState.termsAndConditionsErrors = 'Please indicate that you have accepted the Terms and Conditions and the Privacy Policy';\r\n }\r\n\r\n // update our state\r\n if (!isEmpty(customerErrorState) || !isEmpty(this.state.customerErrors)) {\r\n this.setState({ customerErrors: customerErrorState });\r\n }\r\n\r\n return isEmpty(customerErrorState);\r\n }\r\n});\r\n\r\nexport default Billing;\r\n","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport BasketStore from '../../stores/BasketStore.js';\r\nimport partial from 'lodash/partial';\r\nimport ActionCreators from '../../actions/CheckoutActionCreators.js';\r\nimport map from 'lodash/map';\r\nimport Loading from '../common/loading.jsx';\r\n\r\nvar FlyWireForm = createReactClass({\r\n displayName: \"FlywireForm\",\r\n propTypes: {\r\n destination: PropTypes.string,\r\n country: PropTypes.string,\r\n amountToPay: PropTypes.number,\r\n firstName: PropTypes.string,\r\n lastName: PropTypes.string,\r\n email: PropTypes.string,\r\n mobile: PropTypes.string,\r\n studentFirstName: PropTypes.string,\r\n studentLastName: PropTypes.string,\r\n handleBasketChanged: PropTypes.func,\r\n billingLine1: PropTypes.string,\r\n billingLine2: PropTypes.string,\r\n billingCity: PropTypes.string,\r\n billingCounty: PropTypes.string,\r\n billingPostCode: PropTypes.string,\r\n callbackId: PropTypes.string,\r\n orderId: PropTypes.number,\r\n shouldCloseModal: PropTypes.bool,\r\n flywireModalClosedHandler: PropTypes.func,\r\n onInvalidInput: PropTypes.func,\r\n showErrorMessage: PropTypes.bool\r\n },\r\n\r\n getDefaultProps: function() {\r\n return {\r\n destination: global.OraWidgets.Options.defaultFlywireDestination,\r\n country: 'GB',\r\n billingLine1: '',\r\n billingLine2: '',\r\n billingCity: '',\r\n billingCounty: '',\r\n billingPostCode: '',\r\n shouldCloseModal: false,\r\n isDraftOrder: false,\r\n onInvalidInput: function() {},\r\n showErrorMessage: false\r\n };\r\n },\r\n\r\n getInitialState: function() {\r\n return {\r\n flywireModal: {},\r\n showPollingMessage: false,\r\n showPendingMessage: false,\r\n showErrorMessage: false\r\n };\r\n },\r\n\r\n componentDidMount: function() {\r\n this.initFlywire();\r\n this.tryShowPaymentInstructions();\r\n },\r\n\r\n removeCountdownTimers: function (parentElement) {\r\n var topLevelElement = !!parentElement ? parentElement : document;\r\n\r\n // remove the countdown timer(s)\r\n var countdownElements = topLevelElement.getElementsByClassName('payment-instructions');\r\n\r\n if (countdownElements.length < 1) {\r\n return;\r\n }\r\n\r\n // remove elements in reverse\r\n for (var i = countdownElements.length - 1; i >= 0; i--) {\r\n countdownElements[i].remove();\r\n }\r\n },\r\n\r\n closeFlywireModal: function () {\r\n this.removeCountdownTimers();\r\n // finally close the modal\r\n this.state.flywireModal.close(function() {}); // flywire has asked us to pass an empty function for now\r\n },\r\n\r\n shouldComponentUpdate: function(nextProps, nextState) {\r\n if (!this.props.shouldCloseModal && nextProps.shouldCloseModal) {\r\n this.closeFlywireModal();\r\n }\r\n\r\n return true;\r\n },\r\n\r\n onPaymentComplete: function (args) { //TODO: maybe move this to the parent component(s) if we need to add \"rejected\"/\"cancelled\" messages, or to let them handle the success messages?\r\n if (args.status === 'success') {\r\n ActionCreators.beginPolling(this.props.callbackId, this.props.orderId); // this will forward us on as necessary at the end\r\n this.setState({ showPollingMessage: true });\r\n } else if (args.status === 'pending') {\r\n this.setState({ showPendingMessage: true });\r\n } else {\r\n this.setState({ showErrorMessage: true });\r\n }\r\n },\r\n\r\n onInvalidInput: function(errors) {\r\n this.closeFlywireModal();\r\n this.props.onInvalidInput(errors);\r\n },\r\n\r\n initFlywire: function() {\r\n var flywireModal = global.FlywirePayment.initiate({\r\n env: global.OraWidgets.Options.paymentEnvironment,\r\n recipientCode: this.props.destination,\r\n amount: (this.props.amountToPay / 100),\r\n country: this.props.country,\r\n address: this.props.billingLine1,\r\n city: this.props.billingCity,\r\n email: this.props.email,\r\n firstName: this.props.firstName,\r\n lastName: this.props.lastName,\r\n phone: this.props.mobile,\r\n callbackUrl: global.OraWidgets.Options.callBackUrl,\r\n callbackId: this.props.callbackId,\r\n read_only: \"amount\",\r\n //theme: {\r\n // brandColor: \"#3498db\",\r\n // chat: false,\r\n // footer: false\r\n //}\r\n recipientFields: {\r\n web_admin_payment_id: this.props.callbackId\r\n },\r\n onCompleteCallback: this.onPaymentComplete,\r\n onCancel: this.props.flywireModalClosedHandler,\r\n onInvalidInput: this.onInvalidInput\r\n });\r\n\r\n this.setState({ flywireModal: flywireModal });\r\n\r\n flywireModal.render();\r\n },\r\n\r\n tryShowPaymentInstructions: function () {\r\n var flywireForm = this;\r\n\r\n window.setTimeout(function () {\r\n var elements = document.getElementsByName('fwp.window');\r\n var iframe;\r\n\r\n for (var i = 0; i < elements.length; i++) {\r\n if (elements[i].nodeName === 'IFRAME') {\r\n iframe = elements[i];\r\n break;\r\n }\r\n }\r\n\r\n if (!iframe) {\r\n return;\r\n }\r\n\r\n // remove existing countdown elements\r\n flywireForm.removeCountdownTimers(iframe.parentElement);\r\n\r\n var countdownElements = document.getElementsByClassName('payment-instructions');\r\n\r\n if (countdownElements.length < 1) {\r\n return;\r\n }\r\n\r\n iframe.parentElement.prepend(countdownElements[0]);\r\n }, 3000);\r\n },\r\n\r\n render: function () {\r\n if (!this.props.callbackId) {\r\n return false;\r\n }\r\n\r\n if (this.state.showPollingMessage) {\r\n return
;\r\n }\r\n\r\n var showErrorMessage = this.state.showErrorMessage || this.props.showErrorMessage;\r\n var title, text;\r\n if (this.state.showPendingMessage) {\r\n title = global.OraWidgets.Options.flywirePendingMessageTitle;\r\n text = global.OraWidgets.Options.flywirePendingMessageText;\r\n } else if (showErrorMessage) {\r\n title = global.OraWidgets.Options.flywireErrorMessageTitle;\r\n text = global.OraWidgets.Options.flywireErrorMessageText;\r\n }\r\n \r\n return (\r\n
{!!title ?\r\n
\r\n
{title}
\r\n {!!text && text.length ? (\r\n
\r\n \r\n {map(text, function (message) {\r\n return
\r\n);\r\n}\r\n});\r\n\r\nexport default FlyWireForm;","import BasketStore from '../../stores/BasketStore.js';\r\nimport ActionCreators from '../../actions/CheckoutActionCreators.js';\r\nimport AdManagerService from '../../utilities/AdManagerService.js';\r\nimport scrollToElement from 'scroll-to-element';\r\n\r\nexport default {\r\n returnToStepBeforePayment: function (errorMessage) {\r\n this.setState({\r\n fatalPaymentError: errorMessage\r\n });\r\n\r\n this.previous();\r\n },\r\n\r\n scrollToTop: function (refParam) {\r\n if (!!refParam) {\r\n scrollToElement('body');\r\n }\r\n },\r\n\r\n handleBasketChangedFlywire: function () {\r\n // seems unnecessary given that checkout.jsx has a changeBasket as well\r\n var countries = BasketStore.getCountries();\r\n if (countries !== this.state.countries) {\r\n this.setState({ countries: countries });\r\n }\r\n \r\n var paymentIntentId = BasketStore.getPaymentIntentId();\r\n if (paymentIntentId !== this.state.callbackId) {\r\n this.setState({ callbackId: paymentIntentId });\r\n }\r\n\r\n if (BasketStore.hasPaymentPollingStarted()) {\r\n if (BasketStore.isPaymentCreated()) {\r\n this.setState({\r\n isPollingPayment: true,\r\n hasPaymentSucceeded: false,\r\n hasPaymentFailed: false\r\n });\r\n } else if (BasketStore.isPaymentSucceeded()) {\r\n this.setState({\r\n isPollingPayment: false,\r\n hasPaymentSucceeded: true\r\n });\r\n\r\n if (!!this.stages && this.stages.length) {\r\n this.setState({\r\n currentStage: this.stages[4]\r\n });\r\n }\r\n\r\n // redirect\r\n var order = BasketStore.getOrder();\r\n var redirectUri = BasketStore.getRedirectUri();\r\n if (order.HasTriggeredAnalyticsPurchaseEvent) {\r\n global.location.href = redirectUri;\r\n } else {\r\n AdManagerService.purchaseTag(order, redirectUri);\r\n }\r\n } else if (BasketStore.isPaymentFailed()) {\r\n var failureReason = BasketStore.getPaymentFailureReason();\r\n this.setState({\r\n isPollingPayment: false,\r\n hasPaymentFailed: true,\r\n paymentFailureReason: failureReason\r\n });\r\n\r\n this.onPaymentCancelled();\r\n }\r\n }\r\n },\r\n\r\n onPaymentCancelled: function () { } // gets overridden in derived classes\r\n};","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport createReactClass from 'create-react-class';\r\nimport moment from 'moment';\r\n\r\nvar secondsInOneMinute = 60;\r\n\r\nvar Timer = createReactClass({\r\n propTypes: {\r\n expiryTime: PropTypes.object,\r\n onCountdownComplete: PropTypes.func\r\n },\r\n\r\n getInitialState: function () {\r\n return {\r\n secondsRemaining: this.getRemainingSeconds()\r\n };\r\n },\r\n\r\n getRemainingSeconds: function() {\r\n return moment(this.props.expiryTime).diff(moment.utc(), 'seconds');\r\n },\r\n\r\n componentDidMount: function () {\r\n this.timerId = setInterval(this.countDown, 1000);\r\n },\r\n\r\n componentWillUnmount: function () {\r\n clearInterval(this.timerId);\r\n },\r\n \r\n countDown: function() {\r\n // Remove one second, set state so a re-render happens.\r\n var seconds = this.getRemainingSeconds();\r\n this.setState({\r\n secondsRemaining: seconds\r\n });\r\n\r\n // Check if we're at zero.\r\n if (seconds <= 0) {\r\n this.props.onCountdownComplete();\r\n }\r\n },\r\n\r\n render: function () {\r\n var classes = 'countdown-timer' + (this.state.secondsRemaining < secondsInOneMinute ? ' timer-danger' : '');\r\n var secsPart = this.state.secondsRemaining % secondsInOneMinute;\r\n var minsPart = (this.state.secondsRemaining - secsPart) / secondsInOneMinute;\r\n \r\n return (\r\n {minsPart + ' minute' + (minsPart !== 1 ? 's' : '') + ' and ' + secsPart + ' second' + (secsPart !== 1 ? 's' : '')}\r\n );\r\n }\r\n});\r\n\r\nexport default Timer;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport Loading from '../common/loading.jsx';\r\nimport TermsAndConditionsCreators from '../../actions/TermsAndConditionsCreators.js';\r\nimport FlywireForm from '../flywire/flywire-form.jsx';\r\nimport baseFlywireContainer from '../common/BaseCheckoutFlywireContainer.js';\r\nimport CountdownTimer from '../flywire/countdown-timer.jsx';\r\nimport BasketStore from '../../stores/BasketStore.js';\r\nimport assign from 'lodash/assign';\r\n\r\nvar Flywire = createReactClass(assign({}, baseFlywireContainer, {\r\n displayName: 'Flywire',\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n \r\n getInitialState: function () {\r\n return {\r\n customer: BasketStore.getCustomer(),\r\n isReserving: BasketStore.isReserving(),\r\n reservationFailureResponse: BasketStore.getReservationFailureResponse(),\r\n reservation: BasketStore.getReservation(),\r\n bookingCompleteUrl: this.props.bookingCompleteUrl,\r\n \r\n isPollingPayment: false,\r\n hasPaymentSucceeded: false,\r\n hasPaymentFailed: false,\r\n fatalPaymentError: false,\r\n\r\n hasClickedSendPayment: false,\r\n\r\n shouldClosePaymentModal: false\r\n };\r\n },\r\n\r\n returnToStepBeforePayment: function (errorMessage) {\r\n this.props.wizard.set({ PaymentError: errorMessage });\r\n this.props.wizard.previousQuestion();\r\n },\r\n\r\n onCountdownComplete: function () {\r\n this.setState({ shouldClosePaymentModal: true });\r\n this.returnToStepBeforePayment('Your reservation has expired. Please try again.');\r\n },\r\n\r\n onPaymentCancelled: function() {\r\n this.props.wizard.previousQuestion();\r\n },\r\n\r\n onInvalidInput: function (errors) {\r\n if (!errors || !errors.length) {\r\n errors = [{ msg: 'There was an unexpected error. Please refresh the page and try again' }];\r\n }\r\n\r\n this.props.wizard.set({ PaymentError: errors[0].msg });\r\n this.props.wizard.previousQuestion();\r\n },\r\n\r\n componentWillMount: function() {\r\n if (!this.state.isReserving && !this.state.reservation) {\r\n this.props.wizard.previousQuestion();\r\n }\r\n },\r\n\r\n componentDidMount: function () {\r\n BasketStore.addChangeListener(this.changeBasket);\r\n BasketStore.addChangeListener(this.handleBasketChangedFlywire);\r\n TermsAndConditionsCreators.getAll();\r\n },\r\n\r\n componentWillUnmount: function () {\r\n BasketStore.removeChangeListener(this.changeBasket);\r\n BasketStore.removeChangeListener(this.handleBasketChangedFlywire);\r\n },\r\n\r\n changeBasket: function () {\r\n var reservationFailureResponse = BasketStore.getReservationFailureResponse();\r\n var reservation = BasketStore.getReservation();\r\n\r\n var data = {\r\n customer: BasketStore.getCustomer(),\r\n isReserving: BasketStore.isReserving(),\r\n reservationFailureResponse: reservationFailureResponse,\r\n reservation: reservation\r\n };\r\n\r\n if (!this.state.reservationFailureResponse && reservationFailureResponse) {\r\n this.props.wizard.previousQuestion();\r\n }\r\n\r\n this.setState(data);\r\n },\r\n \r\n render: function () {\r\n if (!this.state.isReserving && !this.state.reservation) {\r\n // happens when the state is reserialized from localstorage\r\n // our componentWillMount takes us back to the previous question but the render still executes\r\n return ;\r\n }\r\n\r\n if (this.state.hasPaymentSucceeded) {\r\n return ;\r\n }\r\n\r\n if (this.state.isPollingPayment) {\r\n return ;\r\n }\r\n\r\n if (this.state.isReserving) {\r\n return ;\r\n }\r\n\r\n var timer = ;\r\n var amountToPay = this.props.wizard.state.hasClickedPayDeposit\r\n ? this.state.reservation.Deposit\r\n : this.state.reservation.Total;\r\n\r\n return
\r\n
\r\n
\r\n {timer &&
Reservation held for: {timer}
}\r\n
\r\n \r\n
\r\n
;\r\n },\r\n\r\n isValid: function() {\r\n return true;\r\n }\r\n}));\r\n\r\nexport default Flywire;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport CourseStore from '../../stores/CourseStore';\r\nimport NavigationButtons from './navigation-buttons';\r\n\r\nvar NoCoursesAvailable = createReactClass({ \r\n displayName: 'NoCoursesAvailable',\r\n getInitialState: function() {\r\n return { courses: CourseStore.getCourses() }\r\n },\r\n props: {\r\n wizard: PropTypes.object\r\n },\r\n \r\n render: function() {\r\n var wizard = this.props.wizard;\r\n \r\n var studentAgeNow = moment().diff(wizard.state.Student.DateOfBirth, 'years');\r\n\r\n // var isAfterSeptember = moment.utc().month() >= 8;\r\n // var studentAgeInSummer =\r\n // isAfterSeptember \r\n // ? moment([moment.utc().year() + 1, 7, 1]).diff(wizard.state.Student.DateOfBirth, 'years')\r\n // : moment([moment.utc().year(), 7, 1]).diff(wizard.state.Student.DateOfBirth, 'years');\r\n\r\n const lowerAgeBound = 14;\r\n const upperAgeBound = 18;\r\n return
\r\n\r\n
Unfortunately we are not currently offering courses for students aged {studentAgeNow}.
\r\n\r\n {studentAgeNow >= 25 \r\n ?
\r\n Please check you've entered the right details for the student who will be attending the course.\r\n You can go back and change their details if required.\r\n
\r\n : false}\r\n \r\n
\r\n We currently offer a variety of courses for students aged {lowerAgeBound} - {upperAgeBound} through our website, if you're interested in opportunities for older or youger students, please contact our enrolment team.\r\n
;\r\n }\r\n});\r\n\r\nexport default StepIndicator;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\n\r\nvar ErrorBoundary = createReactClass({ \r\n displayName: 'ErrorBoundary',\r\n\r\n componentDidCatch: function(error, errorInfo) { \r\n // You can also log the error to an error reporting service \r\n if (!window.rg4js) {\r\n return;\r\n } \r\n\r\n rg4js('send', {\r\n error: error,\r\n customData: { info: errorInfo }\r\n });\r\n },\r\n\r\n getInitialState: function () {\r\n return { hasError: false };\r\n },\r\n\r\n restartApp: function () {\r\n localStorage.clear();\r\n location.reload();\r\n },\r\n\r\n render: function() {\r\n if (this.state.hasError) { \r\n // You can render any custom fallback UI \r\n return
\r\n
Well, this is unexpected...
\r\n
Sorry, this is not working properly. We've sent the mistake to our tech team so that they can get it fixed asap.
\r\n
Usually it's a temporary issue and just starting the application again works.
\r\n \r\n
(Sometimes it's a more permanent error - in that case, please contact us below and we'll get your application finished)
\r\n
;\r\n }\r\n \r\n return this.props.children; \r\n }\r\n});\r\n\r\nErrorBoundary.getDerivedStateFromError = function (error) {\r\n // Update state so the next render will show the fallback UI. \r\n return { hasError: true }; \r\n}\r\n\r\nexport default ErrorBoundary;","import React from 'react';\r\nimport createReactClass from 'create-react-class';\r\nimport moment from 'moment';\r\nimport map from 'lodash/map';\r\nimport find from 'lodash/find';\r\nimport filter from 'lodash/filter';\r\nimport every from 'lodash/every';\r\nimport some from 'lodash/some';\r\nimport any from 'lodash/some';\r\nimport assign from 'lodash/assign.js';\r\n\r\nimport deepLinkParse from './deep-link-parser.js';\r\n\r\nimport Begin from './begin.jsx';\r\nimport Customer from './customer/customer.jsx';\r\nimport BasketActionCreators from '../../actions/BasketActionCreators.js';\r\nimport Student from './student/student.jsx';\r\nimport HowToStudy from './how-to-study.jsx';\r\nimport TimeZone from './what-timezone.jsx';\r\nimport WhatRegion from './what-region.jsx';\r\nimport WhatCourse from './what-course.jsx';\r\nimport WhatSessionOptions from './what-session-options.jsx';\r\nimport WhatSite from './what-site.jsx';\r\nimport Upsells from './upsells.jsx';\r\nimport WhatNext from './what-next.jsx';\r\nimport Billing from './billing.jsx';\r\nimport Flywire from './flywire.jsx';\r\nimport NoCoursesAvailable from './no-courses-available.jsx';\r\nimport StepIndicator from './step-indicator.jsx';\r\nimport ErrorBoundary from './error-boundary.jsx';\r\n\r\nvar End = createReactClass({ render: function() { return
Le Fin
That's all for now folks
; } });\r\n\r\nimport isMatch from 'lodash/isMatch';\r\nimport forEach from 'lodash/forEach';\r\nimport rest from 'lodash/rest';\r\nimport set from 'lodash/set';\r\nimport get from 'lodash/get';\r\nvar NOT_THERE = \"__NOT_THERE__\";\r\nimport storage from '../../utilities/LocalStorage.js';\r\nimport BasketStore from '../../stores/BasketStore.js';\r\n\r\nimport CourseStore from '../../stores/CourseStore.js';\r\n\r\nvar ApplyWizard = createReactClass({\r\n displayName: 'ApplyWizard',\r\n getInitialState: function () {\r\n var tryGetFromStorage = deserialize();\r\n if (tryGetFromStorage) {\r\n tryGetFromStorage.Component = React.createRef();\r\n return tryGetFromStorage;\r\n }\r\n\r\n return this.getDefaultState();\r\n },\r\n\r\n getDefaultState: function() {\r\n // if you add to this make sure serialization and the set() method work\r\n return {\r\n CurrentComponentDisplayName: Begin.displayName,\r\n Component: React.createRef(),\r\n HasStartedWizard: false,\r\n IsUserCustomer: true, // used to be editable, now is not\r\n Customer: {},\r\n Student: {},\r\n CurrentItemId: false,\r\n Booking: {},\r\n Accommodation: {},\r\n SkipUpsell: false,\r\n SelectedUpsellOptions: [],\r\n PaymentError: false,\r\n hasClickedPayDeposit: false,\r\n StudyMethod: 'onsite',\r\n TimeZone: null,\r\n Region: null,\r\n Course: null,\r\n SessionIds: null,\r\n SessionDates: null,\r\n Sessions: null,\r\n SessionPricing: null,\r\n Intensity: null,\r\n CourseOptionSolutions: null,\r\n StudentTooOldOrTooYoung: false\r\n };\r\n },\r\n\r\n set: function (state, callback) {\r\n // when something updates the state of the wizard we need to reset other bits of the wizard\r\n // i.e. if you change the course, the sessionIds no longer match so they need to be reset\r\n // this bit of code sorts that\r\n var derivedState = assign({}, state);\r\n forEach(consequentResetterFor, function(resetter, prop) {\r\n if (!derivedState.hasOwnProperty(prop)) {\r\n return;\r\n }\r\n\r\n var oldValue = get(this.state, prop, NOT_THERE);\r\n var newValue = get(derivedState, prop, NOT_THERE);\r\n if (oldValue !== NOT_THERE\r\n // and the current prop has been set\r\n && newValue !== NOT_THERE \r\n // and they have been changed\r\n && ((typeof oldValue == \"object\" && ((resetter.hasOwnProperty('match') && !resetter.match(oldValue, newValue)) || (!resetter.hasOwnProperty('match') && !isMatch(oldValue, newValue))))\r\n || (typeof oldValue != \"object\" && oldValue !== newValue))) {\r\n // iterate through the properties, if they're being set\r\n // in this update we ignore them, otherwise we reset them\r\n forEach(resetter.reset, function(resetProp) {\r\n if (derivedState.hasOwnProperty(resetProp)) {\r\n return;\r\n }\r\n\r\n var reset = resetFunc(this, resetProp);\r\n derivedState = assign(derivedState, reset);\r\n }.bind(this))\r\n }\r\n }.bind(this));\r\n\r\n return this.setState(derivedState, callback);\r\n },\r\n \r\n componentDidMount: function () {\r\n CourseStore.addChangeListener(this.updateCourseList);\r\n },\r\n\r\n componentWillUnmount: function () {\r\n CourseStore.removeChangeListener(this.updateCourseList);\r\n },\r\n\r\n updateCourseList: function () {\r\n var courses = CourseStore.getCourses();\r\n if (this.state.Student.DateOfBirth) {\r\n var result = deepLinkParse(getCoursesForAgeGroup(courses, this.state.Student.DateOfBirth), this.state) || {};\r\n if (result.hasOwnProperty('Region')) {\r\n this.set(result);\r\n }\r\n }\r\n\r\n function getCoursesForAgeGroup(courses, studentDob) {\r\n return filter(courses, function (c) {\r\n return any(c.Dates, function (cd) {\r\n var studentAgeOnDate = moment.utc(cd.From).diff(studentDob, 'years');\r\n \r\n function isStudentAgeEligible(ag) {\r\n return (!ag.LowerBound || ag.LowerBound <= studentAgeOnDate) && (!ag.UpperBound || studentAgeOnDate <= ag.UpperBound);\r\n }\r\n \r\n return any(c.AgeGroups, isStudentAgeEligible);\r\n });\r\n });\r\n }\r\n },\r\n\r\n componentDidUpdate: function(prevProps, prevState) {\r\n serialize(this.state);\r\n },\r\n\r\n getCurrentComponent: function() {\r\n return this.getComponentByName(this.state.CurrentComponentDisplayName);\r\n },\r\n\r\n getComponentByName: function(name) {\r\n var availableComponents = getAvailableComponents(this.state);\r\n return find(availableComponents,\r\n function (component) {\r\n return component.displayName === name;\r\n }.bind(this));\r\n },\r\n\r\n getCurrentComponentIdx: function () {\r\n return this.getComponentIdx(this.state.CurrentComponentDisplayName);\r\n },\r\n\r\n getComponentIdx: function (name) {\r\n var availableComponents = getAvailableComponents(this.state);\r\n for (var i = 0; i < availableComponents.length; i++) {\r\n if (availableComponents[i].displayName === name) {\r\n return i;\r\n }\r\n }\r\n\r\n return -1;\r\n },\r\n\r\n nextQuestion: function (callback) { \r\n if (!this.state.Component.current.hasOwnProperty(\"isValid\") ||\r\n !(this.state.Component.current.isValid instanceof Function)) {\r\n throw \"Component must have an isValid() method\";\r\n }\r\n\r\n if (!this.state.Component.current.isValid()) {\r\n return;\r\n }\r\n\r\n if (this.state.Component.current.hasOwnProperty('onSubmit')) {\r\n if (!this.state.Component.current.onSubmit()) {\r\n return;\r\n }\r\n }\r\n\r\n var components = getAvailableComponents(this.state);\r\n var currentIdx = this.getCurrentComponentIdx();\r\n var componentDisplayName = currentIdx < components.length - 1 ? components[currentIdx + 1].displayName : this.state.CurrentComponentDisplayName;\r\n \r\n this.jump(componentDisplayName, callback); \r\n },\r\n\r\n previousQuestion: function() {\r\n var components = getAvailableComponents(this.state);\r\n var currentIdx = this.getCurrentComponentIdx();\r\n var componentDisplayName = currentIdx > 0 ? components[currentIdx - 1].displayName : this.state.CurrentComponentDisplayName;\r\n\r\n this.jump(componentDisplayName);\r\n },\r\n\r\n jumpToBilling: function () {\r\n this.resetCourse();\r\n this.jump(Billing);\r\n },\r\n\r\n jumpToWhatNext: function(preventCourseUpdate) {\r\n this.jump(WhatNext, this.resetCourse, preventCourseUpdate);\r\n },\r\n \r\n newWizardForStudent: function (itemId) {\r\n var course = BasketStore.getCourseByItemId(itemId);\r\n this.resetCourse();\r\n this.setState({ \r\n Student: course.Student\r\n }, () => this.jump('WhatRegion'));\r\n },\r\n\r\n newWizardForNewStudent: function () {\r\n this.resetCourse();\r\n this.resetStudent();\r\n this.jump(Student);\r\n },\r\n\r\n reset: function() {\r\n this.setState(this.getDefaultState());\r\n global.localStorage.removeItem('__ora_widget_apply_wizard');\r\n },\r\n\r\n jump: function (component, callback, preventCourseUpdate) {\r\n if (typeof component === \"string\") {\r\n component = this.getComponentByName(component);\r\n }\r\n\r\n var func = () => {\r\n if (component.displayName === WhatNext.displayName && !preventCourseUpdate) {\r\n var currentComponent = this.getCurrentComponent();\r\n var creatableComponents = [WhatCourse, TimeZone, WhatSessionOptions, WhatSite, Upsells];\r\n if (some(creatableComponents, c => c.displayName === currentComponent.displayName)) {\r\n var price = this.getPrice();\r\n var itemId = new Date().getTime() + '_'; \r\n BasketActionCreators.addCourse(\r\n this.state.Course,\r\n this.state.Intensity,\r\n this.getLineItemOptions(),\r\n this.state.Region,\r\n this.state.Student,\r\n price.PriceExcludingDiscount,\r\n price.PriceIncludingDiscount,\r\n price.Deposit,\r\n this.state.TimeZone,\r\n itemId);\r\n\r\n if (this.state.SelectedUpsellOptions && this.state.SelectedUpsellOptions.length) {\r\n forEach(this.state.SelectedUpsellOptions,\r\n function(upsellOption) {\r\n BasketActionCreators.addCourse(\r\n upsellOption.LineItem.Course,\r\n upsellOption.LineItem.Intensity,\r\n [],\r\n null,\r\n this.state.Student,\r\n upsellOption.Price,\r\n upsellOption.Price,\r\n upsellOption.Deposit,\r\n null,\r\n null,\r\n itemId);\r\n }.bind(this));\r\n }\r\n\r\n if (this.state.CurrentItemId) {\r\n BasketActionCreators.removeCourse(this.state.CurrentItemId);\r\n }\r\n }\r\n }\r\n\r\n var state = { CurrentComponentDisplayName: component.displayName };\r\n this.setState(state, function() {\r\n scrollTo(0, 0);\r\n if (callback && typeof callback === \"function\") {\r\n callback();\r\n }\r\n });\r\n }\r\n\r\n if (!document.startViewTransition) {\r\n setTimeout(func, 0);\r\n return;\r\n }\r\n \r\n // With a transition: \r\n var currentIdx = this.getCurrentComponentIdx();\r\n var newIdx = this.getComponentIdx(component.displayName);\r\n this.writeTransition(newIdx > currentIdx);\r\n var transition = document.startViewTransition(func); \r\n },\r\n\r\n writeTransition: function (ltr) {\r\n var id = 'view-transition';\r\n var style = document.getElementById(id);\r\n if (style) {\r\n style.remove();\r\n }\r\n\r\n style = document.createElement('style');\r\n style.id = id;\r\n style.innerHTML = `\r\n @keyframes fade-in {\r\n from { opacity: 0; }\r\n }\r\n \r\n @keyframes fade-out {\r\n to { opacity: 0; }\r\n }\r\n \r\n @keyframes slide-from-right {\r\n from { transform: translateX(300px); }\r\n }\r\n \r\n @keyframes slide-to-left {\r\n to { transform: translateX(-300px); }\r\n }\r\n \r\n @keyframes slide-from-left {\r\n from { transform: translateX(-300px); }\r\n }\r\n \r\n @keyframes slide-to-right {\r\n to { transform: translateX(300px); }\r\n }\r\n \r\n ::view-transition-old(root) {\r\n animation: 90ms cubic-bezier(0.4, 0, 1, 1) both fade-out,\r\n 300ms cubic-bezier(0.4, 0, 0.2, 1) both ${(ltr ? 'slide-to-left' : 'slide-to-right')} ;\r\n }\r\n \r\n ::view-transition-new(root) {\r\n animation: 210ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,\r\n 300ms cubic-bezier(0.4, 0, 0.2, 1) both ${(ltr ? 'slide-from-right' : 'slide-from-left')};\r\n } \r\n `;\r\n document.head.append(style);\r\n },\r\n\r\n resetCourse: function() {\r\n var resetState = resetFunc(this,\r\n \"CurrentItemId\",\r\n \"StudyMethod\",\r\n \"TimeZone\",\r\n \"Region\",\r\n \"Course\",\r\n \"SessionIds\",\r\n \"SessionDates\",\r\n \"Sessions\",\r\n \"SessionPricing\",\r\n \"Intensity\",\r\n \"CourseOptionSolutions\",\r\n \"Accommodation\",\r\n \"SelectedUpsellOptions\",\r\n \"SkipUpsell\");\r\n this.setState(resetState);\r\n },\r\n\r\n resetStudent: function() {\r\n var resetState = resetFunc(this, \"Student\");\r\n this.setState(resetState);\r\n },\r\n\r\n getOptionsSolution: function () {\r\n if (!this.state.Course.HasCourseBreakdown) {\r\n return null;\r\n }\r\n\r\n if (this.state.Accommodation.IsNonResidential) {\r\n // just take the first solution if non-residential\r\n return this.state.CourseOptionSolutions[0];\r\n }\r\n\r\n // iterate through all the solutions until we find one\r\n // that contains the correct session/site mix \r\n // according to the desired site choices\r\n return find(\r\n this.state.CourseOptionSolutions,\r\n function (solution) {\r\n return every(this.state.Sessions,\r\n function(session) {\r\n var sessionSite = this.state.Accommodation[session.SessionId];\r\n return some(\r\n solution,\r\n function(courseOptionSlot) {\r\n return courseOptionSlot.Session.SessionId === session.SessionId &&\r\n courseOptionSlot.Site.SiteId === sessionSite.SiteId;\r\n });\r\n }.bind(this));\r\n }.bind(this));\r\n },\r\n\r\n getLineItemOptions: function() {\r\n return map(this.state.Sessions,\r\n function(session) {\r\n return {\r\n Session: session,\r\n IsNonResidential: this.state.Course.CourseType.StudyMethod === 1 ||\r\n this.state.Accommodation.IsNonResidential,\r\n Site: this.state.Course.CourseType.StudyMethod === 0 &&\r\n !this.state.Accommodation.IsNonResidential &&\r\n this.state.Accommodation.hasOwnProperty(session.SessionId)\r\n ? this.state.Accommodation[session.SessionId]\r\n : null,\r\n Options: this.state.Course.HasCourseBreakdown\r\n ? filter(\r\n this.getOptionsSolution(),\r\n function(availability) {\r\n return availability.Session.SessionId === session.SessionId;\r\n })\r\n : null\r\n };\r\n }.bind(this));\r\n },\r\n\r\n getPrice: function() {\r\n var lineItem = this.getLineItem();\r\n if (some(lineItem.Options,\r\n function(option) {\r\n return option.IsNonResidential;\r\n })) {\r\n return {\r\n PriceIncludingDiscount: this.state.SessionPricing.NonResidentialPriceIncludingDiscount || this.state.SessionPricing.PriceIncludingDiscount,\r\n PriceExcludingDiscount: this.state.SessionPricing.NonResidentialPriceExcludingDiscount || this.state.SessionPricing.PriceExcludingDiscount,\r\n Deposit: this.state.SessionPricing.Deposit\r\n };\r\n }\r\n\r\n return {\r\n PriceIncludingDiscount: this.state.SessionPricing.PriceIncludingDiscount,\r\n PriceExcludingDiscount: this.state.SessionPricing.PriceExcludingDiscount,\r\n Deposit: this.state.SessionPricing.Deposit\r\n }\r\n },\r\n\r\n getLineItem: function () {\r\n return {\r\n Course: this.state.Course,\r\n Student: this.state.Student,\r\n Intensity: this.state.Intensity,\r\n Options: this.getLineItemOptions(),\r\n Region: this.state.Region\r\n };\r\n },\r\n \r\n render: function() {\r\n var component = this.getCurrentComponent(); \r\n \r\n return \r\n \r\n
\r\n {regionName}\r\n 
: false}\r\n 
\r\n ![\"Oxford](\"https://www.oxford-royale.com/wp-content/themes/ora2021/static/images/ora-logo.png\")
\r\n \r\n