1
0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2025-02-20 14:54:15 +01:00

use the cart directive in training reservation

This commit is contained in:
Sylvain 2017-02-22 16:45:13 +01:00
parent dbc5d8836d
commit 1959856235
6 changed files with 211 additions and 681 deletions

View File

@ -508,6 +508,7 @@ Application.Controllers.controller "ReserveMachineController", ["$scope", "$stat
$scope.ctrl.member.subscribed_plan = angular.copy($scope.selectedPlan)
Auth._currentUser.subscribed_plan = angular.copy($scope.selectedPlan)
$scope.plansAreShown = false
$scope.selectedPlan = null
refetchCalendar()

View File

@ -109,59 +109,138 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
groupObj.plans.push(plan) if plan.group_id == group.id
$scope.plansClassifiedByGroup.push(groupObj)
## mapping of fullCalendar events.
$scope.events =
reserved: [] # Slots that the user wants to book
modifiable: null # Slot that the user wants to change
placable: null # Destination slot for the change
paid: [] # Slots that were just booked by the user (transaction ok)
moved: null # Slots that were just moved by the user (change done) -> {newSlot:* oldSlot: *}
## the moment when the slot selection changed for the last time, used to trigger changes in the cart
$scope.selectionTime = null
## the last clicked event in the calender
$scope.selectedEvent = null
## indicates the state of the current view : calendar or plans information
$scope.plansAreShown = false
## indicates if the selected training was validated (ie. added to the shopping cart)
$scope.trainingIsValid = false
## contains the selected training once it was payed, allows to display a firendly end-of-shopping message
$scope.paidTraining = null
## will store the user's plan if he choosed to buy one
$scope.selectedPlan = null
## fullCalendar event. Training slot that the user want to book
$scope.selectedTraining = null
## fullCalendar event. An already booked slot that the user want to modify
$scope.slotToModify = null
## Once a training reservation was modified, will contains {newReservedSlot:{}, oldReservedSlot:{}}
$scope.modifiedSlots = null
## the moment when the plan selection changed for the last time, used to trigger changes in the cart
$scope.planSelectionTime = null
## Selected training unless 'all' trainings are displayed
$scope.training = trainingPromise
## Discount coupon to apply to the basket, if any
$scope.coupon =
applied: null
## Total price of the cart, that the user will pay
$scope.amountTotal = 0
## Total amount of the elements in the cart, without considering any coupon
$scope.totalNoCoupon = 0
## fullCalendar (v2) configuration
$scope.calendarConfig = CalendarConfig
minTime: moment.duration(moment(settingsPromise.booking_window_start).format('HH:mm:ss'))
maxTime: moment.duration(moment(settingsPromise.booking_window_end).format('HH:mm:ss'))
eventClick: (event, jsEvent, view) ->
calendarEventClickCb(event, jsEvent, view)
eventAfterAllRender: (view)->
$scope.events = uiCalendarConfig.calendars.calendar.fullCalendar 'clientEvents'
eventRender: (event, element, view) ->
eventRenderCb(event, element, view)
## Custom settings
## Application global settings
$scope.settings = settingsPromise
## Global config: message to the end user concerning the subscriptions rules
$scope.subscriptionExplicationsAlert = settingsPromise.subscription_explications_alert
## Global config: message to the end user concerning the training reservation
$scope.trainingExplicationsAlert = settingsPromise.training_explications_alert
## Global config: message to the end user giving advice about the training reservation
$scope.trainingInformationMessage = settingsPromise.training_information_message
$scope.enableBookingMove = (settingsPromise.booking_move_enable == "true")
$scope.moveBookingDelay = parseInt(settingsPromise.booking_move_delay)
$scope.enableBookingCancel = (settingsPromise.booking_cancel_enable == "true")
$scope.cancelBookingDelay = parseInt(settingsPromise.booking_cancel_delay)
##
# Change the last selected slot's appearence to looks like 'added to cart'
##
$scope.markSlotAsAdded = ->
$scope.selectedEvent.backgroundColor = SELECTED_EVENT_BG_COLOR
updateCalendar()
##
# Change the last selected slot's appearence to looks like 'never added to cart'
##
$scope.markSlotAsRemoved = (slot) ->
slot.backgroundColor = 'white'
slot.title = slot.training.name
slot.borderColor = FREE_SLOT_BORDER_COLOR
slot.slot_id = null
slot.isValid = false
slot.is_reserved = false
slot.can_modify = false
slot.offered = false
slot.is_completed = false if slot.is_completed
updateCalendar()
##
# Change the last selected slot's appearence to looks like 'currently looking for a new destination to exchange'
##
$scope.markSlotAsModifying = ->
$scope.selectedEvent.backgroundColor = '#eee'
$scope.selectedEvent.title = $scope.selectedEvent.training.name + ' - ' + _t('i_change')
updateCalendar()
##
# Change the last selected slot's appearence to looks like 'the slot being exchanged will take this place'
##
$scope.changeModifyTrainingSlot = ->
if $scope.events.placable
$scope.events.placable.backgroundColor = 'white'
$scope.events.placable.title = $scope.events.placable.training.name
if !$scope.events.placable or $scope.events.placable._id != $scope.selectedEvent._id
$scope.selectedEvent.backgroundColor = '#bbb'
$scope.selectedEvent.title = $scope.selectedEvent.training.name + ' - ' + _t('i_shift')
updateCalendar()
##
# When modifying an already booked reservation, callback when the modification was successfully done.
##
$scope.modifyTrainingSlot = ->
$scope.events.placable.title = if $scope.currentUser.role isnt 'admin' then $scope.events.placable.training.name + " - " + _t('i_ve_reserved') else $scope.events.placable.training.name
$scope.events.placable.backgroundColor = 'white'
$scope.events.placable.borderColor = $scope.events.modifiable.borderColor
$scope.events.placable.slot_id = $scope.events.modifiable.slot_id
$scope.events.placable.is_reserved = true
$scope.events.placable.can_modify = true
$scope.events.modifiable.backgroundColor = 'white'
$scope.events.modifiable.title = $scope.events.modifiable.training.name
$scope.events.modifiable.borderColor = FREE_SLOT_BORDER_COLOR
$scope.events.modifiable.slot_id = null
$scope.events.modifiable.is_reserved = false
$scope.events.modifiable.can_modify = false
$scope.events.modifiable.is_completed = false if $scope.events.modifiable.is_completed
updateCalendar()
##
# Cancel the current booking modification, reseting the whole process
##
$scope.cancelModifyTrainingSlot = ->
if $scope.events.placable
$scope.events.placable.backgroundColor = 'white'
$scope.events.placable.title = $scope.events.placable.training.name
$scope.events.modifiable.title = if $scope.currentUser.role isnt 'admin' then $scope.events.modifiable.training.name + " - " + _t('i_ve_reserved') else $scope.events.modifiable.training.name
$scope.events.modifiable.backgroundColor = 'white'
updateCalendar()
@ -175,65 +254,14 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
$scope.ctrl.member = member
Availability.trainings {trainingId: $stateParams.id, member_id: $scope.ctrl.member.id}, (trainings) ->
uiCalendarConfig.calendars.calendar.fullCalendar 'removeEvents'
$scope.eventSources.push
$scope.eventSources.splice(0, 1,
events: trainings
textColor: 'black'
$scope.trainingIsValid = false
$scope.paidTraining = null
$scope.plansAreShown = false
)
# as the events are re-fetched for the new user, we must re-init the cart
$scope.events.reserved = []
$scope.selectedPlan = null
$scope.selectedTraining = null
$scope.slotToModify = null
$scope.modifiedSlots = null
##
# Callback to mark the selected training as validated (add it to the shopping cart).
##
$scope.validTraining = ->
$scope.trainingIsValid = true
$scope.updatePrices()
##
# Remove the training from the shopping cart
# @param e {Object} see https://docs.angularjs.org/guide/expression#-event-
##
$scope.removeTraining = (e) ->
e.preventDefault()
$scope.selectedTraining.backgroundColor = 'white'
$scope.selectedTraining = null
$scope.plansAreShown = false
$scope.selectedPlan = null
$scope.trainingIsValid = false
$timeout ->
uiCalendarConfig.calendars.fullCalendar 'refetchEvents'
uiCalendarConfig.calendars.fullCalendar 'rerenderEvents'
##
# Validates the shopping chart and redirect the user to the payment step
##
$scope.payTraining = ->
# first, we check that a user was selected
if Object.keys($scope.ctrl.member).length > 0
reservation = mkReservation($scope.ctrl.member, $scope.selectedTraining, $scope.selectedPlan)
Wallet.getWalletByUser {user_id: $scope.ctrl.member.id}, (wallet) ->
amountToPay = helpers.getAmountToPay($scope.amountTotal, wallet.amount)
if $scope.currentUser.role isnt 'admin' and amountToPay > 0
payByStripe(reservation)
else
if $scope.currentUser.role is 'admin' or amountToPay is 0
payOnSite(reservation)
else
# otherwise we alert, this error musn't occur when the current user is not admin
growl.error(_t('please_select_a_member_first'))
@ -242,17 +270,12 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
# @param plan {Object} the plan to subscribe
##
$scope.selectPlan = (plan) ->
if $scope.isAuthenticated()
if $scope.selectedPlan != plan
$scope.selectedPlan = plan
$scope.updatePrices()
else
$scope.selectedPlan = null
$scope.updatePrices()
$scope.planSelectionTime = new Date()
# toggle selected plan
if $scope.selectedPlan != plan
$scope.selectedPlan = plan
else
$scope.login null, ->
$scope.selectedPlan = plan
$scope.updatePrices()
$scope.selectedPlan = null
@ -264,7 +287,8 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
e.preventDefault()
$scope.plansAreShown = false
$scope.selectedPlan = null
$scope.updatePrices()
##
# Switch the user's view from the reservation agenda to the plan subscription
@ -272,96 +296,35 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
$scope.showPlans = ->
$scope.plansAreShown = true
##
# Cancel the current booking modification, removing the previously booked slot from the selection
# @param e {Object} see https://docs.angularjs.org/guide/expression#-event-
##
$scope.removeSlotToModify = (e) ->
e.preventDefault()
if $scope.slotToPlace
$scope.slotToPlace.backgroundColor = 'white'
$scope.slotToPlace.title = $scope.slotToPlace.training.name
$scope.slotToPlace = null
$scope.slotToModify.title = if $scope.currentUser.role isnt 'admin' then $scope.slotToModify.training.name + " - " + _t('i_ve_reserved') else $scope.slotToModify.training.name
$scope.slotToModify.backgroundColor = 'white'
$scope.slotToModify = null
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
##
# When modifying an already booked reservation, cancel the choice of the new slot
# @param e {Object} see https://docs.angularjs.org/guide/expression#-event-
# Once the reservation is booked (payment process successfully completed), change the event style
# in fullCalendar, update the user's subscription and free-credits if needed
# @param reservation {Object}
##
$scope.removeSlotToPlace = (e)->
e.preventDefault()
$scope.slotToPlace.backgroundColor = 'white'
$scope.slotToPlace.title = $scope.slotToPlace.training.name
$scope.slotToPlace = null
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
$scope.afterPayment = (reservation)->
$scope.events.paid[0].backgroundColor = 'white'
$scope.events.paid[0].is_reserved = true
$scope.events.paid[0].can_modify = true
updateTrainingSlotId($scope.events.paid[0], reservation)
$scope.events.paid[0].borderColor = '#b2e774'
$scope.events.paid[0].title = $scope.events.paid[0].training.name + " - " + _t('i_ve_reserved')
if $scope.selectedPlan
$scope.ctrl.member.subscribed_plan = angular.copy($scope.selectedPlan)
Auth._currentUser.subscribed_plan = angular.copy($scope.selectedPlan)
$scope.plansAreShown = false
$scope.selectedPlan = null
$scope.ctrl.member.training_credits = angular.copy(reservation.user.training_credits)
$scope.ctrl.member.machine_credits = angular.copy(reservation.user.machine_credits)
Auth._currentUser.training_credits = angular.copy(reservation.user.training_credits)
Auth._currentUser.machine_credits = angular.copy(reservation.user.machine_credits)
##
# When modifying an already booked reservation, confirm the modification.
##
$scope.modifyTrainingSlot = ->
Slot.update {id: $scope.slotToModify.slot_id},
slot:
start_at: $scope.slotToPlace.start
end_at: $scope.slotToPlace.end
availability_id: $scope.slotToPlace.id
, -> # success
$scope.modifiedSlots =
newReservedSlot: $scope.slotToPlace
oldReservedSlot: $scope.slotToModify
$scope.slotToPlace.title = if $scope.currentUser.role isnt 'admin' then $scope.slotToPlace.training.name + " - " + _t('i_ve_reserved') else $scope.slotToPlace.training.name
$scope.slotToPlace.backgroundColor = 'white'
$scope.slotToPlace.borderColor = $scope.slotToModify.borderColor
$scope.slotToPlace.slot_id = $scope.slotToModify.slot_id
$scope.slotToPlace.is_reserved = true
$scope.slotToPlace.can_modify = true
$scope.slotToPlace = null
$scope.slotToModify.backgroundColor = 'white'
$scope.slotToModify.title = $scope.slotToModify.training.name
$scope.slotToModify.borderColor = FREE_SLOT_BORDER_COLOR
$scope.slotToModify.slot_id = null
$scope.slotToModify.is_reserved = false
$scope.slotToModify.can_modify = false
$scope.slotToModify.is_completed = false if $scope.slotToModify.is_completed
$scope.slotToModify = null
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
, -> # failure
growl.error('an_error_occured_preventing_the_booked_slot_from_being_modified')
##
# Cancel the current booking modification, reseting the whole process
##
$scope.cancelModifyTrainingSlot = ->
$scope.slotToPlace.backgroundColor = 'white'
$scope.slotToPlace.title = $scope.slotToPlace.training.name
$scope.slotToPlace = null
$scope.slotToModify.title = if $scope.currentUser.role isnt 'admin' then $scope.slotToModify.training.name + " - " + _t('i_ve_reserved') else $scope.slotToModify.training.name
$scope.slotToModify.backgroundColor = 'white'
$scope.slotToModify = null
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
##
# Update the prices, based on the current selection
##
$scope.updatePrices = ->
if Object.keys($scope.ctrl.member).length > 0
r = mkReservation($scope.ctrl.member, $scope.selectedTraining, $scope.selectedPlan)
Price.compute mkRequestParams(r, $scope.coupon.applied), (res) ->
$scope.amountTotal = res.price
$scope.totalNoCoupon = res.price_without_coupon
else
$scope.amountTotal = null
refetchCalendar()
@ -375,51 +338,6 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
Member.get id: $scope.currentUser.id, (member) ->
$scope.ctrl.member = member
# watch when a coupon is applied to re-compute the total price
$scope.$watch 'coupon.applied', (newValue, oldValue) ->
unless newValue == null and oldValue == null
$scope.updatePrices()
##
# Create an hash map implementing the Reservation specs
# @param member {Object} User as retreived from the API: current user / selected user if current is admin
# @param training {Object} fullCalendar event: training slot selected on the calendar
# @param [plan] {Object} Plan as retrived from the API: plan to buy with the current reservation
# @return {{user_id:Number, reservable_id:Number, reservable_type:String, slots_attributes:Array<Object>, plan_id:Number|null}}
##
mkReservation = (member, training, plan = null) ->
reservation =
user_id: member.id
reservable_id: training.training.id
reservable_type: 'Training'
slots_attributes: []
plan_id: (plan.id if plan)
reservation.slots_attributes.push
start_at: training.start
end_at: training.end
availability_id: training.id
offered: training.offered || false
reservation
##
# Format the parameters expected by /api/prices/compute or /api/reservations and return the resulting object
# @param reservation {Object} as returned by mkReservation()
# @param coupon {Object} Coupon as returned from the API
# @return {{reservation:Object, coupon_code:string}}
##
mkRequestParams = (reservation, coupon) ->
params =
reservation: reservation
coupon_code: (coupon.code if coupon)
params
##
@ -430,308 +348,24 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
# @see http://fullcalendar.io/docs/mouse/eventClick/
##
calendarEventClickCb = (event, jsEvent, view) ->
if $scope.ctrl.member
# reserve a training if this training will not be reserved and is not about to move and not is completed
if !event.is_reserved && !$scope.slotToModify && !event.is_completed
if event != $scope.selectedTraining
$scope.selectedTraining = event
$scope.selectedTraining.offered = false
event.backgroundColor = SELECTED_EVENT_BG_COLOR
computeTrainingAmount($scope.selectedTraining)
else
$scope.selectedTraining = null
event.backgroundColor = 'white'
$scope.trainingIsValid = false
$scope.paidTraining = null
$scope.selectedPlan = null
$scope.modifiedSlots = null
# clean all others events background
angular.forEach $scope.events, (e)->
if event.id != e.id
e.backgroundColor = 'white'
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
# two if below for move training reserved
# if training isnt reserved and have a training to modify and same training and not complete
else if !event.is_reserved && $scope.slotToModify && slotCanBePlaced(event)
if $scope.slotToPlace
$scope.slotToPlace.backgroundColor = 'white'
$scope.slotToPlace.title = event.training.name
$scope.slotToPlace = event
event.backgroundColor = '#bbb'
event.title = event.training.name + ' - ' + _t('i_shift')
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
# if training reserved can modify
else if event.is_reserved and (slotCanBeModified(event) or slotCanBeCanceled(event)) and !$scope.slotToModify and !$scope.selectedTraining
event.movable = slotCanBeModified(event)
event.cancelable = slotCanBeCanceled(event)
if $scope.currentUser.role is 'admin'
event.user =
name: $scope.ctrl.member.name
dialogs.confirm
templateUrl: '<%= asset_path "shared/confirm_modify_slot_modal.html" %>'
resolve:
object: -> event
, (type) -> # success
if type == 'move'
$scope.modifiedSlots = null
$scope.slotToModify = event
event.backgroundColor = '#eee'
event.title = event.training.name + ' - ' + _t('i_change')
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
else if type == 'cancel'
dialogs.confirm
resolve:
object: ->
title: _t('confirmation_required')
msg: _t('do_you_really_want_to_cancel_this_reservation')
, -> # cancel confirmed
Slot.cancel {id: event.slot_id}, -> # successfully canceled
growl.success _t('reservation_was_successfully_cancelled')
$scope.canceledSlot = event
$scope.canceledSlot.backgroundColor = 'white'
$scope.canceledSlot.title = event.training.name
$scope.canceledSlot.borderColor = FREE_SLOT_BORDER_COLOR
$scope.canceledSlot.slot_id = null
$scope.canceledSlot.is_reserved = false
$scope.canceledSlot.can_modify = false
$scope.canceledSlot.is_completed = false if event.is_completed
$scope.canceledSlot = null
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
, -> # error while canceling
growl.error _t('cancellation_failed')
, -> # canceled
$scope.paidMachineSlots = null
$scope.selectedPlan = null
$scope.modifiedSlots = null
$scope.selectedEvent = event
$scope.selectionTime = new Date()
##
# When events are rendered, adds attributes for popover and compile
# Triggered when fullCalendar tries to graphicaly render an event block.
# Append the event tag into the block, just after the event title.
# @see http://fullcalendar.io/docs/event_rendering/eventRender/
##
eventRenderCb = (event, element, view)->
# Comment these codes for show a popup of description, because we add feature page of training
#element.attr(
# 'uib-popover': $filter('humanize')($filter('simpleText')(event.training.description), 70)
# 'popover-trigger': 'mouseenter'
#)
#$compile(element)($scope)
##
# Open a modal window that allows the user to process a credit card payment for his current shopping cart.
##
payByStripe = (reservation) ->
$uibModal.open
templateUrl: '<%= asset_path "stripe/payment_modal.html" %>'
size: 'md'
resolve:
reservation: ->
reservation
price: ->
Price.compute(mkRequestParams(reservation, $scope.coupon.applied)).$promise
wallet: ->
Wallet.getWalletByUser({user_id: reservation.user_id}).$promise
cgv: ->
CustomAsset.get({name: 'cgv-file'}).$promise
coupon: ->
$scope.coupon.applied
controller: ['$scope', '$uibModalInstance', '$state', 'reservation', 'price', 'wallet', 'cgv', 'Auth', 'Reservation', 'helpers', '$filter', 'coupon'
($scope, $uibModalInstance, $state, reservation, price, wallet, cgv, Auth, Reservation, helpers, $filter, coupon) ->
# User's wallet amount
$scope.walletAmount = wallet.amount
# Price
$scope.amount = helpers.getAmountToPay(price.price, wallet.amount)
# CGV
$scope.cgv = cgv.custom_asset
# Reservation
$scope.reservation = reservation
# Used in wallet info template to interpolate some translations
$scope.numberFilter = $filter('number')
##
# Callback to process the payment with Stripe, triggered on button click
##
$scope.payment = (status, response) ->
if response.error
growl.error(response.error.message)
else
$scope.attempting = true
$scope.reservation.card_token = response.id
Reservation.save mkRequestParams($scope.reservation, coupon), (reservation) ->
$uibModalInstance.close(reservation)
, (response)->
$scope.alerts = []
if response.data.card
$scope.alerts.push
msg: response.data.card[0]
type: 'danger'
else
$scope.alerts.push({msg: _t('a_problem_occured_during_the_payment_process_please_try_again_later'), type: 'danger' })
$scope.attempting = false
]
.result['finally'](null).then (reservation)->
afterPayment(reservation)
##
# Open a modal window that allows the user to process a local payment for his current shopping cart (admin only).
##
payOnSite = (reservation) ->
$uibModal.open
templateUrl: '<%= asset_path "shared/valid_reservation_modal.html" %>'
size: 'sm'
resolve:
reservation: ->
reservation
price: ->
Price.compute(mkRequestParams(reservation, $scope.coupon.applied)).$promise
wallet: ->
Wallet.getWalletByUser({user_id: reservation.user_id}).$promise
coupon: ->
$scope.coupon.applied
controller: ['$scope', '$uibModalInstance', '$state', '$filter', 'reservation', 'price', 'wallet', 'Auth', 'Reservation', 'helpers', 'coupon'
($scope, $uibModalInstance, $state, $filter, reservation, price, wallet, Auth, Reservation, helpers, coupon) ->
# User's wallet amount
$scope.walletAmount = wallet.amount
# Price
$scope.price = price.price
# price to pay
$scope.amount = helpers.getAmountToPay(price.price, wallet.amount)
# Reservation
$scope.reservation = reservation
# Used in wallet info template to interpolate some translations
$scope.numberFilter = $filter('number')
# Button label
if $scope.amount > 0
$scope.validButtonName = _t('confirm_payment_of_html', {ROLE:$scope.currentUser.role, AMOUNT:$filter('currency')($scope.amount)}, "messageformat")
else
if price.price > 0 and $scope.walletAmount == 0
$scope.validButtonName = _t('confirm_payment_of_html', {ROLE:$scope.currentUser.role, AMOUNT:$filter('currency')(price.price)}, "messageformat")
else
$scope.validButtonName = _t('confirm')
##
# Callback to process the local payment, triggered on button click
##
$scope.ok = ->
$scope.attempting = true
Reservation.save mkRequestParams($scope.reservation, coupon), (reservation) ->
$uibModalInstance.close(reservation)
$scope.attempting = true
, (response)->
$scope.alerts = []
$scope.alerts.push({msg: _t('a_problem_occured_during_the_payment_process_please_try_again_later'), type: 'danger' })
$scope.attempting = false
$scope.cancel = ->
$uibModalInstance.dismiss('cancel')
]
.result['finally'](null).then (reservation)->
afterPayment(reservation)
##
# Computes the training amount depending of the member's credit
# @param training {Object} training slot
##
computeTrainingAmount = (training)->
# first we check that a user was selected
if Object.keys($scope.ctrl.member).length > 0
r = mkReservation($scope.ctrl.member, training) # reservation without any Plan -> we get the training price
Price.compute mkRequestParams(r), (res) ->
$scope.selectedTrainingAmount = res.price
else
$scope.selectedTrainingAmount = null
##
# Once the reservation is booked (payment process successfully completed), change the event style
# in fullCalendar, update the user's subscription and free-credits if needed
# @param reservation {Object}
##
afterPayment = (reservation)->
$scope.paidTraining = $scope.selectedTraining
$scope.paidTraining.backgroundColor = 'white'
$scope.paidTraining.is_reserved = true
$scope.paidTraining.can_modify = true
updateTrainingSlotId($scope.paidTraining, reservation)
$scope.paidTraining.borderColor = '#b2e774'
$scope.paidTraining.title = $scope.paidTraining.training.name + " - " + _t('i_ve_reserved')
$scope.selectedTraining = null
$scope.trainingIsValid = false
$scope.coupon.applied = null
if $scope.selectedPlan
$scope.ctrl.member.subscribed_plan = angular.copy($scope.selectedPlan)
Auth._currentUser.subscribed_plan = angular.copy($scope.selectedPlan)
$scope.plansAreShown = false
$scope.selectedPlan = null
$scope.ctrl.member.training_credits = angular.copy(reservation.user.training_credits)
$scope.ctrl.member.machine_credits = angular.copy(reservation.user.machine_credits)
Auth._currentUser.training_credits = angular.copy(reservation.user.training_credits)
Auth._currentUser.machine_credits = angular.copy(reservation.user.machine_credits)
uiCalendarConfig.calendars.calendar.fullCalendar 'refetchEvents'
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
##
# Determines if the provided booked slot is able to be modified by the user.
# @param slot {Object} fullCalendar event object
##
slotCanBeModified = (slot)->
return true if $scope.currentUser.role is 'admin'
slotStart = moment(slot.start)
now = moment(new Date())
if slot.can_modify and $scope.enableBookingMove and slotStart.diff(now, "hours") >= $scope.moveBookingDelay
return true
else
return false
##
# Determines if the provided booked slot is able to be canceled by the user.
# @param slot {Object} fullCalendar event object
##
slotCanBeCanceled = (slot) ->
return true if $scope.currentUser.role is 'admin'
slotStart = moment(slot.start)
now = moment()
if slot.can_modify and $scope.enableBookingCancel and slotStart.diff(now, "hours") >= $scope.cancelBookingDelay
return true
else
return false
##
# For booking modifications, checks that the newly selected slot is valid
# @param slot {Object} fullCalendar event object
##
slotCanBePlaced = (slot)->
if slot.training.id == $scope.slotToModify.training.id and !slot.is_completed
return true
else
return false
if $scope.currentUser.role is 'admin' and event.tags.length > 0
html = ''
for tag in event.tags
html += "<span class='label label-success text-white' title='#{tag.name}'>#{tag.name}</span>"
element.find('.fc-time').append(html)
return
@ -748,7 +382,25 @@ Application.Controllers.controller "ReserveTrainingController", ["$scope", "$sta
## !!! MUST BE CALLED AT THE END of the controller
##
# Update the calendar's display to render the new attributes of the events
##
updateCalendar = ->
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
##
# Asynchronously fetch the events from the API and refresh the calendar's view with these new events
##
refetchCalendar = ->
$timeout ->
uiCalendarConfig.calendars.calendar.fullCalendar 'refetchEvents'
uiCalendarConfig.calendars.calendar.fullCalendar 'rerenderEvents'
## !!! MUST BE CALLED AT THE END of the controller
initialize()
]

View File

@ -210,8 +210,8 @@ Application.Directives.directive 'cart', [ '$rootScope', '$uibModal', 'dialogs',
slotSelectionChanged()
$scope.$watch 'user', (newValue, oldValue) ->
if newValue != oldValue
$scope.events.paid = []
slotSelectionChanged()
resetCartState()
updateCartPrice()
$scope.$watch 'planSelectionTime', (newValue, oldValue) ->
if newValue != oldValue
planSelectionChanged()
@ -232,7 +232,7 @@ Application.Directives.directive 'cart', [ '$rootScope', '$uibModal', 'dialogs',
# -> can be added to cart or removed if already present
index = $scope.events.reserved.indexOf($scope.slot)
if index == -1
if $scope.limitToOneSlot == 'true' and $scope.events.reserved[0]
if $scope.limitToOneSlot is 'true' and $scope.events.reserved[0]
# if we limit the number of slots in the cart to 1, and there is already
# a slot in the cart, we remove it before adding the new one
$scope.removeSlot($scope.events.reserved[0], 0)
@ -242,12 +242,8 @@ Application.Directives.directive 'cart', [ '$rootScope', '$uibModal', 'dialogs',
else
# slot is in the cart, remove it
$scope.removeSlot($scope.slot, index)
# in every cases, because a new reservation has started
# we reset the array of settled events, the selected plan and the coupon
$scope.events.paid = []
$scope.events.moved = null
$scope.selectedPlan = null
$scope.coupon.applied = null
# in every cases, because a new reservation has started, we reset the cart content
resetCartState()
# finally, we update the prices
updateCartPrice()
else if !$scope.slot.is_reserved && $scope.events.modifiable
@ -294,6 +290,17 @@ Application.Directives.directive 'cart', [ '$rootScope', '$uibModal', 'dialogs',
##
# Reset the parameters that may lead to a wrong price but leave the content (events added to cart)
##
resetCartState = ->
$scope.selectedPlan = null
$scope.coupon.applied = null
$scope.events.moved = null
$scope.events.paid = []
##
# Determines if the provided booked slot is able to be modified by the user.
# @param slot {Object} fullCalendar event object

View File

@ -509,7 +509,7 @@ angular.module('application.router', ['ui.router']).
translations: [ 'Translations', (Translations) ->
Translations.query(['app.logged.trainings_reserve', 'app.shared.plan_subscribe', 'app.shared.member_select',
'app.shared.stripe', 'app.shared.valid_reservation_modal', 'app.shared.confirm_modify_slot_modal',
'app.shared.wallet', 'app.shared.coupon_input']).$promise
'app.shared.wallet', 'app.shared.coupon_input', 'app.shared.cart']).$promise
]
# notifications
.state 'app.logged.notifications',

View File

@ -33,165 +33,34 @@
<div class="col-sm-12 col-md-12 col-lg-3">
<div class="text-center m-t">
</div>
<div ng-if="currentUser.role === 'admin'">
<select-member></select-member>
</div>
<div class="widget panel b-a m m-t-lg" ng-if="ctrl.member && !slotToModify && !modifiedSlots">
<div class="panel-heading b-b small">
<h3 translate>{{ 'summary' }}</h3>
</div>
<div class="widget-content no-bg auto wrapper" ng-show="!selectedTraining && !paidTraining">
<p class="font-felt fleche-left text-lg"><%= image_tag("fleche-left.png", class: 'fleche-left visible-lg') %>
{{ 'select_a_slot_in_the_calendar' | translate }}</p>
</div>
<div class="widget-content no-bg auto wrapper" ng-if="selectedTraining">
<div class="font-sbold m-b-sm " translate>{{ 'you_ve_just_selected_the_slot' }}</div>
<cart slot="selectedEvent"
slot-selection-time="selectionTime"
events="events"
user="ctrl.member"
mode-plans="plansAreShown"
plan="selectedPlan"
plan-selection-time="planSelectionTime"
settings="settings"
on-slot-added-to-cart="markSlotAsAdded"
on-slot-removed-from-cart="markSlotAsRemoved"
on-slot-start-to-modify="markSlotAsModifying"
on-slot-modify-success="modifyTrainingSlot"
on-slot-modify-cancel="cancelModifyTrainingSlot"
on-slot-modify-unselect="changeModifyTrainingSlot"
on-slot-cancel-success="markSlotAsRemoved"
after-payment="afterPayment"
reservable-id="{{training.id}}"
reservable-type="Training"
reservable-name="{{training.name}}"
limit-to-one-slot="true"></cart>
<div class="panel panel-default bg-light m-n">
<div class="panel-body">
<div class="font-sbold text-u-c">{{ 'datetime_to_time' | translate:{START_DATETIME:(selectedTraining.start | amDateFormat:'LLLL'), END_TIME:(selectedTraining.end | amDateFormat:'LT')} }}</div>
<div class="text-base">{{ 'training_cost_' | translate }} <span ng-class="{'text-blue': selectedTraining.training.amount == selectedTrainingAmount, 'red': selectedTraining.training.amount != selectedTrainingAmount}">{{selectedTrainingAmount | currency}}</span></div>
<div ng-show="currentUser.role == 'admin'" class="m-t">
<label for="offerSlot" class="control-label m-r" translate>{{ 'offer_this_training' }}</label>
<input bs-switch
ng-model="selectedTraining.offered"
id="offerSlot"
type="checkbox"
class="form-control"
switch-on-text="{{ 'yes' | translate }}"
switch-off-text="{{ 'no' | translate }}"
switch-animate="true"
switch-readonly="{{trainingIsValid}}"
ng-change="updatePrices()"/>
</div>
</div>
<div class="panel-footer no-padder">
<button class="btn btn-valid btn-warning btn-block text-u-c r-b" ng-click="validTraining()" ng-if="!trainingIsValid" translate>{{ 'confirm_this_slot' }}</button>
</div>
</div>
<div class="clear">
<a class="pull-right m-t-xs text-u-l" href="#" ng-click="removeTraining($event)" ng-if="trainingIsValid" translate>{{ 'remove_this_slot' }}</a>
</div>
<coupon show="trainingIsValid && (!plansIsShow || selectedPlan)" coupon="coupon.applied" user-id="{{ctrl.member.id}}" total="totalNoCoupon"></coupon>
<span ng-hide="fablabWithoutPlans">
<div ng-if="trainingIsValid && !ctrl.member.subscribed_plan" ng-show="!plansIsShow">
<p class="font-sbold text-base l-h-2x" translate>{{ 'to_benefit_from_attractive_prices_and_a_free_training' }}</p>
<div><button class="btn btn-warning-full rounded btn-block text-xs" ng-click="showPlans()" translate>{{ 'view_our_subscriptions' }}</button></div>
<p class="font-bold text-base text-u-c text-center m-b-xs">ou</p>
</div>
<div ng-if="selectedPlan">
<div class="m-t-md m-b-sm text-base">{{ 'you_ve_just_selected_a_' | translate }} <br> <span class="font-sbold" translate>{{ '_subscription' }}</span> :</div>
<div class="panel panel-default bg-light m-n">
<div class="panel-body m-b-md">
<div class="font-sbold text-u-c">{{ selectedPlan | humanReadablePlanName }}</div>
<div class="text-base">{{ 'subscription_cost' | translate }} <span class="text-blue">{{selectedPlan.amount | currency}}</span></div>
</div>
</div>
</div>
</span>
</div>
<div class="panel-footer no-padder" ng-if="selectedTraining">
<button class="btn btn-valid btn-info btn-block p-l btn-lg text-u-c r-b text-base" ng-click="payTraining()" ng-if="trainingIsValid && (!plansIsShow || selectedPlan)">{{ 'confirm_and_pay' | translate }} {{amountTotal | currency}}</button>
</div>
<div class="widget-content no-bg auto wrapper" ng-if="paidTraining">
<div class="m-t-md m-b-sm text-base">{{ 'you_have_settled_the_training' | translate }} <br> <span class="font-sbold">{{paidTraining.training.name}}</span> :
</div>
<div class="well well-warning m-t-sm">
<i class="font-sbold text-u-c">{{ 'datetime_to_time' | translate:{START_DATETIME:(paidTraining.start | amDateFormat:'LLLL'), END_TIME:(paidTraining.end | amDateFormat:'LT') } }} </i>
<div class="font-sbold">{{ 'training_cost_' | translate }} {{paidTraining.training.amount | currency}}</div>
</div>
<div ng-if="selectedPlan">
<div class="m-t-md m-b-sm text-base">{{ 'you_have_settled_a_' | translate }} <br> <span class="font-sbold" translate>{{ '_subscription' }}</span> :</div>
<div class="well well-warning m-t-sm">
<i class="font-sbold text-u-c">{{selectedPlan | humanReadablePlanName }}</i>
<div class="font-sbold">{{ 'subscription_cost' | translate }} {{selectedPlan.amount | currency}}</div>
</div>
</div>
<div class="m-t-md font-sbold">{{ 'total_' | translate }} {{amountTotal | currency}}</div>
<div class="alert alert-success" ng-if="ctrl.member.subscribed_plan">{{ 'thank_you_your_payment_has_been_successfully_registered' | translate }}<br>
{{ 'your_invoice_will_be_available_soon_from_your_' | translate }} <a ui-sref="app.logged.dashboard.invoices" translate>{{ 'dashboard' }}</a>
</div>
</div>
</div>
<div class="widget panel b-a m m-t-lg" ng-if="slotToModify || modifiedSlots">
<div class="panel-heading b-b small">
<h3 translate>{{ 'summary' }}</h3>
</div>
<div class="widget-content no-bg auto wrapper" ng-if="slotToModify">
<div class="font-sbold m-b-sm " translate>{{ 'i_want_to_change_the_following_reservation' }}</div>
<div class="panel panel-warning bg-yellow">
<div class="panel-body">
<div class="font-sbold text-u-c">{{ 'datetime_to_time' | translate:{START_DATETIME:(slotToModify.start | amDateFormat:'LLLL'), END_TIME:(slotToModify.end | amDateFormat:'LT') } }}</div>
</div>
<div class="clear"><a class="pull-right m-b-sm text-u-l ng-scope m-r-sm" href="#" ng-click="removeSlotToModify($event)" translate>{{ 'cancel_my_modification' }}</a></div>
</div>
<div class="widget-content no-bg">
<p class="font-felt fleche-left text-lg"><%= image_tag("fleche-left.png", class: 'fleche-left visible-lg') %>
{{ 'select_a_new_slot_in_the_calendar' | translate }}</p>
</div>
<div class="panel panel-info bg-info text-white" ng-if="slotToPlace">
<div class="panel-body">
<div class="font-sbold text-u-c">{{ 'datetime_to_time' | translate:{START_DATETIME:(slotToPlace.start | amDateFormat:'LLLL'), END_TIME:(slotToPlace.end | amDateFormat:'LT') } }}</div>
</div>
<div class="clear"><a class="pull-right m-b-sm text-u-l ng-scope m-r-sm" href="#" ng-click="removeSlotToPlace($event)" translate>{{ 'cancel_my_selection' }}</a></div>
</div>
</div>
<div class="panel-footer no-padder" ng-if="slotToModify && slotToPlace">
<button class="btn btn-invalid btn-default btn-block p-l btn-lg text-u-c r-n text-base" ng-click="cancelModifyTrainingSlot()" translate>{{ 'cancel' }}</button>
<div>
<button class="btn btn-valid btn-info btn-block p-l btn-lg text-u-c r-b text-base" ng-click="modifyTrainingSlot()" translate>{{ 'confirm_my_modification' }}</button>
</div>
</div>
<div class="widget-content no-bg auto wrapper" ng-if="modifiedSlots">
<div class="font-sbold m-b-sm " translate>{{ 'your_booking_slot_was_successfully_moved_from_' }}</div>
<div class="panel panel-default bg-light">
<div class="panel-body">
<div class="font-sbold text-u-c">{{ 'datetime_to_time' | translate:{START_DATETIME:(modifiedSlots.oldReservedSlot.start | amDateFormat:'LLLL'), END_TIME:(modifiedSlots.oldReservedSlot.end | amDateFormat:'LT') } }}</div>
</div>
</div>
<p class="text-center font-bold m-b-sm text-u-c" translate>{{ 'to_date' }}</p>
<div class="panel panel-success bg-success bg-light">
<div class="panel-body">
<div class="font-sbold text-u-c">{{ 'datetime_to_time' | translate:{START_DATETIME:(modifiedSlots.newReservedSlot.start | amDateFormat:'LLLL'), END_TIME:(modifiedSlots.newReservedSlot.end | amDateFormat:'LT') } }}</div>
</div>
</div>
</div>
</div>
<uib-alert type="info m">
<p class="text-sm font-bold">
<i class="fa fa-lightbulb-o"></i>

View File

@ -16,6 +16,7 @@ json.array!(@availabilities) do |a|
json.backgroundColor 'white'
json.can_modify a.can_modify
json.nb_total_places a.nb_total_places
json.availability_id a.trainings.first.id
json.training do
json.id a.trainings.first.id