\r\n {premiere}\r\n {info}\r\n {description}\r\n {originalTitle}\r\n {actors}\r\n {directors}\r\n {genre}\r\n {length}\r\n\r\n {age}\r\n
)\r\n }\r\n}","import React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport _ from 'lodash'\r\n\r\nclass ShowtimeType extends React.Component {\r\n\r\n render() {\r\n const { type, includeName, showtimeTypes } = this.props;\r\n const name = includeName ? type.name : '';\r\n const index = showtimeTypes ? _.findIndex(showtimeTypes, (showType) => { return type.id == showType.id }) : null;\r\n\r\n return (\r\n \r\n {image}\r\n {threeDBanner}\r\n {atmosBanner}\r\n {ageBanner}\r\n
)\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n const config = state.organizer.configuration;\r\n\r\n return {\r\n config\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps)(Poster)","import React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport _ from 'lodash'\r\nimport ShowtimeType from './ShowtimeType'\r\n\r\nclass ShowtimeTypeList extends React.Component {\r\n\r\n render() {\r\n const { types } = this.props;\r\n\r\n return (\r\n \r\n {previousDate}\r\n {dateDisplay}\r\n {nextDate}\r\n
\r\n );\r\n }\r\n}","export default {\r\n da: {\r\n pickDate: \"Vælg dato\",\r\n weekdays: ['Søndag', 'Mandag', 'Tirsdag', 'Onsdag', 'Torsdag', 'Fredag', 'Lørdag'],\r\n weekdaysShort: ['Søn', 'Man', 'Tirs', 'Ons', 'Tors', 'Fre', 'Lør'],\r\n months: ['Januar', 'Februar', 'Marts', 'April', 'Maj', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'December'],\r\n sortByAlphabet: 'Sortér alfabetisk på titel',\r\n sortByTime: 'Sortér efter fremtidige spilletider',\r\n goToAllMovies: 'Gå til alle film',\r\n today: 'I dag',\r\n tomorrow: 'I morgen'\r\n },\r\n\r\n en: {\r\n pickDate: \"Pick a date\",\r\n weekdays: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],\r\n weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],\r\n months: ['January', 'February', 'March', 'April', 'May', 'June', 'Juli', 'August', 'September', 'October', 'November', 'December'],\r\n sortByAlphabet: 'Sort by alphabet',\r\n sortByTime: 'Sort by showtime',\r\n goToAllMovies: 'Go to all movies',\r\n today: 'Today',\r\n tomorrow: 'Tomorrow'\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport LOCALE from './DatePickerLocale'\r\n\r\nexport default class WeekDayPicker extends React.Component {\r\n maxDays = 5;\r\n\r\n extractWeekDays() {\r\n const { selectedDate, changeDate, isAllMovies, datesWithShowtimes } = this.props;\r\n const weekDays = [];\r\n const short = window.outerWidth < 800;\r\n\r\n for (var i = 2; i < _.take(datesWithShowtimes, this.maxDays).length; i++) {\r\n const weekDay = moment().add(i, 'days');\r\n if (weekDays.length <= this.maxDays && _.includes(datesWithShowtimes, weekDay.format('YYYY-MM-DD'))) {\r\n weekDays.push({_.capitalize(short ? weekDay.format('ddd DD/MM') : weekDay.format('dddd DD/MM'))}
);\r\n }\r\n }\r\n return weekDays;\r\n }\r\n\r\n render() {\r\n const { appLocale, selectedDate, changeDate, isAllMovies, datesWithShowtimes } = this.props;\r\n const weekDays = this.extractWeekDays();\r\n const today = moment();\r\n const tomorrow = moment().add(1, 'days');\r\n\r\n return (\r\n \r\n {previousMonth}\r\n {monthDisplay}\r\n {nextMonth}\r\n
\r\n );\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\nimport LOCALE from '../MovieListLocale'\r\nimport Showtime from '../../showtime/Showtime'\r\nimport Poster from '../../movie/Poster'\r\nimport ShowtimeTypeList from '../../showtime/ShowtimeTypeList'\r\n\r\nexport default class SpecialEventsListItem extends React.Component {\r\n constructor() {\r\n super();\r\n this.movieClicked = this.movieClicked.bind(this);\r\n }\r\n\r\n movieClicked(e) {\r\n const { movieClicked } = this.props;\r\n const dataset = e.target.dataset;\r\n e.preventDefault();\r\n\r\n const movieId = e.currentTarget.id || dataset.movieId;\r\n if (e.target.tagName == 'IMG' || e.target.tagName == 'H1' || e.target.tagName == 'INPUT' || _.includes(e.target.classList, 'poster-banner'))\r\n movieClicked(movieId);\r\n }\r\n\r\n showtimeTypes = [];\r\n generateShowtimesInMonth() {\r\n const { movie, showtimeClicked, appLocale } = this.props;\r\n this.showtimeTypes = []; //reset it so types don't bleed into months where they don't apply.\r\n\r\n return 1 ? 'MovieList multibio' : 'MovieList'}>\r\n {movieListItems.length > 0 ? movieListItems :
{LOCALE[appLocale].noMoviesText} }\r\n )\r\n }\r\n}","import '../css/movielists.scss'\r\nimport '../css/multibio.scss'\r\n\r\nimport React from 'react'\r\nimport { bindActionCreators } from 'redux'\r\nimport { connect } from 'react-redux'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\nimport CONSTANTS from '../movielist-constants'\r\nimport { appHeightChanged } from '../../../actions/app-actions'\r\nimport { getMovieList, changeDate, selectedMovieChanged, changeSelectedShowtime } from '../../../actions/movielist-actions'\r\nimport DatePickerContainer from '../../datepicker/DatePickerContainer'\r\nimport MultibioMovieList from './Multibio_MovieList'\r\nimport { setContainerClasses } from '../shared'\r\n\r\nclass Multibio_ProgramContainer extends React.Component {\r\n constructor() {\r\n super();\r\n this.changeDate = this.changeDate.bind(this);\r\n this.movieClicked = this.movieClicked.bind(this);\r\n this.showtimeClicked = this.showtimeClicked.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n const { actions, movies, organizerIds, iframeId } = this.props;\r\n if (movies.length == 0) actions.getMovieList(organizerIds);\r\n\r\n if (window.parent != window) actions.appHeightChanged(iframeId, true);\r\n else window.scrollTo(0, 0);\r\n }\r\n\r\n changeDate(date) {\r\n const { history, organizerIds, actions } = this.props;\r\n actions.changeDate(date);\r\n history.push(`${window.location.pathname}?org=${organizerIds}&date=${date}`);\r\n }\r\n\r\n movieClicked(id) {\r\n const { organizerIds, actions, history, movies } = this.props;\r\n const movie = _.find(movies, (movie) => { return movie.id == id });\r\n actions.selectedMovieChanged(movie.id, history.location.pathname).then(() => history.push(`${ROUTES.MOVIE}/${id}?org=${organizerIds}`));\r\n }\r\n\r\n showtimeClicked(organizerId, showtimeId) {\r\n const { openOrderInNewWindow, actions, history, showtimes } = this.props;\r\n const showtime = _.find(showtimes, (showtime) => { return showtime.id == showtimeId && showtime.organizerId == organizerId });\r\n if (showtime) {\r\n actions.changeSelectedShowtime(showtime, history.location.pathname).then(() => {\r\n const orderUrl = `${ROUTES.ORDERFLOW.TICKETS}/${showtime.movieId}/${showtime.id}?org=${showtime.organizerId}`;\r\n if (openOrderInNewWindow) window.open(orderUrl, '_blank', 'width=1170,height=800,resizable=yes,scrollbars=yes');\r\n else history.push(orderUrl);\r\n })\r\n }\r\n }\r\n\r\n render() {\r\n const { appLocale, pageHeader, organizers, movies, showAsBase, showtimes, posterBanners, selectedDate, columns,\r\n showLocationOnShowtime, showBackInTime, actions, organizerIds, sortBy, showExpired } = this.props;\r\n\r\n const listType = CONSTANTS.listTypes.date;\r\n const header = pageHeader ? 1 ? 'MovieList multibio' : 'MovieList'}>\r\n {movieListItems.length > 0 ? movieListItems :
{LOCALE[appLocale].noMoviesText} }\r\n )\r\n }\r\n}","import '../../css/movielists.scss'\r\nimport React from 'react'\r\nimport { bindActionCreators } from 'redux'\r\nimport { connect } from 'react-redux'\r\nimport _ from 'lodash'\r\nimport { ROUTES } from '../../../navigation/route-constants'\r\nimport CONSTANTS from '../../movielist-constants'\r\nimport { appHeightChanged } from '../../../../actions/app-actions'\r\nimport { selectedMovieChanged, changeSelectedShowtime } from '../../../../actions/movielist-actions'\r\nimport { getMultiOrgFutureMovies } from '../../../../actions/organizer-actions'\r\nimport Multibio_FutureMoviesList from './Multibio_FutureMoviesList'\r\nimport { setContainerClasses } from '../../shared'\r\n\r\nclass Multibio_FutureMoviesContainer extends React.Component {\r\n constructor() {\r\n super();\r\n\r\n this.movieClicked = this.movieClicked.bind(this);\r\n this.showtimeClicked = this.showtimeClicked.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n const { actions, movies, organizerIds, iframeId } = this.props;\r\n if (movies.length == 0) actions.getMultiOrgFutureMovies(organizerIds);\r\n\r\n if (window.parent != window) actions.appHeightChanged(iframeId, true);\r\n else window.scrollTo(0, 0);\r\n\r\n }\r\n\r\n movieClicked(id) {\r\n const { organizerIds, actions, history, movies } = this.props;\r\n const movie = _.find(movies, (movie) => { return movie.id == id });\r\n actions.selectedMovieChanged(movie.id, history.location.pathname).then(() => history.push(`${ROUTES.MOVIE}/${id}?org=${organizerIds}`));\r\n }\r\n\r\n showtimeClicked(organizerId, showtimeId) {\r\n const { openOrderInNewWindow, actions, history, showtimes } = this.props;\r\n const showtime = _.find(showtimes, (showtime) => { return showtime.id == showtimeId && showtime.organizerId == organizerId });\r\n if (showtime) {\r\n actions.changeSelectedShowtime(showtime, history.location.pathname).then(() => {\r\n const orderUrl = `${ROUTES.ORDERFLOW.TICKETS}/${showtime.movieId}/${showtime.id}?org=${showtime.organizerId}`;\r\n if (openOrderInNewWindow) window.open(orderUrl, '_blank', 'width=1170,height=800,resizable=yes,scrollbars=yes');\r\n else history.push(orderUrl);\r\n })\r\n }\r\n }\r\n\r\n render() {\r\n const { appLocale, pageHeader, organizers, movies, showtimes, posterBanners, columns,\r\n listType, showLocationOnShowtime, actions, organizerIds } = this.props;\r\n\r\n const header = pageHeader ? ' }} /> : null;\r\n\r\n const overlay = !isPlaying ?
: null;\r\n\r\n return (\r\n
\r\n {overlay}\r\n {vimeoPlayer}\r\n
)\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\n\r\nexport default class VersionSelector extends React.Component {\r\n constructor() {\r\n super();\r\n this.movieClicked = this.movieClicked.bind(this);\r\n }\r\n\r\n movieClicked(e) {\r\n e.preventDefault();\r\n const movieId = e.currentTarget.id;\r\n this.props.movieClicked(movieId);\r\n }\r\n\r\n render() {\r\n const { movie } = this.props;\r\n const allVersions = _.map(movie.versions, (version, i) => {\r\n // const versionName = version.name.substr(version.base.name.length + 3); //name plus space, hyphen and space\r\n const classes = movie.id === version.id ? 'version selected' : 'version';\r\n //const name = versionName ? versionName : '2D';\r\n return
{version.name}
\r\n });\r\n\r\n return (\r\n
\r\n {allVersions}\r\n
\r\n )\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport Showtime from './Showtime'\r\nimport ShowtimeTypeList from './ShowtimeTypeList';\r\n\r\nexport default class ShowtimeSchedule extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const schedule = this.extractShowtimeSchedule(props.movie);\r\n this.state = {\r\n schedule,\r\n skip: 0,\r\n take: 0\r\n }\r\n\r\n this.nextWeek = this.nextWeek.bind(this)\r\n this.previousWeek = this.previousWeek.bind(this)\r\n this.handleWindowResize = this.handleWindowResize.bind(this);\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n if (this.props.movie.id != nextProps.movie.id || this.props.appLocale != nextProps.appLocale)\r\n this.setState({ schedule: this.extractShowtimeSchedule(nextProps.movie) });\r\n }\r\n\r\n componentDidMount() {\r\n window.addEventListener('resize', this.handleWindowResize);\r\n this.setState({ take: this.determineTakeFromScreenWidth() });\r\n }\r\n\r\n componentWillUnmount() {\r\n window.removeEventListener('resize', this.handleWindowResize);\r\n }\r\n\r\n handleWindowResize = _.debounce(() => { this.setState({ take: this.determineTakeFromScreenWidth() }); }, 400)\r\n\r\n determineTakeFromScreenWidth() {\r\n const schedule = document.querySelector('.schedule');\r\n const scheduleWidth = Math.max(schedule.scrollWidth, schedule.offsetWidth, schedule.clientWidth);\r\n return Math.round(scheduleWidth / 120); //120 being the width wanted for the Showtimes\r\n }\r\n\r\n nextWeek() {\r\n const { schedule, skip, take } = this.state;\r\n if (skip < schedule.length) this.setState({ skip: skip + take });\r\n }\r\n\r\n previousWeek() {\r\n const { skip, take } = this.state;\r\n if (skip > 0) this.setState({ skip: skip - take });\r\n }\r\n\r\n showtimeTypes = [];\r\n extractShowtimeSchedule(movie) {\r\n const { showtimeClicked, showExpired } = this.props;\r\n let schedule = [];\r\n _.forOwn(movie.showtimesByDate, (showtimes, dateKey) => {\r\n const date = moment(dateKey);\r\n\r\n const showtimesOnDate = [];\r\n _.each(showtimes, (showtime) => {\r\n if (showtime.showInfo.enabled && showtime.type && !_.find(this.showtimeTypes, showtime.type)) this.showtimeTypes.push(showtime.type);\r\n\r\n const isInFuture = moment(showtime.dateTime) > moment();\r\n if (showtime.showInfo.enabled === true && (showExpired || isInFuture)) {\r\n showtimesOnDate.push(\r\n
);\r\n }\r\n });\r\n\r\n if (showtimesOnDate.length > 0) {\r\n const showtimesOnDay =
\r\n
{_.capitalize(date.format('ddd DD/MM'))}
\r\n {showtimesOnDate}\r\n
;\r\n schedule.push(showtimesOnDay);\r\n }\r\n });\r\n return schedule;\r\n }\r\n\r\n showtimesOnPage() {\r\n const { schedule, skip, take } = this.state;\r\n let showtimesOnPage = _.take(_.drop(schedule, skip), take);\r\n\r\n if (showtimesOnPage.length > 0 && showtimesOnPage.length < take) {\r\n var emptyElementsNeeded = take - showtimesOnPage.length;\r\n for (var i = 0; i < emptyElementsNeeded; i++) {\r\n showtimesOnPage.push(
);\r\n }\r\n }\r\n return showtimesOnPage;\r\n }\r\n\r\n render() {\r\n const { schedule, skip, take } = this.state;\r\n const { isMultiBio, filterId } = this.props;\r\n const disabled = 'week-nav disabled';\r\n const prevWeekClasses = skip !== 0 ? 'week-nav' : disabled;\r\n const nextWeekClasses = skip + take < schedule.length ? 'week-nav' : disabled;\r\n const showNavs = true; //prevWeekClasses != disabled && nextWeekClasses != disabled;\r\n const showtimeOnPage = this.showtimesOnPage();\r\n\r\n return (\r\n
\r\n {showNavs ?
❮
:
}\r\n
{showtimeOnPage}
\r\n {showNavs ?
❯
:
}\r\n\r\n {!isMultiBio && !filterId && this.showtimeTypes.length > 0 ?
: null}\r\n
\r\n )\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\n\r\nconst Pictures = ({ pictureUrls }) => {\r\n const images = _.map(pictureUrls, (picture, i) =>
);\r\n\r\n return (\r\n
\r\n {images}\r\n
)\r\n}\r\n\r\nexport default Pictures","import React from 'react'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport Trailer from './Trailer'\r\nimport VersionSelector from './VersionSelector'\r\nimport ShowtimeSchedule from '../showtime/ShowtimeSchedule'\r\nimport MovieInfo from './MovieInfo'\r\nimport Pictures from './Pictures'\r\nimport Poster from './Poster'\r\n\r\nexport default class Movie extends React.Component {\r\n\r\n generateShowtimeSchedules() {\r\n const { movie, showtimeClicked, appLocale, organizers, showExpired, filterId } = this.props;\r\n\r\n let showtimeSchedules = [];\r\n if (movie.showtimesByOrgId) {\r\n _.forOwn(movie.showtimesByOrgId, (showtimes, orgId) => {\r\n if (showtimes.length > 0) {\r\n const isMultiBio = organizers.length > 1;\r\n const orgName = _.find(organizers, (org) => { return org.id == orgId });\r\n const showtimesByDate = _.groupBy(showtimes, (showtime) => { return moment(showtime.dateTime).format('YYYY-MM-DD') });\r\n showtimeSchedules.push(\r\n
\r\n {isMultiBio && orgName ?
{orgName.name} : null}\r\n );\r\n }\r\n });\r\n }\r\n\r\n return showtimeSchedules;\r\n }\r\n\r\n render() {\r\n const { movie, movieClicked, appLocale, iframeId } = this.props;\r\n const trailer = movie.trailer ?
: null;\r\n const allVersions = movie.versions.length > 1 ?
: null;\r\n const poster = movie.posters ?
: null;\r\n const pictures = movie.pictures ?
: null;\r\n const movieNameLocale = movie.names ? (movie.names[appLocale] ? movie.names[appLocale] : movie.names['da']) : movie.name;\r\n\r\n return (\r\n
\r\n {trailer}\r\n {allVersions}\r\n
{this.generateShowtimeSchedules()}
\r\n
\r\n
{movieNameLocale} \r\n {poster}\r\n \r\n {pictures}\r\n
\r\n );\r\n }\r\n}","import './movie.scss'\r\n\r\nimport React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport { bindActionCreators } from 'redux'\r\nimport _ from 'lodash'\r\nimport { getParams } from '../../utilities/location-utilities'\r\nimport { APP_MODES } from '../../api/api-constants'\r\nimport LOCALE from './MovieLocale'\r\nimport { ROUTES } from '../navigation/route-constants'\r\nimport { getMovieList, changeSelectedShowtime, selectedMovieChanged } from '../../actions/movielist-actions'\r\nimport Movie from './Movie'\r\nimport { appHeightChanged } from '../../actions/app-actions'\r\n\r\nclass MovieContainer extends React.Component {\r\n constructor() {\r\n super();\r\n this.movieClicked = this.movieClicked.bind(this);\r\n this.showtimeClicked = this.showtimeClicked.bind(this);\r\n this.navBack = this.navBack.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n const { actions, movies, movieId, organizerIds, iframeId } = this.props;\r\n if (movies.length == 0) actions.getMovieList(organizerIds).then(() => actions.selectedMovieChanged(movieId));\r\n\r\n if (window.parent != window) actions.appHeightChanged(iframeId, true);\r\n else window.scrollTo(0, 0);\r\n }\r\n\r\n movieClicked(id) {\r\n const { organizerIds, actions, history } = this.props;\r\n actions.selectedMovieChanged(id).then(() => history.replace(`${ROUTES.MOVIE}/${id}?org=${organizerIds}`));\r\n }\r\n\r\n showtimeClicked(organizerId, showtimeId) {\r\n const { openOrderInNewWindow, actions, history, selectedMovie } = this.props;\r\n const showtime = _.find(selectedMovie.showtimesForMovie, (showtime) => { return showtime.id == showtimeId && showtime.organizerId == organizerId });\r\n if (showtime) {\r\n actions.changeSelectedShowtime(showtime).then(() => {\r\n const orderUrl = `${ROUTES.ORDERFLOW.TICKETS}/${showtime.movieId}/${showtime.id}?org=${showtime.organizerId}`;\r\n if (openOrderInNewWindow) window.open(orderUrl, '_blank', 'width=1170,height=800,resizable=yes,scrollbars=yes');\r\n else history.push(orderUrl);\r\n })\r\n }\r\n }\r\n\r\n navBack() {\r\n const { organizerIds, history, backTo } = this.props;\r\n history.push(`${backTo}?org=${organizerIds}`);\r\n }\r\n\r\n generatBackbutton() {\r\n const { backTo, appLocale } = this.props;\r\n let backText = LOCALE[appLocale].backProgram;\r\n switch (backTo) {\r\n case ROUTES.PROGRAM:\r\n backText = LOCALE[appLocale].backProgram;\r\n break;\r\n case ROUTES.ALL_MOVIES:\r\n backText = LOCALE[appLocale].backAll;\r\n break;\r\n case ROUTES.ALL_FUTURE_MOVIES:\r\n backText = LOCALE[appLocale].backAllFuture;\r\n break;\r\n case ROUTES.FUTURE_MOVIES:\r\n backText = LOCALE[appLocale].backFuture;\r\n break;\r\n }\r\n\r\n return
{backText} ;\r\n }\r\n\r\n render() {\r\n const { selectedMovie, configuration, pageHeader, appLocale, organizers, iframeId, showtimeTypes, showExpired, filterId } = this.props;\r\n\r\n const header = pageHeader ?
: null;\r\n const movie = !_.isEmpty(selectedMovie) ?\r\n
: null;\r\n\r\n return (\r\n
1 ? 'multibio' : ''}`}>\r\n {header}\r\n {movie}\r\n
\r\n {configuration.appMode !== APP_MODES.MOVIE ? this.generatBackbutton() : null}\r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n let selectedMovie = state.movielist.selectedMovie;\r\n\r\n const movieId = ownProps.match.params.movieId;\r\n if (selectedMovie == null || movieId != null && selectedMovie.id != movieId)\r\n selectedMovie = _.find(state.movielist.movies, (movie) => { return movie.id == ownProps.match.params.movieId }) || {};\r\n\r\n selectedMovie.versions = [];\r\n if (selectedMovie.baseId) {\r\n selectedMovie.versions = _.filter(state.movielist.movies, (movie) => { return movie.baseId === selectedMovie.baseId });\r\n selectedMovie.base = _.find(state.movielist.movieBases, { 'id': selectedMovie.baseId });\r\n }\r\n const showtimesForMovie = _.filter(state.movielist.showtimes, (showtime) => { return showtime.movieId == selectedMovie.id });\r\n selectedMovie.showtimesByOrgId = showtimesForMovie ? _.groupBy(showtimesForMovie, 'organizerId') : null;\r\n selectedMovie.showtimesForMovie = showtimesForMovie;\r\n\r\n const config = state.organizer.configuration;\r\n const backTo = state.movielist.backTo;\r\n const showExpired = _.includes(ownProps.location.search, 'showexpired=true') ||\r\n (backTo == ROUTES.ALL_MOVIES || backTo == ROUTES.MULTI_ALL_MOVIES) && config.movielists.all.showExpired ||\r\n (backTo == ROUTES.PROGRAM || backTo == ROUTES.MULTI_PROGRAM || backTo == ROUTES.PROGRAM_AND_ALL_FUTURE_MOVIES) && config.movielists.date.showExpired\r\n\r\n return {\r\n organizerIds: state.movielist.organizerIds || getParams().org,\r\n organizers: state.movielist.organizers,\r\n selectedMovie,\r\n configuration: config,\r\n movieId,\r\n movies: state.movielist.movies,\r\n backTo,\r\n pageHeader: config.pageHeaders.movie,\r\n appLocale: state.app.locale,\r\n openOrderInNewWindow: config.openOrderInNewWindow,\r\n iframeId: state.app.iframeId,\r\n showtimeTypes: state.movielist.showtimeTypes,\r\n showExpired,\r\n filterId: state.movielist.filterId\r\n }\r\n}\r\n\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n actions: bindActionCreators(Object.assign({}, { getMovieList, selectedMovieChanged, changeSelectedShowtime, appHeightChanged }), dispatch)\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(MovieContainer)","export default {\r\n da: {\r\n longDateTimeFormat: 'dddd [d.] LL [kl.] LT',\r\n cinema: 'Biograf',\r\n circus: 'Cirkus',\r\n age: 'Censur',\r\n duration: 'Varighed',\r\n durationTo: 'til ca.'\r\n },\r\n\r\n en: {\r\n longDateTimeFormat: 'dddd LL [at] LT',\r\n cinema: 'Cinema',\r\n circus: 'Circus',\r\n age: 'Censoring',\r\n duration: 'Duration',\r\n durationTo: 'to approx.'\r\n }\r\n}","import './topbar.scss'\r\nimport React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport Poster from '../../movie/Poster'\r\nimport { ORGANIZER_TYPES } from '../../../api/api-constants'\r\nimport CONSTANTS from '../../movielists/movielist-constants'\r\nimport LOCALE from './TopBarLocale'\r\nimport ShowtimeType from '../../showtime/ShowtimeType'\r\n\r\nclass TopBar extends React.Component {\r\n\r\n generateDuration() {\r\n const { movie, showtime, appLocale } = this.props;\r\n const from = moment(showtime.dateTime);\r\n const duration = movie.type == CONSTANTS.types.special ? moment.duration(movie.length) : moment.duration(showtime.duration);\r\n const to = moment(from).add(duration);\r\n return
\r\n
{LOCALE[appLocale].duration}: {from.format('HH:mm')} {LOCALE[appLocale].durationTo} {to.format('HH:mm')}
\r\n
\r\n }\r\n\r\n render() {\r\n const { organizer, movie, showtime, clubCardEnabled, pageHeaderEnabled, appLocale } = this.props;\r\n const poster = movie.posters ?
: null;\r\n const duration = showtime.duration ? this.generateDuration() : null;\r\n const age = movie.ageCensoring ?
{LOCALE[appLocale].age}: {movie.ageCensoring}
: null;\r\n const dateTime = moment(showtime.dateTime);\r\n\r\n let topBarClasses = 'TopBar';\r\n if (clubCardEnabled) topBarClasses += ' club-enabled'\r\n if (pageHeaderEnabled) topBarClasses += ' header-enabled';\r\n\r\n const movieNameLocale = movie.names[appLocale] ? movie.names[appLocale] : movie.names['da'];\r\n const typeName = showtime.type ?
: null;\r\n\r\n return (\r\n
\r\n {poster}\r\n
\r\n
{movieNameLocale} \r\n
{_.capitalize(dateTime.format(LOCALE[appLocale].longDateTimeFormat))} \r\n
{organizer.configuration.type == ORGANIZER_TYPES.CIRCUS ? LOCALE[appLocale].circus : LOCALE[appLocale].cinema}: {`${organizer.name}, ${showtime.locationName}`}
\r\n {age}\r\n {duration}\r\n\r\n {typeName}\r\n
\r\n
\r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n showtimeTypes: state.movielist.showtimeTypes\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps)(TopBar)","import React from 'react'\r\nimport _ from 'lodash'\r\n\r\nexport default class QuantitySelector extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { selectedTicket } = props;\r\n const quantity = selectedTicket ? selectedTicket.quantity : 0;\r\n\r\n this.state = { quantity };\r\n this.increment = this.increment.bind(this);\r\n this.decrement = this.decrement.bind(this);\r\n }\r\n\r\n debounceMultipleClicks = _.debounce((quantity) => {\r\n const { ticketQuantityChanged, availableTicket } = this.props;\r\n ticketQuantityChanged(availableTicket.id, quantity);\r\n }, 400)\r\n\r\n canIncrement(quantity) {\r\n const { freeSeats, availableTicket, canIncrementTotalQuantity, canIncrementTotalPoints, order } = this.props;\r\n const newQuantity = quantity + 1;\r\n const totalTicketQuantity = order.selected.totalTicketQuantity;\r\n const canIncrement = (freeSeats > 1 || freeSeats == 1 && quantity == 0 && totalTicketQuantity == 0) && (newQuantity <= Math.max(availableTicket.buyMax, availableTicket.reserveMax)) && canIncrementTotalQuantity();\r\n if (availableTicket.points) return canIncrementTotalPoints(availableTicket.points, newQuantity) && canIncrement;\r\n else return canIncrement;\r\n }\r\n\r\n increment() {\r\n const { incrementTotalQuantity } = this.props;\r\n let { quantity } = this.state;\r\n if (this.canIncrement(quantity)) {\r\n this.setState({ quantity: ++quantity });\r\n incrementTotalQuantity();\r\n this.debounceMultipleClicks(quantity);\r\n }\r\n }\r\n\r\n decrement() {\r\n const { decrementTotalQuantity } = this.props;\r\n let { quantity } = this.state;\r\n if (quantity > 0) {\r\n this.setState({ quantity: --quantity });\r\n decrementTotalQuantity();\r\n this.debounceMultipleClicks(quantity);\r\n }\r\n }\r\n\r\n render() {\r\n const { availableTicket, order, canIncrementTotalQuantity, freeSeats } = this.props;\r\n const { quantity } = this.state;\r\n const decrementClasses = !order.isFetching && quantity > 0 ? 'decrement' : 'decrement deactivated';\r\n let incrementClasses = !order.isFetching && (freeSeats > 1 || freeSeats == 1 && quantity == 0 && order.selected.totalTicketQuantity == 0) && canIncrementTotalQuantity() ? 'increment' : 'increment deactivated';\r\n if (order.clubCard && availableTicket.points > order.clubCard.remainingPoints) incrementClasses = 'increment deactivated';\r\n\r\n return (\r\n
\r\n
\r\n
{quantity}
\r\n
\r\n
\r\n )\r\n }\r\n}","export default {\r\n da: {\r\n next: 'Næste ❯',\r\n nextReserve: 'Reserver ❯',\r\n nextBuy: 'Køb ❯',\r\n back: '❮ Tilbage',\r\n\r\n currency: 'kr.',\r\n points: 'points'\r\n },\r\n\r\n en: {\r\n next: 'Next ❯',\r\n nextReserve: 'Reserve ❯',\r\n nextBuy: ' Buy ❯',\r\n back: '❮ Back',\r\n\r\n currency: 'DKK',\r\n points: 'points'\r\n }\r\n}","import OrderFlowLocale from \"../OrderFlowLocale\";\r\n\r\nexport default {\r\n da: {\r\n ...OrderFlowLocale.da,\r\n showtimeUnNumbered: 'Venligst bemærk at pladserne i salen er unummereret.
Først til mølle princippet gælder.',\r\n oneSeat: 'Valgt plads: ',\r\n multiSeats: 'Valgte pladser: ',\r\n row: 'Række',\r\n seat: 'Sæde',\r\n seats: 'Sæder',\r\n seatsUnNumbered: 'Unummereret',\r\n seatBlue: 'Dit valg',\r\n seatGreen: 'Ledige',\r\n seatWhite: 'Reserveret',\r\n seatRed: 'Optaget',\r\n chooseSeats: 'Du skal vælge mindst en billet for at vælge sæder',\r\n chooseTickets: 'Du skal vælge mindst en billet for at fortsætte',\r\n discountTextBioKlubDk: 'Biografklub Danmark kan ikke angives her. Disse indtastes senere i forløbet.',\r\n discountTextGiftCard: 'Gavekort kan ikke angives her. Disse indtastes senere i forløbet.',\r\n discountTextBoth: 'Biografklub Danmark og gavekort kan ikke angives her. Disse indtastes senere i forløbet.',\r\n\r\n noOnlineOrder: 'Denne forestilling kan ikke bestilles online på nuværende tidspunkt',\r\n noReserveClubCard: 'Du kan ikke reservere når du er logget på klubkort',\r\n noReserve: 'De valgte billetter kan ikke reserveres',\r\n noBuy: 'De valgte billetter kan ikke købes',\r\n\r\n backProgram: '❮ Program',\r\n backAll: '❮ Alle Film',\r\n backFuture: '❮ Kommende Film',\r\n backMovie: '❮ Andre Tider',\r\n\r\n nextBuyBioKlubDk: ' Køb med Biografklub Danmark ❯ ',\r\n\r\n extraPurchasesReset: 'Du har flyttet dine sæder til eller fra pladser med specialtilkøb tilgængeligt, så dine valgte tilkøb er blevet nulstillet.'\r\n },\r\n\r\n en: {\r\n ...OrderFlowLocale.en,\r\n showtimeUnNumbered: 'Please note that the seats in this hall are unnumbered.
First come, first serve.',\r\n oneSeat: 'Chosen seat: ',\r\n multiSeats: 'Chosen seats: ',\r\n row: 'Row',\r\n seat: 'Seat',\r\n seats: 'Seats',\r\n seatsUnNumbered: 'Unnumbered',\r\n seatBlue: 'Your seats',\r\n seatGreen: 'Available',\r\n seatWhite: 'Reserved',\r\n seatRed: 'Sold',\r\n chooseSeats: 'You have to select minimum one ticket to choose seats',\r\n chooseTickets: 'You have to select minimum one ticket to continue',\r\n discountTextBioKlubDk: '\"Biografklub Danmark\" can not be used here. They can be added later in the process.',\r\n discountTextGiftCard: 'Gift cards can not be used here. They can be added later in the process.',\r\n discountTextBoth: '\"Biografklub Danmark\" and gift cards can not be used here. They can be added later in the process.',\r\n\r\n noOnlineOrder: 'This showtime can\\'t be ordered online',\r\n noReserveClubCard: 'You can\\'t reserve tickets when you are logged into as a club card owner',\r\n noReserve: 'The chosen tickets can\\'t be reserved',\r\n noBuy: 'The chosen tickets can\\'t be bought',\r\n\r\n backProgram: '❮ Program',\r\n backAll: '❮ All Movies',\r\n backFuture: '❮ Future Movies',\r\n backMovie: '❮ Other Showtimes',\r\n\r\n nextBuyBioKlubDk: 'Buy with \"Biografklub Danmark\"',\r\n\r\n extraPurchasesReset: 'You have moved your seats to or from places where there are special extra purchases available. Your previously chosen extra purchases have been reset.'\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport CONSTANTS from '../../orderflow-constants'\r\nimport QuantitySelector from './QuantitySelector'\r\nimport LOCALE from '../OrderLocale'\r\n\r\nexport default class Ticket extends React.Component {\r\n generatePrice(price) {\r\n if (price.from === price.to) return price.from;\r\n else if (price.from && price.to) return price.from + ' - ' + price.to;\r\n else if (price.from && !price.to) return price.from;\r\n else if (!price.from && price.to) return price.to;\r\n else return null;\r\n }\r\n\r\n generateTicketInteraction(availableTicket) {\r\n const { order, selectedTicket, bioDkActive, ticketQuantityChanged, canIncrementTotalQuantity, incrementTotalQuantity, decrementTotalQuantity, canIncrementTotalPoints, freeSeats } = this.props;\r\n switch (availableTicket.type) {\r\n case CONSTANTS.ticketType.quantity:\r\n return
\r\n }\r\n }\r\n\r\n render() {\r\n const { availableTicket, appLocale } = this.props;\r\n let price = availableTicket.price ? this.generatePrice(availableTicket.price) + ` ${LOCALE[appLocale].currency}` : null;\r\n price = availableTicket.points ? availableTicket.points + ` ${LOCALE[appLocale].points}` : null;\r\n const ticketInteraction = this.generateTicketInteraction(availableTicket);\r\n\r\n return (\r\n
\r\n
{availableTicket.name} \r\n
{price}
\r\n {ticketInteraction}\r\n
\r\n )\r\n }\r\n}","export default {\r\n da: {\r\n placeholderBioKlubDk: 'Indtast kuponnummer eller TAST-SELV-KODE',\r\n placeholderGiftCard: 'Gavekortnummer',\r\n placeholderDiscount: 'Rabatkode',\r\n submit: 'Indløs',\r\n error: 'Kun bogstaver og numre tilladt',\r\n errorInvalidType: 'Ugyldigt nummer',\r\n currency: 'kr.',\r\n remaningAmount: 'Ny saldo: ',\r\n toolTipOne: 'Du kan indtaste',\r\n toolTipStartsWith: 'som starter med',\r\n toolTipMulti: 'Du kan indtaste følgende typer: '\r\n },\r\n\r\n en: {\r\n placeholderBioKlubDk: 'Coupon number',\r\n placeholderGiftCard: 'Gift card number',\r\n placeholderDiscount: 'Discount code',\r\n submit: 'Redeem',\r\n error: 'Only letters and numbers allowed',\r\n errorInvalidType: 'Invalid code',\r\n currency: 'DKK',\r\n remaningAmount: 'Remaining amount: ',\r\n toolTipOne: 'You can only enter',\r\n toolTipStartsWith: 'starting with',\r\n toolTipMulti: 'You can only enter the following types:'\r\n }\r\n}","import './vouchers.scss'\r\nimport React from 'react'\r\nimport _ from 'lodash'\r\nimport { VOUCHER_TYPES } from '../../../api/api-constants'\r\nimport LOCALE from './VoucherLocale'\r\n\r\nexport default class Vouchers extends React.Component {\r\n constructor() {\r\n super();\r\n this.state = { value: '', error: '', showToolTip: false };\r\n this.handleChange = this.handleChange.bind(this);\r\n this.handleSubmit = this.handleSubmit.bind(this);\r\n this.toggleToolTip = this.toggleToolTip.bind(this);\r\n }\r\n\r\n componentDidUpdate() {\r\n const { appHeightChanged, iframeId } = this.props;\r\n if (window.parent != window) appHeightChanged(iframeId);\r\n }\r\n\r\n handleChange(e) {\r\n const { appLocale } = this.props;\r\n const value = e.target.value.toUpperCase();\r\n if (!this.isLetterOrNumber(value)) this.setState({ error: LOCALE[appLocale].error });\r\n else if (this.isKeyStrokeValid(value)) this.setState({ value, error: '' });\r\n }\r\n\r\n isKeyStrokeValid(input) {\r\n const { type, appLocale, voucherConstraints } = this.props;\r\n const constraints = type == VOUCHER_TYPES.BIOKLUBDK ? _.filter(voucherConstraints, (voucher) => { return voucher.type == type }) : voucherConstraints;\r\n if (type != VOUCHER_TYPES.DISCOUNT && constraints.length > 0) {\r\n const vouchers = _.split(input, ',');\r\n const isValid = _.every(vouchers, (voucher) => {\r\n if (voucher.length <= 5) return true; // only check after 5 chars on each voucher number\r\n return _.some(constraints, (constraint) => {\r\n const startValid = voucher.startsWith(constraint.prefix);\r\n const lengthValid = voucher.length <= constraint.length;\r\n return startValid && lengthValid;\r\n });\r\n });\r\n\r\n if (!isValid) {\r\n this.setState({ error: LOCALE[appLocale].errorInvalidType });\r\n return false;\r\n } else return true;\r\n } else { //There are no constraints on this type and we proceeed.\r\n this.setState({ error: '' });\r\n return true;\r\n }\r\n }\r\n\r\n handleSubmit(e) {\r\n e.preventDefault();\r\n const { value } = this.state;\r\n const { type, vouchers, vouchersChanged } = this.props;\r\n if (type == VOUCHER_TYPES.DISCOUNT) {\r\n vouchersChanged(value);\r\n this.setState({ value: '' });\r\n } else if (this.isValidConstraints(value)) {\r\n let updatedVouchers = '';\r\n const voucherCodes = _.uniq(_.concat(_.split(value, ','), _.map(vouchers.active, 'barCode')));\r\n _.map(voucherCodes, (code) => { return updatedVouchers += code + ','; });\r\n updatedVouchers = _.trimEnd(updatedVouchers, ',');\r\n\r\n vouchersChanged(updatedVouchers);\r\n this.setState({ value: '' });\r\n }\r\n }\r\n\r\n isLetterOrNumber(input) {\r\n const regex = /^[A-Z0-9,]*$/;\r\n return regex.test(input);\r\n }\r\n\r\n isValidConstraints(input) {\r\n const { type, appLocale, voucherConstraints } = this.props;\r\n const constraints = type == VOUCHER_TYPES.BIOKLUBDK ? _.filter(voucherConstraints, (voucher) => { return voucher.type == type }) : voucherConstraints;\r\n if (constraints.length > 0) {\r\n const vouchers = _.split(input, ',');\r\n const isValid = _.every(vouchers, (voucher) => {\r\n return _.some(constraints, (constraint) => {\r\n const startValid = voucher.startsWith(constraint.prefix);\r\n const lengthValid = voucher.length == constraint.length;\r\n return startValid && lengthValid;\r\n });\r\n });\r\n\r\n if (!isValid) {\r\n this.setState({ error: LOCALE[appLocale].errorInvalidType });\r\n return false;\r\n } else return true;\r\n } else { //There are no constraints on this type and we proceeed.\r\n this.setState({ error: '' });\r\n return true;\r\n }\r\n }\r\n\r\n getPlaceholder() {\r\n const { type, appLocale } = this.props;\r\n switch (type) {\r\n case VOUCHER_TYPES.GIFTCARD:\r\n return LOCALE[appLocale].placeholderGiftCard;\r\n case VOUCHER_TYPES.BIOKLUBDK:\r\n return LOCALE[appLocale].placeholderBioKlubDk;\r\n case VOUCHER_TYPES.DISCOUNT:\r\n return LOCALE[appLocale].placeholderDiscount;\r\n }\r\n }\r\n\r\n getConstraints() {\r\n const { type, voucherConstraints, appLocale } = this.props;\r\n const constraints = type == VOUCHER_TYPES.BIOKLUBDK ? _.filter(voucherConstraints, (voucher) => { return voucher.type == type }) : voucherConstraints;\r\n if (constraints.length > 1) {\r\n const mapped = _.map(constraints, (constraint, i) => {\r\n return
{constraint.name} {LOCALE[appLocale].toolTipStartsWith} {constraint.prefix} ;\r\n });\r\n return
{LOCALE[appLocale].toolTipMulti} {mapped}
;\r\n } else if (constraints.length > 0)\r\n return
{LOCALE[appLocale].toolTipOne} {constraints[0].name} {LOCALE[appLocale].toolTipStartsWith} {constraints[0].prefix}
;\r\n }\r\n\r\n toggleToolTip() {\r\n const { showToolTip } = this.state;\r\n if (showToolTip) this.setState({ showToolTip: false });\r\n else this.setState({ showToolTip: true });\r\n }\r\n\r\n render() {\r\n const { type, appLocale, inputInfo } = this.props;\r\n const { value, error, showToolTip } = this.state;\r\n const constraintInfo = type != VOUCHER_TYPES.DISCOUNT ? this.getConstraints() : null;\r\n const toolTip = type != VOUCHER_TYPES.DISCOUNT ?
: null;\r\n\r\n return (\r\n
\r\n );\r\n }\r\n} ","import React from 'react'\r\nimport _ from 'lodash'\r\nimport Ticket from './Ticket'\r\nimport VoucherInput from '../../vouchers/VoucherInput'\r\nimport LOCALE from '../OrderLocale'\r\nimport { VOUCHER_TYPES } from '../../../../api/api-constants';\r\n\r\nexport default class AvailableTickets extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n totalTicketQuantity: props.order.selected.totalTicketQuantity || 0,\r\n selectedPoints: props.order.selected.clubCardPoints || 0\r\n }\r\n\r\n this.canIncrementTotalQuantity = this.canIncrementTotalQuantity.bind(this);\r\n this.canIncrementTotalPoints = this.canIncrementTotalPoints.bind(this);\r\n this.incrementTotalQuantity = this.incrementTotalQuantity.bind(this);\r\n this.decrementTotalQuantity = this.decrementTotalQuantity.bind(this);\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { order } = this.props;\r\n const selected = order.selected;\r\n const nextSelected = nextProps.order.selected;\r\n const { totalTicketQuantity, selectedPoints } = this.state;\r\n\r\n if (selected.totalTicketQuantity && totalTicketQuantity != nextSelected.totalTicketQuantity)\r\n this.setState({ totalTicketQuantity: nextSelected.totalTicketQuantity });\r\n if (selected.clubCardPoints && selectedPoints != nextSelected.clubCardPoints)\r\n this.setState({ selectedPoints: nextSelected.clubCardPoints });\r\n }\r\n\r\n canIncrementTotalQuantity() {\r\n let { totalTicketQuantity } = this.state;\r\n const { order } = this.props;\r\n const newTotal = totalTicketQuantity + 1;\r\n return newTotal <= Math.max(order.buyMax, order.reserveMax);\r\n }\r\n\r\n incrementTotalQuantity() {\r\n let { totalTicketQuantity } = this.state;\r\n this.setState({ totalTicketQuantity: ++totalTicketQuantity })\r\n }\r\n\r\n decrementTotalQuantity() {\r\n let { totalTicketQuantity } = this.state;\r\n if (totalTicketQuantity > 0) {\r\n this.setState({ totalTicketQuantity: --totalTicketQuantity })\r\n }\r\n }\r\n\r\n canIncrementTotalPoints(incrementBy) {\r\n const { selectedPoints } = this.state;\r\n const { order } = this.props;\r\n const newTotal = selectedPoints + incrementBy;\r\n const canIncrement = newTotal <= order.clubCard.points;\r\n if (canIncrement) this.setState({ selectedPoints: newTotal });;\r\n return canIncrement;\r\n }\r\n\r\n generateTickets() {\r\n const { order, ticketQuantityChanged, bioDkActive, freeSeats, appLocale, discountEnabled } = this.props;\r\n const selected = order.selected;\r\n let selectedIdsHandled = [];\r\n let tickets = [];\r\n\r\n _.forEach(order.availableTickets, (available) => {\r\n const selectedTicket = _.find(selected.tickets, (ticket) => { return available.id === ticket.id; });\r\n if (selectedTicket != null) selectedIdsHandled.push(selectedTicket.id);\r\n\r\n tickets.push(
);\r\n });\r\n\r\n //Checking if there have been added other selected tickets that are not in available tickets, such as biografklub dk\r\n if (bioDkActive && selectedIdsHandled.length < selected.tickets.length) {\r\n _.forEach(selected.tickets, (ticket) => {\r\n const existing = _.find(selectedIdsHandled, (id) => { return id === ticket.id });\r\n if (!existing) {\r\n tickets.push(
\r\n
{ticket.name} \r\n
{ticket.quantity}
\r\n
)\r\n }\r\n });\r\n }\r\n\r\n return tickets;\r\n }\r\n\r\n getVoucherText() {\r\n const { configuration, order, appLocale } = this.props;\r\n if (!configuration.giftCardsEnabled && order.bioKlubDk.available)\r\n return
{LOCALE[appLocale].discountTextBioKlubDk} ;\r\n else if (configuration.giftCardsEnabled && !order.bioKlubDk.available)\r\n return
{LOCALE[appLocale].discountTextGiftCard} ;\r\n else if (configuration.giftCardsEnabled && order.bioKlubDk.available)\r\n return
{LOCALE[appLocale].discountTextBoth} ;\r\n else return null;\r\n }\r\n\r\n getLocationText() {\r\n const { configuration, locationId } = this.props;\r\n const locationText = _.find(configuration.locationTexts, (text) => { return text.id == locationId });\r\n return locationText ? locationText.text : null;\r\n }\r\n\r\n render() {\r\n const { initialFetchDone, discountEnabled, discountActivated, appLocale, submitDiscountCode, appHeightChanged } = this.props;\r\n const tickets = initialFetchDone ? this.generateTickets() : null;\r\n const voucherText = this.getVoucherText();\r\n const locationText = this.getLocationText();\r\n\r\n return (\r\n
\r\n {locationText ?
: null}\r\n {tickets}\r\n {!discountActivated && discountEnabled ?
\r\n
: null}\r\n
\r\n )\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport LOCALE from '../OrderLocale'\r\n\r\nexport default class SelectedSeats extends React.Component {\r\n\r\n extractRowsAndSeats() {\r\n const { hasNumberedSeats, selectedSeats, appLocale } = this.props;\r\n if (hasNumberedSeats) {\r\n return _.map(selectedSeats, (seatText, i) => {\r\n return
{seatText}
;\r\n });\r\n } else return LOCALE[appLocale].seatsUnNumbered;\r\n }\r\n\r\n render() {\r\n const { label } = this.props;\r\n const rowsAndSeats = this.extractRowsAndSeats();\r\n return (\r\n
\r\n
{label} \r\n
{rowsAndSeats}
\r\n
\r\n )\r\n }\r\n}","import React from 'react'\r\nimport LOCALE from '../OrderLocale'\r\n\r\nconst SeatColors = ({ showReservedAsRed, appLocale }) => {\r\n return showReservedAsRed ?\r\n
\r\n
\r\n :\r\n
\r\n
; \r\n}\r\n\r\nexport default SeatColors","import React from 'react'\r\nimport _ from 'lodash'\r\nimport SelectedSeats from './SelectedSeats'\r\nimport SeatColors from './SeatColors'\r\nimport LOCALE from '../OrderLocale'\r\n\r\nexport default class SeatSelection extends React.Component {\r\n constructor() {\r\n super();\r\n this.selectedSeatsChanged = this.selectedSeatsChanged.bind(this);\r\n }\r\n\r\n selectedSeatsChanged(e) {\r\n const { selected, moveSeats, setError, appLocale } = this.props;\r\n\r\n if (selected.tickets.length > 0) {\r\n setError('');\r\n const target = e.target;\r\n const boundingClientRect = target.getBoundingClientRect();\r\n let x = (e.pageX - boundingClientRect.left) - window.pageXOffset;\r\n let y = (e.pageY - boundingClientRect.top) - window.pageYOffset;\r\n\r\n if (target.naturalWidth != target.width) {\r\n x = x * target.naturalWidth / target.width;\r\n y = y * target.naturalHeight / target.height;\r\n }\r\n moveSeats(selected.transactionId, parseInt(x), parseInt(y));\r\n } else setError(LOCALE[appLocale].chooseSeats);\r\n }\r\n\r\n render() {\r\n const { showtime, seatsImage, selected, configuration, error, showReceiptData, receipt, appLocale } = this.props;\r\n const seatsImageClass = selected.tickets.length === 0 && !selected.vouchers.active ? 'dim' : 'fade-in';\r\n const errorMessage = error ?
{error}
: null;\r\n \r\n const seats = showReceiptData ? receipt.seatTexts : selected.seatTexts;\r\n const prefix = selected.seats.length == 0 ? null : (selected.seats.length > 1 ? LOCALE[appLocale].multiSeats : LOCALE[appLocale].oneSeat);\r\n\r\n return (\r\n
\r\n {errorMessage}\r\n {showtime.hasNumberedSeats ?\r\n
\r\n
\r\n
\r\n
\r\n
\r\n :
\r\n }\r\n
\r\n )\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\n\r\nexport default class Info extends React.Component {\r\n constructor() {\r\n super();\r\n this.state = { show: false };\r\n this.close = this.close.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n setTimeout(() => { this.setState({ show: true }); }, 0) // css transition workaround\r\n\r\n const body = document.querySelector('body');\r\n body.classList.add('no-scroll');\r\n }\r\n\r\n close() {\r\n const { canClose } = this.props;\r\n if (canClose) {\r\n const body = document.querySelector('body');\r\n body.classList.remove('no-scroll');\r\n\r\n this.setState({ show: false });\r\n }\r\n }\r\n\r\n render() {\r\n const { show } = this.state;\r\n const { title, text, buttons } = this.props;\r\n\r\n return (\r\n
\r\n
\r\n
{title} \r\n
') }} />\r\n
{buttons}
\r\n
\r\n
\r\n )\r\n }\r\n}","import './order.scss'\r\nimport React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport { bindActionCreators } from 'redux'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport CONSTANTS from '../orderflow-constants'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\nimport { APP_MODES } from '../../../api/api-constants'\r\nimport * as orderActions from '../../../actions/order-actions'\r\nimport * as gaActions from '../../../actions/ga-actions'\r\nimport { appHeightChanged } from '../../../actions/app-actions'\r\nimport AvailableTickets from './ticketselection/AvailableTickets'\r\nimport SeatSelection from './seatselection/SeatSelection'\r\nimport LOCALE from './OrderLocale'\r\nimport Info from '../../overlays/Info'\r\n\r\nclass OrderContainer extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n error: '',\r\n canReserveSelected: true,\r\n canBuySelected: true,\r\n showInfoBox: false\r\n };\r\n props.actions.calculateTotalPrice();\r\n this.ticketQuantityChanged = this.ticketQuantityChanged.bind(this);\r\n this.submitDiscountCode = this.submitDiscountCode.bind(this);\r\n this.navBack = this.navBack.bind(this)\r\n this.navNext = this.navNext.bind(this);\r\n this.setError = this.setError.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n const { actions, iframeId } = this.props; \r\n\r\n if (window.parent != window) actions.appHeightChanged(iframeId, true);\r\n else window.scrollTo(0, 0);\r\n\r\n this.checkAndUpdateReserveAndBuy();\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n if (!this.props.order.isFetching && this.props.selected.totalTicketQuantity != null)\r\n this.checkAndUpdateReserveAndBuy();\r\n\r\n if (this.props.showInfoBox != nextProps.showInfoBox) {\r\n this.setState({ showInfoBox: nextProps.showInfoBox });\r\n }\r\n }\r\n\r\n ticketQuantityChanged(id, quantity) {\r\n this.setError('');\r\n const { actions, showtime, selected } = this.props;\r\n let selectedTickets = [...selected.tickets];\r\n const existingTicket = _.find(selectedTickets, (ticket) => { return id === ticket.id; });\r\n if (existingTicket) {\r\n if (quantity > 0) existingTicket.quantity = quantity;\r\n else _.remove(selectedTickets, (ticket) => { return ticket.id === existingTicket.id });\r\n } else selectedTickets.push({ id, quantity });\r\n\r\n this.checkAndUpdateReserveAndBuy();\r\n actions.ticketQuantityChanged(showtime.id, selected.transactionId, selectedTickets, selected.vouchers);\r\n }\r\n\r\n submitDiscountCode(discountCode) {\r\n const { showtime, clubCardId, actions } = this.props;\r\n actions.getAvailableTicketsAndExtraPurchases(showtime.id, clubCardId, discountCode);\r\n }\r\n\r\n setError(message) {\r\n this.setState({ error: message });\r\n }\r\n\r\n navBack(e) {\r\n const { organizerId, history, actions } = this.props;\r\n actions.resetOrder();\r\n const page = e.target.dataset.navTo;\r\n history.push(`${page}?org=${organizerId}`);\r\n }\r\n\r\n navNext(e) {\r\n const { organizerId, showtime, order, selected, actions, history, appLocale, bioKlubDkAvailable } = this.props;\r\n const { canReserveSelected, canBuySelected } = this.state;\r\n if (selected.tickets.length > 0) {\r\n const orderType = e.target.id;\r\n\r\n if (orderType === CONSTANTS.orderTypes.reserve && (!this.canReserveNow() || !canReserveSelected))\r\n order.clubCard ? this.setError(LOCALE[appLocale].noReserveClubCard) : this.setError(LOCALE[appLocale].noReserve);\r\n else if (orderType === CONSTANTS.orderTypes.buy && (!this.canBuyNow() || !canBuySelected))\r\n this.setError(LOCALE[appLocale].noBuy);\r\n else {\r\n actions.gaTrackCheckoutStep(1);\r\n actions.orderTypeChanged(orderType);\r\n if (e.target.dataset.buyBioKlubDk && bioKlubDkAvailable) history.push(`${ROUTES.ORDERFLOW.BIOKLUB_DK}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n else history.push(`${ROUTES.ORDERFLOW.EXTRA_PURCHASES}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n }\r\n } else this.setError(LOCALE[appLocale].chooseTickets);\r\n }\r\n\r\n canReserveNow() {\r\n const { showtime } = this.props;\r\n const datetimeNow = moment();\r\n const isInsidePeriod = datetimeNow >= moment(showtime.reserveInfo.start) && datetimeNow <= moment(showtime.reserveInfo.end);\r\n return showtime.reserveInfo.enabled && isInsidePeriod;\r\n }\r\n\r\n canBuyNow() {\r\n const { showtime } = this.props;\r\n const datetimeNow = moment();\r\n const isInsidePeriod = datetimeNow >= moment(showtime.buyInfo.start) && datetimeNow <= moment(showtime.buyInfo.end);\r\n return showtime.buyInfo.enabled && isInsidePeriod;\r\n }\r\n\r\n checkAndUpdateReserveAndBuy() {\r\n const { order } = this.props;\r\n const canReserveTotalQuantity = order.selected.totalTicketQuantity <= order.reserveMax;\r\n const canBuyTotalQuantity = order.selected.totalTicketQuantity <= order.buyMax;\r\n let canReserveTicketQuantity = true, canBuyTicketQuantity = true;\r\n _.some(order.selected.tickets, function (selectedTicket) {\r\n const availableTicket = _.find(order.availableTickets, (available) => { return selectedTicket.id == available.id; });\r\n if (availableTicket) {\r\n canReserveTicketQuantity = availableTicket.canReserve !== false && selectedTicket.quantity <= availableTicket.reserveMax;\r\n canBuyTicketQuantity = availableTicket.canBuy !== false && selectedTicket.quantity <= availableTicket.buyMax;\r\n }\r\n });\r\n\r\n this.setState({\r\n canReserveSelected: canReserveTotalQuantity && canReserveTicketQuantity && !order.clubCard && order.canReserve,\r\n canBuySelected: canBuyTotalQuantity && canBuyTicketQuantity\r\n });\r\n }\r\n\r\n generateReserveButton(selected) {\r\n const { bioDkActive, appLocale, configuration, canReserve } = this.props;\r\n const { canReserveSelected } = this.state;\r\n let reserveClasses = canReserve && selected.tickets.length > 0 && canReserveSelected ? 'next green fade-in' : 'next green dim';\r\n if (configuration.openOrderInNewWindow) reserveClasses += ' no-top-margin';\r\n return !bioDkActive && this.canReserveNow() ?
: null;\r\n }\r\n\r\n generateBuyButton(selected) {\r\n const { canBuySelected } = this.state;\r\n const { appLocale, configuration } = this.props;\r\n let buyClasses = selected.tickets.length > 0 && canBuySelected ? 'next green fade-in' : 'next green dim';\r\n if (configuration.openOrderInNewWindow) buyClasses += ' no-top-margin';\r\n return this.canBuyNow() ?
: null;\r\n }\r\n\r\n generateBioKlubDkButton(selected) {\r\n const { canBuySelected } = this.state;\r\n const { appLocale, configuration } = this.props;\r\n let buyClasses = selected.tickets.length > 0 && canBuySelected ? 'next green fade-in' : 'next green dim';\r\n if (configuration.openOrderInNewWindow) buyClasses += ' no-top-margin';\r\n return this.canBuyNow() ?
: null;\r\n }\r\n\r\n generateBackButtons(configuration, showtime) {\r\n const { backTo, appLocale } = this.props;\r\n let backText = LOCALE[appLocale].backProgram;\r\n switch (backTo) {\r\n case ROUTES.PROGRAM:\r\n backText = LOCALE[appLocale].backProgram;\r\n break;\r\n case ROUTES.ALL_MOVIES:\r\n backText = LOCALE[appLocale].backAll;\r\n break;\r\n case ROUTES.FUTURE_MOVIES:\r\n backText = LOCALE[appLocale].backFuture;\r\n break;\r\n }\r\n\r\n const programButton = configuration.appMode !== APP_MODES.ORDERFLOW && configuration.appMode !== APP_MODES.MOVIE ?\r\n
: null;\r\n\r\n const movieButton = configuration.appMode !== APP_MODES.ORDERFLOW ?
: null;\r\n\r\n return
{programButton}{movieButton}
;\r\n }\r\n\r\n render() {\r\n const { showInfoBox } = this.state;\r\n const { showtime, order, selected, configuration, actions, bioDkActive, initialFetchDone, appLocale, discountEnabled, discountActivated, bioKlubDkAvailable } = this.props;\r\n const backButtons = !configuration.openOrderInNewWindow ? this.generateBackButtons(configuration, showtime) : null;\r\n const reserveButton = showtime ? this.generateReserveButton(selected) : null;\r\n const buyButton = showtime ? this.generateBuyButton(selected) : null;\r\n const buyBioKlubDkButton = showtime && bioKlubDkAvailable ? this.generateBioKlubDkButton(selected) : null;\r\n const disabled = !reserveButton && !buyButton ?
{LOCALE[appLocale].noOnlineOrder} : null;\r\n const navButtonClasses = configuration.bottomBarAllwaysVisible ? 'nav-buttons fixed' : 'nav-buttons';\r\n\r\n const seatSelection = showtime ?
: null;\r\n\r\n let infoText = '';\r\n if (showtime.info) infoText = showtime.info;\r\n else if (showInfoBox) infoText = LOCALE[appLocale].extraPurchasesReset;\r\n\r\n return (\r\n
\r\n {infoText ?
this.setState({ showInfoBox: false })} value=\"OK\" />} /> : null}\r\n\r\n \r\n
\r\n {seatSelection}\r\n
\r\n {backButtons}\r\n
\r\n {buyButton}\r\n {buyBioKlubDkButton}\r\n {reserveButton}\r\n
\r\n {disabled}\r\n
\r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n currentPage: ownProps.currentPage,\r\n organizerId: state.organizer.id,\r\n showtime: state.movielist.selectedShowtime,\r\n order: state.order,\r\n selected: state.order.selected,\r\n configuration: state.organizer.configuration,\r\n bioKlubDkAvailable: state.order.bioKlubDk.available,\r\n bioDkActive: state.order.selected.vouchers.active != '',\r\n backTo: state.movielist.backTo,\r\n initialFetchDone: state.order.initialFetchDone,\r\n appLocale: state.app.locale,\r\n discountEnabled: state.order.discountEnabled,\r\n discountActivated: state.order.discountActivated,\r\n clubCardId: state.user.clubCardId,\r\n canReserve: state.order.canReserve,\r\n showInfoBox: state.order.showInfoBox,\r\n iframeId: state.app.iframeId\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n actions: bindActionCreators(Object.assign({}, orderActions, gaActions, { appHeightChanged }), dispatch)\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(OrderContainer)","export function isValidPhone(number, minLength) {\r\n const regex = new RegExp(`^\\\\d{${minLength},}$`);\r\n return regex.test(number);\r\n}\r\n\r\nexport function isValidEmail(email) {\r\n const regex = /^([a-zA-Z0-9_\\.\\-])+\\@(([a-zA-Z0-9\\-])+\\.)+([a-zA-Z0-9]{2,4})+$/;\r\n return regex.test(email);\r\n}\r\n\r\nexport function isValidPassword(password) {\r\n const regex = /^[a-zA-Z0-9_.-]*$/;\r\n return regex.test(password) && password !== '';\r\n}\r\n\r\nexport function hasDecimals(number) {\r\n if (!isNaN(number)) return number % 1 != 0;\r\n else return false;\r\n}\r\n\r\nexport function withTwoDecimals(number) { return number.toFixed(2).replace('.', ',') }","import OrderFlowLocale from '../OrderFlowLocale'\r\n\r\nexport default {\r\n da: {\r\n ...OrderFlowLocale.da,\r\n customerInfo: 'Dine oplysninger',\r\n name: 'Navn',\r\n phone: 'Telefon',\r\n email: 'Email',\r\n repeatEmail: 'Gentag email',\r\n password: 'Opret kode',\r\n zipCode: 'Postnr.',\r\n note: 'Note',\r\n passwordReserveText: 'Hvis du ønsker at slette din bestilling senere',\r\n passwordBuyText: 'Koden skal bruges, hvis du ønsker at finde dit køb frem senere',\r\n rememberMe: 'Husk mig',\r\n smsReminder: 'Gratis SMS påmindelse',\r\n acceptConditions: 'Jeg accepterer
købsvilkårene for dette køb',\r\n\r\n errorName: 'Skal være udfyldt',\r\n errorPhone: 'Skal bestå af minimum INSERT_NUMBER tal',\r\n errorEmail: 'Skal være en gyldig email',\r\n errorRepeatEmail: 'De indtastede e-mails er ikke ens',\r\n errorPassword: 'Må kun indeholde bogstaver og tal',\r\n errorZipCode: 'Skal være et gyldigt post nummer',\r\n errorConditionsAccepted: 'Du skal acceptere købsvilkårene for at fortsætte'\r\n },\r\n\r\n en: {\r\n ...OrderFlowLocale.en,\r\n customerInfo: 'Your information',\r\n name: 'Name',\r\n phone: 'Phone',\r\n email: 'Email',\r\n repeatEmail: 'Repeat email',\r\n password: 'Add password',\r\n zipCode: 'Zip code',\r\n note: 'Note',\r\n passwordReserveText: 'If you wish to cancel your reservation later',\r\n passwordBuyText: 'The password is needed if you wish to find your purchase information later',\r\n rememberMe: 'Remember me',\r\n smsReminder: 'Free SMS reminder',\r\n acceptConditions: 'I accept the
purchase agreement for this order',\r\n\r\n errorName: 'Has to be filled out',\r\n errorPhone: 'Has to be minimum INSERT_NUMBER numbers',\r\n errorEmail: 'Has to be a valid email',\r\n errorRepeatEmail: 'The entered emails are not the same',\r\n errorPassword: 'Can only contain letters and numbers',\r\n errorZipCode: 'Has to be a valid zip code',\r\n errorConditionsAccepted: 'You have to accept the purchase agreement to continue'\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport * as validators from '../../../utilities/validation-utilities'\r\nimport LOCALE from './CustomerLocale'\r\nimport { ORGANIZER_TYPES } from '../../../api/api-constants';\r\n\r\nexport default class Customer extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const customer = props.customer;\r\n this.state = {\r\n isValid: {\r\n name: customer.name !== '',\r\n phone: validators.isValidPhone(customer.phone, props.configuration.phoneMinLength),\r\n email: validators.isValidEmail(customer.email),\r\n repeatEmail: validators.isValidEmail(customer.repeatEmail) && customer.email === customer.repeatEmail,\r\n password: validators.isValidPassword(customer.password),\r\n conditionsAccepted: customer.conditionsAccepted === true,\r\n zipCode: customer.zipCode !== ''\r\n },\r\n name: customer.name,\r\n phone: customer.phone,\r\n email: customer.email,\r\n repeatEmail: customer.repeatEmail,\r\n password: customer.password,\r\n smsReminder: customer.smsReminder == null ? props.configuration.smsReminder.checkedByDefault : customer.smsReminder,\r\n rememberMe: customer.rememberMe,\r\n conditionsAccepted: customer.conditionsAccepted,\r\n zipCode: customer.zipCode,\r\n note: customer.note\r\n }\r\n\r\n // Need this in customer store for reserve and book\r\n if (customer.smsReminder == null) props.actions.smsReminderChanged(props.configuration.smsReminder.checkedByDefault);\r\n if (customer.newsletters.length == 0 && props.configuration.newsletters.length > 0) props.actions.newsletterChanged(props.configuration.newsletters);\r\n //--\r\n\r\n this.nameChanged = this.nameChanged.bind(this);\r\n this.phoneChanged = this.phoneChanged.bind(this);\r\n this.emailChanged = this.emailChanged.bind(this);\r\n this.repeatEmailChanged = this.repeatEmailChanged.bind(this);\r\n this.passwordChanged = this.passwordChanged.bind(this);\r\n this.newsletterChanged = this.newsletterChanged.bind(this);\r\n this.smsReminderChanged = this.smsReminderChanged.bind(this);\r\n this.rememberMeChanged = this.rememberMeChanged.bind(this);\r\n this.customerChanged = this.customerChanged.bind(this);\r\n this.conditionsAcceptedChanged = this.conditionsAcceptedChanged.bind(this);\r\n this.zipCodeChanged = this.zipCodeChanged.bind(this);\r\n this.noteChanged = this.noteChanged.bind(this);\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n if (this.props.clubCardId) {\r\n const customer = nextProps.customer;\r\n this.setState({\r\n isValid: {\r\n name: customer.name !== '',\r\n phone: validators.isValidPhone(customer.phone, nextProps.configuration.phoneMinLength),\r\n email: validators.isValidEmail(customer.email),\r\n repeatEmail: validators.isValidEmail(customer.repeatEmail) && customer.email === customer.repeatEmail,\r\n conditionsAccepted: customer.conditionsAccepted === true,\r\n zipCode: customer.zipCode !== ''\r\n },\r\n name: customer.name,\r\n phone: customer.phone,\r\n email: customer.email,\r\n repeatEmail: customer.repeatEmail,\r\n conditionsAccepted: customer.conditionsAccepted,\r\n zipCode: customer.zipCode,\r\n note: customer.note\r\n });\r\n }\r\n }\r\n\r\n customerChanged() {\r\n const customer = this.state;\r\n this.props.actions.customerChanged({\r\n name: customer.name,\r\n phone: customer.phone,\r\n email: customer.email,\r\n repeatEmail: customer.repeatEmail,\r\n password: customer.password,\r\n zipCode: customer.zipCode,\r\n note: customer.note\r\n });\r\n }\r\n\r\n nameChanged(e) {\r\n const name = e.target.value;\r\n const isValid = name !== '';\r\n this.setState({ name, isValid: { ...this.state.isValid, name: isValid } });\r\n }\r\n\r\n phoneChanged(e) {\r\n const { configuration } = this.props;\r\n let phone = e.target.value;\r\n phone = this.numbersOnly(phone);\r\n\r\n const isValid = validators.isValidPhone(phone, configuration.phoneMinLength);\r\n this.setState({ phone, isValid: { ...this.state.isValid, phone: isValid } });\r\n }\r\n\r\n numbersOnly(input) {\r\n const nonNumericRegex = /[^0-9]+/g;\r\n input = input.replace(nonNumericRegex, '');\r\n return input;\r\n }\r\n\r\n emailChanged(e) {\r\n const email = e.target.value;\r\n const isValid = validators.isValidEmail(email);\r\n const repeatEmail = this.state.repeatEmail;\r\n const repeatEmailIsValid = validators.isValidEmail(repeatEmail) && email === repeatEmail;\r\n this.setState({ email, isValid: { ...this.state.isValid, email: isValid, repeatEmail: repeatEmailIsValid } });\r\n }\r\n\r\n repeatEmailChanged(e) {\r\n const repeatEmail = e.target.value;\r\n const isValid = validators.isValidEmail(repeatEmail) && this.state.email === repeatEmail;\r\n this.setState({ repeatEmail, isValid: { ...this.state.isValid, repeatEmail: isValid } });\r\n }\r\n\r\n passwordChanged(e) {\r\n const password = e.target.value;\r\n const isValid = validators.isValidPassword(password);\r\n this.setState({ password, isValid: { ...this.state.isValid, password: isValid } });\r\n }\r\n\r\n newsletterChanged(e) {\r\n const id = e.target.id;\r\n const checked = e.target.checked;\r\n const { customer, configuration, actions } = this.props;\r\n const newsletters = customer.newsletters.length > 0 ? customer.newsletters : configuration.newsletters;\r\n const letter = _.find(newsletters, (letter) => { return letter.id == id });\r\n letter.checked = checked;\r\n actions.newsletterChanged(newsletters);\r\n }\r\n\r\n smsReminderChanged(e) {\r\n const checked = e.target.checked;\r\n this.setState({ smsReminder: checked });\r\n this.props.actions.smsReminderChanged(checked);\r\n }\r\n\r\n rememberMeChanged(e) {\r\n const checked = e.target.checked;\r\n this.setState({ rememberMe: checked });\r\n this.props.actions.rememberMeChanged(checked);\r\n }\r\n\r\n conditionsAcceptedChanged(e) {\r\n const checked = e.target.checked;\r\n const isValid = checked === true;\r\n this.setState({ conditionsAccepted: checked, isValid: { ...this.state.isValid, conditionsAccepted: isValid } });\r\n this.props.actions.conditionsAcceptedChanged(checked);\r\n }\r\n\r\n zipCodeChanged(e) {\r\n let zipCode = e.target.value;\r\n zipCode = this.numbersOnly(zipCode);\r\n const isValid = zipCode !== '';\r\n this.setState({ zipCode, isValid: { ...this.state.isValid, zipCode: isValid } });\r\n }\r\n\r\n noteChanged(e) {\r\n const note = e.target.value;\r\n this.setState({ note });\r\n }\r\n\r\n generateNewsletters(newsletters) {\r\n const { customer } = this.props;\r\n return _.map(newsletters, (newsletter) => {\r\n if (newsletter.enabled) {\r\n const remembered = _.find(customer.newsletters, (letter) => { return newsletter.id == letter.id });\r\n return
\r\n }\r\n });\r\n }\r\n\r\n generatePasswordInput() {\r\n const { configuration, isReserve, errors, clubCardId, appLocale } = this.props;\r\n const { password, isValid } = this.state;\r\n\r\n return configuration.customerPasswordEnabled && !clubCardId ?
\r\n
{LOCALE[appLocale].password} \r\n
\r\n
{isReserve ? LOCALE[appLocale].passwordReserveText : LOCALE[appLocale].passwordBuyText}
\r\n
{!isValid.password ? errors.password : ''}
\r\n
: null;\r\n }\r\n\r\n generateCircusInputs() {\r\n const { appLocale, errors } = this.props;\r\n const { isValid, zipCode, note } = this.state;\r\n\r\n return
\r\n
\r\n
{LOCALE[appLocale].zipCode} \r\n
\r\n
{!isValid.zipCode ? errors.zipCode : ''}
\r\n
\r\n
\r\n {LOCALE[appLocale].note}
\r\n
\r\n }\r\n\r\n render() {\r\n const { configuration, isReserve, errors, clubCardId, appLocale, organizerType } = this.props;\r\n const { name, phone, email, repeatEmail, isValid, smsReminder, rememberMe, conditionsAccepted } = this.state;\r\n\r\n const passwordTextBox = this.generatePasswordInput();\r\n const newsletterCheckboxes = configuration.newsletters.length > 0 && !clubCardId ? this.generateNewsletters(configuration.newsletters) : null;\r\n const smsReminderCheckbox = configuration.smsReminder.enabled && isReserve ?
: null;\r\n const newsletterGdpr = newsletterCheckboxes && configuration.gdprTexts.newsletters && !clubCardId ?
: null;\r\n const rememberMeCheckbox = !clubCardId ?
: null;\r\n\r\n const circusTextBoxes = organizerType == ORGANIZER_TYPES.CIRCUS ? this.generateCircusInputs() : null;\r\n\r\n return (\r\n
\r\n
{LOCALE[appLocale].customerInfo} \r\n
\r\n
{LOCALE[appLocale].name} \r\n
\r\n
{!isValid.name ? errors.name : ''}
\r\n
\r\n
\r\n
{LOCALE[appLocale].phone} \r\n
\r\n
{!isValid.phone ? errors.phone : ''}
\r\n
\r\n
\r\n
{LOCALE[appLocale].email} \r\n
\r\n
{!isValid.email ? errors.email : ''}
\r\n
\r\n {configuration.repeatEmail ?
\r\n
{LOCALE[appLocale].repeatEmail} \r\n
\r\n
{!isValid.repeatEmail ? errors.repeatEmail : ''}
\r\n
: null}\r\n {passwordTextBox}\r\n {circusTextBoxes}\r\n\r\n
\r\n
\r\n {rememberMeCheckbox}\r\n {smsReminderCheckbox}\r\n {newsletterCheckboxes}\r\n
\r\n {newsletterGdpr}\r\n\r\n {!isReserve ?
\r\n
\r\n \r\n
{!isValid.conditionsAccepted ? errors.conditionsAccepted : ''}
\r\n
: null}\r\n
\r\n
\r\n )\r\n }\r\n}","import './customer.scss'\r\nimport React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport { bindActionCreators } from 'redux'\r\nimport _ from 'lodash'\r\nimport * as orderActions from '../../../actions/order-actions'\r\nimport * as customerActions from '../../../actions/customer-actions'\r\nimport * as gaActions from '../../../actions/ga-actions'\r\nimport * as validators from '../../../utilities/validation-utilities'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\nimport CONSTANTS from '../orderflow-constants'\r\nimport Customer from './Customer'\r\nimport LOCALE from './CustomerLocale'\r\nimport { ORGANIZER_TYPES } from '../../../api/api-constants';\r\nimport { appHeightChanged } from '../../../actions/app-actions'\r\n\r\nclass CustomerContainer extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n errors: {\r\n name: '',\r\n phone: '',\r\n email: '',\r\n repeatEmail: '',\r\n password: '',\r\n conditionsAccepted: '',\r\n zipCode: ''\r\n },\r\n }\r\n\r\n props.actions.gaTrackCheckoutStep(2);\r\n this.navBack = this.navBack.bind(this);\r\n this.navNext = this.navNext.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n const { actions, iframeId } = this.props;\r\n if (window.parent != window) actions.appHeightChanged(iframeId, true);\r\n else window.scrollTo(0, 0);\r\n }\r\n\r\n navBack() {\r\n const { customer, history, actions, clubCardId } = this.props;\r\n if (customer.rememberMe === true && !clubCardId) actions.updateCustomerLocalStorage();\r\n history.goBack();\r\n }\r\n\r\n navNext(e) {\r\n const id = e.target.id;\r\n const { organizerId, actions, transactionId, customer, showtime, clubCardId, totalPrice, history } = this.props;\r\n if (customer.rememberMe === true && !clubCardId) actions.updateCustomerLocalStorage();\r\n\r\n if (this.customerIsValid(id) === true) {\r\n if (id === CONSTANTS.orderTypes.reserve) {\r\n actions.reserve(transactionId, customer)\r\n .then((result) => { if (!result.error) { history.push(`${ROUTES.ORDERFLOW.RECEIPT}/${showtime.movieId}/${showtime.id}?org=${organizerId}`); } });\r\n } else if (totalPrice === 0) {\r\n actions.preBook(transactionId, customer).then((result) => {\r\n if (!result.error) {\r\n actions.book(transactionId, customer, 'Free', result.dibs.parameters.orderid, totalPrice, null)\r\n .then((result) => { if (!result.error) history.push(`${ROUTES.ORDERFLOW.RECEIPT}/${showtime.movieId}/${showtime.id}?org=${organizerId}`) });\r\n }\r\n });\r\n } else history.push(`${ROUTES.ORDERFLOW.PAYMENT}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n }\r\n }\r\n\r\n customerIsValid(orderType) {\r\n const isReserve = orderType === CONSTANTS.orderTypes.reserve\r\n const { customer, configuration, appLocale, organizerType } = this.props;\r\n const nameIsValid = customer.name !== '',\r\n phoneIsValid = validators.isValidPhone(customer.phone, configuration.phoneMinLength),\r\n emailIsValid = validators.isValidEmail(customer.email),\r\n repeatEmailIsValid = configuration.repeatEmail ? validators.isValidEmail(customer.repeatEmail) && customer.email === customer.repeatEmail : true,\r\n passwordIsValid = !configuration.customerPasswordEnabled ? true : validators.isValidPassword(customer.password),\r\n conditionsAccepted = !isReserve ? customer.conditionsAccepted === true : true, //only check for buy\r\n zipCodeIsValid = organizerType == ORGANIZER_TYPES.CIRCUS ? customer.zipCode !== '' : true; //only for circus\r\n\r\n const errors = {\r\n name: !nameIsValid ? LOCALE[appLocale].errorName : '',\r\n phone: !phoneIsValid ? LOCALE[appLocale].errorPhone.replace('INSERT_NUMBER', configuration.phoneMinLength) : '',\r\n email: !emailIsValid ? LOCALE[appLocale].errorEmail : '',\r\n repeatEmail: !repeatEmailIsValid ? LOCALE[appLocale].errorRepeatEmail : '',\r\n password: !passwordIsValid ? LOCALE[appLocale].errorPassword : '',\r\n conditionsAccepted: !isReserve && !conditionsAccepted ? LOCALE[appLocale].errorConditionsAccepted : '',\r\n zipCode: !zipCodeIsValid ? LOCALE[appLocale].errorZipCode : ''\r\n }\r\n\r\n\r\n this.setState({ errors });\r\n return nameIsValid && phoneIsValid && emailIsValid && repeatEmailIsValid && passwordIsValid && conditionsAccepted && zipCodeIsValid;\r\n }\r\n\r\n render() {\r\n const { orderType, configuration, customer, actions, clubCardId, appLocale, organizerType } = this.props;\r\n const { errors } = this.state;\r\n\r\n\r\n const nextButton = orderType === CONSTANTS.orderTypes.buy || orderType === CONSTANTS.orderTypes.buyReservation ?\r\n
:\r\n
;\r\n\r\n const gdprText = orderType !== CONSTANTS.orderTypes.reserve ?
:\r\n
;\r\n\r\n return (\r\n
\r\n
\r\n\r\n {gdprText}\r\n\r\n
\r\n
\r\n
\r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n //TODO make this an action like calculateTotalPrice and store in state\r\n const totalTicketPrice = state.order.selected.totalTicketPrice;\r\n const totalExtraPurchasesPrice = state.order.selected.totalExtraPurchasesPrice;\r\n const priceBeforeFees = totalTicketPrice + totalExtraPurchasesPrice;\r\n const totalFees = state.order.selected.totalFees;\r\n const totalPrice = priceBeforeFees > 0 ? priceBeforeFees + totalFees : priceBeforeFees;\r\n //----\r\n\r\n return {\r\n organizerId: state.organizer.id,\r\n showtime: state.movielist.selectedShowtime,\r\n orderType: state.order.orderType,\r\n configuration: state.organizer.configuration,\r\n customer: state.customer,\r\n transactionId: state.order.selected.transactionId,\r\n receipt: state.receipt,\r\n clubCardId: state.user.clubCardId,\r\n totalPrice,\r\n appLocale: state.app.locale,\r\n organizerType: state.organizer.configuration.type,\r\n iframeId: state.app.iframeId\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n actions: bindActionCreators(Object.assign({}, orderActions, customerActions, gaActions, { appHeightChanged }), dispatch)\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(CustomerContainer)","import React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport { bindActionCreators } from 'redux'\r\nimport _ from 'lodash'\r\nimport { logTrace } from '../../../api/orderflow-api'\r\nimport { resetOrder } from '../../../actions/order-actions'\r\nimport { book } from '../../../actions/customer-actions'\r\nimport { gaTrackCheckoutStep } from '../../../actions/ga-actions'\r\nimport { getParams } from '../../../utilities/location-utilities'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\n\r\nclass DibsContainer extends React.Component {\r\n componentDidMount() {\r\n window.scrollTo(0, 0);\r\n const { checkoutComplete, customer, actions, history, sessionState, showtime, organizerId, transactionId } = this.props;\r\n actions.gaTrackCheckoutStep(3);\r\n\r\n const querystrings = getParams();\r\n\r\n //new dibs transaction\r\n if (!querystrings.cancel && !querystrings.orderid && !_.isEmpty(customer.dibs.parameters) && document.dibsform) {\r\n localStorage.setItem('beforeDibsState', JSON.stringify(sessionState));\r\n const message = `transactionId: ${transactionId}, orgId: ${organizerId}, customer email: ${customer.email}, customer phone: ${customer.phone}`;\r\n logTrace('DibsContainer - NEW TRANSACTION', message);\r\n document.dibsform.submit();\r\n }\r\n\r\n // cancel dibs transaction\r\n else if (querystrings.cancel) {\r\n const message = `transactionId: ${transactionId}, orgId: ${organizerId}, customer email: ${customer.email}, customer phone: ${customer.phone}`;\r\n logTrace('DibsContainer - CANCEL TRANSACTION', message);\r\n localStorage.removeItem('beforeDibsState');\r\n actions.resetOrder();\r\n window.location.href = `${ROUTES.ORDERFLOW.TICKETS}/${showtime.movieId}/${showtime.id}?org=${organizerId}`;\r\n }\r\n\r\n // complete dibs transaction\r\n else if (checkoutComplete) {\r\n const message = `transactionId: ${transactionId}, orderId: ${querystrings.orderid}, dibs transact: ${querystrings.transact}, orgId: ${organizerId}, customer email: ${customer.email}, customer phone: ${customer.phone}, payType: ${querystrings.paytype}`;\r\n logTrace('DibsContainer - COMPLETED TRANSACTION', message);\r\n localStorage.removeItem('beforeDibsState');\r\n history.push(`${ROUTES.ORDERFLOW.RECEIPT}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n }\r\n }\r\n\r\n generateInputs(dibs) {\r\n const { showtime, organizerId } = this.props;\r\n const callback = window.location.origin + `/dibs/${showtime.movieId}/${showtime.id}?org=${organizerId}`;\r\n let inputs = _.map(dibs.parameters, function (value, key) { return
});\r\n inputs.push(
);\r\n inputs.push(
);\r\n inputs.push(
);\r\n return inputs;\r\n }\r\n\r\n render() {\r\n const dibs = this.props.customer.dibs;\r\n const inputs = this.generateInputs(dibs);\r\n const form = dibs.url && inputs ?
: null;\r\n return (\r\n
\r\n {form}\r\n
\r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n organizerId: state.organizer.id,\r\n showtime: state.movielist.selectedShowtime,\r\n customer: state.customer,\r\n transactionId: state.order.selected.transactionId,\r\n checkoutComplete: state.customer.checkoutComplete,\r\n\r\n //for session storage after dibs payment on seperate page\r\n sessionState: {\r\n organizer: state.organizer,\r\n movielist: {\r\n selectedMovie: { ...state.movielist.selectedMovie, versions: [] },\r\n selectedShowtime: state.movielist.selectedShowtime\r\n },\r\n order: { ...state.order, seatsImage: null },\r\n customer: state.customer,\r\n user: state.user,\r\n }\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n actions: bindActionCreators({ book, gaTrackCheckoutStep, resetOrder }, dispatch)\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(DibsContainer)","import fetch from 'isomorphic-fetch'\r\nimport _ from 'lodash'\r\n\r\nexport default {\r\n fetchSessionId\r\n}\r\n\r\nasync function fetchSessionId(apiKey, reepayObject) { \r\n return await fetch('https://checkout-api.reepay.com/v1/session/charge', {\r\n method: 'POST',\r\n headers: {\r\n 'Authorization': `Basic ${apiKey}`,\r\n 'Content-Type': 'application/json'\r\n },\r\n body: JSON.stringify(reepayObject)\r\n }).then(response => {\r\n if (response.ok) return response.json();\r\n else throw response\r\n });\r\n}","import React from 'react'\r\nimport { connect } from 'react-redux'\r\nimport { bindActionCreators } from 'redux'\r\nimport _ from 'lodash'\r\nimport api from '../../../api/reepay-api'\r\nimport { logTrace } from '../../../api/orderflow-api'\r\nimport { resetOrder } from '../../../actions/order-actions'\r\nimport { preBook, book } from '../../../actions/customer-actions'\r\nimport { gaTrackCheckoutStep } from '../../../actions/ga-actions'\r\nimport { getParams } from '../../../utilities/location-utilities'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\nimport { SITE_TYPES } from '../../../api/api-constants'\r\n\r\nclass ReepayContainer extends React.Component {\r\n constructor() {\r\n super();\r\n this.state = { error: '' }\r\n }\r\n\r\n componentDidMount() {\r\n window.scrollTo(0, 0);\r\n const { iframeId, siteType, customer, actions, history, sessionState, showtime, organizerId, transactionId, checkoutComplete, origin, paymentMethods } = this.props;\r\n actions.gaTrackCheckoutStep(3);\r\n\r\n const querystrings = getParams();\r\n\r\n //new reepay transaction\r\n if (!querystrings.cancel && !querystrings.invoice) {\r\n localStorage.setItem('beforeDibsState', JSON.stringify(sessionState));\r\n const message = `transactionId: ${transactionId}, orgId: ${organizerId}, customer email: ${customer.email}, customer phone: ${customer.phone}`;\r\n logTrace('ReepayContainer - NEW TRANSACTION', message);\r\n\r\n //TODO make an action\r\n actions.preBook(transactionId, customer).then((result) => {\r\n if (!result.error) {\r\n const preBook = result.dibs.parameters;\r\n const type = siteType ? `&sitetype=${siteType}` : '';\r\n let callback = window.location.origin + `/reepay/${showtime.movieId}/${showtime.id}?org=${organizerId}&amount=${preBook.amount}&iframeid=${iframeId}${type}`; //Book skal bruge amount..!\r\n let acceptUrl = callback + '&accept=true';\r\n let cancelUrl = callback + '&cancel=true';\r\n\r\n if (siteType == SITE_TYPES.UMBRACO && origin) {\r\n const base64Url = btoa(callback);\r\n acceptUrl = `${origin}/reepay-landing-page/?iframeid=${iframeId}&iframeurl=${base64Url}`;\r\n cancelUrl = `${origin}/reepay-landing-page/?cancel=true&iframeid=${iframeId}&iframeurl=${base64Url}`;\r\n }\r\n\r\n const reepayObject = {\r\n order: {\r\n handle: preBook.orderid,\r\n customer: {\r\n first_name: customer.name,\r\n phone: customer.phone,\r\n email: customer.email\r\n },\r\n amount: preBook.amount,\r\n metadata: {\r\n showtimeId: showtime.id,\r\n movieId: showtime.movieId,\r\n organizerId: showtime.organizerId,\r\n iframeUrl: callback\r\n },\r\n },\r\n accept_url: acceptUrl,\r\n cancel_url: cancelUrl\r\n };\r\n\r\n if (paymentMethods)\r\n reepayObject.payment_methods = _.split(paymentMethods, ',');\r\n\r\n logTrace('REEPAY - SESSION ID REQUEST', JSON.stringify(reepayObject));\r\n api.fetchSessionId(btoa(preBook.merchant), reepayObject).then((session) => {\r\n logTrace('REEPAY - SESSION ID SUCCESS', session.id);\r\n if (siteType == SITE_TYPES.UMBRACO && window.parent != window) { \r\n console.log('[CHILD] Start Reepay! Posting to parent: ');\r\n console.log({ iframeId, sessionId: session.id });\r\n\r\n window.parent.postMessage({\r\n iframeId: iframeId,\r\n reepay: {\r\n sessionId: session.id\r\n }\r\n }, '*');\r\n } else {\r\n new window.Reepay.WindowCheckout(session.id);\r\n }\r\n });\r\n }\r\n });\r\n }\r\n\r\n // cancel reepay transaction\r\n if (querystrings.cancel) {\r\n const message = `transactionId: ${transactionId}, orgId: ${organizerId}, customer email: ${customer.email}, customer phone: ${customer.phone}`;\r\n logTrace('ReepayContainer - CANCEL TRANSACTION', message);\r\n localStorage.removeItem('beforeDibsState');\r\n actions.resetOrder();\r\n history.push(`${ROUTES.ORDERFLOW.TICKETS}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n }\r\n\r\n // complete reepay transaction\r\n else if (checkoutComplete) {\r\n const message = `transactionId: ${transactionId}, orderId: ${querystrings.invoice}, reepay sessionId: ${querystrings.id}, orgId: ${organizerId}, customer email: ${customer.email}, customer phone: ${customer.phone}`;\r\n logTrace('ReepayContainer - COMPLETED TRANSACTION', message);\r\n localStorage.removeItem('beforeDibsState');\r\n history.push(`${ROUTES.ORDERFLOW.RECEIPT}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n }\r\n }\r\n\r\n render() {\r\n const { error } = this.state;\r\n return (\r\n
\r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n organizerId: state.organizer.id,\r\n showtime: state.movielist.selectedShowtime,\r\n customer: state.customer,\r\n transactionId: state.order.selected.transactionId,\r\n checkoutComplete: state.customer.checkoutComplete,\r\n iframeId: state.app.iframeId,\r\n siteType: state.app.siteType,\r\n origin: state.app.origin,\r\n paymentMethods: state.organizer.configuration.paymentMethods,\r\n\r\n //for session storage after reepay payment on seperate page\r\n sessionState: {\r\n organizer: state.organizer,\r\n movielist: {\r\n selectedMovie: { ...state.movielist.selectedMovie, versions: [] },\r\n selectedShowtime: state.movielist.selectedShowtime\r\n },\r\n order: { ...state.order, seatsImage: null },\r\n customer: state.customer,\r\n user: state.user\r\n }\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n actions: bindActionCreators({ preBook, book, gaTrackCheckoutStep, resetOrder }, dispatch)\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(ReepayContainer)","export default {\r\n da: {\r\n startOver: 'Start forfra',\r\n reservationSuccess: 'Reservation gennemført på',\r\n purchaseSuccess: 'Køb gennemført på',\r\n name: 'Navn',\r\n email: 'Email',\r\n print: 'Print',\r\n reserve: 'Reserver',\r\n buy: 'Køb',\r\n delete: 'Afbestil',\r\n deleteText: 'Ønsker du at afbestille reservationen?',\r\n deletedText: 'Din reservation er afbestilt',\r\n confirm: 'Ja',\r\n cancel: 'Nej',\r\n pickUp: 'Afhentes'\r\n },\r\n\r\n en: {\r\n startOver: 'Start over',\r\n reservationSuccess: 'Reservation completed on',\r\n purchaseSuccess: 'Purchase completed on',\r\n name: 'Name',\r\n email: 'Email',\r\n print: 'Print',\r\n reserve: 'Reserve',\r\n buy: 'Buy',\r\n delete: 'Cancel',\r\n deleteText: 'Do you wish to cancel your reservation?',\r\n deletedText: 'Your reservation is cancelled',\r\n confirm: 'Yes',\r\n cancel: 'No',\r\n pickUp: 'Pick up'\r\n }\r\n}","import React from 'react'\r\nimport _ from 'lodash'\r\nimport moment from 'moment'\r\nimport { isiPhone } from '../../../utilities/location-utilities'\r\nimport SelectedSeats from '../order/seatselection/SelectedSeats'\r\nimport Info from '../../overlays/Info'\r\nimport { ROUTES } from '../../navigation/route-constants'\r\nimport CONSTANTS from '../orderflow-constants'\r\nimport LOCALE from './ReceiptLocale'\r\nimport { ORGANIZER_TYPES } from '../../../api/api-constants';\r\n\r\nexport default class Reservation extends React.Component {\r\n timeout = 300000;\r\n timer = null;\r\n\r\n constructor() {\r\n super()\r\n this.state = {\r\n deactivateButtons: false,\r\n showDeleteConfirm: false\r\n }\r\n\r\n this.handleTimeout = this.handleTimeout.bind(this);\r\n this.activateReservation = this.activateReservation.bind(this);\r\n this.deleteReservation = this.deleteReservation.bind(this);\r\n this.deleteConfirmResult = this.deleteConfirmResult.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n this.timer = setTimeout(this.handleTimeout, this.timeout);\r\n }\r\n\r\n componentWillUnmount() {\r\n clearTimeout(this.timer);\r\n }\r\n\r\n handleTimeout() {\r\n this.setState({ deactivateButtons: true });\r\n }\r\n\r\n activateReservation() {\r\n const { actions, receipt } = this.props;\r\n if (receipt.activated) this.navigateAfterActivate();\r\n else actions.activateReservation(receipt.id).then(() => this.navigateAfterActivate());\r\n }\r\n\r\n navigateAfterActivate() {\r\n const { actions, history, showtime, organizerId } = this.props;\r\n actions.orderTypeChanged(CONSTANTS.orderTypes.buyReservation);\r\n history.push(`${ROUTES.ORDERFLOW.EXTRA_PURCHASES}/${showtime.movieId}/${showtime.id}?org=${organizerId}`);\r\n }\r\n\r\n deleteReservation() {\r\n this.setState({ showDeleteConfirm: true });\r\n }\r\n\r\n deleteConfirmResult(e) {\r\n if (e.target.id === 'delete') {\r\n const { actions, receipt } = this.props;\r\n actions.deleteReservation(receipt.id, receipt.customer.phone, receipt.customer.password).then(() => {\r\n actions.gaDeleteReservation();\r\n this.setState({ showDeleteConfirm: false });\r\n });\r\n } else this.setState({ showDeleteConfirm: false });\r\n }\r\n\r\n generateButtons() {\r\n const { appLocale } = this.props;\r\n const { deactivateButtons } = this.state;\r\n const printBtn = !isiPhone() ?
: null;\r\n const buyButton = this.generateBuyButton();\r\n return
\r\n
;\r\n }\r\n\r\n generateBuyButton() {\r\n const { showtime, appLocale } = this.props;\r\n const { deactivateButtons } = this.state;\r\n const datetimeNow = moment();\r\n const isInsidePeriod = datetimeNow >= moment(showtime.buyInfo.start) && datetimeNow <= moment(showtime.buyInfo.end);\r\n const canBuy = showtime.buyInfo.enabled && isInsidePeriod;\r\n return canBuy ?
: null;\r\n }\r\n\r\n generateDeleteConfirmOverlay() {\r\n const { appLocale } = this.props;\r\n const { showDeleteConfirm } = this.state;\r\n return showDeleteConfirm ?\r\n
\r\n \r\n {loginTopBar}\r\n {user}\r\n {loginOverlay}\r\n
\r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n\r\n return {\r\n clubCard: state.order.clubCard,\r\n availableClubCard: state.organizer.configuration.clubCard\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n actions: bindActionCreators(userActions, dispatch)\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(ClubCardContainer)","import React from 'react'\r\nimport _ from 'lodash'\r\n\r\nexport default class QuantitySelector extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n id: props.id,\r\n quantity: props.quantity\r\n };\r\n this.increment = this.increment.bind(this);\r\n this.decrement = this.decrement.bind(this);\r\n }\r\n\r\n debounceMultipleClicks = _.debounce((quantity) => {\r\n const { quantityChanged } = this.props;\r\n const { id } = this.state;\r\n quantityChanged(id, quantity);\r\n }, 400)\r\n\r\n canIncrement(quantity) {\r\n const { extra, canIncrementTotalPoints } = this.props;\r\n if (extra.points) return canIncrementTotalPoints(extra.points, quantity) && this.checkMaxQuantity(quantity);\r\n else return this.checkMaxQuantity(quantity);\r\n }\r\n\r\n increment() {\r\n let { quantity } = this.state;\r\n const newQuantity = quantity + 1;\r\n if (this.canIncrement(newQuantity)) {\r\n this.setState({ quantity: newQuantity });\r\n this.debounceMultipleClicks(newQuantity);\r\n }\r\n }\r\n\r\n decrement() {\r\n let { quantity } = this.state;\r\n if (quantity > 0) {\r\n this.setState({ quantity: --quantity });\r\n this.debounceMultipleClicks(quantity);\r\n }\r\n }\r\n\r\n checkMaxQuantity(quantity) {\r\n const { maxQuantity } = this.props;\r\n return maxQuantity === 0 || maxQuantity > 0 && quantity < maxQuantity;\r\n }\r\n\r\n render() {\r\n const { clubCard, extra, isFetching } = this.props;\r\n const { quantity } = this.state;\r\n const decrementClasses = !isFetching && quantity > 0 ? 'decrement' : 'decrement deactivated';\r\n let incrementClasses = !isFetching && this.checkMaxQuantity(quantity) ? 'increment' : 'increment deactivated';\r\n if (clubCard && extra.points > clubCard.remainingPoints) incrementClasses = 'increment deactivated';\r\n\r\n return (\r\n