yyc12345/coconut-leaf
1
0
Fork 0
Code Activity

fix various bugs

Browse Source
This commit is contained in:
yyc12345
2021-04-07 15:22:53 +08:00
parent 1c7ddfc8a9
commit bf3dc67754
7 changed files with 106 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/static/css/datetimepicker.css
View File

@@ -29,6 +29,9 @@ div.perfectTable > div > div {
display: flex; display: flex;
justify-content: center; justify-content: center;
padding-top: 1rem;
padding-bottom: 1rem;
} }
div.perfectTable > div { div.perfectTable > div {
@@ -95,7 +98,7 @@ header.pickerHeader {
display: flex; display: flex;
flex-flow: row; flex-flow: row;
flex-grow: 1; flex-grow: 0;
flex-basis: 0; flex-basis: 0;
flex-shrink: 0; flex-shrink: 0;

4
src/static/js/datetime.js
View File

@@ -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_MIN_YEAR = 1950;
var ccn_datetime_MAX_YEAR = 2200; 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_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, 1, 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_MIN_TIMESTAMP = Math.floor(ccn_datetime_MIN_DATETIME.getTime() / 60000);
var ccn_datetime_MAX_TIMESTAMP = Math.floor(ccn_datetime_MAX_DATETIME.getTime() / 60000); var ccn_datetime_MAX_TIMESTAMP = Math.floor(ccn_datetime_MAX_DATETIME.getTime() / 60000);

49
src/static/js/datetimepicker.js
View File

@@ -116,6 +116,7 @@ function ccn_datetimepicker_Modal(mode, pickerIndex, isUTC) {
} }
function ccn_datetimepicker_Confirm() { function ccn_datetimepicker_Confirm() {
// update and call callback func
ccn_datetimepicker_Set( ccn_datetimepicker_Set(
ccn_datetimepicker_pickerIndex, ccn_datetimepicker_pickerIndex,
ccn_datetimepicker_internalDateTime, ccn_datetimepicker_internalDateTime,
@@ -211,7 +212,7 @@ function ccn_datetimepicker_RefreshDisplay(tab) {
var gottenYear = ccn_datetimepicker_displayCacheDateTime.getFullYear(); var gottenYear = ccn_datetimepicker_displayCacheDateTime.getFullYear();
var gottenMonth = ccn_datetimepicker_displayCacheDateTime.getMonth() + 1; var gottenMonth = ccn_datetimepicker_displayCacheDateTime.getMonth() + 1;
var counter = -ccn_datetime_DayOfWeek(gottenYear, gottenMonth, 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 i = 0; i < 6; i++) {
for(var j = 0; j < 7; j++, counter++) { 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)); 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_StartDragHour() { ccn_datetimepicker_enableHourDrag = true; }
function ccn_datetimepicker_DraggingHour(e) { function ccn_datetimepicker_DraggingHour(e) {
var offset = $('#ccn-datetimepicker-panelHour').offset(); if (!ccn_datetimepicker_enableHourDrag) return;
var x = e.pageX - offset.left - ccn_datetimepicker_dialPlateRadius;
var y = -(e.pageY - offset.top - ccn_datetimepicker_dialPlateRadius); 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 distance = Math.sqrt(x * x + y * y);
var angle = Math.asin(y / distance); 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_StartDragMinute() { ccn_datetimepicker_enableMinuteDrag = true; }
function ccn_datetimepicker_DraggingMinute(e) { function ccn_datetimepicker_DraggingMinute(e) {
var offset = $('#ccn-datetimepicker-panelMinute').offset(); if (!ccn_datetimepicker_enableMinuteDrag) return;
var x = e.pageX - offset.left - ccn_datetimepicker_dialPlateRadius;
var y = -(e.pageY - offset.top - ccn_datetimepicker_dialPlateRadius); 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 distance = Math.sqrt(x * x + y * y);
var angle = Math.asin(y / distance); var angle = Math.asin(y / distance);
@@ -434,19 +451,23 @@ function ccn_datetimepicker_ClampDateTime(dateObj) {
function ccn_datetimepicker_Set(pickerIndex, dt, isUTC, mode) { function ccn_datetimepicker_Set(pickerIndex, dt, isUTC, mode) {
var ele = $('[datetimepicker=' + pickerIndex + ']'); var ele = $('[datetimepicker=' + pickerIndex + ']');
if (mode < ccn_datetimepicker_tabType.year) return; while(true) {
if (mode < ccn_datetimepicker_tabType.year) break;
ele.attr('datetimepicker-year', isUTC ? dt.getUTCFullYear() : dt.getFullYear()); ele.attr('datetimepicker-year', isUTC ? dt.getUTCFullYear() : dt.getFullYear());
if (mode < ccn_datetimepicker_tabType.month) return; if (mode < ccn_datetimepicker_tabType.month) break;
ele.attr('datetimepicker-month', (isUTC ? dt.getUTCMonth() : dt.getMonth()) + 1); ele.attr('datetimepicker-month', (isUTC ? dt.getUTCMonth() : dt.getMonth()) + 1);
if (mode < ccn_datetimepicker_tabType.day) return; if (mode < ccn_datetimepicker_tabType.day) break;
ele.attr('datetimepicker-day', isUTC ? dt.getUTCDate() : dt.getDate()); ele.attr('datetimepicker-day', isUTC ? dt.getUTCDate() : dt.getDate());
if (mode < ccn_datetimepicker_tabType.hour) return; if (mode < ccn_datetimepicker_tabType.hour) break;
ele.attr('datetimepicker-hour', isUTC ? dt.getUTCHours() : dt.getHours()); ele.attr('datetimepicker-hour', isUTC ? dt.getUTCHours() : dt.getHours());
if (mode < ccn_datetimepicker_tabType.minute) return; if (mode < ccn_datetimepicker_tabType.minute) break;
ele.attr('datetimepicker-minute', isUTC ? dt.getUTCMinutes() : dt.getMinutes()); ele.attr('datetimepicker-minute', isUTC ? dt.getUTCMinutes() : dt.getMinutes());
if (typeof(ele.prop('callbackFunc')) == 'function') break;
ele.prop('callbackFunc')(); }
if (typeof(ele.prop('funcs')) != 'undefined' && typeof(ele.prop('funcs').callback) == 'function')
ele.prop('funcs').callback();
} }
function ccn_datetimepicker_Get(pickerIndex, isUTC) { function ccn_datetimepicker_Get(pickerIndex, isUTC) {

7
src/static/js/page/calendar.js
View File

@@ -61,9 +61,12 @@ $(document).ready(function() {
$('#ccn-calendar-collection-btnRefresh').click(ccn_calendar_collection_Refresh); $('#ccn-calendar-collection-btnRefresh').click(ccn_calendar_collection_Refresh);
$('#ccn-calendar-calendar-btnJump') $('#ccn-calendar-calendar-btnJump')
.prop('callbackFunc', ccn_calendar_calendar_btnRefresh) .prop('funcs', {callback: ccn_calendar_calendar_btnRefresh})
.click(function() { .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-btnToday').click(ccn_calendar_calendar_btnToday);
$('#ccn-calendar-calendar-btnAdd').click(ccn_calendar_calendar_btnAdd); $('#ccn-calendar-calendar-btnAdd').click(ccn_calendar_calendar_btnAdd);

46
src/static/js/page/event.js
View File

@@ -37,6 +37,15 @@ $(document).ready(function() {
$('#ccn-event-btnCancel').click(ccn_event_btnCancel); $('#ccn-event-btnCancel').click(ccn_event_btnCancel);
$('#ccn-event-btnSpot').click(ccn_event_btnSpot); $('#ccn-event-btnSpot').click(ccn_event_btnSpot);
$('#ccn-event-btnFullDay').click(ccn_event_btnFullDay); $('#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 // init form
ccn_event_Init(); ccn_event_Init();
@@ -60,9 +69,6 @@ function ccn_event_Init() {
.attr('step', 1) .attr('step', 1)
.val(1); .val(1);
// now, init 3 datetimepicker
//ccn_datetimepicker_Init();
// in there, we need get uuid from meta // in there, we need get uuid from meta
var uuid = $('meta[name=uuid]').attr('content'); var uuid = $('meta[name=uuid]').attr('content');
if (uuid != "") 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)); $('#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 // return undefined to indicate an error
// or // or
// [belongTo, title, description, eventDateTimeStart, eventDateTimeEnd, timezoneOffset, loopRules] // [belongTo, title, description, eventDateTimeStart, eventDateTimeEnd, timezoneOffset, loopRules]
@@ -365,6 +391,20 @@ function ccn_event_btnFullDay() {
ccn_datetimepicker_Set(2, datetime, false); 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() { function ccn_event_btnCancel() {
window.location.href = '/web/calendar'; window.location.href = '/web/calendar';
} }

6
src/templates/calendar.html
View File

@@ -55,14 +55,14 @@
<nav class="level is-mobile"> <nav class="level is-mobile">
<div class="level-left"> <div class="level-left">
<div class="level-item control"> <div class="level-item control">
<a id="ccn-calendar-calendar-btnPrevMonth" class="button" datetimepicker="1"> <a id="ccn-calendar-calendar-btnPrevMonth" class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-left"></i></span> <span class="icon is-small"><i class="fas fa-chevron-circle-left"></i></span>
</a> </a>
</div> </div>
</div> </div>
<div class="level-item control"> <div class="level-item control">
<a id="ccn-calendar-calendar-btnJump" class="button"> <a id="ccn-calendar-calendar-btnJump" class="button" datetimepicker="1">
<span id="ccn-calendar-calendar-textMonth"></span> <span id="ccn-calendar-calendar-textMonth"></span>
</a> </a>
</div> </div>
@@ -75,7 +75,7 @@
</div> </div>
</div> </div>
</nav> </nav>
<nav class="level"> <nav class="level is-mobile">
<div class="level-item control"> <div class="level-item control">
<a id="ccn-calendar-calendar-btnToday" i18n-name="ccn-i18n-calendar-calendar-today" class="button is-info"></a> <a id="ccn-calendar-calendar-btnToday" i18n-name="ccn-i18n-calendar-calendar-today" class="button is-info"></a>
</div> </div>

95
src/templates/event.html
View File

@@ -73,38 +73,9 @@
<section class="section"> <section class="section">
<h2 class="subtitle" i18n-name="ccn-i18n-event-startDateTime"></h2> <h2 class="subtitle" i18n-name="ccn-i18n-event-startDateTime"></h2>
<div class="control-list"> <a id="ccn-event-btnStartDateTime" class="button" datetimepicker="1">
<div class="field"> <span id="ccn-event-btnStartDateTime-text"></span>
<label class="label" i18n-name="ccn-i18n-universal-text-year"></label> </a>
<div class="control">
<input datetimepicker="1" class="input datetimepicker-year" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-month"></label>
<div class="control">
<input datetimepicker="1" class="input datetimepicker-month" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-day"></label>
<div class="control">
<input datetimepicker="1" class="input datetimepicker-day" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-hour"></label>
<div class="control">
<input datetimepicker="1" class="input datetimepicker-hour" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-minute"></label>
<div class="control">
<input datetimepicker="1" class="input datetimepicker-minute" type="number">
</div>
</div>
</div>
<h2 class="subtitle" i18n-name="ccn-i18n-event-endDateTime"></h2> <h2 class="subtitle" i18n-name="ccn-i18n-event-endDateTime"></h2>
<div class="control-list"> <div class="control-list">
@@ -115,38 +86,9 @@
<a id="ccn-event-btnFullDay" class="button is-link" i18n-name="ccn-i18n-event-btnFullDay"></a> <a id="ccn-event-btnFullDay" class="button is-link" i18n-name="ccn-i18n-event-btnFullDay"></a>
</div> </div>
</div> </div>
<div class="control-list"> <a id="ccn-event-btnEndDateTime" class="button" datetimepicker="2">
<div class="field"> <span id="ccn-event-btnEndDateTime-text"></span>
<label class="label" i18n-name="ccn-i18n-universal-text-year"></label> </a>
<div class="control">
<input datetimepicker="2" class="input datetimepicker-year" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-month"></label>
<div class="control">
<input datetimepicker="2" class="input datetimepicker-month" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-day"></label>
<div class="control">
<input datetimepicker="2" class="input datetimepicker-day" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-hour"></label>
<div class="control">
<input datetimepicker="2" class="input datetimepicker-hour" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-minute"></label>
<div class="control">
<input datetimepicker="2" class="input datetimepicker-minute" type="number">
</div>
</div>
</div>
</section> </section>
@@ -279,28 +221,9 @@
</label> </label>
</div> </div>
<div id="ccn-event-boxLoopStopDateTime"> <div id="ccn-event-boxLoopStopDateTime">
<div class="field"> <a id="ccn-event-btnLoopStopDateTime" class="button" datetimepicker="3">
<div class="control-list"> <span id="ccn-event-btnLoopStopDateTime-text"></span>
<div class="field"> </a>
<label class="label" i18n-name="ccn-i18n-universal-text-year"></label>
<div class="control">
<input datetimepicker="3" class="input datetimepicker-year" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-month"></label>
<div class="control">
<input datetimepicker="3" class="input datetimepicker-month" type="number">
</div>
</div>
<div class="field">
<label class="label" i18n-name="ccn-i18n-universal-text-day"></label>
<div class="control">
<input datetimepicker="3" class="input datetimepicker-day" type="number">
</div>
</div>
</div>
</div>
</div> </div>
<div id="ccn-event-boxLoopStopTimes"> <div id="ccn-event-boxLoopStopTimes">
<div class="field"> <div class="field">