FullCalendar scripts
This commit is contained in:
Markines16
GitHub
parent
a57751e699
commit
c6d7a98a85
139
assets/js/sessionCalendar.js
Normal file
139
assets/js/sessionCalendar.js
Normal file
@ -0,0 +1,139 @@
|
||||
$(document).ready(function(){
|
||||
//Get the data that is going to be used as a filter for events
|
||||
var selectedFeed = $('#hall_selector').find(':selected').data('feed');
|
||||
|
||||
var modal = document.getElementById("myModal");
|
||||
var btn = document.getElementById("myBtn");
|
||||
var span = document.getElementsByClassName("close")[0];
|
||||
|
||||
var calendar = $('#calendar').fullCalendar({
|
||||
editable:true,
|
||||
header:{
|
||||
left:'prev,next today',
|
||||
center:'title',
|
||||
right:'month,agendaWeek,agendaDay'
|
||||
},
|
||||
firstDay: 1,
|
||||
fixedWeekCount: false,
|
||||
eventSources: [ selectedFeed ],
|
||||
selectable:true,
|
||||
selectHelper:true,
|
||||
timeFormat: 'H:mm',
|
||||
eventOverlap: function(stillEvent, movingEvent) {
|
||||
return (stillEvent.start_time > stillEvent.end && stillEvent.end < movingEvent.start_time)
|
||||
},
|
||||
//Add event/session function when u click in any non-event date. Prepares the form to be seen as such
|
||||
select: function(start, end, allDay)
|
||||
{
|
||||
|
||||
$(modal).fadeIn();
|
||||
|
||||
var x = document.getElementById("film_group");
|
||||
x.style.display = "none";
|
||||
x = document.getElementById("film_list");
|
||||
x.style.display = "block";
|
||||
|
||||
document.getElementById("hall").value = document.getElementById("hall_selector").value;
|
||||
document.getElementById("startDate").value = $.fullCalendar.formatDate( start, "Y-MM-DD" );
|
||||
document.getElementById("endDate").value = $.fullCalendar.formatDate( end, "Y-MM-DD" );
|
||||
|
||||
document.getElementById("sumbit_new").style.display = "block";
|
||||
document.getElementById("edit_inputs").style.display = "none";
|
||||
},
|
||||
editable:true,
|
||||
//Edit only the date/hour start of an event/session when u click,drag and drop an event.
|
||||
eventDrop:function(event)
|
||||
{
|
||||
var e = {
|
||||
"newDate" : $.fullCalendar.formatDate(event.start, "Y-MM-DD HH:mm:ss"),
|
||||
"idhall": document.getElementById("hall").value,
|
||||
"startHour":event.start_time,
|
||||
"startDate":event.date,
|
||||
"price": event.seat_price,
|
||||
"idfilm": event.film.idfilm,
|
||||
"format": event.format,
|
||||
};
|
||||
console.log(e);
|
||||
console.log(event);
|
||||
$.ajax({
|
||||
url:"eventsProcess.php?drop=true",
|
||||
contentType: 'application/json; charset=utf-8',
|
||||
dataType: "json",
|
||||
type:"PUT",
|
||||
data:JSON.stringify(e),
|
||||
success: function(data) {
|
||||
alert("El evento se ha desplazado correctamente");
|
||||
calendar.fullCalendar('refetchEvents');
|
||||
},
|
||||
error: function(data) {
|
||||
alert("Ha habido un error al desplazar el evento");
|
||||
},
|
||||
});
|
||||
},
|
||||
//Edit event/session function when u click an event. Prepares the form to be seen as such
|
||||
eventClick:function(event)
|
||||
{
|
||||
$(modal).fadeIn();
|
||||
|
||||
var x = document.getElementById("film_group");
|
||||
x.style.display = "block";
|
||||
|
||||
x = document.getElementById("film_list");
|
||||
x.style.display = "none";
|
||||
|
||||
document.getElementById("hall").value = document.getElementById("hall_selector").value;
|
||||
document.getElementById("startDate").value = $.fullCalendar.formatDate( event.start, "Y-MM-DD" );
|
||||
document.getElementById("endDate").value = $.fullCalendar.formatDate( event.end, "Y-MM-DD" );
|
||||
document.getElementById("price").value = event.seat_price;
|
||||
document.getElementById("format").value = event.format;
|
||||
document.getElementById("startHour").value = event.start_time;
|
||||
|
||||
document.getElementById("original_hall").value = document.getElementById("hall_selector").value;
|
||||
document.getElementById("original_start_time").value = event.start_time;
|
||||
document.getElementById("original_date").value = $.fullCalendar.formatDate( event.start, "Y-MM-DD" );
|
||||
|
||||
document.getElementById("film_title").innerHTML = event.film.tittle;
|
||||
document.getElementById("film_lan").innerHTML = event.film.language;
|
||||
document.getElementById("film_dur").innerHTML = event.film.duration+" min";
|
||||
document.getElementById("film_img").src = "../img/films/"+event.film.img;
|
||||
document.getElementById("film_desc").innerHTML = event.film.description;
|
||||
document.getElementById("film_id").value = event.film.idfilm;
|
||||
document.getElementById("sumbit_new").style.display = "none";
|
||||
document.getElementById("edit_inputs").style.display = "grid";
|
||||
|
||||
},
|
||||
|
||||
});
|
||||
//Once the filter changes, do the changes needed so full calendar research the events with the new hall
|
||||
$('#hall_selector').change(onSelectChangeFeed);
|
||||
|
||||
function onSelectChangeFeed() {
|
||||
var feed = $(this).find(':selected').data('feed');
|
||||
$('#calendar').fullCalendar('removeEventSource', selectedFeed);
|
||||
$('#calendar').fullCalendar('addEventSource', feed);
|
||||
selectedFeed = feed;
|
||||
};
|
||||
|
||||
//When u click on the X the form closes. If the user close it because the operation has been complete. Restart the form correctly
|
||||
span.onclick = function() {
|
||||
formout();
|
||||
}
|
||||
|
||||
function formout(){
|
||||
$(modal).fadeOut(100,function(){
|
||||
var success = document.getElementById("success");
|
||||
if(success){
|
||||
calendar.fullCalendar('refetchEvents');
|
||||
$(".alert").remove();
|
||||
document.getElementById("session_form").style.display = "block";
|
||||
document.getElementById("price").value = "";
|
||||
document.getElementById("format").value = "";
|
||||
document.getElementById("film_id").value = "";
|
||||
document.getElementById("startHour").value ="";
|
||||
}
|
||||
$(".form_group").removeClass("has_error");
|
||||
$(".help_block").remove();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
212
assets/js/sessionFormProcess.js
Normal file
212
assets/js/sessionFormProcess.js
Normal file
@ -0,0 +1,212 @@
|
||||
$(document).ready(function () {
|
||||
|
||||
//New session
|
||||
$('#sumbit_new').click( function(e) {
|
||||
$(".form_group").removeClass("has_error");
|
||||
$(".help_block").remove();
|
||||
|
||||
var formData = {
|
||||
price: $("#price").val(),
|
||||
format: $("#format").val(),
|
||||
hall: $("#hall").val(),
|
||||
startDate: $("#startDate").val(),
|
||||
endDate: $("#endDate").val(),
|
||||
startHour: $("#startHour").val(),
|
||||
idFilm: $("#film_id").val(),
|
||||
};
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url:"eventsProcess.php",
|
||||
contentType: 'application/json; charset=utf-8',
|
||||
dataType: "json",
|
||||
data:JSON.stringify(formData),
|
||||
encode: true,
|
||||
}).done(function (data) {
|
||||
console.log(data);
|
||||
checkErrors(data,"session_form");
|
||||
})
|
||||
.fail(function (jqXHR, textStatus) {
|
||||
$("form#session_form").html(
|
||||
'<div class="alert alert_danger">Could not reach server, please try again later. '+textStatus+'</div>'
|
||||
);
|
||||
});
|
||||
e.preventDefault();
|
||||
});
|
||||
//Edit session
|
||||
$('#sumbit_edit').click( function(e) {
|
||||
$(".form_group").removeClass("has_error");
|
||||
$(".help_block").remove();
|
||||
|
||||
|
||||
var formData = {
|
||||
price: $("#price").val(),
|
||||
format: $("#format").val(),
|
||||
hall: $("#hall").val(),
|
||||
startDate: $("#startDate").val(),
|
||||
endDate: $("#endDate").val(),
|
||||
startHour: $("#startHour").val(),
|
||||
idFilm: $("#film_id").val(),
|
||||
og_hall: $("#original_hall").val(),
|
||||
og_date: $("#original_date").val(),
|
||||
og_start: $("#original_start_time").val(),
|
||||
};
|
||||
console.log(formData);
|
||||
|
||||
$.ajax({
|
||||
type: "PUT",
|
||||
url:"eventsProcess.php",
|
||||
contentType: 'application/json; charset=utf-8',
|
||||
dataType: "json",
|
||||
data:JSON.stringify(formData),
|
||||
encode: true,
|
||||
}).done(function (data) {
|
||||
console.log(data);
|
||||
checkErrors(data,"session_form");
|
||||
})
|
||||
.fail(function (jqXHR, textStatus) {
|
||||
$("form#session_form").html(
|
||||
'<div class="alert alert_danger">Could not reach server, please try again later. '+textStatus+'</div>'
|
||||
);
|
||||
});
|
||||
e.preventDefault();
|
||||
});
|
||||
//Delete Session
|
||||
$('#submit_del').click( function(e) {
|
||||
$(".form_group").removeClass("has_error");
|
||||
$(".help_block").remove();
|
||||
|
||||
|
||||
var formData = {
|
||||
og_hall: $("#original_hall").val(),
|
||||
og_date: $("#original_date").val(),
|
||||
og_start: $("#original_start_time").val(),
|
||||
};
|
||||
console.log(formData);
|
||||
|
||||
$.ajax({
|
||||
type: "DELETE",
|
||||
url:"eventsProcess.php",
|
||||
contentType: 'application/json; charset=utf-8',
|
||||
dataType: "json",
|
||||
data:JSON.stringify(formData),
|
||||
encode: true,
|
||||
}).done(function (data) {
|
||||
console.log(data);
|
||||
checkErrors(data,"session_form")
|
||||
})
|
||||
.fail(function (jqXHR, textStatus) {
|
||||
$("form#session_form").html(
|
||||
'<div class="alert alert_danger">Could not reach server, please try again later. '+textStatus+'</div>'
|
||||
);
|
||||
});
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
function checkErrors(data,formname) {
|
||||
if (!data.success) {
|
||||
if (data.errors.price) {
|
||||
$("#price_group").addClass("has_error");
|
||||
$("#price_group").append(
|
||||
'<div class="help_block">' + data.errors.price + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.format) {
|
||||
$("#format_group").addClass("has_error");
|
||||
$("#format_group").append(
|
||||
'<div class="help_block">' + data.errors.format + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.hall) {
|
||||
$("#hall_group").addClass("has_error");
|
||||
$("#hall_group").append(
|
||||
'<div class="help_block">' + data.errors.hall + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.startDate) {
|
||||
$("#date_group").addClass("has_error");
|
||||
$("#date_group").append(
|
||||
'<div class="help_block">' + data.errors.startDate + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.startDate) {
|
||||
$("#date_group").addClass("has_error");
|
||||
$("#date_group").append(
|
||||
'<div class="help_block">' + data.errors.endDate + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.date) {
|
||||
$("#date_group").addClass("has_error");
|
||||
$("#date_group").append(
|
||||
'<div class="help_block">' + data.errors.date + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.startHour) {
|
||||
$("#hour_group").addClass("has_error");
|
||||
$("#hour_group").append(
|
||||
'<div class="help_block">' + data.errors.startHour + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.idfilm) {
|
||||
$("#film_msg_group").addClass("has_error");
|
||||
$("#film_msg_group").append(
|
||||
'<div class="help_block">' + data.errors.idfilm + "</div>"
|
||||
);
|
||||
}
|
||||
if (data.errors.global) {
|
||||
$("#global_group").addClass("has_error");
|
||||
$("#global_group").append(
|
||||
'<div class="help_block">' + data.errors.global + "</div>"
|
||||
);
|
||||
}
|
||||
} else {
|
||||
$("#operation_msg").addClass("has_no_error");
|
||||
$("#operation_msg").append(
|
||||
'<div class="alert alert_success" id="success">' + data.message + "</div>"
|
||||
);
|
||||
document.getElementById("session_form").style.display = "none";
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//Change the view from the film list to a concrete film with some data about it
|
||||
$('.film_button').bind('click', function(e) {
|
||||
var id = $(this).attr('id');
|
||||
|
||||
var x = document.getElementById("film_group");
|
||||
x.style.display = "block";
|
||||
|
||||
var tittle = document.getElementById("title"+id);
|
||||
document.getElementById("film_title").innerHTML = tittle.innerHTML;
|
||||
|
||||
var lan = document.getElementById("lan"+id);
|
||||
document.getElementById("film_lan").innerHTML = lan.value;
|
||||
|
||||
var dur = document.getElementById("dur"+id);
|
||||
document.getElementById("film_dur").innerHTML = dur.innerHTML;
|
||||
|
||||
var img = document.getElementById("img"+id);
|
||||
document.getElementById("film_img").src = "../img/films/"+img.value;
|
||||
|
||||
var desc = document.getElementById("desc"+id);
|
||||
document.getElementById("film_desc").innerHTML = desc.value;
|
||||
|
||||
var idf = document.getElementById("id"+id);
|
||||
document.getElementById("film_id").value = idf.value;
|
||||
|
||||
x = document.getElementById("film_list")
|
||||
x.style.display = "none";
|
||||
|
||||
|
||||
});
|
||||
//Change the view from the concrete film data to a film list with all available films
|
||||
$('#return').click( function() {
|
||||
var x = document.getElementById("film_group");
|
||||
x.style.display = "none";
|
||||
|
||||
x = document.getElementById("film_list");
|
||||
x.style.display = "block";
|
||||
});
|
||||
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user