search

Adorkable / node-red-contrib-ui-led

A simple LED status indicator for the Node-RED Dashboard
MIT License
16 stars 12 forks source link

In mobile browsers first render of LED has width of 1, properly calculated if resized #72

Closed Rollem1 closed 3 years ago

Rollem1 commented 3 years ago

Hi,

Since upgrading to 0.4.8 most LEDs (but not all) on my node red dashboard appear as a line rather than a circle. I don't remember what version I had before but previously this wasn't an issue.

I have several tabs to my dashboard for different elements of home control. On one tab the LEDs always display perfectly, on all the others initially they display as a line. If you rotate the screen so the display gets resized the LEDs display normally again. Rotating back to the original orientation the LEDs stay as a circle correctly. It doesn’t matter which orientation you start in.

I think this is the same issue that @bburkett52 raised in thread #68 however as its a different issue than the OP raised I have created a new issue.

On opening page image

On rotating the iPad Screen image

yoiang commented 3 years ago

Hey @Rollem1, thank you for further reporting the issue and including screenshots! I've been able to reproduce the bug but not why it's happening, something to do with the workaround I'm using that doesn't appear to work the first time it's rendered on mobile browsers but properly calculates how it should appear if one does something to resize the screen (such as rotate).

I'll try to track down why a little longer, if not I have a hacky solution that I think should work!

bburkett52 commented 3 years ago

@yoiang

I have discovered an additional issue with Chrome browser on iPhoneX IOS 14.4

The initial display of the LEDs shows as a width of 1 as previously reported:

IMG-9019

After rotating the device to landscape orientation and still when rotated again back to portrait orientation, the display is too large to fit the device:

IMG-9020

With manual re-scaling (pinch gesture) the image again fits the device. Rotating the display does correct the LED size.

-Node-red-contrib-ui-led: 0.4.8 -Node-red-dashboard: 2.27.0 -Node-red 1.2.5

Thanks for your efforts!

~Bob

yoiang commented 3 years ago

(props on both your and @Rollem1 's beautiful dashboards btw 🤩)

Even stranger! I'd hoped I had built the component to respond to situations flexibly but it appears to not flex well in these situations on mobile. It's making me suspect I may have to lean on the hack, it won't change anything on your side (besides actually working properly), it'll just mean maintenance of the code will be a little more manual!

zakx commented 3 years ago

Any news on this? Ran into it just now on an iPad

bburkett52 commented 3 years ago

This issue is also appearing on an Ubuntu Linux OS PC

~Bob

yoiang commented 3 years ago

Sorry for the delay in pushing a fix, life stuff has gotten in the way (just moved at the beginning of the week for a new project).

I should have an attempted fix pushed this weekend, thanks for being patient everyone!

bburkett52 commented 3 years ago

@yoiang

Your work is greatly appreciated! Moving in Brooklyn can't be easy!

~Bob

yoiang commented 3 years ago

Thanks all for your patience, I just pushed 0.4.9!

In the effort of getting a fix for the squishing out sooner there is an unresolved issue it introduces where the glow's edge at some sizes is cut off. I'll address that in a later version, this fix was more important ;)

Please let me know if this doesn't resolve the issue or introducing any other bugs!

bburkett52 commented 3 years ago

Thanks fir all your work! This is much appreciated!

I do notice that the diameter of the LED is smaller?

Regards ~Bob

On Sun, Mar 7, 2021 at 11:48 Ian G notifications@github.com wrote:

Thanks all for your patience, I just pushed 0.4.9!

In the effort of getting a fix for the squishing out sooner there is an unresolved issue it introduces where the glow's edge at some sizes is cut off. I'll address that in a later version, this fix was more important ;)

Please let me know if this doesn't resolve the issue or introducing any other bugs!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/Adorkable/node-red-contrib-ui-led/issues/72#issuecomment-792309174, or unsubscribe https://github.com/notifications/unsubscribe-auth/AIOUEODM66ECKJHAFH5NWZTTCOU6ZANCNFSM4XR6RMFQ .

Rollem1 commented 3 years ago

Thanks for providing the update! I can confirm it works and I actually prefer the smaller LED's

image

Cheers, Jon

smithy-eng commented 3 years ago

Thank you so much! LEDs looking very fine now!

image

yoiang commented 3 years ago

Y'alls dashboard game is on point

@bburkett52 ya, I'll have to look into why it was able to be larger before when I have more time and potentially make that configurable. Now I'm matching the silly algorithm Node-RED uses to decide a control row's height so it is guaranteed to fit. Keep your eyes peeled!

Closing for now, thanks again for everyone's help!