Skip to content

Commit

Permalink
form quick event
Browse files Browse the repository at this point in the history
  • Loading branch information
@dieunb
dieunb authored and Tung Pham committed Jun 26, 2015
1 parent bb1a5d8 commit 2e4fcf4
Show file tree
Hide file tree
Showing 7 changed files with 301 additions and 55 deletions.
192 changes: 139 additions & 53 deletions app/assets/javascripts/calendar/custom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,27 +3,38 @@ $(document).ready(function() {
var schedule_query_url = "/api/schedules.json";
var MyCalendar = $("#calendar");
var MyMiniCalendar = $("#mini-calendar");

var EventPopup = $("#quick-event-popup");
var PongPopup = $("#prong");

var clock = 5*60;

var current_user_id = $("body").data("current-user-id");
var view_type = localStorage.getItem("view_type");

var schedule_start = $("#schedule_start_time");
var schedule_finish = $("#schedule_finish_time");
schedule_start.attr("readonly", "readonly");
schedule_finish.attr("readonly", "readonly");

var getTime = function getTime(arg) {
return new Date(arg.setTime(arg.getTime() + (arg.getTimezoneOffset() * 60000)))
}

$("#room_selector ul.dropdown-menu li").click(function(e) {
room_id = $(this).val();
if(room_id == 0){
if (room_id == 0) {
room_id = "";
}

room_name = $(this).find("span").text();
schedule_query_url = "/api/schedules.json?room_id=" + room_id;
MyCalendar.fullCalendar("refetchEvents");
$("#room_dropdown").html(room_name);
if(room_id != ""){

if (room_id != "") {
$("#schedule_room_id option").removeAttr("selected");
$("#schedule_room_id option[value="+room_id+"]").attr("selected", "selected");
$("#schedule_room_id option[value=" + room_id + "]").attr("selected", "selected");
$("#select2-chosen-1").html(room_name);
}
});
Expand Down Expand Up @@ -93,60 +104,86 @@ $(document).ready(function() {
revertFunc();
},
select: function (start, end, jsEvent, view) {
var date = new Date();
if (view.type != "month") {
date = new Date();

windowWidth = window.innerWidth;
windowHeight = window.innerHeight;
popupWidth = EventPopup.width();
popupHeight = EventPopup.height();
clientX = jsEvent.clientX;
clientY = jsEvent.clientY;
selectedElementHeight = $(jsEvent.toElement.parentElement).height();
_left = 0;

if ((clientX + popupWidth * 1/2 + 30) > windowWidth) {
_left = windowWidth - popupWidth - 5;
_leftPong = clientX + popupWidth - windowWidth;
PongPopup.css({"left": _leftPong});
} else {
_left = clientX - popupWidth * 1/2;
PongPopup.css({"left": 182});
}

if((view.type != "month") && (start.date() == date.getDate())) {
if((start.hour() > date.getHours()) || ((start.hour() == date.getHours()) && (start.minute() >= date.getMinutes()))) {
$("#modal-form").modal("show");
_top = clientY - popupHeight - selectedElementHeight;

if (_top < 5) {
_top = clientY - 80 + selectedElementHeight * 1/2;
PongPopup.removeClass("bottom-prong").addClass("top-prong");
} else {
MyCalendar.fullCalendar("unselect");
_top = _top - 80 + selectedElementHeight * 1/2;
PongPopup.removeClass("top-prong").addClass("bottom-prong");
}

var start_event = getTime(start._d);
var finish_event = getTime(end._d);
if (start.date() == date.getDate()) {
if ((start.hour() > date.getHours()) || ((start.hour() == date.getHours()) && (start.minute() >= date.getMinutes()))) {

schedule_start_time.max(finish_event);
schedule_finish_time.min(start_event);
EventPopup.css({"visibility": "visible", "left": _left, "top": _top});
} else {
MyCalendar.fullCalendar("unselect");
}

schedule_start_time.value(start_event);
schedule_finish_time.value(finish_event);
} else if((view.type != "month") && (start._d > date)) {
$("#modal-form").modal("show");
start_event = getTime(start._d);
finish_event = getTime(end._d);

var start_event = getTime(start._d);
var finish_event = getTime(end._d);
schedule_start.val(formatDate(start_event));
schedule_finish.val(formatDate(finish_event));
} else if (start._d > date) {
EventPopup.css({"visibility": "visible", "left": _left, "top": _top});

schedule_start_time.max(finish_event);
schedule_finish_time.min(start_event);
start_event = getTime(start._d);
finish_event = getTime(end._d);

schedule_start_time.value(start_event);
schedule_finish_time.value(finish_event);
} else {
MyCalendar.fullCalendar("unselect");
schedule_start.val(formatDate(start_event));
schedule_finish.val(formatDate(finish_event));
} else {
MyCalendar.fullCalendar("unselect");
}
}
},
eventRender: function (event, element) {
$(".popover").hide();
time_start = "From: " + event.start.format("HH:mm");
time_end = "To: " + event.end.format("HH:mm");
room = "Room: " + event.room
detail = "schedules/" + event.id
edit = "schedules/" + event.id + "/edit"
deleteRepeat = "repeats/" + event.repeat_id

$(".title-popover").text(event.title);
$(".start-time-popover").text(time_start);
$(".finish-time-popover").text(time_end);
$(".room-popover").text(room);
$("#detail-schedule-popover").attr("href", detail);

delete_repeat = $("#delete-repeat-popover");
edit_schedule = $("#edit-schedule-popover");
delete_schedule = $("#delete-schedule-popover");

if (!event.url) {
if(event.user_id == current_user_id) {
if(event.repeat_id == null) {

if (event.id != undefined) {
time_start = "From: " + event.start.format("HH:mm");
time_end = "To: " + event.end.format("HH:mm");
room = "Room: " + event.room
detail = "schedules/" + event.id
edit = "schedules/" + event.id + "/edit"
deleteRepeat = "repeats/" + event.repeat_id

$(".title-popover").text(event.title);
$(".start-time-popover").text(time_start);
$(".finish-time-popover").text(time_end);
$(".room-popover").text(room);
$("#detail-schedule-popover").attr("href", detail);

delete_repeat = $("#delete-repeat-popover");
edit_schedule = $("#edit-schedule-popover");
delete_schedule = $("#delete-schedule-popover");

if (event.user_id == current_user_id) {
if (event.repeat_id == null) {
delete_repeat.attr("href", null);
delete_repeat.text("");
} else {
Expand All @@ -156,10 +193,11 @@ $(document).ready(function() {

var time_now = new Date();
var end_time = new Date(event.end);
if(time_now > end_time) {

if (time_now > end_time) {
edit_schedule.attr("href", null);
edit_schedule.text("");
}else {
} else {
edit_schedule.attr("href", edit);
edit_schedule.text("Edit");
}
Expand Down Expand Up @@ -200,11 +238,13 @@ $(document).ready(function() {

if (!element.is(e.target) && element.has(e.target).length == 0 && $(".popover").has(e.target).length == 0)
element.popover("hide");

if($(".fc-popover").length == 1){
$(".fc-icon-x").click(function(){
element.popover("hide");
});
}

$(".popover").click(function(){
$(this).hide();
});
Expand All @@ -219,23 +259,53 @@ $(document).ready(function() {
}
},
dayClick: function(date, jsEvent, view) {
windowWidth = window.innerWidth;
windowHeight = window.innerHeight;
popupWidth = EventPopup.width();
popupHeight = EventPopup.height();
clientX = jsEvent.clientX;
clientY = jsEvent.clientY;
selectedElementHeight = $(jsEvent.toElement.parentElement).height();
_left = 0;

if ((clientX + popupWidth * 1/2 + 30) > windowWidth) {
_left = windowWidth - popupWidth - 5;
_leftPong = clientX + popupWidth - windowWidth;
PongPopup.css({"left": _leftPong});
} else {
_left = clientX - popupWidth * 1/2;
PongPopup.css({"left": 182});
}

if ((clientY - popupHeight) <= 15) {
_top = clientY - 70;
PongPopup.removeClass("bottom-prong").addClass("top-prong");
} else {
_top = clientY - popupHeight - 90;
PongPopup.removeClass("top-prong").addClass("bottom-prong");
}

$("#search-setting").hide();
$("#room_selector, #other_dropdown").removeClass("open");
if((view.type == "month") && ((date.format() >= (new Date()).toISOString().slice(0, 10)) || (date._d >= (new Date())))) {
$("#modal-form").modal("show");

var TimeZoned = new Date(date.toDate().setTime(date.toDate().getTime() + (date.toDate().getTimezoneOffset() * 60000)));
if((view.type == "month") && ((date.format() >= (new Date()).toISOString().slice(0, 10)) || (date._d >= (new Date())))) {
EventPopup.css({"visibility": "visible", "left": _left, "top": _top});

schedule_start_time.value(TimeZoned);
schedule_finish_time.value(TimeZoned);
var timezoned = new Date(date.toDate().setTime(date.toDate().getTime() + (date.toDate().getTimezoneOffset() * 60000)));
var start_event = new Date(timezoned.setHours(8));
var finish_event = new Date(timezoned.setMinutes(30));

schedule_start_time.max(schedule_finish_time.value());
schedule_finish_time.min(schedule_start_time.value());
schedule_start.val(formatDate(start_event));
schedule_finish.val(formatDate(finish_event));
}

$(".popover").hide();
},
viewRender: function(view, element) {
EventPopup.css({"visibility": "hidden"});

localStorage.setItem("view_type", view.type);

try {
setTimeLine();
setInterval(function(){ setTimeLine() }, clock*1000);
Expand Down Expand Up @@ -320,4 +390,20 @@ $(document).ready(function() {
MyCalendar.fullCalendar("addEventSource", events);
MyCalendar.fullCalendar("rerenderEvents");
}, 900000);

$(".bubbleclose").bind("click", function(){
EventPopup.css({"visibility": "hidden"});
MyCalendar.fullCalendar("unselect");
});
});

function formatDate(date) {
var date_of_month = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();
var hours = date.getHours();
var minutes = date.getMinutes();
minutes = minutes < 10 ? "0" + minutes : minutes;
var strTime = hours + ":" + minutes;
return strTime + " " + month + "/" + date_of_month + "/" + year;
};
2 changes: 0 additions & 2 deletions app/assets/javascripts/share/custom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,6 @@
//= require websocket_rails/main
//= require select2
//= require search_schedules
//= require kendo.web.min
//= require kendo.custom
//= require repeats
//= require jquery.are-you-sure

Expand Down
1 change: 1 addition & 0 deletions app/assets/stylesheets/application.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@
*= require timeline
*= require search-form
*= require timetable
*= require quick-event-popup
*/

@import "bootstrap-sprockets";
Expand Down
Loading

0 comments on commit 2e4fcf4

Please sign in to comment.