A bit of a long shot this one but I thought I’d ask on here in case anyone has any ideas.
I’ve installed a module to my alarm (Honeywell Dimension) that enables a virtual keypad over http. In Sharptools I have a tile pointing to the local IP address of the module so that I can have full control when necessary from the Fire HD tablet. However when the virtual keypad is displayed it only occupies the top left ninth of the screen. I asked the supplier for assistance and received the following reply:
The css sets initial dimensions. It’s markup, so vectorised and should scale with browser zoom etc. You can always process the content directly and create your own html/css around it.
This means little to me - I’ve gone through the various options in Fully and can see nothing that helps. Does anyone have any (simple) idea how I could get this to fill the screen, to make it usable? I’ve already got SharpTools displaying status of the alarm on the tiles and have rules to arm/disarm the system, however getting the keypad working nicely would be the icing on the cake, as it would allow me to remove all but one of the physical keypads and replace them with tablets running Sharptools and Fully - much neater. TIA
Unfortunately not. It’s just a representation of my alarm keypad and I can access it at the IP address of the module in the alarm system that runs it. I’ve just set a hyperlink button on my dash that goes to that http://192.168.0.xxx address.
When that page opens - the graphical representation of the keypad is too small for my fingers to operate on screen. I can mess around manually pinch zooming the page to make it bigger, but invariably I end up accidentally swiping back to the main dashboard. What I need is some method that when the page loads it zooms to say 300%.
I’ve messed around with the web zoom settings in fully but they apply the zoom globally to all pages so it completely scrambles the sharptools dash as well.
Can you share more details about the module that was installed? Does the supplier offer any documentation we could refer to?
Based on this description, it sounds like the content is scalable, but it’s hard to provide further guidance without being able to better understand what we’re working with.
There are manuals available for it on that page, but they don’t really give a great deal of information regarding the http virtual keypad. The module is primarily for use with mqtt.
As said I can scale it manually but haven’t a clue on how I could get the initial scale to match the device to make it more usable.
Would you mind sharing a screenshot of what the keypad looks like in a dashboard with the initial (bad) scale?
Are there any options around the UI / display of the keypad? As you mentioned, the manual is quite light on the details around the HTTP keypad, but there was a vague mention of module settings (though it wasn’t clear if those were just alarm integration type settings or if there were settings around the HTTP keypad itself)
Module configuration
When the module boots, the virtual keypad is served from port 80. The module settings page is available at http://ip.addr/settings.shtm (where ip.addr is the modules DHCP assigned address)
As a workaround, I’m wondering if some trickery could be used to shrink the iframe to fit the ‘initial’ size of the keypad (assuming it’s a static size that doesn’t scale) and then use CSS to scale the iframe. I’d be happy to poke around with the idea, but it would likely be trial-and-error and I would likely need more details / screenshots to understand what we’re working with.
The photo shows the Fire HD 10 screen when I click the link (apologies I couldn’t transfer a screenshot as I’ve not set e mail up on the fire tablets I use for dashboards)
As you say the settings.shtm page is solely for setting up the alarm integration and communications. There’s nothing in the UI - zooming has to be done by pinching on the tablet screen.
Hi @josh - I’ve had a play around this morning and this is what I’ve found.
The keypad does successfully load within the custom tile using the local IP address and isn’t blocked. Unfortunately I can’t get the scale to work. It seems as though there is some fixed border/margin, so when I set the scale to 200%, it does increase the keypad size, but the surrounding border crops it cutting off the right hand side and bottom (keeping the overall size the same within the tile). I guess this is down to how the developer has coded the web page and not editable.
What I have at the moment - I can control the alarm and see its set/unset status using SharpTools (and Hubitat). I have a Fibaro Smart Implant for this. The two digital inputs on the implant are connected to outputs on the physical alarm panel that are programmed to activate when the system is night set or full set (a view only switch tile shows appropriate icons for set and unset). Two outputs on the implant are also connected to the alarm system as momentary key switch inputs. These allow me to night set or full set the system from the dashboard (but not unset it). This has allowed me to have some rules that arm/disarm the system at given times or when I click my virtual “Bedtime” button on the dashboard (the rules are conditional first checking the set/unset status)
I think I might be fighting a losing battle with the virtual keypad side of things. There’s actually a dedicated Android and iOS app for SelfMon which scales that keypad perfectly to fit the screen. Unfortunately it wouldn’t work on my older Android tablet and won’t open on the Fire HD either, which is a pain as I could have just used the app intent to launch it when required. Additionally there’s a freely available java based keypad that the dev has put on GitHub, but this requires a JRE so it’s probably not possible to use that either.
On the plus side - your custom tile allows me to show the keypad permanently (albeit small) on the dashboard - rather than having to use the hyperlink tile to display it. This in itself is rather cool and a big step forward. Thanks again for your help.
Yeah, the ideal approach would be for the source keypad to offer some options around scaling or even the ability to tweak the base keypad.
That being said, there may be further tricks we could use to work around this. We might be able to overscale the embedded page (like overscan on an old CRT TV) to effectively crop out the extra border.
Would you mind sharing a photo of what the scaled keypad looks like in a custom tile?
Neat. Many modern browsers block loading an HTTP page from an HTTPS page. Here’s what Chrome would show in the browser console:
After that it still occupies the same overall space on screen but it’s cropped even more with the characters in the keypads display overlapping each other.
Yes I’m using the Fire OS version of Fully with mixed content enabled.
I think I would need to see the source code of the keypad entry page to help further - otherwise I’m just guessing as to what approach they’ve taken. If you have a computer available, you should be able to save the page or view the source. Feel free to PM @support and I’d be happy to provide further guidance.
Just an update that @John_Williamson and I were able to work together to troubleshoot this and we got things working! Had to tweak the custom tile a bit to improve compatibility with Fully Kiosk Browser on Fire OS.
Import Scalable Iframe Custom Tile
Do not change the tile settings within the developer tools!
