107 lines
4.6 KiB
JavaScript
107 lines
4.6 KiB
JavaScript
var firstSeatLabel = 1;
|
|
|
|
$(document).ready(function() {
|
|
var $cart = $('#selected-seats'),
|
|
seatNumber = '',
|
|
$placeNumber = ('#sel-seat'),
|
|
$counter = $('#counter'),
|
|
$name = $('#studentName'),
|
|
$total = $('#total'),
|
|
sc = $('#seat-map').seatCharts({
|
|
map: [
|
|
'cccccc',
|
|
'_',
|
|
'cccccc',
|
|
'cccccc',
|
|
],
|
|
seats: {
|
|
h: {
|
|
price : 2500,
|
|
classes : 'student-class',
|
|
category: 'Student Seat'
|
|
},
|
|
},
|
|
naming : {
|
|
rows: ['1','','2','3'],
|
|
top : false,
|
|
getLabel : function (character, row, column) {
|
|
if (row == '1') {
|
|
return column;
|
|
} else if (row == '2') {
|
|
return column;
|
|
} else if (row == '3') {
|
|
return column;
|
|
}
|
|
},
|
|
},
|
|
legend : {
|
|
node : $('#legend'),
|
|
items : [
|
|
[ 'c', 'available', 'Dostępne miejsce'],
|
|
[ 'f', 'unavailable', 'Zajęte miejsce']
|
|
]
|
|
},
|
|
click: function () {
|
|
if (this.status() == 'available' && recalculateTotal(sc) < 1) {
|
|
//let's create a new <li> which we'll add to the cart items
|
|
$('<li> rząd '+ this.settings.row + ', miejsce '+this.settings.label+ ' <a href="#" class="cancel-cart-item">[cancel]</a></li>')
|
|
.attr('id', 'cart-item-'+this.settings.id)
|
|
.data('seatId', this.settings.id)
|
|
.appendTo($cart);
|
|
|
|
seatNumber = 'rząd: ' + this.settings.row + ' miejsce: ' + this.settings.label;
|
|
localStorage.setItem('myElement', seatNumber);
|
|
|
|
/*
|
|
* Lets update the counter and total
|
|
*
|
|
* .find function will not find the current seat, because it will change its stauts only after return
|
|
* 'selected'. This is why we have to add 1 to the length and the current seat price to the total.
|
|
*/
|
|
$counter.text(sc.find('selected').length+1);
|
|
$total.text(recalculateTotal(sc)+1);
|
|
|
|
return 'selected';
|
|
} else if (this.status() == 'selected') {
|
|
//update the counter
|
|
$counter.text(sc.find('selected').length-1);
|
|
//and total
|
|
$total.text(recalculateTotal(sc)-1);
|
|
|
|
//remove the item from our cart
|
|
$('#cart-item-'+this.settings.id).remove();
|
|
$('#item-'+this.settings.id).remove();
|
|
|
|
//seat has been vacated
|
|
return 'available';
|
|
} else if (this.status() == 'unavailable') {
|
|
//seat has been already booked
|
|
return 'unavailable';
|
|
} else {
|
|
return this.style();
|
|
}
|
|
}
|
|
});
|
|
|
|
|
|
//this will handle "[cancel]" link clicks
|
|
$('#selected-seats').on('click', '.cancel-cart-item', function () {
|
|
//let's just trigger Click event on the appropriate seat, so we don't have to repeat the logic here
|
|
sc.get($(this).parents('li:first').data('seatId')).click();
|
|
});
|
|
|
|
//let's pretend some seats have already been booked
|
|
//sc.get(['1_2', '4_1', '7_1', '7_2']).status('unavailable');
|
|
|
|
});
|
|
|
|
function recalculateTotal(sc) {
|
|
var total = 0;
|
|
|
|
//basically find every selected seat and sum its price
|
|
sc.find('selected').each(function () {
|
|
total += 1;//this.data().price;
|
|
});
|
|
|
|
return total;
|
|
} |