Button "pointerup" not registered at times in flowfuze Dashboard 2.0

Hello All,

I am trying to control apple tv in the below flow (and other devices that require press and hold actions), where on short press it will just trigger one pulse, however if "pointerdown" is detected for more than half second without "pointerup" event, it will keep on pulsing the command every 20ms, until "pointerup" event is detected.

Code works fine, however with a bit of debugging, i noticed that flowfuze Dashboard 2.0 button node would not report "pointerup" event 100% of the time. Are these bugs something that can be rectified somehow?

[
    {
        "id": "a435eaa503f8d1f8",
        "type": "tab",
        "label": "Flow 1",
        "disabled": false,
        "info": "",
        "env": []
    },
    {
        "id": "6c59de489cb35677",
        "type": "ui-button",
        "z": "a435eaa503f8d1f8",
        "group": "9f1341f87eb0b58b",
        "name": "up",
        "label": "<font size=10><span class=\"mdi mdi-arrow-up-bold-outline\"></span>",
        "order": 2,
        "width": "1",
        "height": "2",
        "emulateClick": false,
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "iconPosition": "left",
        "payload": "",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "buttonColor": "background-image= linear-gradient(90deg, #000000, #02413b)",
        "textColor": "",
        "iconColor": "",
        "enableClick": false,
        "enablePointerdown": true,
        "pointerdownPayload": "true",
        "pointerdownPayloadType": "bool",
        "enablePointerup": true,
        "pointerupPayload": "false",
        "pointerupPayloadType": "bool",
        "x": 430,
        "y": 180,
        "wires": [
            [
                "b021bf4ec520c7b1",
                "8f7d236e883966da"
            ]
        ]
    },
    {
        "id": "b021bf4ec520c7b1",
        "type": "button-events",
        "z": "a435eaa503f8d1f8",
        "name": "test",
        "outputs": 3,
        "inputField": "payload",
        "inputFieldType": "msg",
        "outputField": "payload",
        "outputFieldType": "msg",
        "downValue": "true",
        "downValueType": "bool",
        "upValue": "false",
        "upValueType": "bool",
        "idleValue": "1",
        "buttonEventsConfig": "1401704f15c5bfa5",
        "clickedInterval": null,
        "pressedInterval": null,
        "debounceInterval": null,
        "events": [
            {
                "type": "clicked"
            },
            {
                "type": "pressed"
            },
            {
                "type": "released"
            }
        ],
        "x": 590,
        "y": 180,
        "wires": [
            [
                "df7e04ea700450d4"
            ],
            [
                "feb98c2030f475bf"
            ],
            [
                "feb98c2030f475bf"
            ]
        ]
    },
    {
        "id": "df7e04ea700450d4",
        "type": "trigger",
        "z": "a435eaa503f8d1f8",
        "name": "",
        "op1": "sendir,1:1,1,39000,1,69,347,172,21,22,21,65,21,65,21,65,21,22,21,65,21,65,21,65,21,65,21,65,21,65,21,22,21,22,21,22,21,22,21,65,21,22,21,65,21,22,21,64,21,22,21,22,21,22,21,22,21,22,21,65,21,22,21,65,21,65,21,22,21,65,21,65,21,1470,347,86,21,3694",
        "op2": "",
        "op1type": "str",
        "op2type": "nul",
        "duration": "100",
        "extend": false,
        "overrideDelay": false,
        "units": "ms",
        "reset": "false",
        "bytopic": "all",
        "topic": "topic",
        "outputs": 1,
        "x": 820,
        "y": 160,
        "wires": [
            [
                "0aa84c08c8f56ac7"
            ]
        ]
    },
    {
        "id": "feb98c2030f475bf",
        "type": "trigger",
        "z": "a435eaa503f8d1f8",
        "name": "",
        "op1": "sendir,1:1,1,39000,1,69,347,172,21,22,21,65,21,65,21,65,21,22,21,65,21,65,21,65,21,65,21,65,21,65,21,22,21,22,21,22,21,22,21,65,21,22,21,65,21,22,21,64,21,22,21,22,21,22,21,22,21,22,21,65,21,22,21,65,21,65,21,22,21,65,21,65,21,1470,347,86,21,3694",
        "op2": "0",
        "op1type": "str",
        "op2type": "str",
        "duration": "-100",
        "extend": false,
        "overrideDelay": false,
        "units": "ms",
        "reset": "released",
        "bytopic": "all",
        "topic": "topic",
        "outputs": 1,
        "x": 800,
        "y": 200,
        "wires": [
            [
                "0aa84c08c8f56ac7"
            ]
        ]
    },
    {
        "id": "8f7d236e883966da",
        "type": "debug",
        "z": "a435eaa503f8d1f8",
        "name": "Button Events",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 620,
        "y": 100,
        "wires": []
    },
    {
        "id": "0aa84c08c8f56ac7",
        "type": "debug",
        "z": "a435eaa503f8d1f8",
        "name": "CMD sent",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 1040,
        "y": 180,
        "wires": []
    },
    {
        "id": "9f1341f87eb0b58b",
        "type": "ui-group",
        "name": "Apple TV",
        "page": "293be73524f2f689",
        "width": "4",
        "height": "4",
        "order": 1,
        "showTitle": true,
        "className": "",
        "visible": "true",
        "disabled": "false",
        "groupType": "default"
    },
    {
        "id": "1401704f15c5bfa5",
        "type": "button-events-config",
        "name": "Button Hold Timings",
        "clickedInterval": "20",
        "pressedInterval": "500",
        "debounceInterval": "15"
    },
    {
        "id": "293be73524f2f689",
        "type": "ui-page",
        "name": "Apple TV",
        "ui": "8fa8d48807f25123",
        "path": "/page1",
        "icon": "apple mdi-48px",
        "layout": "grid",
        "theme": "c3675db52282be61",
        "breakpoints": [
            {
                "name": "Default",
                "px": "0",
                "cols": "4"
            },
            {
                "name": "Desktop",
                "px": "1024",
                "cols": "4"
            }
        ],
        "order": 3,
        "className": "",
        "visible": true,
        "disabled": false
    },
    {
        "id": "8fa8d48807f25123",
        "type": "ui-base",
        "name": "Wyrestorm",
        "path": "/dashboard",
        "appIcon": "http://10.10.20.51/1up.png",
        "includeClientData": true,
        "acceptsClientConfig": [
            "ui-notification",
            "ui-control"
        ],
        "showPathInSidebar": false,
        "showPageTitle": true,
        "navigationStyle": "temporary",
        "titleBarStyle": "fixed",
        "showReconnectNotification": true,
        "notificationDisplayTime": 1,
        "showDisconnectNotification": true
    },
    {
        "id": "c3675db52282be61",
        "type": "ui-theme",
        "name": "Default Theme",
        "colors": {
            "surface": "#00423c",
            "primary": "#0e5b7c",
            "bgPage": "#000000",
            "groupBg": "#233e43",
            "groupOutline": "#001e24"
        },
        "sizes": {
            "density": "default",
            "pagePadding": "12px",
            "groupGap": "12px",
            "groupBorderRadius": "10px",
            "widgetGap": "12px"
        }
    }
]

The pointerup event I believe is only triggered if the focus is still on the button itself. So, if you've pushed the button down, slid your finger/cursor away from the button, then released, I don't believe pointerup is fired.

Indeed you are right.

I just tested it and it seems to affect only mobile devices, as they get stuck on pointerdown if i slide my finger.

Interestingly on the Desktop browser i can click and slide the mouse and it will register pointerup.

I am guessing that this is something that is related to touch events on mobile devices being registered slightly different from mouse click events.

Is this something that might be accounted for? Maybe by registering the slide event somehow in nodered?

this is a very common issue for web based HMI type operations.

there is a PR waiting for final touches that introduces pointercancel event that can be used to "handle" these types of situations: Button - Added additional pointercancel eventlistener by JulianStremel · Pull Request #1487 · FlowFuse/node-red-dashboard · GitHub

That would be great, as there are several looping/ramping functions i use which get stuck at the moment, due to this issue.

Many thanks for the update, i will monitor the progress of the PR.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.