cal.js (raw)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 |
window.cal = {}; cal.hilightNow = function() { $(".calendarSubWrapper").each(function() { if ($(this).children("h4").text() == moment().format("MMMM")) { console.log($(this).children("h4").text()); $(this).children(".calendar").each(function() { $(this).children("tbody").each(function() { $(this).children("tr").each(function() { $(this).children("td").each(function() { console.log($(this).html()); if ($(this).text() == moment().format("D")) { $(this).addClass("working"); console.log($(this).text()); } }) }) }) }) } }) } cal.genYear = function(y) { var ret = ""; for (var i = 1; i <= 12; i++) { ret += cal.genPage(y, i); } return ret; } cal.switchMode = function() { switch(options.calendarSelector) { case "monthly": $("#wholeYearSelect").css("display", "none"); $("#yearSelect, #monthSelect").css("display", "inline-block"); $("#calendarWrapper").html(cal.genPage($("#yearSelect").val(), $("#monthSelect").val())); if ($("#yearSelect").val() == moment().format("Y")) cal.hilightNow(); break; case "yearly": $("#wholeYearSelect").css("display", "inline-block"); $("#yearSelect, #monthSelect").css("display", "none"); $("#calendarWrapper").html(cal.genYear($("#wholeYearSelect").val())); if ($("#wholeYearSelect").val() == moment().format("Y")) cal.hilightNow(); break; } } cal.genPage = function(y, m) { var ret = ""; var t = moment([y, m-1]); var offset = t.format("d"); ret += `<div class="calendarSubWrapper">` ret += `<h4>${t.format("MMMM")}</h4>`; ret += `<table class="calendar">`; ret += `<tr><th>Sun</th><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th>Sat</th></tr>` for (var i = 0;; i++) { ret += `<tr>` if (i == 0) { for (var j = 0; j < offset; j++) { ret += `<td></td>` } for (var j = offset; j < 7; j++) { ret += `<td>${t.format("D")}</td>` t.add(1, "day"); if (t.format("M") != m) break; } } else { for (var j = 0; j < 7; j++) { ret += `<td>${t.format("D")}</td>` t.add(1, "day"); if (t.format("M") != m) break; } } ret += `</tr>` if (t.format("M") != m) break; } ret += `</table>` ret += `</div>` return ret; } window.options = { calendarSelector: "monthly" } window.updateFuncs = [ cal.switchMode ]; $(document).ready(function(){ initOption("#calendarSelector"); $(`#monthSelect option[value=${moment().format("M")}]`).attr("selected", "selected"); $("#yearSelect").val(moment().format("Y")); $("#wholeYearSelect").val(moment().format("Y")); $("#monthSelect, #yearSelect, #wholeYearSelect").on("change", cal.switchMode); cal.switchMode(); }); |