extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-10-05 09:42:30 +02:00
Code Issues Packages Projects Releases Wiki Activity

Calendar refactors:

Browse Source 
- Remove some more jQueryUI.datepicker usages
This commit is contained in:
nathan 2022-05-02 15:23:03 -06:00
parent 1de2a89eeb
commit b0a57a05fd
5 changed files with 39 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
api/js/etemplate/Et2Date/Et2Date.ts
View File

@ -239,7 +239,7 @@ export function formatDate(date : Date, options = {dateFormat: ""}) : string
m: (date.getUTCMonth() < 9 ? "0" : "") + (date.getUTCMonth() + 1),
Y: "" + date.getUTCFullYear()
}
let re = new RegExp(Object.keys(replace_map).join("|"), "gi");
let re = new RegExp(Object.keys(replace_map).join("|"), "g");
_value = dateformat.replace(re, function(matched)
{
return replace_map[matched];

30
calendar/js/app.ts
View File

@ -51,8 +51,10 @@ import {et2_checkbox} from "../../api/js/etemplate/et2_widget_checkbox";
import {et2_grid} from "../../api/js/etemplate/et2_widget_grid";
import {Et2Textbox} from "../../api/js/etemplate/Et2Textbox/Et2Textbox";
import "./SidemenuDate";
import {parseDate} from "../../api/js/etemplate/Et2Date/Et2Date";
import {EGW_KEY_PAGE_UP,EGW_KEY_PAGE_DOWN} from "../../api/js/egw_action/egw_action_constants";
import {formatDate, formatTime, parseDate} from "../../api/js/etemplate/Et2Date/Et2Date";
import {EGW_KEY_PAGE_DOWN, EGW_KEY_PAGE_UP} from "../../api/js/egw_action/egw_action_constants";
import {nm_action} from "../../api/js/etemplate/et2_extension_nextmatch_actions";
import flatpickr from "flatpickr";
/**
* UI for calendar
@ -3337,10 +3339,12 @@ export class CalendarApp extends EgwApp
if (state.name)
{
// 'blank' is the special name for no filters, send that instead of the nice translated name
state.state.favorite = jQuery.isEmptyObject(state) || jQuery.isEmptyObject(state.state||state.filter) ? 'blank' : state.name.replace(/[^A-Za-z0-9-_]/g, '_');
state.state.favorite = jQuery.isEmptyObject(state) || jQuery.isEmptyObject(state.state || state.filter) ? 'blank' : state.name.replace(/[^A-Za-z0-9-_]/g, '_');
// set date for "No Filter" (blank) favorite to todays date
if (state.state.favorite == 'blank')
state.state.date = jQuery.datepicker.formatDate('yymmdd', new Date);
if(state.state.favorite == 'blank')
{
state.state.date = formatDate(new Date, {dateFormat: 'yymmdd'});
}
}
menuaction = 'calendar.calendar_uilist.listview';
state.state.ajax = 'true';
@ -4022,7 +4026,7 @@ export class CalendarApp extends EgwApp
if (display_day)
{
range = jQuery.datepicker.formatDate('DD',first_format)+(datefmt[0] != 'd' ? ' ' : ', ');
range = flatpickr.formatDate(first_format, 'l') + (datefmt[0] != 'd' ? ' ' : ', ');
}
for (var i = 0; i < 5; i += 2)
{
@ -4034,7 +4038,7 @@ export class CalendarApp extends EgwApp
{
if (!month_before_day)
{
range += jQuery.datepicker.formatDate('MM',first_format);
range += flatpickr.formatDate(first_format, "F");
}
if (first.getFullYear() != last.getFullYear() && datefmt[0] != 'Y')
{
@ -4042,7 +4046,7 @@ export class CalendarApp extends EgwApp
}
if (display_time)
{
range += ' '+jQuery.datepicker.formatDate(dateTimeFormat(timefmt),first_format);
range += ' ' + formatTime(first_format);
}
if (!last)
{
@ -4057,14 +4061,14 @@ export class CalendarApp extends EgwApp
if (month_before_day)
{
range += jQuery.datepicker.formatDate('MM',last_format);
range += flatpickr.formatDate(last_format, 'l');
}
}
else if (last)
{
if (display_time)
{
range += ' '+jQuery.datepicker.formatDate(dateTimeFormat(timefmt),last_format);
range += ' ' + formatTime(last_format);
}
if(last)
{
@ -4078,7 +4082,7 @@ export class CalendarApp extends EgwApp
break;
case 'm':
case 'M':
range += ' '+jQuery.datepicker.formatDate('MM',month_before_day || !last ? first_format : last_format) + ' ';
range += ' ' + flatpickr.formatDate(month_before_day || !last ? first_format : last_format, "l") + ' ';
break;
case 'Y':
if (datefmt[0] != 'm')
@ -4090,7 +4094,7 @@ export class CalendarApp extends EgwApp
}
if (display_time && last)
{
range += ' '+jQuery.datepicker.formatDate(dateTimeFormat(timefmt),last_format);
range += ' ' + formatTime(last_format);
}
if (datefmt[4] == 'Y' && datefmt[0] == 'm')
{
@ -4123,7 +4127,7 @@ export class CalendarApp extends EgwApp
d.setUTCDate(d.getUTCDate() + 2);
}
return jQuery.datepicker.iso8601Week(new Date(d.valueOf() + d.getTimezoneOffset() * 60 * 1000));
return flatpickr.formatDate(new Date(d.valueOf() + d.getTimezoneOffset() * 60 * 1000), "W");
},
start_of_week: function(date)
{

73
calendar/js/et2_widget_event.ts
View File

@ -26,6 +26,7 @@ import {egw} from "../../api/js/jsapi/egw_global";
import {et2_selectbox} from "../../api/js/etemplate/et2_widget_selectbox";
import {et2_container} from "../../api/js/etemplate/et2_core_baseWidget";
import {Et2Dialog} from "../../api/js/etemplate/Et2Dialog/Et2Dialog";
import {formatTime} from "../../api/js/etemplate/Et2Date/Et2Date";
/**
* Class for a single event, displayed in either the timegrid or planner view
@ -391,26 +392,17 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached
}
else
{
// @ts-ignore
const start_time = jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: event.start_m / 60,
minute: event.start_m % 60,
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
).trim();
// @ts-ignore
const start_time = formatTime(event.start).trim();
this.body
.html('<span class="calendar_calEventTitle">' + title + '</span>')
.append('<span class="calendar_calTimespan">' + start_time + '</span>');
if(this.options.value.description.trim())
{
this.body
.html('<span class="calendar_calEventTitle">' + title + '</span>')
.append('<span class="calendar_calTimespan">' + start_time + '</span>');
if (this.options.value.description.trim())
{
this.body
.append('<p>' + egw.htmlspecialchars(this.options.value.description) + '</p>');
}
.append('<p>' + egw.htmlspecialchars(this.options.value.description) + '</p>');
}
}
// Clear tooltip for regeneration
@ -768,26 +760,9 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached
if (event['end_m'] > 24 * 60)
{
// @ts-ignore
timespan = jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: event.start_m / 60,
minute: event.start_m % 60,
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
// @ts-ignore
).trim() + ' - ' + jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: event.end_m / 60,
minute: event.end_m % 60,
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
).trim();
timespan = formatTime(event.start)
// @ts-ignore
.trim() + ' - ' + formatTime(event.end).trim();
}
else
{
@ -802,28 +777,10 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached
duration = Math.floor(duration / 60) + this.egw().lang('h') + (duration % 60 ? duration % 60 : '');
// @ts-ignore
timespan = jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: event.start_m / 60,
minute: event.start_m % 60,
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
).trim();
timespan = formatTime(event.start).trim();
// @ts-ignore
timespan += ' - ' + jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: event.end_m / 60,
minute: event.end_m % 60,
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
).trim();
timespan += ' - ' + formatTime(event.end);
timespan += ': ' + duration;
}

15
calendar/js/et2_widget_planner.ts
View File

@ -31,7 +31,7 @@ import {CalendarApp} from "./app";
import {sprintf} from "../../api/js/egw_action/egw_action_common.js";
import {et2_dataview_grid} from "../../api/js/etemplate/et2_dataview_view_grid";
import {et2_selectbox} from "../../api/js/etemplate/et2_widget_selectbox";
import {formatDate} from "../../api/js/etemplate/Et2Date/Et2Date";
import {formatDate, formatTime} from "../../api/js/etemplate/Et2Date/Et2Date";
import {holidays} from "../../api/js/etemplate/Et2Date/Holidays";
/**
@ -1771,18 +1771,9 @@ export class et2_calendar_planner extends et2_calendar_view implements et2_IDeta
*/
_drag_helper(element, position ,height)
{
var time = this._get_time_from_position(position.left, position.top);
let time = this._get_time_from_position(position.left, position.top);
element.dropEnd = time;
var formatted_time = jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: time.getUTCHours(),
minute: time.getUTCMinutes(),
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
);
let formatted_time = formatTime(time);
element.innerHTML = '<div class="calendar_d-n-d_timeCounter"><span class="calendar_timeDemo" >'+formatted_time+'</span></div>';

24
calendar/js/et2_widget_timegrid.ts
View File

@ -27,7 +27,7 @@ import {egw_getObjectManager, egwActionObject} from "../../api/js/egw_action/egw
import {et2_compileLegacyJS} from "../../api/js/etemplate/et2_core_legacyJSFunctions";
import {Et2Dialog} from "../../api/js/etemplate/Et2Dialog/Et2Dialog";
import {EGW_AI_DRAG_OUT, EGW_AI_DRAG_OVER} from "../../api/js/egw_action/egw_action_constants.js";
import {formatDate} from "../../api/js/etemplate/Et2Date/Et2Date";
import {formatDate, formatTime, parseTime} from "../../api/js/etemplate/Et2Date/Et2Date";
/**
* Class which implements the "calendar-timegrid" XET-Tag for displaying a span of days
@ -426,16 +426,7 @@ export class et2_calendar_timegrid extends et2_calendar_view implements et2_IDet
else
{
// @ts-ignore
time = jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: element.dropEnd.attr('data-hour'),
minute: element.dropEnd.attr('data-minute'),
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") == "12")}
);
time = formatTime(parseTime(element.dropEnd.attr('data-hour') + ":" + element.dropEnd.attr('data-minute')));
}
element.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span class="calendar_timeDemo" >'+time+'</span></div>';
}
@ -852,16 +843,7 @@ export class et2_calendar_timegrid extends et2_calendar_view implements et2_IDet
html += '<div class="calendar_calTimeRow' + working_hours + '" style="height: '+(100/row_count)+'%;">';
// show time for full hours, always for 45min interval and at least on every 3 row
// @ts-ignore
var time = jQuery.datepicker.formatTime(
egw.preference("timeformat") === "12" ? "h:mmtt" : "HH:mm",
{
hour: t / 60,
minute: t % 60,
seconds: 0,
timezone: 0
},
{"ampm": (egw.preference("timeformat") === "12")}
);
let time = formatTime(parseTime((t / 60) + ":" + (t % 60)));
var time_label = (typeof show[granularity] === 'undefined' ? t % 60 === 0 : show[granularity].indexOf(t % 60) !== -1) ? time : '';
if(time_label && egw.preference("timeformat") == "12" && time_label.split(':')[0] < 10)