Indigo Domotics

I have a series of control pages that time out to a sort of Indigo-based screensaver for iPad mini wall-based controllers. The way it works is this:

- I have a small (2 pixels by 2 pixels), blank PNG that is invisible on a page. This is called screendim+.png and also saved as screendim+false.png
- I have a large number of photos called screendim+n.png where n is a reference number between 1 and X. Each of these is 2060 x 1545 pixels)
- I have a variable called ScreenDim which is either false or a random number between 1 and X. It defaults to false after a set period of time
- I insert the screendim+ image on a control page to reflect the variable state of ScreenDim, and with a client action to switch ScreenDim to false when the image is pressed.
- Every five minutes, the variable changes to a different number (and hence image).

This works pretty well (would be even better if I got the photos exactly the right size, but they are very close). The default is that an image shows. If I tap the image, I reveal the control beneath, and after fifteen minutes or so, the screensaver starts again.

But there's a problem (of course because otherwise I wouldn't be posting). For an iPad page displaying in Indigo Touch, the PNG needs to be located right in the middle of the control page - Indigo Touch centres the image on the page. But if I then view that control page in Safari (either on the iPad or on a computer), the photo images display down and to the right, only covering a quarter of the screen - Safari seems to put the top left hand corner of the image in the centre of the control page, rather than the centre of the image.

Is this a bug? Am I doing something wrong?

Sometimes there are some caching issues with images, particularly if you're editing them then reloading. Try emptying the Safari cache and restart the Indigo Server just to make sure that's not the issue.

No, that doesn't help. To be clear, I am not editing the images. I created them a while back and gave them all the relevant (indexed) file names. It looks as if Safari centres the top left pixel of the image while Indigo Touch centres the middle pixel of the image. Happy to post a screen shot if my explanation isn't clear.

Indigo renders HTML with the same coordinates it renders control pages internally. Try a different browser just to see if the problem persists - that'll give us a better idea where to look further.

Just tried with Opera. Same thing.

Email us your database and your images (and where they're installed in the image tree). support AT indigodomo DOT com

I experience similar situations when using 1x1 pixel images. Ended up creating two versions of the same control page. Not had time to look into it in any more detail to work out exactly why it's happening but a different layout is required to get the same results. The small image needs moving to a different position on the control page to line up in Crome vs app

I've re-read your forum thread and think I know the problem. The issue, which we need to document, is that all of the images within an image group (so all of your screendim+ images) need to be the same dimensions. Indigo's logic for positioning images assumes they are all the same width/height, so if they are changed at runtime then it won't layout correctly.

At the very least we need to document this (I will do that now), but I will also add to our feature request list to somehow handle this or provide an alternative technique that allows for hidden images/controls that don't accept clicks unless they are somehow made visible.

Been wondering about that myself. Some time ago I thought it would be nice to tone back, or dim, all or a portion
of a CP with a variable based image. What became immediately apparent though was any image, transparent
or not would block all other buttons/images below it.

Has that changed recently?

Thanks,

Carl

Carl,

Yep, you have to play with the z-order and use different size images - i use a 1x1 pixel image as off and the main image as "whatever" size, laid on the background. The problem comes with lining up the larger image, as its different for different devices. I've just finished off "generic" control pages, copied them for phone, ipad and browser, then moved the images accordingly.

HTH

Mat

We were wondering if this problem with the moving heuristic images was solved in Indigo 7.
But unfortunately not.

For example 2 screemdumps:

- The first plot (Heuristic variable image) is displayed correctly with Safari (Mac and iPad version are the same)
BUT with Indigo Touch at an iPad, the left upper corner of the Heuristic graphics are moved to the centre of the window/screen.
(normally the Heuristic Variable-dot+ stays upper left in the control page)

- So, when we placed the Heuristic Variable-dot+ to the centre of the control page and displays this with Indigo Touch the problem is solved and the Heuristic Plot image is perfectly centred and full at the screen.
But then with Safari at the Mac and iPad the left upper corner of the Heuristic graphics are moved to the centre of the window….


It’s a lot of work to maintain, only for this problem, 2 different control pages with hundreds of devices and variables,


Kind regards,

John

Are the images the same size? That is what is causing the other problem reported on this thread I think – Indigo expects all images within one heuristic set to have the same width and height.

Thanks for the feedback.

The original heuristic Variable+ is a little small image (5 x 5 pixels).
Because otherwise when it's bigger, it totally covered the whole control page.
It has to be at the upper front (Z-order) for:

Every 5 minutes the Heuristic Variable changed with a new Karl plot
All the + Images that belongs to this Heuristic+ are the same size.; (1042 x 769 pixels)
And after 30 seconds the plot image disappeared and the control page is visible again.

Why is there a difference between Safari and Indigo Touch?

As mentioned above, we have on the request list adding the ability to allow show/hide of images. That will be the best way for us to fix this problem.

As to the differences, Indigo Touch uses a custom internal renderer for Control Pages. Browser viewing of Control pages is done via HTML+CSS+JS. As I mentioned, the layout of heuristic images requires the images to be the same size and we don't have plans to change that. Instead we want to address the main problem which is that you need the ability to hide/show images or controls.

Thanks for the explanation.
We are looking forward for a fix of this problem.

One last issue: every 5 minutes there is a new plot with new updated (Variable)graphics.
Safari displays the right real time last Heuristic graphic, Indigo Touch displays almost the whole day the same plot (for example the start of the day energy and gas plot).
I think it didn't see the changes and uses a cached file.

Kind regards,

John