// jQuery Gantt Chart
// ==================
// Basic usage:
// $(".selector").gantt({
// source: "ajax/data.json",
// scale: "weeks",
// minScale: "weeks",
// maxScale: "months",
// onItemClick: function(data) {
// alert("Item clicked - show some details");
// },
// onAddClick: function(dt, rowId) {
// alert("Empty space clicked - add an item!");
// },
// onRender: function() {
// console.log("chart rendered");
// }
// });
//
/*jshint shadow:true, unused:false, laxbreak:true, evil:true*/
/*globals jQuery, alert*/
(function ($) {
"use strict";
$.fn.gantt = function (options) {
var cookieKey = "jquery.fn.gantt";
var scales = ["hours", "days", "weeks", "months"];
//Default settings
var settings = {
source: null,
itemsPerPage: 7,
months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
dow: ["S", "M", "T", "W", "T", "F", "S"],
startPos: new Date(),
navigate: "buttons",
scale: "days",
useCookie: false,
maxScale: "months",
minScale: "hours",
waitText: "Please wait...",
onItemClick: function (data) { return; },
onAddClick: function (data) { return; },
onRender: function() { return; },
scrollToToday: true
};
// custom selector `:findday` used to match on specified day in ms.
//
// The selector is passed a date in ms and elements are added to the
// selection filter if the element date matches, as determined by the
// id attribute containing a parsable date in ms.
$.extend($.expr[":"], {
findday: function (a, i, m) {
var cd = new Date(parseInt(m[3], 10));
var id = $(a).attr("id");
id = id ? id : "";
var si = id.indexOf("-") + 1;
var ed = new Date(parseInt(id.substring(si, id.length), 10));
cd = new Date(cd.getFullYear(), cd.getMonth(), cd.getDate());
ed = new Date(ed.getFullYear(), ed.getMonth(), ed.getDate());
return cd.getTime() === ed.getTime();
}
});
// custom selector `:findweek` used to match on specified week in ms.
$.extend($.expr[":"], {
findweek: function (a, i, m) {
var cd = new Date(parseInt(m[3], 10));
var id = $(a).attr("id");
id = id ? id : "";
var si = id.indexOf("-") + 1;
cd = cd.getFullYear() + "-" + cd.getDayForWeek().getWeekOfYear();
var ed = id.substring(si, id.length);
return cd === ed;
}
});
// custom selector `:findmonth` used to match on specified month in ms.
$.extend($.expr[":"], {
findmonth: function (a, i, m) {
var cd = new Date(parseInt(m[3], 10));
cd = cd.getFullYear() + "-" + cd.getMonth();
var id = $(a).attr("id");
id = id ? id : "";
var si = id.indexOf("-") + 1;
var ed = id.substring(si, id.length);
return cd === ed;
}
});
// Date prototype helpers
// ======================
// `getWeekId` returns a string in the form of 'dh-YYYY-WW', where WW is
// the week # for the year.
// It is used to add an id to the week divs
Date.prototype.getWeekId = function () {
var y = this.getFullYear();
var w = this.getDayForWeek().getWeekOfYear();
var m = this.getMonth();
if (m === 11 && w === 1) {
y++;
}
return 'dh-' + y + "-" + w;
};
// `getRepDate` returns the seconds since the epoch for a given date
// depending on the active scale
Date.prototype.genRepDate = function () {
switch (settings.scale) {
case "hours":
return this.getTime();
case "weeks":
return this.getDayForWeek().getTime();
case "months":
return new Date(this.getFullYear(), this.getMonth(), 1).getTime();
default:
return this.getTime();
}
};
// `getDayOfYear` returns the day number for the year
Date.prototype.getDayOfYear = function () {
var fd = new Date(this.getFullYear(), 0, 0);
var sd = new Date(this.getFullYear(), this.getMonth(), this.getDate());
return Math.ceil((sd - fd) / 86400000);
};
// `getWeekOfYear` returns the week number for the year
Date.prototype.getWeekOfYear = function () {
var ys = new Date(this.getFullYear(), 0, 1);
var sd = new Date(this.getFullYear(), this.getMonth(), this.getDate());
if (ys.getDay() > 3) {
ys = new Date(sd.getFullYear(), 0, (7 - ys.getDay()));
}
var daysCount = sd.getDayOfYear() - ys.getDayOfYear();
return Math.ceil(daysCount / 7);
};
// `getDaysInMonth` returns the number of days in a month
Date.prototype.getDaysInMonth = function () {
return 32 - new Date(this.getFullYear(), this.getMonth(), 32).getDate();
};
// `hasWeek` returns `true` if the date resides on a week boundary
// **????????????????? Don't know if this is true**
Date.prototype.hasWeek = function () {
var df = new Date(this.valueOf());
df.setDate(df.getDate() - df.getDay());
var dt = new Date(this.valueOf());
dt.setDate(dt.getDate() + (6 - dt.getDay()));
if (df.getMonth() === dt.getMonth()) {
return true;
} else {
return (df.getMonth() === this.getMonth() && dt.getDate() < 4) || (df.getMonth() !== this.getMonth() && dt.getDate() >= 4);
}
};
// `getDayForWeek` returns the Date object for the starting date of
// the week # for the year
Date.prototype.getDayForWeek = function () {
var df = new Date(this.valueOf());
df.setDate(df.getDate() - df.getDay());
var dt = new Date(this.valueOf());
dt.setDate(dt.getDate() + (6 - dt.getDay()));
if ((df.getMonth() === dt.getMonth()) || (df.getMonth() !== dt.getMonth() && dt.getDate() >= 4)) {
return new Date(dt.setDate(dt.getDate() - 3));
} else {
return new Date(df.setDate(df.getDate() + 3));
}
};
// Grid management
// ===============
// Core object is responsible for navigation and rendering
var core = {
// Return the element whose topmost point lies under the given point
// Normalizes for IE
elementFromPoint: function (x, y) {
if ($.browser.msie) {
x -= $(document).scrollLeft();
y -= $(document).scrollTop();
} else {
x -= window.pageXOffset;
y -= window.pageYOffset;
}
return document.elementFromPoint(x, y);
},
// **Create the chart**
create: function (element) {
// Initialize data with a json object or fetch via an xhr
// request depending on `settings.so
- 1
- 2
- 3
- 4
前往页