Controls/DateControls/TimeCombo.qml

0001 // SPDX-FileCopyrightText: 2021 Claudio Cambra <claudio.cambra@gmail.com>
0002 // SPDX-License-Identifier: LGPL-2.1-or-later
0003
0004 import QtQuick 2.15
0005 import QtQuick.Controls 2.15 as QQC2
0006 import QtQuick.Layouts 1.15
0007 import org.kde.kirigami 2.15 as Kirigami
0008 import "dateutils.js" as DateUtils
0009
0010 QQC2.ComboBox {
0011     id: root
0012
0013     signal newTimeChosen(int hours, int minutes)
0014
0015     property int timeZoneOffset: 0
0016     property string display
0017     property date dateTime
0018     property alias timePicker: popupTimePicker
0019
0020     editable: true
0021     editText: activeFocus && !popupTimePicker.visible ? editText : display
0022
0023     inputMethodHints: Qt.ImhTime
0024
0025     onEditTextChanged: {
0026         if (activeFocus && !popupTimePicker.visible) {
0027             if (editText.length === 4 && editText[1] === ":") {
0028                 editText = "0" + editText;
0029             }
0030             const dateFromTime = Date.fromLocaleTimeString(Qt.locale(), editText, Locale.NarrowFormat);
0031             if(!isNaN(dateFromTime.getTime())) {
0032                 newTimeChosen(dateFromTime.getHours(), dateFromTime.getMinutes());
0033             }
0034         }
0035     }
0036
0037     popup: QQC2.Popup {
0038         id: timePopup
0039         width: Kirigami.Units.gridUnit * 10
0040         height: Kirigami.Units.gridUnit * 14
0041         x: parent.width - width
0042         y: parent.y + parent.height
0043         z: 1000
0044         padding: 0
0045
0046         TimePicker {
0047             id: popupTimePicker
0048
0049             Component.onCompleted: minuteMultiples = 5
0050             Connections {
0051                 target: root
0052
0053                 function timeChangeHandler() {
0054                     if(!popupTimePicker.visible) {
0055                         // JS for some insane reason always tries to give you a datetime in the local timezone, even though
0056                         // we want the hours in the datetime's timezone, not our local timezone
0057                         const adjusted = DateUtils.adjustDateTimeToLocalTimeZone(root.dateTime, root.timeZoneOffset)
0058
0059                         popupTimePicker.hours = adjusted.getHours();
0060                         popupTimePicker.minutes = adjusted.getMinutes();
0061                     }
0062                 }
0063
0064                 function onDateTimeChanged() {
0065                     timeChangeHandler();
0066                 }
0067
0068                 function onTimeZoneOffsetChanged() {
0069                     timeChangeHandler();
0070                 }
0071             }
0072
0073             function valuesChangedHandler() {
0074                 if(visible) {
0075                     root.newTimeChosen(hours, minutes);
0076                 }
0077             }
0078
0079             onHoursChanged: valuesChangedHandler()
0080             onMinutesChanged: valuesChangedHandler()
0081         }
0082     }
0083 }