Skip to content

Instantly share code, notes, and snippets.

@minajevs
Created December 10, 2015 20:02
Show Gist options
  • Save minajevs/7b14abdacffa97c8863c to your computer and use it in GitHub Desktop.
Save minajevs/7b14abdacffa97c8863c to your computer and use it in GitHub Desktop.
function PrettyCalendar(e, t, n, r) {
if (typeof n == "undefined") n = false;
if (typeof r == "undefined") {
var i = new Array(7);
i[0] = "Sunday";
i[1] = "Monday";
i[2] = "Tuesday";
i[3] = "Wednesday";
i[4] = "Thursday";
i[5] = "Friday";
i[6] = "Saturday";
r = i
}
this.wrappingDiv = t;
this.genCalendar(r);
if (n) {
PrettyCalendar.addNavigation()
}
this.initTransitions();
PrettyCalendar.commitEvents(e)
}
PrettyCalendar.prototype.weekView = true;
PrettyCalendar.prototype.transition = false;
PrettyCalendar.UNDEFINED_TIME = -2;
PrettyCalendar.EVENT_PADDING = 10;
PrettyCalendar.prototype.wrappingDiv;
PrettyCalendar.arrangeInDays = function(e) {
var t = [];
for (var n = 0; n < 7; n++) t[n] = [];
for (var n = 0; n < e.length; n++) {
var r = 0;
switch (e[n][0].toLowerCase()) {
case "sunday":
r = 0;
break;
case "monday":
r = 1;
break;
case "tuesday":
r = 2;
break;
case "wednesday":
r = 3;
break;
case "thursday":
r = 4;
break;
case "friday":
r = 5;
break;
case "saturday":
r = 6;
break
}
var i = t[r].length;
t[r][i] = [];
t[r][i][0] = e[n][1];
t[r][i][1] = e[n][2];
t[r][i][2] = e[n][3];
if (e[n].length > 4) {
t[r][i][3] = e[n][4]
}
}
return t
};
PrettyCalendar.prototype.genCalendar = function(e) {
$("#" + this.wrappingDiv).css("font-family", "Tahoma,Arial,sans-serif");
$("#" + this.wrappingDiv).css("overflow-x", "hidden");
$("#" + this.wrappingDiv).css("overflow-y", "hidden");
$("#" + this.wrappingDiv).css("min-width", "760px");
$("#" + this.wrappingDiv).css("min-height", "500px");
var t = document.createElement("div");
$(t).attr("id", "wrapper");
var n = document.createElement("div");
$(n).attr("id", "calendar");
var r = document.createElement("div");
$(r).attr("id", "sidebar");
for (var i = 0; i < 12; i++) {
var s = document.createElement("div");
$(s).attr("class", "timeLabel");
var o = "12";
if (i > 0) o = i * 2 - 12 * (i > 6);
if (i < 6) o += "am";
else o += "pm";
$(s).text(o);
r.appendChild(s)
}
for (var i = 0; i < 7; i++) {
var u = document.createElement("div");
$(u).attr("id", "day" + (i + 1));
$(u).attr("class", "day");
var a = document.createElement("div");
$(a).attr("class", "dayName sep");
var f = "Sunday";
f = e[i];
$(a).text(f);
u.appendChild(a);
for (var l = 0; l < 23; l++) {
var c = document.createElement("div");
$(c).attr("class", "sep");
u.appendChild(c)
}
n.appendChild(u)
}
t.appendChild(r);
t.appendChild(n);
document.getElementById(this.wrappingDiv).appendChild(t)
};
PrettyCalendar.timeToHours = function(e) {
var t = 0;
var n = e;
if (n.replace("pm", "") != n) t += 12;
var r = n.split(":");
if (r[0] == "12") t -= 12;
t = Number(t) + Number(r[0]);
t = Number(t) + Number(r[1].replace("am", "").replace("pm", "")) / 60;
return t
};
PrettyCalendar.hoursToPercent = function(e) {
return 100 * e / 24 + 4.16
};
PrettyCalendar.populateEvents = function(e) {
var t = 0;
for (var n = 0; n < 7; n++) {
var r = PrettyCalendar.UNDEFINED_TIME;
var i = 1;
if (e[n].length != 0) {
e[n] = e[n].sort(function(e, t) {
return PrettyCalendar.timeToHours(e[0]) - PrettyCalendar.timeToHours(t[0])
})
}
for (var s = 0; s < e[n].length; s++) {
t++;
var o = PrettyCalendar.timeToHours(e[n][s][0]);
var u = PrettyCalendar.hoursToPercent(o);
var a = PrettyCalendar.hoursToPercent(r);
if ($("#calendar").height() * a / 100 + $("#event" + (t - 1)).innerHeight() + PrettyCalendar.EVENT_PADDING > $("#calendar").height() * u / 100) {
i++
} else {
i = 1
}
var f = 100 / i;
r = o;
var l = document.createElement("div");
$(l).attr("class", "event");
$(l).attr("id", "event" + t);
var c = "height:auto;";
if (e[n][s].length > 3) {
c = "height:" + (PrettyCalendar.hoursToPercent(PrettyCalendar.timeToHours(e[n][s][3])) - u) + "%;"
}
$(l).attr("style", "top:" + u + "%;width:" + f + "%;background-color:" + e[n][s][2] + ";left:" + (100 - f) + "%;" + c);
if (f != 100) {
for (var h = 0; h < i - 1; h++) {
$("#event" + (t - (h + 1))).css("width", f + "%");
$("#event" + (t - (h + 1))).css("left", 100 - f * (h + 2) + "%");
$("#event" + (t - (h + 1))).attr("title", $("#event" + (t - (h + 1))).text())
}
$(l).attr("title", e[n][s][1])
}
$(l).text(e[n][s][1]);
$("#day" + (n + 1)).append(l)
}
}
};
PrettyCalendar.updateEvents = function(e) {
$(".event").remove();
PrettyCalendar.commitEvents(e)
};
PrettyCalendar.prototype.initTransitions = function() {
var e = this;
$(".day").click(function() {
if (!e.transition) {
if (e.weekView) {
e.transition = true;
e.weekView = false;
$("#day7").not(this).css("width", "13%");
$("#day1").not(this).css("width", "13%");
$(".day").not(this).css("min-width", "0px");
$(".day").not(this).animate({
width: "0%"
}, 1e3, function() {
$(".day").not(this).css("display", "none")
});
$(this).animate({
width: "100%"
}, 1e3, function() {
$(this).css("display", "block");
e.transition = false
})
} else {
e.transition = true;
$(".day").css("display", "block");
e.weekView = true;
$(".day").not(this).animate({
width: "14.28%"
}, 1e3, function() {
$(".day").css("min-width", "100px");
e.transition = false
});
$(this).animate({
width: "14.28%"
}, 970)
}
}
})
};
PrettyCalendar.prototype.addFooter = function(e) {
var t = document.createElement("footer");
$(t).html(e);
document.getElementById(this.wrappingDiv).appendChild(t)
};
PrettyCalendar.addNavigation = function() {
var e = '<div class="directionNav" onclick="leftNav()"><span class="directionLabel">&lt;</span></div>';
var t = '<div class="directionNav" onclick="rightNav()" style="left:95%;"><span class="directionLabel">&gt;</span></div>';
$("#wrapper").append(e + t)
};
PrettyCalendar.commitEvents = function(e) {
e = PrettyCalendar.arrangeInDays(e);
PrettyCalendar.populateEvents(e)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment