Heisig_GmbH/infineon_plc
1
0
Fork 0
Code Issues Activity

Added minimal functionality for Robot teaching

Browse Source 
- Added minimal HMI
- Added possibility to open and close all chamber doors
This commit is contained in:
Matthias Heisig
2026-01-17 09:20:39 +01:00
parent 9f058db2a3
commit 2d11c43579
2274 changed files with 912690 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files

522
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Description.json vendored Normal file
View File

@@ -0,0 +1,522 @@
{
"$schema": "../../TcHmiFramework/Schema/ControlDescription.Schema.json",
"apiVersion": 1,
"name": "TcHmiDateTimeInput",
"namespace": "TcHmi.Controls.Beckhoff",
"displayName": "Date Time Input",
"version": {
"full": "14.4.1.0",
"major": 14,
"minor": 4,
"build": 1,
"revision": 0
},
"visible": true,
"themeable": "Standard",
"base": "TcHmi.Controls.System.TcHmiControl",
"description": "An input control which only accepts ISO 8601 time strings.",
"defaultDesignerEvent": ".onValueChanged",
"properties": {
"containerControl": false,
"geometry": {
"width": 264,
"height": 26
}
},
"icons": [
{
"name": "Icons/16x16.png",
"width": 16,
"height": 16
}
],
"template": "Template.html",
"dependencyFiles": [
{
"name": "Style.css",
"type": "Stylesheet",
"description": ""
},
{
"name": "../dist/TcHmiDateTimeInput/TcHmiDateTimeInput.esm.js",
"type": "EsModule",
"description": "Contains all the main logic as ES module."
}
],
"themes": {
"Base": {
"resources": [
{
"name": "Themes/Base/Style.css",
"type": "Stylesheet",
"description": ""
}
]
},
"Base-Dark": {
"resources": [
{
"name": "Themes/Base-Dark/Style.css",
"type": "Stylesheet",
"description": ""
}
]
}
},
"attributes": [
{
"name": "data-tchmi-value-color",
"propertyName": "ValueColor",
"propertySetterName": "setValueColor",
"propertyGetterName": "getValueColor",
"displayName": "Value Color",
"visible": true,
"themeable": "Standard",
"displayPriority": 10,
"type": "tchmi:framework#/definitions/SolidColor",
"category": "Colors",
"description": "Defines the text color of the displayed value.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"allowSymbolExpressionsInObject": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-value",
"propertyName": "Value",
"propertySetterName": "setValue",
"propertyGetterName": "getValue",
"displayName": "Value",
"visible": true,
"themeable": "Standard",
"displayPriority": 10,
"type": "tchmi:general#/definitions/DateTime",
"category": "Common",
"description": "The date and time value defined as ISO time string.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": "",
"defaultValueInternal": null
},
{
"name": "data-tchmi-min-value",
"propertyName": "MinValue",
"propertySetterName": "setMinValue",
"propertyGetterName": "getMinValue",
"displayName": "Min Value",
"visible": true,
"displayPriority": 10,
"type": "tchmi:general#/definitions/DateTime",
"category": "Common",
"themeable": "Advanced",
"description": "The end date and time defined as ISO time string.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-max-value",
"propertyName": "MaxValue",
"propertySetterName": "setMaxValue",
"propertyGetterName": "getMaxValue",
"displayName": "Max Value",
"visible": true,
"displayPriority": 10,
"type": "tchmi:general#/definitions/DateTime",
"category": "Common",
"themeable": "Advanced",
"description": "The end date and time defined as ISO time string.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-ignore-invalid-values",
"propertyName": "IgnoreInvalidValues",
"propertySetterName": "setIgnoreInvalidValues",
"propertyGetterName": "getIgnoreInvalidValues",
"displayName": "Ignore Invalid Values",
"visible": true,
"themeable": "Standard",
"displayPriority": 15,
"type": "tchmi:general#/definitions/Boolean",
"category": "Common",
"description": "Whether an invalid value should be displayed or not. If not, invalid values are discarded.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": false
},
{
"name": "data-tchmi-input-processing-point",
"propertyName": "InputProcessingPoint",
"propertySetterName": "setInputProcessingPoint",
"propertyGetterName": "getInputProcessingPoint",
"displayName": "Input Processing Point",
"visible": true,
"themeable": "Advanced",
"displayPriority": 50,
"type": "tchmi:framework#/definitions/TcHmi.Controls.Beckhoff.InputProcessingPoint",
"category": "Common",
"description": "When to process the input made by the user. Either while the input is still happening (i.e. on every keystroke) or after the interaction has finished (i.e. the control loses focus).",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": "InteractionFinished"
},
{
"name": "data-tchmi-value-horizontal-alignment",
"propertyName": "ValueHorizontalAlignment",
"propertySetterName": "setValueHorizontalAlignment",
"propertyGetterName": "getValueHorizontalAlignment",
"displayName": "Value Horizontal Alignment",
"visible": true,
"themeable": "Standard",
"displayPriority": 20,
"type": "tchmi:framework#/definitions/HorizontalAlignment",
"category": "Value",
"description": "Defines the horizontal aligment of the displayed value.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-content-padding",
"propertyName": "ContentPadding",
"propertySetterName": "setContentPadding",
"propertyGetterName": "getContentPadding",
"displayName": "Content Padding",
"visible": true,
"themeable": "Standard",
"displayPriority": 55,
"type": "tchmi:framework#/definitions/Padding",
"category": "Value",
"description": "The distance of the value to the border.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"allowSymbolExpressionsInObject": true,
"defaultValue": {
"top": 3,
"right": 3,
"bottom": 3,
"left": 3
},
"defaultValueInternal": null
},
{
"name": "data-tchmi-value-font-family",
"propertyName": "ValueFontFamily",
"propertySetterName": "setValueFontFamily",
"propertyGetterName": "getValueFontFamily",
"displayName": "Value Font Family",
"visible": true,
"themeable": "Standard",
"displayPriority": 60,
"type": "tchmi:framework#/definitions/FontFamily",
"category": "Value",
"description": "Comma separated list of family name or keyword: 'serif', 'sans-serif', 'monospace'.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-value-font-size",
"propertyName": "ValueFontSize",
"propertySetterName": "setValueFontSize",
"propertyGetterName": "getValueFontSize",
"displayName": "Value Font Size",
"visible": true,
"themeable": "Standard",
"displayPriority": 30,
"type": "tchmi:framework#/definitions/MeasurementValue",
"category": "Value",
"description": "The size of the font. Percent values are relative to the parent elements font size.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-value-font-size-unit",
"propertyName": "ValueFontSizeUnit",
"propertySetterName": "setValueFontSizeUnit",
"propertyGetterName": "getValueFontSizeUnit",
"refTo": "ValueFontSize",
"displayName": "Value Font Size Unit",
"visible": true,
"themeable": "Advanced",
"displayPriority": 30,
"type": "tchmi:framework#/definitions/MeasurementUnit",
"category": "Value",
"description": "Could be 'px' or for relative sizing '%'.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": "px"
},
{
"name": "data-tchmi-value-font-style",
"propertyName": "ValueFontStyle",
"propertySetterName": "setValueFontStyle",
"propertyGetterName": "getValueFontStyle",
"displayName": "Value Font Style",
"visible": true,
"themeable": "Standard",
"displayPriority": 60,
"type": "tchmi:framework#/definitions/FontStyle",
"category": "Value",
"description": "'Normal', 'Italic' (slanted with special glyphs), 'Oblique' (slanted normal glyphs) or 'Auto' for inherited.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": "Auto"
},
{
"name": "data-tchmi-value-font-weight",
"propertyName": "ValueFontWeight",
"propertySetterName": "setValueFontWeight",
"propertyGetterName": "getValueFontWeight",
"displayName": "Value Font Weight",
"visible": true,
"themeable": "Standard",
"displayPriority": 60,
"type": "tchmi:framework#/definitions/FontWeight",
"category": "Value",
"description": "'Normal', 'Bold' (glyphs with more weight) or 'Auto' for inherited.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": "Auto"
},
{
"name": "data-tchmi-placeholder",
"propertyName": "Placeholder",
"propertySetterName": "setPlaceholder",
"propertyGetterName": "getPlaceholder",
"displayName": "Placeholder",
"visible": true,
"themeable": "Standard",
"displayPriority": 50,
"type": "tchmi:general#/definitions/String",
"category": "Value",
"description": "A placeholder text to display if the date time input is empty.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": null
},
{
"name": "data-tchmi-auto-focus-out",
"propertyName": "AutoFocusOut",
"propertySetterName": "setAutoFocusOut",
"propertyGetterName": "getAutoFocusOut",
"displayName": "Auto Focus Out",
"visible": true,
"themeable": "Advanced",
"displayPriority": 45,
"type": "tchmi:general#/definitions/Boolean",
"category": "Common",
"description": "Whether the control should automatically lose focus when the user confirms or cancels his interaction via enter or escape.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": true,
"defaultValueInternal": false
},
{
"name": "data-tchmi-auto-select-text",
"propertyName": "AutoSelectText",
"propertySetterName": "setAutoSelectText",
"propertyGetterName": "getAutoSelectText",
"displayName": "Auto Select Text",
"visible": true,
"themeable": "Advanced",
"displayPriority": 50,
"type": "tchmi:general#/definitions/Boolean",
"category": "Common",
"description": "Whether a focusIn selects the whole text or not.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": false
},
{
"name": "data-tchmi-reset-to-last-valid-value",
"propertyName": "ResetToLastValidValue",
"propertySetterName": "setResetToLastValidValue",
"propertyGetterName": "getResetToLastValidValue",
"displayName": "Reset to Last Valid Value",
"visible": true,
"themeable": "Advanced",
"displayPriority": 45,
"type": "tchmi:general#/definitions/Boolean",
"category": "Common",
"description": "Whether the displayed text is reseted to the last valid value on focus out.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": true,
"defaultValueInternal": false
},
{
"name": "data-tchmi-button-Position",
"propertyName": "ButtonPosition",
"propertySetterName": "setButtonPosition",
"propertyGetterName": "getButtonPosition",
"displayName": "Button Position",
"visible": true,
"themeable": "Standard",
"displayPriority": 40,
"type": "tchmi:framework#/definitions/TcHmi.Controls.Beckhoff.TcHmiDateTimeInput.ButtonPosition",
"category": "Common",
"description": "Defines the position of the button",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": "Right"
},
{
"name": "data-tchmi-is-read-only",
"propertyName": "IsReadOnly",
"propertySetterName": "setIsReadOnly",
"propertyGetterName": "getIsReadOnly",
"displayName": "Is Read Only",
"visible": true,
"themeable": "Standard",
"displayPriority": 52,
"type": "tchmi:general#/definitions/Boolean",
"category": "Common",
"description": "Controls whose primary purpose is data input can be set to read-only to only display data without allowing modification.",
"readOnly": false,
"bindable": true,
"defaultBindingMode": "OneWay",
"heritable": true,
"defaultValue": null,
"defaultValueInternal": false
}
],
"attributeCategories": [
{
"name": "Value",
"displayPriority": 500,
"defaultCollapsed": true,
"description": "Attributes defining the value of the control."
}
],
"functions": [],
"events": [
{
"name": ".onFocusIn",
"displayName": ".onFocusIn",
"visible": true,
"displayPriority": 7,
"category": "Operator",
"description": "The focusin event is fired when an element is about to receive focus.",
"heritable": true,
"arguments": [
{
"type": "tchmi:framework#/definitions/DOMFocusEvent",
"description": "The FocusEvent object of the underlying focusin dom event."
}
]
},
{
"name": ".onFocusOut",
"displayName": ".onFocusOut",
"visible": true,
"displayPriority": 7,
"category": "Operator",
"description": "The focusout event is fired when an element is about to lose focus.",
"heritable": true,
"arguments": [
{
"type": "tchmi:framework#/definitions/DOMEvent",
"description": "The Event object of the underlying focusout dom event."
}
]
},
{
"name": ".onValueChanged",
"displayName": ".onValueChanged",
"visible": true,
"displayPriority": 10,
"category": "Control",
"description": "The valuechanged event is fired when the value was changed. This event could be fired multiples times while a user interaction.",
"heritable": true,
"arguments": [
{
"type": "tchmi:general#/definitions/String",
"description": "The new value for value"
}
]
},
{
"name": ".onUserInteractionFinished",
"displayName": ".onUserInteractionFinished",
"visible": true,
"displayPriority": 5,
"category": "Operator",
"description": "The userinteractionfinished event is fired after leaving the date time input.",
"heritable": true,
"arguments": []
},
{
"name": ".onUserInteractionCanceled",
"displayName": ".onUserInteractionCanceled",
"visible": true,
"displayPriority": 7,
"category": "Operator",
"description": "The userinteractioncanceled event is fired when the user presses the escape key, causing the value to reset to its previous value.",
"heritable": true,
"arguments": []
}
],
"dataTypes": [
{
"schema": "Schema/Types.Schema.json"
}
],
"languages": {
"en": "Lang/Language.en.json",
"de": "Lang/Language.de.json"
}
}

BIN
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Icons/16x16.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 253 B

8
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Lang/Language.de.json vendored Normal file
View File

@@ -0,0 +1,8 @@
{
"$schema": "../../../TwinCAT-HMI-Common/JsonSchemas/Language.Schema.json",
"locale": "de",
"localizedText": {
"ValueFormat": "Ungültiger Wert. Der Wert muss dem ISO 8601-Standard entsprechen.",
"ValueEmpty": "Es wurde kein Wert eingegeben."
}
}

8
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Lang/Language.en.json vendored Normal file
View File

@@ -0,0 +1,8 @@
{
"$schema": "../../../TwinCAT-HMI-Common/JsonSchemas/Language.Schema.json",
"locale": "en",
"localizedText": {
"ValueFormat": "Wrong value format. The value must conform to the ISO 8601 standard.",
"ValueEmpty": "No value entered."
}
}

20
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Schema/Types.Schema.json vendored Normal file
View File

@@ -0,0 +1,20 @@
{
"$schema": "http://json-schema.org/draft-04/schema",
"definitions": {
"TcHmi.Controls.Beckhoff.TcHmiDateTimeInput": {
"type": "object",
"frameworkInstanceOf": "TcHmi.Controls.System.TcHmiControl",
"frameworkControlType": "TcHmiDateTimeInput",
"frameworkControlNamespace": "TcHmi.Controls.Beckhoff"
},
"TcHmiDateTimeInput": {
"$ref": "tchmi:framework#/definitions/TcHmi.Controls.Beckhoff.TcHmiDateTimeInput"
},
"TcHmi.Controls.Beckhoff.TcHmiDateTimeInput.ButtonPosition": {
"title": "DateTimeInputButtonPosition",
"type": "string",
"enum": ["Left", "Right"],
"default": "Right"
}
}
}

99
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Style.css vendored Normal file
View File

@@ -0,0 +1,99 @@
/** Styles for all themes */
/* Style for the main element */
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput {
/* Prevent overflow if the border radius is huge */
overflow: hidden;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template {
position: relative;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
display: grid;
border-radius: inherit;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button {
grid-column: 2;
grid-row: 1;
width: 100%;
height: 100%;
border-top-right-radius: inherit;
border-bottom-right-radius: inherit;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input {
background: transparent;
grid-column: 1;
grid-row: 1;
font-family: inherit;
font-size: inherit;
font-style: inherit;
font-weight: inherit;
text-align: left;
white-space: pre;
overflow: hidden;
position: relative;
padding: 2px;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
outline: none;
resize: none;
cursor: text;
display: flex;
align-items: flex-start;
border-top-left-radius: inherit;
border-bottom-left-radius: inherit;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.left .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button {
grid-column: 1;
grid-row: 1;
}
.left .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input {
grid-column: 2;
grid-row: 1;
}
/* The main use for this control is interaction. So mark when this is not allowed. */
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput.TcHmi_Controls_System_TcHmiControl-operate-disallowed::after {
content: '';
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.5);
z-index: 100;
cursor: not-allowed;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input-invalid-notification {
position: absolute;
display: flex;
align-items: center;
height: 100%;
top: 0px;
right: 0px;
pointer-events: none;
padding: 2px;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input:not(:invalid)
+ .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input-invalid-notification {
visibility: hidden;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template:not(.left)
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input-invalid-notification {
right: 26px; /* same size as button (flex-basis: 26px;) */
}

487
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/TcHmiDateTimeInput.d.ts vendored Normal file
View File

@@ -0,0 +1,487 @@
// Compatibility file for non-module typescript compiles without adjustments.
// Use the following line for modern code (needs adjustments to tsconfig.json#configOptions/paths)
// import { TcHmiControl } from "Beckhoff.TwinCAT.HMI.Framework/index.esm.js";
// ***************************************************************************
declare class TcHmiDateTimeInput extends TcHmi.Controls.System.TcHmiControl {
#private;
constructor(element: JQuery, pcElement: JQuery, attrs: TcHmi.Controls.ControlAttributeList);
/** Reference to the root dom element of the current control template as html element. */
protected __elementTemplateRoot: HTMLElement;
/** Reference to the underlying html text textarea or input element as jquery object. */
protected __elementInput: HTMLInputElement;
/** Reference to the underlying button element as html element. */
protected __elementButton: HTMLElement;
/** Reference to the DateTimePicker*/
protected __dateTimePicker: TcHmiDateTimePicker;
/** Reference to the invalid notification label element as jquery object. */
protected __elementInvalidNotificationLabel: HTMLLabelElement;
/**
* Is set to true if the control is locked and to false if the control is unlocked.
* When the control is locked, calls to setValue are ignored.
*/
protected __locked: boolean;
/** Internal reference to the attribute "data-tchmi-value" */
protected __value: string | null | undefined;
/**
* Internal reference to the attribute "data-tchmi-min-value" (iso timestamp string)
*/
protected __minValue: string | undefined;
/**
* Internal reference to the attribute "data-tchmi-max-value" (iso timestamp string)
*/
protected __maxValue: string | undefined;
/** Internal reference to the attribute 'data-tchmi-ignore-invalid-values' */
protected __ignoreInvalidValues: boolean | undefined;
protected __valueBuffer: ValueBuffer<string | null> | undefined;
/** Value at focusin time */
protected __oldValue: string | null | undefined;
/** Last input string which could be converted into a number */
protected __lastValidValue: string | undefined;
/** Last input string which could be converted into a number */
protected __lastInput: string | undefined;
/** Internal reference to the attribute "data-tchmi-text-horizontal-alignment */
protected __valueHorizontalAlignment: TcHmi.HorizontalAlignment | null | undefined;
/** Internal reference to the attribute "data-tchmi-content-padding" */
protected __contentPadding: TcHmi.FourSidedCss | null | undefined;
/** Internal reference to the attribute "data-tchmi-text-font-size" */
protected __valueFontSize: number | undefined;
/** Internal reference to the attribute "data-tchmi-text-font-size-unit" */
protected __valueFontSizeUnit: TcHmi.FontSizeUnit | undefined;
/** Internal reference to the attribute "data-tchmi-text-font-family" */
protected __valueFontFamily: TcHmi.FontFamily | null | undefined;
/** Internal reference to the attribute "data-tchmi-text-font-style" */
protected __valueFontStyle: TcHmi.FontStyle | undefined;
/** Internal reference to the attribute "data-tchmi-text-font-style" */
protected __valueFontWeight: TcHmi.FontWeight | undefined;
/** Internal reference to the attribute "data-tchmi-placeholder" */
protected __placeholder: string | null | undefined;
/** Internal reference to the attribute "data-tchmi-text-color" */
protected __valueColor: TcHmi.SolidColor | null | undefined;
/** Internal reference to the attribute "data-tchmi-auto-focus-out" */
protected __autoFocusOut: boolean | undefined;
/** Internal reference to the attribute "data-tchmi-auto-select-text" */
protected __autoSelectText: boolean | undefined;
/** Internal reference to the attribute "data-tchmi-reset-to-last-valid-value" */
protected __resetToLastValidValue: boolean | undefined;
/** Internal reference to the attribute 'data-tchmi-button-position' */
protected __buttonPosition: 'Left' | 'Right' | undefined;
/**
* ReadOnly state of the control.
*/
protected __isReadOnly: boolean | undefined;
/** Interaction has started so we should raise event after it. */
protected __triggerUIFinishedOnBlur: boolean;
/** Localization */
protected __localizedInput: {
key: string;
parameters: any[];
};
protected __localizationReader: TcHmi.Locale.LocalizationReader | undefined;
/** Regex to validate a string after RFC 3339, the subset of ISO 8601 that is used in JsonSchema. See https://regexr.com/5cnhd for tests.*/
private __REGEX_ISO_8601;
/**
* If raised, the control object exists in control cache and constructor of each inheritation level was called.
* This function is only to be used by the System. Other function calls are not intended.
*/
__previnit(): void;
/**
* If raised, all attributes have been set to it's default or dom values.
* This function is only to be used by the System. Other function calls are not intended.
*/
__init(): void;
/**
* Is called by the system after the control instance gets part of the current DOM.
* This function is only to be used by the System. Other function calls are not intended.
*/
__attach(): void;
/**
* Is called by the system after the control instance is no longer part of the current DOM.
* This function is only to be used by the System. Other function calls are not intended.
*/
__detach(): void;
/**
* Destroy the current control instance.
* Will be called automatically if system destroys control!
*/
destroy(): void;
/**
* Validates the value of the html input element. Input must conform to the ISO 8601 standard.
* Higlights the controls if value is out of range.
*/
protected __validateInput(): void;
/**
* Handle submit on keydown
*/
protected __onKeydown(event: KeyboardEvent): void;
/**
* Handle value change on "input" to support virtual keyboards on mobile devices
* which caches the value while editing (iOS for example)
* input is fired when the keys has changed text
*/
protected __onInput(_event: Event): void;
/**
* Is raised if text is pasted into the underlying textarea element.
*/
protected __onPaste(_event: Event): void;
/**
* Is raised if text is cut from the underlying textarea element.
*/
protected __onCut(_event: Event): void;
/**
* Is raised if the underlying input element gets the focus.
*/
protected __onFocusIn(event: FocusEvent): void;
/**
* Is raised if the underlying input element has lost its focus.
*/
protected __onFocusOut(event: FocusEvent): void;
/**
* Performs the steps after a focusout event was received.
* @param event The focusout event.
*/
protected __performFocusOut(event: Event): void;
/**
* Is raised after successful interaction with a TcHmiKeyboard control with indirect input.
* @param event The event.
*/
protected __onIndirectInputFinished(_event: Event): void;
/**
* Is raised after canceled interaction with a TcHmiKeyboard control with indirect input.
* @param event The event.
*/
protected __onIndirectInputCanceled(event: Event): void;
/**
* Is called when the button is clicked.
*/
protected __onClick(_event: MouseEvent): void;
/**
* Is called value of the date time picker control changed.
*/
protected __onValueChanged(): void;
/**
* Is called if the input of the date time picker control was canceled.
*/
protected __onCancel(_event: TcHmi.EventProvider.Event): void;
/**
* Is called if the input of the date time picker control was confirmed.
*/
protected __onConfirmed(_event: TcHmi.EventProvider.Event): void;
/**
* Change the localization of the input elements validity
* @param key The localization key.
* @param parameters Optional parameters to pass to tchmi_format_string.
*/
__setLocalizedInputValidity(key: string, ...parameters: any[]): void;
/**
* Sets the value of the member variable "value" if the new value is not equal to the current value
* or the current control instance is locked and calls the associated process function (processValue) after that.
* @param valueNew The new value for value.
*/
setValue(valueNew: string | null): void;
/**
* Sets the value of the member variable "value" regardless of lock.
* @param valueNew The new value for value
* @param writeToInput Whether to write the value back to the input element.
*/
protected __setValue(valueNew: string | null | undefined, writeToInput?: boolean): void;
/**
* Returns the current value of the member variable value.
* @returns the current value of the member variable value.
*/
getValue(): string | null | undefined;
/**
* Processes the current value of value and forwards it to the value attribute of the underlying input variable.
* The current value of value is only forwarded if it is no binding expression.
* @param writeToInput Whether to write the value back to the input element.
*/
protected __processValue(writeToInput?: boolean): void;
/**
* Sets the value of MinValue
* @param valueNew The new value for MinValue
*/
setMinValue(valueNew: string | null): void;
/**
* Gets the value of MinValue
*/
getMinValue(): string | undefined;
/**
* Processes the value of MinValue
*/
protected __processMinValue(): void;
/**
* Sets the value of MaxValue
* @param valueNew The new value for MaxValue
*/
setMaxValue(valueNew: string | null): void;
/**
* Gets the value of MaxValue
*/
getMaxValue(): string | undefined;
/**
* Processes the value of MaxValue
*/
protected __processMaxValue(): void;
/**
* Sets the ignoreInvalidValues attribute.
* @param valueNew The new value for ignoreInvalidValues.
*/
setIgnoreInvalidValues(valueNew: boolean | null): void;
/**
* Returns the current value of ignoreInvalidValues.
* @returns The current value of ignoreInvalidValues.
*/
getIgnoreInvalidValues(): boolean | undefined;
/**
* Processes the current value of attribute ignoreInvalidValues.
*/
protected __processIgnoreInvalidValues(): void;
/**
* Sets the inputProcessingPoint attribute.
* @param valueNew The new value for inputProcessingPoint.
*/
setInputProcessingPoint(valueNew: InputProcessingPoint | keyof typeof InputProcessingPoint | null): void;
/**
* Returns the current value of inputProcessingPoint.
* @returns The current value of inputProcessingPoint.
*/
getInputProcessingPoint(): InputProcessingPoint | undefined;
/**
* Processes the current InputProcessingPoint attribute value.
*/
__processInputProcessingPoint(): void;
/**
* Sets the text horizontal alignment and calls the associated process function (processValueHorizontalAlignment).
* @param valueNew The new value for textHorizontalAlignment.
*/
setValueHorizontalAlignment(valueNew: TcHmi.HorizontalAlignment | null): void;
/**
* Returns the current value of textHorizontalAlignment.
* @returns The current value of textHorizontalAlignment.
*/
getValueHorizontalAlignment(): TcHmi.HorizontalAlignment | null | undefined;
/**
* Processes the current textHorizontalAlignment attribute value.
*/
protected __processValueHorizontalAlignment(): void;
/**
* Sets the contentPadding value and calls the associated process function (processContentPadding) after it.
* @param valueNew The new value for the contentPadding attribute as object.
*/
setContentPadding(valueNew: TcHmi.FourSidedCss | null): void;
/**
* The watch callback for the contentPadding object resolver.
*/
protected __onResolverForContentPaddingWatchCallback(data: TcHmi.Symbol.ObjectResolver.IWatchResultObject<TcHmi.FourSidedCss>): void;
/**
* Returns the current contentPadding value.
* @returns The current value of the contentPadding member variable as json in string format.
*/
getContentPadding(): TcHmi.FourSidedCss | null | undefined;
/**
* Processes the current contentPadding attribute.
*/
protected __processContentPadding(): void;
/**
* Sets the font size and calls the associated process function (processValueFontSize).
* @param valueNew The new value for textFontSize.
*/
setValueFontSize(valueNew: number | null): void;
/**
* Returns the current value of textFontSize.
* @returns The current value of textFontSize.
*/
getValueFontSize(): number | undefined;
/**
* Processes the current textFontSize attribute value.
*/
protected __processValueFontSize(): void;
/**
* Sets the font size and calls the associated process function (processValueFontSizeUnit).
* @param valueNew The new value for textFontSize.
*/
setValueFontSizeUnit(valueNew: TcHmi.FontSizeUnit | null): void;
/**
* Returns the current value of textFontSizeUnit.
*/
getValueFontSizeUnit(): TcHmi.FontSizeUnit | undefined;
/**
* Processes the current textFontSizeUnit attribute value.
*/
protected __processValueFontSizeUnit(): void;
/**
* Sets the font family and calls the associated process function (processValueFontFamily).
* @param valueNew The new value for textFontFamily.
*/
setValueFontFamily(valueNew: TcHmi.FontFamily | null): void;
/**
* Returns the current value of textFontFamily.
* @returns The current value of textFontFamily.
*/
getValueFontFamily(): string | null | undefined;
/**
* Processes the current textFontFamily attribute value.
*/
protected __processValueFontFamily(): void;
/**
* Sets the font style and calls the associated process function (processValueFontStyle).
* @param valueNew The new value for textFontStyle.
*/
setValueFontStyle(valueNew: TcHmi.FontStyle | null): void;
/**
* Returns the current value of textFontStyle.
* @returns The current value of textFontStyle.
*/
getValueFontStyle(): TcHmi.FontStyle | undefined;
/**
* Processes the current textFontStyle attribute value.
*/
protected __processValueFontStyle(): void;
/**
* Sets the font weight and calls the associated process function (processValueFontWeight).
* @param valueNew The new value for textFontWeight.
*/
setValueFontWeight(valueNew: TcHmi.FontWeight | null): void;
/**
* Returns the current value of textFontWeight.
* @returns The current value of textFontWeight.
*/
getValueFontWeight(): TcHmi.FontWeight | undefined;
/**
* Processes the current textFontWeight attribute value.
*/
protected __processValueFontWeight(): void;
/**
* Sets the placeholder value and calls the associated process function (processPlaceholder).
* @param valueNew The new value for placeholder.
*/
setPlaceholder(valueNew: string | null): void;
/**
* Returns the current value of placeholder.
* @returns The current value of placeholder.
*/
getPlaceholder(): string | null | undefined;
/**
* Processes the current placeholder attribute value.
*/
protected __processPlaceholder(): void;
/**
* Sets the text color and calls the associated process function (processValueColor).
* @param valueNew The new value for textColor.
*/
setValueColor(valueNew: TcHmi.SolidColor | null): void;
/**
* The watch callback for the textColor object resolver.
*/
protected __onResolverForValueColorWatchCallback(data: TcHmi.Symbol.ObjectResolver.IWatchResultObject<TcHmi.SolidColor>): void;
/**
* Returns the current value of textColor.
* @returns The current value of textColor.
*/
getValueColor(): TcHmi.SolidColor | null | undefined;
/**
* Processes the current textColor attribute value.
*/
protected __processValueColor(): void;
/**
* Sets the auto focus out attribute and calls the associated process function (processAutoFocusOut).
* @param valueNew The new value for autoFocusOut.
*/
setAutoFocusOut(valueNew: boolean | null): void;
/**
* Returns the current value of autoFocusOut.
* @returns The current value of autoFocusOut.
*/
getAutoFocusOut(): boolean | undefined;
/**
* Processes the current autoFocusOut attribute value.
*/
protected __processAutoFocusOut(): void;
/** Lock handling */
/**
* Lock the control. Calls to setValue will be ignored until control is unlocked.
*/
__lock(): void;
/**
* Unlocks the control.
*/
__unlock(): void;
/**
* Checks if the Control is deactivated and adjusts the visualization
*/
protected __processControlActivation(): void;
/**
* Processes the current isEnabled attribute value.
*/
__processIsEnabled(): void;
/**
* Processes the current AccessConfig attribute value.
*/
__processAccessConfig(): void;
/**
* Sets the isReadOnly attribute and calls the associated process function (processIsReadOnly).
* @preserve (Part of the public API)
*/
setIsReadOnly(valueNew: boolean | null): void;
/**
* Returns the effective value of isReadOnly based on own and parent isReadOnly variable.
*/
getIsReadOnly(): boolean | undefined;
/**
* Process IsReadOnly.
*/
protected __processIsReadOnly(): void;
/**
* Sets the auto select text attribute and calls the associated process function (processAutoSelectText).
* @param valueNew The new value for autoSelectText.
*/
setAutoSelectText(valueNew: boolean | null): void;
/**
* Returns the current value of autoSelectText.
* @returns The current value of autoSelectText.
*/
getAutoSelectText(): boolean | undefined;
/**
* Sets the resetToLastValidValue attribute.
* @param valueNew The new value for resetToLastValidValue.
*/
setResetToLastValidValue(valueNew: boolean | null): void;
/**
* Returns the current value of resetToLastValidValue.
* @returns The current value of resetToLastValidValue.
*/
getResetToLastValidValue(): boolean | undefined;
/**
* Processes the current ResetToLastValidValue attribute value.
*/
__processResetToLastValidValue(): void;
/**
* Sets the buttonPosition attribute.
* @param valueNew The new value for buttonPosition.
*/
setButtonPosition(valueNew: 'Left' | 'Right' | null): void;
/**
* Returns the current value of buttonPosition.
* @returns The current value of buttonPosition.
*/
getButtonPosition(): "Left" | "Right" | undefined;
/**
* Processes the current value of attribute buttonPosition.
*/
protected __processButtonPosition(): void;
/**
* Sets the focus to the html input element.
*/
focus(): void;
}
export { TcHmiDateTimeInput as Control };
declare const _TcHmiDateTimeInput: typeof TcHmiDateTimeInput;
type tTcHmiDateTimeInput = TcHmiDateTimeInput;
declare global {
namespace TcHmi.Controls.Beckhoff {
const TcHmiDateTimeInput: typeof _TcHmiDateTimeInput;
type TcHmiDateTimeInput = tTcHmiDateTimeInput;
}
}

6
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Template.html vendored Normal file
View File

@@ -0,0 +1,6 @@
<div class="TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template tchmi-box">
<input class="TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input tchmi-box" spellcheck="false" />
<label class="TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input-invalid-notification tchmi-box">!</label>
<div id="{Id}_TcHmiDateTimePicker" data-tchmi-type="TcHmi.Controls.Beckhoff.TcHmiDateTimePicker"></div>
<div class="TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button tchmi-box"></div>
</div>

8
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Themes/Base-Dark/Images/datetimepicker_normal.svg vendored Normal file
View File

@@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="time-span-picker-bg-less" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-status" transform="translate(6.000000, 5.000000)" fill="#ffffff">
<path d="M13.0368925,18.8781263 C9.75174991,18.8781263 7.07916266,16.2559652 7.07916266,13.0328064 C7.07916266,9.80919028 9.75174991,7.1870292 13.0368925,7.1870292 C14.8251438,7.1870292 16.427857,7.96777732 17.5210399,9.19538596 L12.9837484,12.7213305 L9.8337969,11.1218717 C9.60397211,11.0056971 9.32333413,11.0939715 9.20539159,11.3180878 C9.08698288,11.5422041 9.17648868,11.8184618 9.40491494,11.9346364 L12.8224515,13.6694798 C12.8905132,13.7037833 12.9637029,13.7207063 13.0368925,13.7207063 C13.1399174,13.7207063 13.24201,13.6868602 13.3263878,13.6219122 L18.077654,9.93039605 C18.6557123,10.8305204 18.9950885,11.8925574 18.9950885,13.0328064 C18.9950885,16.2559652 16.3225012,18.8781263 13.0368925,18.8781263 Z M1.13681663,3.82940064 L1.13681663,2.45725984 L3.46769685,2.45725984 L3.46769685,2.9146401 C3.46769685,3.16711401 3.67607754,3.37202037 3.93387289,3.37202037 C4.19120207,3.37202037 4.40004894,3.16711401 4.40004894,2.9146401 L4.40004894,2.45725984 L11.3926896,2.45725984 L11.3926896,2.9146401 C11.3926896,3.16711401 11.6010703,3.37202037 11.8588656,3.37202037 C12.1161948,3.37202037 12.3250417,3.16711401 12.3250417,2.9146401 L12.3250417,2.45725984 L14.1897458,2.45725984 L14.1897458,3.82940064 L1.13681663,3.82940064 Z M15.1220979,6.63863026 L15.1220979,1.77393371 C15.1220979,1.52145981 15.0475098,1.5424993 14.7901806,1.5424993 L12.3250417,1.5424993 L12.3250417,0.62773876 C12.3250417,0.374807471 12.1161948,0.170358491 11.8588656,0.170358491 C11.6010703,0.170358491 11.3926896,0.374807471 11.3926896,0.62773876 L11.3926896,1.5424993 L4.40004894,1.5424993 L4.40004894,0.62773876 C4.40004894,0.374807471 4.19120207,0.170358491 3.93387289,0.170358491 C3.67607754,0.170358491 3.46769685,0.374807471 3.46769685,0.62773876 L3.46769685,1.5424993 L0.662249419,1.5424993 C0.404454067,1.5424993 0.204464544,1.52145981 0.204464544,1.77393371 L0.204464544,13.2646982 C0.204464544,13.5171721 0.404454067,13.8917666 0.662249419,13.8917666 L4.71098836,13.8917666 C4.96831753,13.8917666 5.1771644,13.6868602 5.1771644,13.4343863 C5.1771644,13.181455 4.96831753,12.977006 4.71098836,12.977006 L1.13681663,12.977006 L1.13681663,4.74416118 L14.1897458,4.74416118 L14.1897458,6.39484657 C13.7235698,6.31709193 13.4102995,6.27226866 12.969297,6.27226866 C9.17089456,6.27226866 6.11277972,9.30515722 6.11277972,13.0328064 C6.11277972,16.7604556 9.2207754,19.7928868 13.0201102,19.7928868 C16.8194449,19.7928868 19.8519201,16.7604556 19.8519201,13.0328064 C19.8519201,10.0676101 17.9191542,7.54790223 15.1220979,6.63863026 Z" id="Fill-1"></path>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

8
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Themes/Base-Dark/Images/datetimepicker_pressed.svg vendored Normal file
View File

@@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="time-span-picker-bg-less" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-status" transform="translate(6.000000, 5.000000)" fill="#ffffff">
<path d="M13.0368925,18.8781263 C9.75174991,18.8781263 7.07916266,16.2559652 7.07916266,13.0328064 C7.07916266,9.80919028 9.75174991,7.1870292 13.0368925,7.1870292 C14.8251438,7.1870292 16.427857,7.96777732 17.5210399,9.19538596 L12.9837484,12.7213305 L9.8337969,11.1218717 C9.60397211,11.0056971 9.32333413,11.0939715 9.20539159,11.3180878 C9.08698288,11.5422041 9.17648868,11.8184618 9.40491494,11.9346364 L12.8224515,13.6694798 C12.8905132,13.7037833 12.9637029,13.7207063 13.0368925,13.7207063 C13.1399174,13.7207063 13.24201,13.6868602 13.3263878,13.6219122 L18.077654,9.93039605 C18.6557123,10.8305204 18.9950885,11.8925574 18.9950885,13.0328064 C18.9950885,16.2559652 16.3225012,18.8781263 13.0368925,18.8781263 Z M1.13681663,3.82940064 L1.13681663,2.45725984 L3.46769685,2.45725984 L3.46769685,2.9146401 C3.46769685,3.16711401 3.67607754,3.37202037 3.93387289,3.37202037 C4.19120207,3.37202037 4.40004894,3.16711401 4.40004894,2.9146401 L4.40004894,2.45725984 L11.3926896,2.45725984 L11.3926896,2.9146401 C11.3926896,3.16711401 11.6010703,3.37202037 11.8588656,3.37202037 C12.1161948,3.37202037 12.3250417,3.16711401 12.3250417,2.9146401 L12.3250417,2.45725984 L14.1897458,2.45725984 L14.1897458,3.82940064 L1.13681663,3.82940064 Z M15.1220979,6.63863026 L15.1220979,1.77393371 C15.1220979,1.52145981 15.0475098,1.5424993 14.7901806,1.5424993 L12.3250417,1.5424993 L12.3250417,0.62773876 C12.3250417,0.374807471 12.1161948,0.170358491 11.8588656,0.170358491 C11.6010703,0.170358491 11.3926896,0.374807471 11.3926896,0.62773876 L11.3926896,1.5424993 L4.40004894,1.5424993 L4.40004894,0.62773876 C4.40004894,0.374807471 4.19120207,0.170358491 3.93387289,0.170358491 C3.67607754,0.170358491 3.46769685,0.374807471 3.46769685,0.62773876 L3.46769685,1.5424993 L0.662249419,1.5424993 C0.404454067,1.5424993 0.204464544,1.52145981 0.204464544,1.77393371 L0.204464544,13.2646982 C0.204464544,13.5171721 0.404454067,13.8917666 0.662249419,13.8917666 L4.71098836,13.8917666 C4.96831753,13.8917666 5.1771644,13.6868602 5.1771644,13.4343863 C5.1771644,13.181455 4.96831753,12.977006 4.71098836,12.977006 L1.13681663,12.977006 L1.13681663,4.74416118 L14.1897458,4.74416118 L14.1897458,6.39484657 C13.7235698,6.31709193 13.4102995,6.27226866 12.969297,6.27226866 C9.17089456,6.27226866 6.11277972,9.30515722 6.11277972,13.0328064 C6.11277972,16.7604556 9.2207754,19.7928868 13.0201102,19.7928868 C16.8194449,19.7928868 19.8519201,16.7604556 19.8519201,13.0328064 C19.8519201,10.0676101 17.9191542,7.54790223 15.1220979,6.63863026 Z" id="Fill-1"></path>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

60
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Themes/Base-Dark/Style.css vendored Normal file
View File

@@ -0,0 +1,60 @@
/** Styles for the theme: Base-Dark */
/* Style for the main element */
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput {
--tchmi-background: var(--tchmi-background-color-4);
--tchmi-background-invalid: var(--tchmi-invalid-color);
--tchmi-color: var(--tchmi-foreground-color-1);
--tchmi-border-color: var(--tchmi-background-color-2);
background-color: var(--tchmi-background);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template {
grid-template-columns: auto 26px;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template.left {
grid-template-columns: 26px auto;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input {
color: var(--tchmi-color);
border: 1px solid var(--tchmi-border-color);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button {
font-size: var(--tchmi-button-font-size);
background: url(Images/datetimepicker_normal.svg), var(--tchmi-highlight-button-background);
background-repeat: no-repeat;
background-position: center;
color: var(--tchmi-highlight-button-text-color);
border: var(--tchmi-highlight-button-border);
box-shadow: var(--tchmi-highlight-button-shadow);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button:active {
background: url(Images/datetimepicker_pressed.svg), var(--tchmi-highlight-button-background-pressed);
background-repeat: no-repeat;
background-position: center;
color: var(--tchmi-highlight-button-text-color-pressed);
border: var(--tchmi-highlight-button-border-pressed);
box-shadow: var(--tchmi-highlight-button-shadow-pressed);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input:is(:focus, .tchmi-focus, .tchmi-keyboard-user-input) {
background: rgba(76, 99, 116, 0.05);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input:invalid {
background: var(--tchmi-background-invalid);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input-invalid-notification {
color: red;
font-weight: bold;
font-size: 15px;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput.read-only {
background: var(--tchmi-read-only-color);
}

8
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Themes/Base/Images/datetimepicker_normal.svg vendored Normal file
View File

@@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="time-span-picker-bg-less" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-status" transform="translate(6.000000, 5.000000)" fill="#ffffff">
<path d="M13.0368925,18.8781263 C9.75174991,18.8781263 7.07916266,16.2559652 7.07916266,13.0328064 C7.07916266,9.80919028 9.75174991,7.1870292 13.0368925,7.1870292 C14.8251438,7.1870292 16.427857,7.96777732 17.5210399,9.19538596 L12.9837484,12.7213305 L9.8337969,11.1218717 C9.60397211,11.0056971 9.32333413,11.0939715 9.20539159,11.3180878 C9.08698288,11.5422041 9.17648868,11.8184618 9.40491494,11.9346364 L12.8224515,13.6694798 C12.8905132,13.7037833 12.9637029,13.7207063 13.0368925,13.7207063 C13.1399174,13.7207063 13.24201,13.6868602 13.3263878,13.6219122 L18.077654,9.93039605 C18.6557123,10.8305204 18.9950885,11.8925574 18.9950885,13.0328064 C18.9950885,16.2559652 16.3225012,18.8781263 13.0368925,18.8781263 Z M1.13681663,3.82940064 L1.13681663,2.45725984 L3.46769685,2.45725984 L3.46769685,2.9146401 C3.46769685,3.16711401 3.67607754,3.37202037 3.93387289,3.37202037 C4.19120207,3.37202037 4.40004894,3.16711401 4.40004894,2.9146401 L4.40004894,2.45725984 L11.3926896,2.45725984 L11.3926896,2.9146401 C11.3926896,3.16711401 11.6010703,3.37202037 11.8588656,3.37202037 C12.1161948,3.37202037 12.3250417,3.16711401 12.3250417,2.9146401 L12.3250417,2.45725984 L14.1897458,2.45725984 L14.1897458,3.82940064 L1.13681663,3.82940064 Z M15.1220979,6.63863026 L15.1220979,1.77393371 C15.1220979,1.52145981 15.0475098,1.5424993 14.7901806,1.5424993 L12.3250417,1.5424993 L12.3250417,0.62773876 C12.3250417,0.374807471 12.1161948,0.170358491 11.8588656,0.170358491 C11.6010703,0.170358491 11.3926896,0.374807471 11.3926896,0.62773876 L11.3926896,1.5424993 L4.40004894,1.5424993 L4.40004894,0.62773876 C4.40004894,0.374807471 4.19120207,0.170358491 3.93387289,0.170358491 C3.67607754,0.170358491 3.46769685,0.374807471 3.46769685,0.62773876 L3.46769685,1.5424993 L0.662249419,1.5424993 C0.404454067,1.5424993 0.204464544,1.52145981 0.204464544,1.77393371 L0.204464544,13.2646982 C0.204464544,13.5171721 0.404454067,13.8917666 0.662249419,13.8917666 L4.71098836,13.8917666 C4.96831753,13.8917666 5.1771644,13.6868602 5.1771644,13.4343863 C5.1771644,13.181455 4.96831753,12.977006 4.71098836,12.977006 L1.13681663,12.977006 L1.13681663,4.74416118 L14.1897458,4.74416118 L14.1897458,6.39484657 C13.7235698,6.31709193 13.4102995,6.27226866 12.969297,6.27226866 C9.17089456,6.27226866 6.11277972,9.30515722 6.11277972,13.0328064 C6.11277972,16.7604556 9.2207754,19.7928868 13.0201102,19.7928868 C16.8194449,19.7928868 19.8519201,16.7604556 19.8519201,13.0328064 C19.8519201,10.0676101 17.9191542,7.54790223 15.1220979,6.63863026 Z" id="Fill-1"></path>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

8
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Themes/Base/Images/datetimepicker_pressed.svg vendored Normal file
View File

@@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="time-span-picker-bg-less" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-status" transform="translate(6.000000, 5.000000)" fill="#ffffff">
<path d="M13.0368925,18.8781263 C9.75174991,18.8781263 7.07916266,16.2559652 7.07916266,13.0328064 C7.07916266,9.80919028 9.75174991,7.1870292 13.0368925,7.1870292 C14.8251438,7.1870292 16.427857,7.96777732 17.5210399,9.19538596 L12.9837484,12.7213305 L9.8337969,11.1218717 C9.60397211,11.0056971 9.32333413,11.0939715 9.20539159,11.3180878 C9.08698288,11.5422041 9.17648868,11.8184618 9.40491494,11.9346364 L12.8224515,13.6694798 C12.8905132,13.7037833 12.9637029,13.7207063 13.0368925,13.7207063 C13.1399174,13.7207063 13.24201,13.6868602 13.3263878,13.6219122 L18.077654,9.93039605 C18.6557123,10.8305204 18.9950885,11.8925574 18.9950885,13.0328064 C18.9950885,16.2559652 16.3225012,18.8781263 13.0368925,18.8781263 Z M1.13681663,3.82940064 L1.13681663,2.45725984 L3.46769685,2.45725984 L3.46769685,2.9146401 C3.46769685,3.16711401 3.67607754,3.37202037 3.93387289,3.37202037 C4.19120207,3.37202037 4.40004894,3.16711401 4.40004894,2.9146401 L4.40004894,2.45725984 L11.3926896,2.45725984 L11.3926896,2.9146401 C11.3926896,3.16711401 11.6010703,3.37202037 11.8588656,3.37202037 C12.1161948,3.37202037 12.3250417,3.16711401 12.3250417,2.9146401 L12.3250417,2.45725984 L14.1897458,2.45725984 L14.1897458,3.82940064 L1.13681663,3.82940064 Z M15.1220979,6.63863026 L15.1220979,1.77393371 C15.1220979,1.52145981 15.0475098,1.5424993 14.7901806,1.5424993 L12.3250417,1.5424993 L12.3250417,0.62773876 C12.3250417,0.374807471 12.1161948,0.170358491 11.8588656,0.170358491 C11.6010703,0.170358491 11.3926896,0.374807471 11.3926896,0.62773876 L11.3926896,1.5424993 L4.40004894,1.5424993 L4.40004894,0.62773876 C4.40004894,0.374807471 4.19120207,0.170358491 3.93387289,0.170358491 C3.67607754,0.170358491 3.46769685,0.374807471 3.46769685,0.62773876 L3.46769685,1.5424993 L0.662249419,1.5424993 C0.404454067,1.5424993 0.204464544,1.52145981 0.204464544,1.77393371 L0.204464544,13.2646982 C0.204464544,13.5171721 0.404454067,13.8917666 0.662249419,13.8917666 L4.71098836,13.8917666 C4.96831753,13.8917666 5.1771644,13.6868602 5.1771644,13.4343863 C5.1771644,13.181455 4.96831753,12.977006 4.71098836,12.977006 L1.13681663,12.977006 L1.13681663,4.74416118 L14.1897458,4.74416118 L14.1897458,6.39484657 C13.7235698,6.31709193 13.4102995,6.27226866 12.969297,6.27226866 C9.17089456,6.27226866 6.11277972,9.30515722 6.11277972,13.0328064 C6.11277972,16.7604556 9.2207754,19.7928868 13.0201102,19.7928868 C16.8194449,19.7928868 19.8519201,16.7604556 19.8519201,13.0328064 C19.8519201,10.0676101 17.9191542,7.54790223 15.1220979,6.63863026 Z" id="Fill-1"></path>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

62
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiDateTimeInput/Themes/Base/Style.css vendored Normal file
View File

@@ -0,0 +1,62 @@
/** Styles for the theme: Base */
/* Style for the main element */
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput {
--tchmi-background: var(--tchmi-background-color-4);
--tchmi-background-invalid: var(--tchmi-invalid-color);
--tchmi-color: var(--tchmi-foreground-color-1);
--tchmi-border-color: var(--tchmi-background-color-2);
background-color: var(--tchmi-background);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template {
grid-template-columns: auto 26px;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template.left {
grid-template-columns: 26px auto;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input {
-webkit-appearance: none; /* Important to have visible box-shadow on input elements in iOS/Safari. */
appearance: none;
color: var(--tchmi-color);
border: 1px solid var(--tchmi-border-color);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button {
font-size: var(--tchmi-button-font-size);
background: url(Images/datetimepicker_normal.svg), var(--tchmi-highlight-button-background);
background-repeat: no-repeat;
background-position: center;
color: var(--tchmi-highlight-button-text-color);
border: var(--tchmi-highlight-button-border);
box-shadow: var(--tchmi-highlight-button-shadow);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput .TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-button:active {
background: url(Images/datetimepicker_pressed.svg), var(--tchmi-highlight-button-background-pressed);
background-repeat: no-repeat;
background-position: center;
color: var(--tchmi-highlight-button-text-color-pressed);
border: var(--tchmi-highlight-button-border-pressed);
box-shadow: var(--tchmi-highlight-button-shadow-pressed);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input:is(:focus, .tchmi-focus, .tchmi-keyboard-user-input) {
background: rgba(76, 99, 116, 0.05);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input:invalid {
background: var(--tchmi-background-invalid);
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput-template-input-invalid-notification {
color: red;
font-weight: bold;
font-size: 15px;
}
.TcHmi_Controls_Beckhoff_TcHmiDateTimeInput.read-only {
background: var(--tchmi-read-only-color);
}