grodansparadis / vscp-ux Goto Github PK

View Code? Open in Web Editor NEW

2.0 3.0 0.0 108.77 MB

VSCP HTML5 user interface component framework

Home Page: http://www.vscp.org

License: Other

HTML 31.33% JavaScript 67.85% CSS 0.17% Python 0.52% Shell 0.14%

iot iot-platform iot-application iot-framework m2m ux user-interface javascript-library vscp

vscp-ux's Introduction

VSCP & Friends - HTML5 UX demos

This is the VSCP HTML5 user interface component framework which can be used to create nice and responsible user interfaces experiences.

The provided demo's are based on websocket and REST interface to the VSCP server. The interfaces itself are described in the VSCP daemon documentation:

If you want to know more about the VSCP project visit the VSCP web site.

Everything is released under the MIT License.

Getting started

On a standard system install this full source tree at /var/lib/vscp/web/html (programdata/vscp/web/html on windows) or other folder set in <document_root>...</document_root> directive under the <websrver> tag in the /etc/vscp/vscpd.conf file of the VSCP daemon.

If you just want the VSCP websocket or REST javascript code you find it in the 'js/vscp-js' folder. Or get them from its repository: https://github.com/grodansparadis/vscp-js/

You should probably compress this javascript file for a production system. There are plenty of them around this is one of them.

Testing

You can use the do_web_download script to download this code to your local setup. Go to the folder where you want to set up the demo pages. If you are testing the vsclp2drv-websrv this is typically the /var/lib/vscp/web/html/ folder. In this folder issue

curl https://raw.githubusercontent.com/grodansparadis/vscp-ux/master/do_web_download | bash

This will download the latest pages.

Now restart you should be able to test the web server, websockets and the rest interface.

Demos

You will find the demo code in the demos subfolder. The index.html file in it will take you to it and give some further instructions.

The folder contains a few demos on how to use VSCP widgets and demonstrates the VSCP daemon websocket and REST interface.

To test that everything is working enter

http://localhost:8884/demos/authentication/authentication.html

https://localhost:8843/demos/authentication/authentication.html

for a TLS/SSL setup.

and you should get the start page which takes you thru the rest of the demo..

Useful test commands

Some useful commands for the vanilla test window

5 Turn ON Zone=1, Subzone=35

send 0,30,5,0,0,-,0,1,35

6 Turn Off

send 0,30,6,0,0,-,0,1,35

7 Start

send 0,30,7,0,0,-,0,1,35

8 stop

send 0,30,8,0,0,-,0,1,35

send head,class,type,obid,time-stamp,GUID,data1,data2,data3....

vscp-ux's People

Contributors

Stargazers

Watchers

vscp-ux's Issues

javascript libraries api

How it is at the moment:

Bad:

vscp.Connection handles websocket connection and is part of vscp namespace. It should be moved to vscp.ws namespace, similar like the REST client (vscp.rest.Client).
All upper classes/functions are only supporting the websocket connection. Should they support the REST API as well (big effort)?

How it will change, to get the goal a little bit closer:

vscp.Connection will be moved and renamed to vscp.ws.Client.
Common part will stay in vscp.js.
Websocket specific part will be moved to vscpws.js, like vscprest.js for REST API.

Questions/Ideas:

Moving all VSCP javascript libs to a dedicated git repository 'vscp-js' and bind them to vscp-ux via git submodule? Why? Because vscp-ux contains the demos and unused other stuff. Hard for users to get the point what to use. Additional advantage, just add 'vscp-js' as submodule to the own project and thats it.

epoch graph shows wrong time

Hi,

Still one issue :---
http://demo.vscp.org:8080/testws/epoch_simple.html
Everything is working fine but time is not coming correct.
My system is showing time 12:50 PM but epoch graph shows variable time which is absolutely wrong.
Please see the attached image.

Problem seems to be in this code, where d.getTime is used() :----
var d = new Date();
var data = [{ time: d.getTime(), y: value }];

lineBarChart1.push( data );
lineBarChart2.push( data );
areaChartInstance1.push( data )

Regards,
Dinesh

all recipe related keywords are not fully supported right now
only the "important" mdf tags are supported yet