Tiny mobile-friendly Events editor (custom page)

In this subforum you can show projects you have made, or you are busy with. Please create your own topic.

Moderator: leecollings

Post Reply
jeradam
Posts: 10
Joined: Friday 27 May 2022 14:18
Target OS: NAS (Synology & others)
Domoticz version:
Contact:

Tiny mobile-friendly Events editor (custom page)

Post by jeradam »

Hi all,

The stock Events editor is almost unusable on my phone (Chrome on Android): the edit page doesn't behave well on mobile, and copy/paste was simply impossible for me. So I had Claude write a single-file "replacement" that runs as a Domoticz custom page.

Features
  • Script list with search, filter (active / inactive / language) and one-tap enable/disable
  • Touch-friendly editor: symbol bar ({ } ( ) [ ] ' " = ~ ...), undo/redo, font size, line wrap, sticky Save bar with an "unsaved changes" marker
  • Device picker: search by name or idx and insert domoticz.devices('Name') (dzVents) or otherdevices['Name'] (Lua)
  • Live log viewer under the editor: filter all / events / errors, errors in red, dzVents and EventSystem lines in green, optional auto-refresh
  • Drafts: unsaved edits (code, name, language, trigger type) are kept, and scripts with a draft are flagged in the list
  • Local version history: the previous 5 versions of each script are kept in the browser and can be restored with one tap
  • Export / import: one script or all scripts as JSON. Import also accepts plain .lua / .py / .txt files, opened as a new unsaved script
  • Blockly scripts are shown read-only (tree view + raw XML)
  • English / French interface (English by default); light / dark / auto theme (auto follows the device setting)
Install
It is a single HTML file with no external dependencies. Copy it to the custom pages folder of Domoticz (with Docker, map a volume to it) and open it from the Custom menu. It must be served by Domoticz itself: opened from another address, the browser blocks the API calls (CORS).

Tested on
Domoticz v2026.4 (build 18465) (Docker), Chrome on Android. It uses the events API (type=command&param=events), getdevices (with a fallback to the older type=devices) and getlog. I haven't tested older Domoticz versions, Safari or iOS.

Known limitations
  • No Blockly editing or saving
  • Drafts and version history live in the browser's local storage (per device): use Export for real backups
  • Python event scripts: the device picker only inserts the plain name / idx
Screenshots and html file in attachements
Attachments
1000169371.jpg
1000169371.jpg (374.37 KiB) Viewed 77 times
domoticz_scripts.zip
(11.18 KiB) Downloaded 4 times
User avatar
gizmocuz
Posts: 3060
Joined: Thursday 11 July 2013 18:59
Target OS: Raspberry Pi / ODroid
Domoticz version: beta
Location: Top of the world
Contact:

Re: Tiny mobile-friendly Events editor (custom page)

Post by gizmocuz »

That is right, it is not meant to be used on a 'phone', at least a tablet or desktop.
But you can also make a PR against the original editor so everybody can enjoy your work, instead of creating a custom page 8-)

Great job bdw!
Quality outlives Quantity!
Post Reply