Control Page Editing

Posted on
Fri Jun 24, 2022 7:55 am
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Control Page Editing

Is it possible to edit the control page HTML / CSS?

I've found a template for Star Trek LCARS and would love to make a control page that uses that interface / style on my ipad to control my home.

Posted on
Fri Jun 24, 2022 9:42 am
jay (support) offline
Site Admin
User avatar
Posts: 18199
Joined: Mar 19, 2008
Location: Austin, Texas

Re: Control Page Editing

It's possible to edit the templates, but not recommended. First, it would require that you know/understand the current templating system as well as how the web server interfaces to the Indigo Server (which isn't really published). Second, it will break every time you update Indigo. Third, Indigo Touch doesn't render using HTML, so it would only apply to the web pages. Fourth, the next major release of Indigo will have a completely rewritten web server, with completely new underlying technologies, so anything you did in this respect now wouldn't be applicable.

You can add your own images however, so you can probably get you partially the way there.

Alternately, you can use the REST API to build your own web pages.

Jay (Indigo Support)
Twitter | Facebook | LinkedIn

Posted on
Fri Jun 24, 2022 10:29 am
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

Thanks Jay!

I think the REST API is what I'm looking for. I can start just by creating a LCARS themed button that turns a light on and off. I dont do very complex or complicated setups, mostly on and off, set a dimmer, that sort of thing.

Posted on
Fri Jun 24, 2022 11:18 am
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

Jay I may need a little bit of help.

So I am able to create a button on my page and use the REST API to change the device status, but then all that happens is I get taken to the attributes page for that device and the device doesnt turn on or off?

Posted on
Fri Jun 24, 2022 12:21 pm
jay (support) offline
Site Admin
User avatar
Posts: 18199
Joined: Mar 19, 2008
Location: Austin, Texas

Re: Control Page Editing

Huh? Explain your setup.

Jay (Indigo Support)
Twitter | Facebook | LinkedIn

Posted on
Fri Jun 24, 2022 1:05 pm
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

So I entered this into my url bar:

http://my.internal.ip.address:8176/devices/

and obtained a list of my devices in browser. Then I clicked on the name of one of the devices which takes me to the attributes page:

On that page I click Edit Attributes and then change isOn from False to True then click Update and nothing happens
Attachments
Screen Shot 2022-06-24 at 2.01.06 PM.png
Screen Shot 2022-06-24 at 2.01.06 PM.png (139.87 KiB) Viewed 2611 times

Posted on
Sat Jun 25, 2022 2:36 pm
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

Jay,

I have it almost working the way I want. I have an HTML page with a button and the <a href"http://127.0.0.1:8176/devices/office-lamp?toggle=1&_method=put">Office Light</a> toggles the device on and off, BUT it opens the attribute page in a new tab. How can I prevent it from doing that and simply stay on the same page?

Posted on
Sat Jun 25, 2022 2:40 pm
FlyingDiver offline
User avatar
Posts: 7189
Joined: Jun 07, 2014
Location: Southwest Florida, USA

Re: Control Page Editing

You're probably going to have to use JavaScript to do the http call so you can discard the result. Using an HREF link will always try to display the page you linked to.

If you want to open the attribute page in place of the current page (not in a tab), you can do that with the _target parameter.

joe (aka FlyingDiver)
my plugins: http://forums.indigodomo.com/viewforum.php?f=177

Posted on
Sat Jun 25, 2022 8:00 pm
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

I kinda figured.

Its been a LONG while since I've last done anything with HTML, XML, PHP, Javascript, etc..

Posted on
Mon Jun 27, 2022 9:03 am
jay (support) offline
Site Admin
User avatar
Posts: 18199
Joined: Mar 19, 2008
Location: Austin, Texas

Re: Control Page Editing

Please further explain in detail what it is you want to do. If, for instance, all you want to do is use a custom images to represent on/off of an existing device, you can do that without using the REST API. I think you are probably making this much harder than it actually is.

As I said above, you could build your own custom website using your own technologies and hosting platform by using the REST API as the communication layer. You should (almost) never use the REST API within a control page.

Jay (Indigo Support)
Twitter | Facebook | LinkedIn

Posted on
Mon Jun 27, 2022 2:16 pm
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

I'm trying to make a control page that looks like the attachment. Where basically clicking the button in the page toggles the device on or off.
Attachments
Screen Shot 2022-06-27 at 3.13.38 PM.png
Screen Shot 2022-06-27 at 3.13.38 PM.png (372.78 KiB) Viewed 2441 times

Posted on
Mon Jun 27, 2022 4:15 pm
jay (support) offline
Site Admin
User avatar
Posts: 18199
Joined: Mar 19, 2008
Location: Austin, Texas

Re: Control Page Editing

Yes, that's easy. First, set the device element's server action (not client action) to toggle which will just toggle it on/off. Next, add the correct images (see the Image Heuristics article I mention above) and then select that as the image set to use for the device element.

Jay (Indigo Support)
Twitter | Facebook | LinkedIn

Posted on
Thu Jun 30, 2022 11:55 am
Fxguy offline
Posts: 153
Joined: Mar 24, 2011

Re: Control Page Editing

Jay,

Is it possible to change the the image "on click" for a device?

In other words lets say I have a purple_button.png image that controls / toggles my living room lamps. What I would like to do is when I tap / click that button is change from purple_button.png to red_button.png as a visual indicator that the light has turned on and then toggle back and forth between the images when the device toggles back and forth.

Does that make sense?

Posted on
Thu Jun 30, 2022 1:17 pm
DaveL17 offline
User avatar
Posts: 6741
Joined: Aug 20, 2013
Location: Chicago, IL, USA

Re: Control Page Editing

Not like you have proposed exactly, but that's how the heuristics work. Name them whatever you want, like this:

foo+.png (purple image)
foo+off.png (purple image) <-- this one is not technically necessary, but I usually do it for good measure.
foo+on.png (red image)

It's not the clicking of the image that changes it; rather, it's the device state (or variable value) that does it.

I came here to drink milk and kick ass....and I've just finished my milk.

[My Plugins] - [My Forums]

Page 1 of 1

Who is online

Users browsing this forum: No registered users and 3 guests