Viability for this? Touch screen login/out project

I don't have any sql nodes installed.

Alas I am not into databases.

index.html

correct

No, the rest is standard though and you already have it.

No, that is the error reference number.

I can't really see what is causing that error but you've not shared all of that code so not too surprising. If you share the code, I can take a look.

Sorry....

Full flow / tab.

Slight additions to set things up automatically.

[{"id":"11223118693cf0a4","type":"tab","label":"Sign in example","disabled":false,"info":"","env":[]},{"id":"c480c15e8ae54ca2","type":"group","z":"11223118693cf0a4","name":"Base Configuration \\n ","style":{"fill":"#bfdbef","fill-opacity":"0.12","label":true,"color":"#000000"},"nodes":["65ec86be3f5d8aed","bdd19c31149a953e","1276c925f77d592d","becd7b4e9df4cc2e","e1b8e420fb3ceba9","1fa1e50ec490537d","b00996156cb9e85e","1206478c462c5604","70dcf9c03798d318","9111efb2f00b1562","017718debee9dfd1","a02081fdfbb3f8f7","d0f1e332f11932a7","67eafc92ed9e5efd","cc9c724a5e199043","40f19743af440271","8a14206863d3b649","ff8803e82ae8e0bb"],"x":64,"y":161,"w":1320,"h":480},{"id":"8a14206863d3b649","type":"group","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Data setup \\n ","style":{"fill":"#ffffff","fill-opacity":"0.22","label":true,"color":"#000000"},"nodes":["30c20c7cdb30a0be","0744d5b8a2915619"],"x":94,"y":203,"w":532,"h":98},{"id":"ff8803e82ae8e0bb","type":"group","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Run this to update the front-end code files. Remember to change the uib-save node to point to your uibuilder node \\n ","style":{"fill":"#ffffff","fill-opacity":"0.31","label":true,"color":"#000000"},"nodes":["e50dc2ddd7b025a6","a477de9427090857","ca627c6704404be9","f197cb5ccc5f5177","96925ec19f0f5c11","3028a39579ad0503","98930d16c52dc719","f636f59656d8b9db","d65337330a162677"],"x":644,"y":203,"w":714,"h":178},{"id":"9111efb2f00b1562","type":"junction","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","x":950,"y":460,"wires":[["65ec86be3f5d8aed"]]},{"id":"017718debee9dfd1","type":"junction","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","x":950,"y":500,"wires":[["becd7b4e9df4cc2e"]]},{"id":"d65337330a162677","type":"junction","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","x":740,"y":300,"wires":[["f197cb5ccc5f5177","96925ec19f0f5c11","98930d16c52dc719"]]},{"id":"65ec86be3f5d8aed","type":"debug","z":"11223118693cf0a4","d":true,"g":"c480c15e8ae54ca2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":1055,"y":440,"wires":[],"l":false},{"id":"bdd19c31149a953e","type":"uibuilder","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"","topic":"","url":"sign-in","okToGo":true,"fwdInMessages":false,"allowScripts":false,"allowStyles":false,"copyIndex":true,"templateFolder":"blank","extTemplate":"","showfolder":false,"reload":true,"sourceFolder":"src","deployedVersion":"6.8.2","showMsgUib":true,"title":"","descr":"","x":790,"y":480,"wires":[["70dcf9c03798d318","9111efb2f00b1562"],["e1b8e420fb3ceba9","017718debee9dfd1"]]},{"id":"1276c925f77d592d","type":"uib-cache","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","cacheall":false,"cacheKey":"topic","newcache":true,"num":1,"storeName":"default","name":"","storeContext":"context","varName":"uib_cache","x":500,"y":480,"wires":[["bdd19c31149a953e"]]},{"id":"becd7b4e9df4cc2e","type":"debug","z":"11223118693cf0a4","d":true,"g":"c480c15e8ae54ca2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":1055,"y":520,"wires":[],"l":false},{"id":"e1b8e420fb3ceba9","type":"link out","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"uib-ctrl-out","mode":"link","links":["1fa1e50ec490537d"],"x":915,"y":520,"wires":[]},{"id":"1fa1e50ec490537d","type":"link in","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"uib-in-cached","links":["e1b8e420fb3ceba9","40f19743af440271"],"x":315,"y":520,"wires":[["1276c925f77d592d"]]},{"id":"b00996156cb9e85e","type":"link in","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"uib-in-nocached","links":["bdfc9a577a74bb7c"],"x":595,"y":520,"wires":[["bdd19c31149a953e"]]},{"id":"1206478c462c5604","type":"inject","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Clear Cache","props":[{"p":"uibuilderCtrl","v":"clear cache","vt":"str"},{"p":"cacheControl","v":"CLEAR","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":260,"y":480,"wires":[["1276c925f77d592d"]]},{"id":"70dcf9c03798d318","type":"link out","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"link out 135","mode":"link","links":["67eafc92ed9e5efd"],"x":915,"y":440,"wires":[]},{"id":"a02081fdfbb3f8f7","type":"change","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Members List","rules":[{"t":"set","p":"payload","pt":"msg","to":"members","tot":"flow"},{"t":"set","p":"topic","pt":"msg","to":"full-members-list","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":250,"y":420,"wires":[["1276c925f77d592d"]]},{"id":"d0f1e332f11932a7","type":"inject","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Update members list to cache","props":[],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":125,"y":420,"wires":[["a02081fdfbb3f8f7"]],"l":false},{"id":"67eafc92ed9e5efd","type":"link in","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Upd today list","links":["70dcf9c03798d318"],"x":215,"y":600,"wires":[["cc9c724a5e199043"]]},{"id":"cc9c724a5e199043","type":"function","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"Update Today & send to cache","func":"if (msg.topic === 'person-status-change') {\n    const today = flow.get('today') ?? {}\n    // Create the person if they don't exist today\n    if (!today[msg.key]) today[msg.key] = {}\n    // Merge the new record with the flow var version\n    today[msg.key] = {...today[msg.key], ...msg.record}\n    flow.set('today', today)\n\n    // Send the today list to the cache\n    // So new/reloaded browser tabs get the latest data\n    return {\n        topic: 'today-cache',\n        payload: today,\n    }\n}","outputs":1,"timeout":0,"noerr":0,"initialize":"","finalize":"","libs":[],"x":400,"y":600,"wires":[["40f19743af440271"]]},{"id":"40f19743af440271","type":"link out","z":"11223118693cf0a4","g":"c480c15e8ae54ca2","name":"today-to-cache","mode":"link","links":["1fa1e50ec490537d"],"x":595,"y":600,"wires":[]},{"id":"30c20c7cdb30a0be","type":"inject","z":"11223118693cf0a4","g":"8a14206863d3b649","name":"100 Names","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"[\"Oliver Smith\",\"Charlotte Johnson\",\"William Brown\",\"Amelia Jones\",\"Jack Taylor\",\"Ava Williams\",\"Thomas White\",\"Mia Martin\",\"Henry Thompson\",\"Isla Harris\",\"Liam Lee\",\"Sophie Walker\",\"James Hall\",\"Grace Clark\",\"Samuel Allen\",\"Emily Young\",\"Lucas King\",\"Zoe Wright\",\"Alexander Scott\",\"Chloe Green\",\"Ethan Adams\",\"Ruby Baker\",\"Noah Roberts\",\"Harper Mitchell\",\"Mason Lewis\",\"Ella Campbell\",\"Charlie Turner\",\"Lily Hill\",\"Jacob Phillips\",\"Ivy Parker\",\"Harrison Evans\",\"Sienna Edwards\",\"Sebastian Collins\",\"Zara Murphy\",\"Aiden Ward\",\"Georgia Cox\",\"Oscar Rogers\",\"Matilda Bailey\",\"Daniel Cooper\",\"Evelyn Richardson\",\"Isaac Kelly\",\"Willow Bennett\",\"Leo Wood\",\"Sophia Barnes\",\"Harvey Russell\",\"Evie Gray\",\"Elijah Carter\",\"Madison Hughes\",\"Matthew Watson\",\"Aria Price\",\"Benjamin Bell\",\"Layla Brooks\",\"Joshua Patterson\",\"Abigail Simmons\",\"Dylan Howard\",\"Hannah Fisher\",\"Archie Reed\",\"Mila Butler\",\"Nathan Foster\",\"Scarlett Murray\",\"Ryan Grant\",\"Lucy Bryant\",\"Carter Hayes\",\"Poppy Long\",\"Gabriel Hughes\",\"Ivy Johnston\",\"Christian Fox\",\"Alice Bryant\",\"Luke Wells\",\"Zoe Richardson\",\"Jonathan Brooks\",\"Madison Simpson\",\"Connor Chapman\",\"Lilly Spencer\",\"Michael Walton\",\"Ellie Lawson\",\"Cameron Abbott\",\"Maya Ward\",\"Hunter Freeman\",\"Violet McDonald\",\"Jackson Harper\",\"Audrey Osborne\",\"Elliot Goodwin\",\"Bella Walsh\",\"Aaron Owen\",\"Molly Newton\",\"Cooper Andrews\",\"Holly Fuller\",\"Joseph Harvey\",\"Piper Morgan\",\"Austin Wallace\",\"Maddison Ellis\",\"Blake Cooper\",\"Eloise Jordan\",\"Xavier Perry\",\"Isabelle Russell\",\"Chase Hughes\",\"Penelope Walsh\",\"George Hunt\",\"Alyssa Hamilton\",\"Sebastian Murray\",\"Stella Foster\"]","payloadType":"json","x":210,"y":260,"wires":[["0744d5b8a2915619","18360f435c052bf8"]],"info":"ChatGPT Prompt:\r\n\r\nPlease generate me a list of 100 random people names (given-name family-name) that would be found in Australia. Return the list as a JavaScript array of strings where each entry is in the format given-name space family-name."},{"id":"0744d5b8a2915619","type":"function","z":"11223118693cf0a4","g":"8a14206863d3b649","name":"Create master members list","func":"function getRandomFiveDigitString() {\n    // Generate a random number between 10000 and 99999\n    const randomNumber = Math.floor(10000 + Math.random() * 90000);\n    // Convert the number to a string and return it\n    return randomNumber.toString();\n}\n\nfunction getRandomDateString() {\n    // Define the start and end dates\n    const startDate = new Date('2015-01-01');\n    const endDate = new Date('2024-04-05');\n\n    // Generate a random timestamp between the start and end dates\n    const randomTimestamp = startDate.getTime() + Math.random() * (endDate.getTime() - startDate.getTime());\n\n    // Create a new date object from the random timestamp\n    const randomDate = new Date(randomTimestamp);\n\n    // Format the date as YYYY-MM-DD\n    const year = randomDate.getFullYear();\n    const month = String(randomDate.getMonth() + 1).padStart(2, '0'); // Months are zero-indexed\n    const day = String(randomDate.getDate()).padStart(2, '0');\n\n    // Return the formatted date string\n    return `${year}-${month}-${day}`;\n}\n\n// const members = flow.get('members') ?? {}\nconst members = {}\n\nconst names = msg.payload\n\nnames.forEach((name) => {\n    const id = getRandomFiveDigitString();\n    // Adding member id to key to ensure it is unique\n    members[`${name} ${id}`] = {\n        'name': name,\n        'joined': getRandomDateString(),\n        'membershipId': id,\n    };\n});\n\n// Convert the members object to an array of entries\nconst membersArray = Object.entries(members);\n\n// Sort the array based on member names (the value at index 1 of each entry)\nmembersArray.sort((a, b) => a[1].name.localeCompare(b[1].name));\n\n// Convert the sorted array back to an object\nconst sortedMembers = Object.fromEntries(membersArray);\n\n// Set the sorted members to flow context\nflow.set('members', sortedMembers);\n","outputs":1,"timeout":0,"noerr":0,"initialize":"","finalize":"","libs":[],"x":480,"y":260,"wires":[[]]},{"id":"e50dc2ddd7b025a6","type":"inject","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"","props":[],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":705,"y":300,"wires":[["d65337330a162677"]],"l":false},{"id":"a477de9427090857","type":"template","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"","field":"payload","fieldType":"msg","format":"html","syntax":"mustache","template":"<!doctype html>\n<html lang=\"en\">\n\n<head>\n\n    <meta charset=\"utf-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n    <link rel=\"icon\" href=\"../uibuilder/images/node-blue.ico\">\n\n    <title>Members In/Out Register - Node-RED UIBUILDER</title>\n    <meta name=\"description\" content=\"Node-RED UIBUILDER - Members In/Out Register\">\n\n    <!-- Your own CSS (defaults to loading uibuilders css)-->\n    <link type=\"text/css\" rel=\"stylesheet\" href=\"./index.css\" media=\"all\">\n\n    <!-- #region Supporting Scripts. These MUST be in the right order. Note no leading / -->\n    <script defer src=\"../uibuilder/uibuilder.iife.min.js\"></script>\n    <script defer src=\"./index.js\"></script>\n    <!-- #endregion -->\n\n</head>\n\n<body class=\"uib\">\n\n    <h1 class=\"with-subtitle\">Members In/Out Register</h1>\n    <div role=\"doc-subtitle\">Using Node-RED and the UIBUILDER IIFE library.</div>\n\n    <div>\n        <label for=\"search\">Search: </label>\n        <input id=\"search\" type=\"text\" placeholder=\"Enter first characters of name to search for\" style=\"width: 50%;\" oninput=\"doSearch(event)\">\n    </div>\n\n    <ul id=\"results\"></ul>\n\n</body>\n\n</html>","output":"str","x":1040,"y":260,"wires":[["ca627c6704404be9"]]},{"id":"ca627c6704404be9","type":"uib-save","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","url":"sign-in","uibId":"bdd19c31149a953e","folder":"src","fname":"","createFolder":false,"reload":false,"usePageName":false,"encoding":"utf8","mode":438,"name":"","topic":"","x":1180,"y":300,"wires":[]},{"id":"f197cb5ccc5f5177","type":"change","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"index.html","rules":[{"t":"set","p":"fname","pt":"msg","to":"index.html","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":850,"y":260,"wires":[["a477de9427090857"]]},{"id":"96925ec19f0f5c11","type":"change","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"index.js","rules":[{"t":"set","p":"fname","pt":"msg","to":"index.js","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":840,"y":300,"wires":[["3028a39579ad0503"]]},{"id":"3028a39579ad0503","type":"template","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"","field":"payload","fieldType":"msg","format":"javascript","syntax":"mustache","template":"let fullMembersList = {}\nlet members = []\nlet today = {}\n\nfunction doInOut(event) {\n    const key = event.target.value\n    // If the person not yet seen today, create them an entry\n    if (!today[key]) today[key] = { status: 'out' }\n    // Toggle their status\n    if (today[key].status === 'out') {\n        today[key].status = 'in'\n        today[key].inTime = new Date()\n    } else {\n        today[key].status = 'out'\n        today[key].outTime = new Date()\n    }\n    // send today update to node-red\n    uibuilder.send({\n        topic: 'person-status-change',\n        key: key,\n        record: today[key],\n    })\n    // Toggle the button class\n    const id = key.replace(/ /g, '_')\n    const btn = $(`#${id}`)\n    btn.setAttribute('class', today[key].status)\n    // console.log('btn click: ', key, id, today[key].status, btn)\n}\n\n// Listen for incoming messages from Node-RED and action\n// Actually, you only need to send the list of member keys, not the full thing.\nuibuilder.onTopic('full-members-list', (msg) => {\n    fullMembersList = msg.payload\n    members = Object.keys(fullMembersList)\n    console.log('full-members-list received')\n})\n\nuibuilder.onTopic('today-cache', (msg) => {\n    today = msg.payload\n    members = Object.keys(fullMembersList)\n    console.log('today-list received')\n})\n\nfunction doSearch(event) {\n    if (fullMembersList.length < 1) {\n        alert('Members list not yet received')\n        return\n    }\n    if (members.length < 1) members = Object.keys(fullMembersList)\n\n    // console.log('input', event.data, event.target.value, event)\n    const val = event.target.value\n    let result\n    if (val.length >= 1) {\n        // Get a reference to the results list\n        const ul = $('#results')\n        // Clear out all of the results\n        ul.innerHTML = ''\n        // Search for members starting with the types letters\n        // result = members.filter( m => m.startsWith(val))\n        result = members.filter(m => (m.toLowerCase()).includes(val.toLowerCase()))\n        console.log(`${result.length} names found`)\n        // Loop through the results adding list entries\n        result.forEach(r => {\n            const li = document.createElement('li')\n            const id = r.replace(/ /g, '_')\n            let status\n            if (today[r]) {\n                status = today[r].status\n            } else {\n                status = 'out'\n            }\n            li.innerHTML = `<button id=\"${id}\" onclick=\"doInOut(event)\" class=\"${status}\" value=\"${r}\" data-name=\"${fullMembersList[r].name}\">${r}</button>`\n            ul.appendChild(li)\n        })\n    }\n}\n","output":"str","x":1040,"y":300,"wires":[["ca627c6704404be9"]]},{"id":"98930d16c52dc719","type":"change","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"index.css","rules":[{"t":"set","p":"fname","pt":"msg","to":"index.css","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":840,"y":340,"wires":[["f636f59656d8b9db"]]},{"id":"f636f59656d8b9db","type":"template","z":"11223118693cf0a4","g":"ff8803e82ae8e0bb","name":"","field":"payload","fieldType":"msg","format":"css","syntax":"mustache","template":"/* Load defaults from `<userDir>/node_modules/node-red-contrib-uibuilder/front-end/uib-brand.min.css`\n * This version auto-adjusts for light/dark browser settings but might not be as complete.\n */\n@import url(\"../uibuilder/uib-brand.min.css\");\n\n/* OR, load the defaults from the older `<userDir>/node_modules/node-red-contrib-uibuilder/front-end/uib-styles.css` */\n/* @import url(\"../uibuilder/uib-styles.css\"); */\n\n.in {\n    color: hsl(120, 100%, 50%);\n}\n\n.out {\n    color: hsl(290, 100%, 80%);\n}","output":"str","x":1040,"y":340,"wires":[["ca627c6704404be9"]]},{"id":"18360f435c052bf8","type":"delay","z":"11223118693cf0a4","name":"","pauseType":"delay","timeout":"1","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"allowrate":false,"outputs":1,"x":420,"y":130,"wires":[["d65337330a162677","013971784f3824dc"]]},{"id":"013971784f3824dc","type":"delay","z":"11223118693cf0a4","name":"","pauseType":"delay","timeout":"1","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"allowrate":false,"outputs":1,"x":580,"y":130,"wires":[["a02081fdfbb3f8f7"]]}]

Thanks. I'm not seeing any errors in the js code except for the uibuilder one which is expected and can be ignored because WE know that the uibuilder global exists even if Monaco doesn't :slight_smile:

So it isn't something I should worry about?

:person_shrugging:

This is the sign-in node BTW.

This one

Update: (only info, nothing to startlling)

NR 4.0.1
Ubuntu 24.04 LTS
node version 20.16.0

I believe I am using Monaco

(From bottom of the settings.js file)

    editorTheme: {
        theme: "midnight-red",
        projects: {
            // To enable the Projects feature, set this value to true
            enabled: false
        }
    },

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