diff --git a/src/static/css/datetimepicker.css b/src/static/css/datetimepicker.css
index 51d77f2..f0fc54b 100644
--- a/src/static/css/datetimepicker.css
+++ b/src/static/css/datetimepicker.css
@@ -29,6 +29,9 @@ div.perfectTable > div > div {
display: flex;
justify-content: center;
+
+ padding-top: 1rem;
+ padding-bottom: 1rem;
}
div.perfectTable > div {
@@ -95,7 +98,7 @@ header.pickerHeader {
display: flex;
flex-flow: row;
- flex-grow: 1;
+ flex-grow: 0;
flex-basis: 0;
flex-shrink: 0;
diff --git a/src/static/js/datetime.js b/src/static/js/datetime.js
index dcc4a3e..f4cf14f 100644
--- a/src/static/js/datetime.js
+++ b/src/static/js/datetime.js
@@ -3,8 +3,8 @@ var ccn_datetime_monthDayCount = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31
var ccn_datetime_MIN_YEAR = 1950;
var ccn_datetime_MAX_YEAR = 2200;
-var ccn_datetime_MIN_DATETIME = new Date(Date.UTC(ccn_datetime_MIN_YEAR, 1, 1, 0, 0, 0, 0));
-var ccn_datetime_MAX_DATETIME = new Date(Date.UTC(ccn_datetime_MAX_YEAR, 1, 1, 0, 0, 0, 0));
+var ccn_datetime_MIN_DATETIME = new Date(Date.UTC(ccn_datetime_MIN_YEAR, 0, 1, 0, 0, 0, 0));
+var ccn_datetime_MAX_DATETIME = new Date(Date.UTC(ccn_datetime_MAX_YEAR, 0, 1, 0, 0, 0, 0));
var ccn_datetime_MIN_TIMESTAMP = Math.floor(ccn_datetime_MIN_DATETIME.getTime() / 60000);
var ccn_datetime_MAX_TIMESTAMP = Math.floor(ccn_datetime_MAX_DATETIME.getTime() / 60000);
diff --git a/src/static/js/datetimepicker.js b/src/static/js/datetimepicker.js
index 9c3df4c..d5b37a3 100644
--- a/src/static/js/datetimepicker.js
+++ b/src/static/js/datetimepicker.js
@@ -116,6 +116,7 @@ function ccn_datetimepicker_Modal(mode, pickerIndex, isUTC) {
}
function ccn_datetimepicker_Confirm() {
+ // update and call callback func
ccn_datetimepicker_Set(
ccn_datetimepicker_pickerIndex,
ccn_datetimepicker_internalDateTime,
@@ -211,7 +212,7 @@ function ccn_datetimepicker_RefreshDisplay(tab) {
var gottenYear = ccn_datetimepicker_displayCacheDateTime.getFullYear();
var gottenMonth = ccn_datetimepicker_displayCacheDateTime.getMonth() + 1;
var counter = -ccn_datetime_DayOfWeek(gottenYear, gottenMonth, 1);
- var days = ccn_datetime_monthDayCount[gottenMonth - 1] + ((gottenMonth == 2 && ccn_datetime_IsLeapYear(year)) ? 1 : 0);
+ var days = ccn_datetime_monthDayCount[gottenMonth - 1] + ((gottenMonth == 2 && ccn_datetime_IsLeapYear(gottenYear)) ? 1 : 0);
for(var i = 0; i < 6; i++) {
for(var j = 0; j < 7; j++, counter++) {
var ele = $('#ccn-datetimepiacker-panelDay-table > div:nth-child({0}) > div:nth-child({1})'.format(i + 2, j + 1));
@@ -356,9 +357,17 @@ function ccn_datetimepicker_ClickDay() {
function ccn_datetimepicker_StartDragHour() { ccn_datetimepicker_enableHourDrag = true; }
function ccn_datetimepicker_DraggingHour(e) {
- var offset = $('#ccn-datetimepicker-panelHour').offset();
- var x = e.pageX - offset.left - ccn_datetimepicker_dialPlateRadius;
- var y = -(e.pageY - offset.top - ccn_datetimepicker_dialPlateRadius);
+ if (!ccn_datetimepicker_enableHourDrag) return;
+
+ var ele = $('#ccn-datetimepicker-panelHour')
+ var offset = {
+ left: ele.offset().left,
+ top: ele.offset().top,
+ width: ele.width(),
+ height: ele.height()
+ }
+ var x = (e.pageX - offset.left) / width * ccn_datetimepicker_dialPlateWidth - ccn_datetimepicker_dialPlateRadius;
+ var y = -((e.pageY - offset.top) / height * ccn_datetimepicker_dialPlateWidth - ccn_datetimepicker_dialPlateRadius);
var distance = Math.sqrt(x * x + y * y);
var angle = Math.asin(y / distance);
@@ -392,9 +401,17 @@ function ccn_datetimepicker_StopDragHour() {
function ccn_datetimepicker_StartDragMinute() { ccn_datetimepicker_enableMinuteDrag = true; }
function ccn_datetimepicker_DraggingMinute(e) {
- var offset = $('#ccn-datetimepicker-panelMinute').offset();
- var x = e.pageX - offset.left - ccn_datetimepicker_dialPlateRadius;
- var y = -(e.pageY - offset.top - ccn_datetimepicker_dialPlateRadius);
+ if (!ccn_datetimepicker_enableMinuteDrag) return;
+
+ var ele = $('#ccn-datetimepicker-panelMinute')
+ var offset = {
+ left: ele.offset().left,
+ top: ele.offset().top,
+ width: ele.width(),
+ height: ele.height()
+ }
+ var x = (e.pageX - offset.left) / offset.width * ccn_datetimepicker_dialPlateWidth - ccn_datetimepicker_dialPlateRadius;
+ var y = -((e.pageY - offset.top) / offset.height * ccn_datetimepicker_dialPlateWidth - ccn_datetimepicker_dialPlateRadius);
var distance = Math.sqrt(x * x + y * y);
var angle = Math.asin(y / distance);
@@ -434,19 +451,23 @@ function ccn_datetimepicker_ClampDateTime(dateObj) {
function ccn_datetimepicker_Set(pickerIndex, dt, isUTC, mode) {
var ele = $('[datetimepicker=' + pickerIndex + ']');
- if (mode < ccn_datetimepicker_tabType.year) return;
- ele.attr('datetimepicker-year', isUTC ? dt.getUTCFullYear() : dt.getFullYear());
- if (mode < ccn_datetimepicker_tabType.month) return;
- ele.attr('datetimepicker-month', (isUTC ? dt.getUTCMonth() : dt.getMonth()) + 1);
- if (mode < ccn_datetimepicker_tabType.day) return;
- ele.attr('datetimepicker-day', isUTC ? dt.getUTCDate() : dt.getDate());
- if (mode < ccn_datetimepicker_tabType.hour) return;
- ele.attr('datetimepicker-hour', isUTC ? dt.getUTCHours() : dt.getHours());
- if (mode < ccn_datetimepicker_tabType.minute) return;
- ele.attr('datetimepicker-minute', isUTC ? dt.getUTCMinutes() : dt.getMinutes());
+ while(true) {
+ if (mode < ccn_datetimepicker_tabType.year) break;
+ ele.attr('datetimepicker-year', isUTC ? dt.getUTCFullYear() : dt.getFullYear());
+ if (mode < ccn_datetimepicker_tabType.month) break;
+ ele.attr('datetimepicker-month', (isUTC ? dt.getUTCMonth() : dt.getMonth()) + 1);
+ if (mode < ccn_datetimepicker_tabType.day) break;
+ ele.attr('datetimepicker-day', isUTC ? dt.getUTCDate() : dt.getDate());
+ if (mode < ccn_datetimepicker_tabType.hour) break;
+ ele.attr('datetimepicker-hour', isUTC ? dt.getUTCHours() : dt.getHours());
+ if (mode < ccn_datetimepicker_tabType.minute) break;
+ ele.attr('datetimepicker-minute', isUTC ? dt.getUTCMinutes() : dt.getMinutes());
- if (typeof(ele.prop('callbackFunc')) == 'function')
- ele.prop('callbackFunc')();
+ break;
+ }
+
+ if (typeof(ele.prop('funcs')) != 'undefined' && typeof(ele.prop('funcs').callback) == 'function')
+ ele.prop('funcs').callback();
}
function ccn_datetimepicker_Get(pickerIndex, isUTC) {
diff --git a/src/static/js/page/calendar.js b/src/static/js/page/calendar.js
index fb6faa5..74a290d 100644
--- a/src/static/js/page/calendar.js
+++ b/src/static/js/page/calendar.js
@@ -61,9 +61,12 @@ $(document).ready(function() {
$('#ccn-calendar-collection-btnRefresh').click(ccn_calendar_collection_Refresh);
$('#ccn-calendar-calendar-btnJump')
- .prop('callbackFunc', ccn_calendar_calendar_btnRefresh)
+ .prop('funcs', {callback: ccn_calendar_calendar_btnRefresh})
.click(function() {
- ccn_datetimepicker_Modal(ccn_datetimepicker_tabType.month, 1, false);
+ ccn_datetimepicker_Modal(
+ ccn_datetimepicker_tabType.month,
+ 1,
+ false);
});
$('#ccn-calendar-calendar-btnToday').click(ccn_calendar_calendar_btnToday);
$('#ccn-calendar-calendar-btnAdd').click(ccn_calendar_calendar_btnAdd);
diff --git a/src/static/js/page/event.js b/src/static/js/page/event.js
index ff8f967..e6b6dd6 100644
--- a/src/static/js/page/event.js
+++ b/src/static/js/page/event.js
@@ -37,6 +37,15 @@ $(document).ready(function() {
$('#ccn-event-btnCancel').click(ccn_event_btnCancel);
$('#ccn-event-btnSpot').click(ccn_event_btnSpot);
$('#ccn-event-btnFullDay').click(ccn_event_btnFullDay);
+ $('#ccn-event-btnStartDateTime')
+ .prop('funcs', {callback: function() {ccn_event_UpdateDateTimePickerButton(1);}})
+ .click(ccn_event_btnDateTimePicker);
+ $('#ccn-event-btnEndDateTime')
+ .prop('funcs', {callback: function() {ccn_event_UpdateDateTimePickerButton(2);}})
+ .click(ccn_event_btnDateTimePicker);
+ $('#ccn-event-btnLoopStopDateTime')
+ .prop('funcs', {callback: function() {ccn_event_UpdateDateTimePickerButton(3);}})
+ .click(ccn_event_btnDateTimePicker);
// init form
ccn_event_Init();
@@ -60,9 +69,6 @@ function ccn_event_Init() {
.attr('step', 1)
.val(1);
- // now, init 3 datetimepicker
- //ccn_datetimepicker_Init();
-
// in there, we need get uuid from meta
var uuid = $('meta[name=uuid]').attr('content');
if (uuid != "")
@@ -242,6 +248,26 @@ function ccn_event_RefreshLoopMonthType() {
$('#ccn-event-loopMonth-textD').text($.i18n.prop('ccn-i18n-event-loopWeek-optionD').format(data[4], data[5] + 1));
}
+function ccn_event_UpdateDateTimePickerButton(index) {
+ switch(index) {
+ case 1:
+ $('#ccn-event-btnStartDateTime-text').text(
+ ccn_datetimepicker_Get(1, false).toLocaleString()
+ );
+ break;
+ case 2:
+ $('#ccn-event-btnEndDateTime-text').text(
+ ccn_datetimepicker_Get(2, false).toLocaleString()
+ );
+ break;
+ case 3:
+ $('#ccn-event-btnLoopStopDateTime-text').text(
+ ccn_datetimepicker_Get(3, false).toLocaleDateString()
+ );
+ break;
+ }
+}
+
// return undefined to indicate an error
// or
// [belongTo, title, description, eventDateTimeStart, eventDateTimeEnd, timezoneOffset, loopRules]
@@ -365,6 +391,20 @@ function ccn_event_btnFullDay() {
ccn_datetimepicker_Set(2, datetime, false);
}
+function ccn_event_btnDateTimePicker() {
+ switch(parseInt($(this).attr('datetimepicker'))) {
+ case 1:
+ ccn_datetimepicker_Modal(ccn_datetimepicker_tabType.minute, 1, false);
+ break;
+ case 2:
+ ccn_datetimepicker_Modal(ccn_datetimepicker_tabType.minute, 2, false);
+ break;
+ case 3:
+ ccn_datetimepicker_Modal(ccn_datetimepicker_tabType.day, 3, false);
+ break;
+ }
+}
+
function ccn_event_btnCancel() {
window.location.href = '/web/calendar';
}
diff --git a/src/templates/calendar.html b/src/templates/calendar.html
index 23468f3..ffc3287 100644
--- a/src/templates/calendar.html
+++ b/src/templates/calendar.html
@@ -55,14 +55,14 @@
-