Custom webserver tutorial (request)

[Thomasdc]

Hi!

I've been using domoticz for over a year now,

Because i use it in my "studio/room" but my parrents also use it (opening gates, ...) its getting really messy

I would like to build a webserver wich runs a website to control domoticz
(with visual studio?)

I know there are a lot of custom webpages out there, but there is not really something out there for my need

There is only one problem.. i have not HTML /website scripting experience..

i already tried some basic stuf (just texts, and ad buttons).

But here is where i struggle...

I just dont get how i can link a button action to a execute a json link (controlling domoticz) without actualy opening the link (opening the link in the window)


So my question is more.. can someone make some kind tutorial or something how to get started (so yeah from the beginning) with json in a html project.

so maybe make a simple example webpage/webserver, with only 1 or 2 buttons on that turns a light on/off, give the light status,... of a domoticz device..

maybe with a little info. so i understand why you do it like that and what is happening.. and maybe i will be able to build a full webpage (more like website the way i see it) to control my domoticz



i dont know, maybe i ask a lot now..
but you never know!

Thanks
Thomke

[SweetPants]

Did you try different users in domoticz? You can assing only the devices to the user you select

[Thomasdc]

Did you try different users in domoticz? You can assing only the devices to the user you select

thanks for the tip!

But i would like to make a whole new interface with different pages, with different camera's integration (over 8 ip camera's).

its a small business and home in one, we have different access gates
so an example i would like to make a page "access" and on that page i have the status of the gates, buttons to open/close the gates and camera feed from on the gates.. so this would be 1 page of the 'website'

we have different refrigerators so an other page "refrigerators" would contain the temperature and log of those, also with the camera feed and with feedback if the doors are open or closed.

so you get an idea..

i dont know if its possible, its just something i would like to try to integrate

Thanks for the reply!

[Egregius]

I use my own floorplan instead of the Domoticz interface.
The code is on https://github.com/Egregius/PHP-Custom- ... r-Domoticz
In that code the usersystem is stripped but can easily be added. Then, depending on the connected user you can decide what switches they see.

[Evelen]

I'm looking for the same as OP.
Can basic HTML, but need to know how to:
- Call a json, not opening link
- Get the status of the switsh
- Also get info from sensors.

[Thomasdc]

I use my own floorplan instead of the Domoticz interface.
The code is on https://github.com/Egregius/PHP-Custom- ... r-Domoticz
In that code the usersystem is stripped but can easily be added. Then, depending on the connected user you can decide what switches they see.

Yeah i saw this,
And this is a great project..

But its just to complex for a beginner..
A tutorial on how to make this is what i am looking for..

i seer your code, i recognize some stuff.. but i would never know how to begin from a blank project.. and that is what i would like to learn..
so some kind of tutorial from the start to the end of your project would be great (or not to the end but just some devices, just something really small to begin with )

I'm looking for the same as OP.
Can basic HTML, but need to know how to:
- Call a json, not opening link
- Get the status of the switsh
- Also get info from sensors.

yeah that is what i'm looking for
start from a blank simple project to a simple webpage with some device statuses and the possibility to change them.

[Egregius]

You'll have much more options with php than plain html. Or you need lots of javascript.
Almost all json calls are explained on the wiki and implemented in my functions.php.
If you include that file it's easy to start and build upon it.

[Thomasdc]

I will give this a try,

But i have to be honnest, to start from your project Egregius is just to complex for me :s
(when i look at your project i think " where do i start??, chich file first?? , functions.php??"
But i do want to learn it and will start looking for tutorials on the internet.

is there somebody that knows a tutorial to get started with php?
i am looking into this for the moment:
http://php.net

(or maybe someone still wants to make his own tutorial with an domoticz example? somekind of screencast from scratch? )

Thanks, ThomasDc

[HNBC84]

http://www.w3schools.com/

But you really don't know what your asking for... This will eat your time and years away.

Stick with the diffrent users and in your spare time mess arround with html(5),css,php. Start learning the basics first!

[HNBC84]

viewtopic.php?f=38&t=10996

Someone allready think of you

[Egregius]

But i have to be honnest, to start from your project Egregius is just to complex for me :s
(when i look at your project i think " where do i start??, chich file first?? , functions.php??"

Just Google PHP with a keyword you wan't to do. There's a very large userbase and lots of info on the net.
About my stuff on Github:
The start is quite simple, put the files on a php enabled webserver, edit secure/settings.php and floorplan.php. In that last you can remove everything after the last 'if(isset($_POST['Schakel'])){' block and start by just adding 1 switch:

Schakelaar('hall','Light',52,416,239);
That will add the switch with name 'hall' with the 'Light' icon with a size of 52px at 416px top and 239px left.
But, for floorplan support it's better to react in http://www.domoticz.com/forum/viewtopic.php?f=8&t=7551

[pj-r]

You dont need PHP to behave as proxy here... Just html + Javascript and direct calls to domoticz. I think with JQuery lib you can make all needed calls to domoticz.

There is simple button for you
http://www.w3schools.com/jquery/tryit.a ... y_ajax_get

Another concept of seeing things updated in your page is polling. With javascript you could use timers to launch your polling functionality. In polling you read wanted values from domoticz and update your web page components.

But be warned! You need time for learning this stuff

You'll have much more options with php than plain html.

For what you need PHP in between UI and Domoticz?

[asjmcguire]

You want to google JQuery and experiment with adding JQuery to a basic webpage, once you have that down, you stick a hidden div somewhere on the page:

Code: Select all

<div id="domresponse" style="display:none;">&nbsp;</div>

Then when you want to do something use code like:

Code: Select all

$("#domresponse").load('http://url');

eg:

Code: Select all

$("#domresponse").load("http://domoticz_ip:domoticz_port/json.htm?type=command&param=switchlight&idx=99&switchcmd=On");

When you get more adventurous you can actually create javascript functions so that you don't have to keep repeating the URL instead you would do something like this:

Code: Select all

function domwrapperSwitchLight(idx,state) {
 if (idx) {
  $("#domresponse").load("http://domoticz_ip:domoticz_port/json.htm?type=command&param=switchlight&idx=" + idx + "&switchcmd=" + state);
 }
}

then would would just add code to the button:

Code: Select all

$("#gatebutton_on").click(function() { domwrapperSwitchLight(99,"On"); });
$("#gatebutton_off").click(function() { domwrapperSwitchLight(99,"Off"); });

I hope this helps a bit.

[Thomasdc]

You want to google JQuery and experiment with adding JQuery to a basic webpage, once you have that down, you stick a hidden div somewhere on the page:

Code: Select all

<div id="domresponse" style="display:none;">&nbsp;</div>

Then when you want to do something use code like:

Code: Select all

$("#domresponse").load('http://url');

eg:

Code: Select all

$("#domresponse").load("http://domoticz_ip:domoticz_port/json.htm?type=command&param=switchlight&idx=99&switchcmd=On");

When you get more adventurous you can actually create javascript functions so that you don't have to keep repeating the URL instead you would do something like this:

Code: Select all

function domwrapperSwitchLight(idx,state) {
 if (idx) {
  $("#domresponse").load("http://domoticz_ip:domoticz_port/json.htm?type=command&param=switchlight&idx=" + idx + "&switchcmd=" + state);
 }
}

then would would just add code to the button:

Code: Select all

$("#gatebutton_on").click(function() { domwrapperSwitchLight(99,"On"); });
$("#gatebutton_off").click(function() { domwrapperSwitchLight(99,"Off"); });

I hope this helps a bit.

This helped me out a lot!
Thanks so much!