new pisilinux web sites
This commit is contained in:
@@ -0,0 +1,141 @@
|
||||
!(function ($) {
|
||||
"use strict";
|
||||
|
||||
var CalendarApp = function () {
|
||||
this.$body = $("body");
|
||||
(this.$calendar = $("#calendar")),
|
||||
(this.$event = "#calendar-events div.calendar-events"),
|
||||
(this.$categoryForm = $("#add-new-event form")),
|
||||
(this.$extEvents = $("#calendar-events")),
|
||||
(this.$modal = $("#my-event")),
|
||||
(this.$saveCategoryBtn = $(".save-category")),
|
||||
(this.$calendarObj = null);
|
||||
};
|
||||
|
||||
/* on drop */
|
||||
(CalendarApp.prototype.onDrop = function (eventObj, date) {
|
||||
var $this = this;
|
||||
// retrieve the dropped element's stored Event Object
|
||||
var originalEventObject = eventObj.data("eventObject");
|
||||
var $categoryClass = eventObj.attr("data-class");
|
||||
// we need to copy it, so that multiple events don't have a reference to the same object
|
||||
var copiedEventObject = $.extend({}, originalEventObject);
|
||||
// assign it the date that was reported
|
||||
copiedEventObject.start = date;
|
||||
if ($categoryClass) copiedEventObject["className"] = [$categoryClass];
|
||||
// render the event on the calendar
|
||||
$this.$calendar.fullCalendar("renderEvent", copiedEventObject, true);
|
||||
// is the "remove after drop" checkbox checked?
|
||||
if ($("#drop-remove").is(":checked")) {
|
||||
// if so, remove the element from the "Draggable Events" list
|
||||
eventObj.remove();
|
||||
}
|
||||
}),
|
||||
/* on click on event */
|
||||
(CalendarApp.prototype.onEventClick = function (calEvent, jsEvent, view) {
|
||||
var $this = this;
|
||||
var form = $("<form></form>");
|
||||
form.append("<label>Change event name</label>");
|
||||
form.append(
|
||||
"<div class='input-group'><input class='form-control' type=text value='" +
|
||||
calEvent.title +
|
||||
"' /><span class='input-group-btn'><button type='submit' class='btn btn-success waves-effect waves-light'><i class='fa fa-check'></i> Save</button></span></div>"
|
||||
);
|
||||
$this.$modal.modal({
|
||||
backdrop: "static",
|
||||
});
|
||||
$this.$modal
|
||||
.find(".delete-event")
|
||||
.show()
|
||||
.end()
|
||||
.find(".save-event")
|
||||
.hide()
|
||||
.end()
|
||||
.find(".modal-body")
|
||||
.empty()
|
||||
.prepend(form)
|
||||
.end()
|
||||
.find(".delete-event")
|
||||
.unbind("click")
|
||||
.click(function () {
|
||||
$this.$calendarObj.fullCalendar("removeEvents", function (ev) {
|
||||
return ev._id == calEvent._id;
|
||||
});
|
||||
$this.$modal.modal("hide");
|
||||
});
|
||||
$this.$modal.find("form").on("submit", function () {
|
||||
calEvent.title = form.find("input[type=text]").val();
|
||||
$this.$calendarObj.fullCalendar("updateEvent", calEvent);
|
||||
$this.$modal.modal("hide");
|
||||
return false;
|
||||
});
|
||||
}),
|
||||
(CalendarApp.prototype.enableDrag = function () {
|
||||
//init events
|
||||
$(this.$event).each(function () {
|
||||
// create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
|
||||
// it doesn't need to have a start or end
|
||||
var eventObject = {
|
||||
title: $.trim($(this).text()), // use the element's text as the event title
|
||||
};
|
||||
// store the Event Object in the DOM element so we can get to it later
|
||||
$(this).data("eventObject", eventObject);
|
||||
// make the event draggable using jQuery UI
|
||||
$(this).draggable({
|
||||
zIndex: 999,
|
||||
revert: true, // will cause the event to go back to its
|
||||
revertDuration: 0, // original position after the drag
|
||||
});
|
||||
});
|
||||
});
|
||||
/* Initializing */
|
||||
(CalendarApp.prototype.init = function () {
|
||||
this.enableDrag();
|
||||
/* Initialize the calendar */
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
var form = "";
|
||||
var today = new Date($.now());
|
||||
|
||||
var defaultEvents = [];
|
||||
|
||||
var $this = this;
|
||||
$this.$calendarObj = $this.$calendar.fullCalendar({
|
||||
slotDuration: "00:15:00",
|
||||
/* If we want to split day time each 15minutes */
|
||||
minTime: "08:00:00",
|
||||
maxTime: "19:00:00",
|
||||
defaultView: "month",
|
||||
handleWindowResize: true,
|
||||
|
||||
header: {
|
||||
left: "prev,next today",
|
||||
center: "title",
|
||||
right: "month,agendaWeek,agendaDay",
|
||||
},
|
||||
events: defaultEvents,
|
||||
editable: true,
|
||||
droppable: true, // this allows things to be dropped onto the calendar !!!
|
||||
eventLimit: true, // allow "more" link when too many events
|
||||
selectable: true,
|
||||
drop: function (date) {
|
||||
$this.onDrop($(this), date);
|
||||
},
|
||||
select: function (start, end, allDay) {
|
||||
$this.onSelect(start, end, allDay);
|
||||
},
|
||||
eventClick: function (calEvent, jsEvent, view) {
|
||||
$this.onEventClick(calEvent, jsEvent, view);
|
||||
},
|
||||
});
|
||||
}),
|
||||
//init CalendarApp
|
||||
($.CalendarApp = new CalendarApp()),
|
||||
($.CalendarApp.Constructor = CalendarApp);
|
||||
})(window.jQuery),
|
||||
//initializing CalendarApp
|
||||
$(window).on("load", function () {
|
||||
$.CalendarApp.init();
|
||||
});
|
||||
Reference in New Issue
Block a user