Расширение функций виджета iCal в Mac OS X

в 12:54, , рубрики: dashboard, javascript, mac os x, метки:

На Хабре недавно была опубликована статья о том, как писать виджеты для Mac OS X Dashboard.

Давайте воспользуемся полученными знаниями для того, чтобы научить стандартный dashboard'овский календарик показывать нерабочие и праздничные дни.

Расширение функций виджета iCal в Mac OS X

Исходники виджета находятся в каталоге /Library/Widgets/iCal.wdgt. Найдем в файле Calendar.css оформление дней месяца (обычное, «приглушенное», подсвеченное) и добавим туда стиль для нерабочих дней; по аналогии с существующими назовем его .calendar-dayOfMonthNumberHoliday.

Проще всего сделать copy-paste стандартного стиля, но из соображений эстетики я переоформил код следующим образом:

.calendar-dayOfMonthNumberNormal,
.calendar-dayOfMonthNumberHoliday,
.calendar-dayOfMonthNumberDimmed,
.calendar-dayOfMonthNumberHighlighted
 {
	float: left; 
	position: relative;
	left: 3px;
	width: 16px;
	padding-right: 0px;
	border-right: 7px solid transparent;
	margin-top: 0px;
	text-align: right; 
}

.calendar-dayOfMonthNumberNormal {
	color: white;
}

.calendar-dayOfMonthNumberHoliday {
	color: rgb(255,102,51);
}

.calendar-dayOfMonthNumberDimmed {
	color: rgb(51,51,51);
}

.calendar-dayOfMonthNumberHighlighted {
	color: rgb(204,255,0);
}

Теперь добавим в файл Calendar.js список праздничных и выходных дней 2012-го года (в соответствии с производственным календарем calend.ru), а также функцию проверки на «праздничность»:

var holidays = [ 
 [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 14, 15, 21, 22 ], 
 [ 4, 5, 11, 12, 18, 19, 23, 25, 26 ],
 [ 3, 4, 8, 9, 10, 17, 18, 24, 25, 31 ], 
 [ 1, 7, 8, 14, 15, 21, 22, 29, 30 ],
 [ 1, 6, 7, 8, 9, 13, 19, 20, 26, 27 ], 
 [ 2, 3, 10, 11, 12, 16, 17, 23, 24, 30 ],
 [ 1, 7, 8, 14, 15, 21, 22, 28, 29 ],
 [ 4, 5, 11, 12, 18, 19, 25, 26 ],
 [ 1, 2, 8, 9, 15, 16, 22, 23, 29, 30 ],
 [ 6, 7, 13, 14, 20, 21, 27, 28 ],
 [ 3, 4, 5, 10, 11, 17, 18, 24, 25 ],
 [ 1, 2, 8, 9, 15, 16, 22, 23, 30, 31 ]
];

function isHoliday(month, dayOfMonth) {
	return holidays[month].indexOf(dayOfMonth) != -1;
}

Осталось поправить одну строку в функции drawGrid, выставляющую класс для числа:

dateSpan.setAttribute ("class", isHoliday(ourMonth, date) ? "calendar-dayOfMonthNumberHoliday" : "calendar-dayOfMonthNumberNormal");

Для того, чтобы изменения вступили в силу, необходимо удалить виджет с dashboard'а и снова добавить. Кстати, если нужно часто смотреть на результат в процессе разработки, новую копию виджета можно запускать прямо из Finder'а или из терминала (open /Library/Widgets/iCal.wdgt).

Вы спросите: «Если с этими виджетами все так просто, почему многие сайты даже не задумываются о том, что могут их предоставлять? Например, Gismeteo?». Хороший вопрос. Во многом ради него эта маленькая статья и написана.

Автор: vk2


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js