Drinks Toolkit and Tabranet

From openPicus Wiki
(Redirected from TABRANET)
Jump to: navigation, search

Tabranet comes from the need to have a board capable of controlling temperatures and show their status by a web server. To do this we have used a OpenPicus Ethernet with a specific hardware to interface the I/O and create web pages using DRINKS TOOLKIT , an open source downloadable from Internet at web site http://www.goincompany.com/drinks.php. Inside Tabranet there are some web pages capable to set threshold variables and send an alarm when they are exceeded. The purpose is to have an autonomous board capable to sending spontaneously alarms. Tabranet have two user level, supervisor (managing I/O capable) , normal user (read only). The web pages is updated by AJAX and the values are show on remote site immediately. DRINKS work fine also in Smart Phone Android and with all known browser, so you can manage your I/O by a cell phone or tablet . DRINKS have some nice widgets ready to use to create a remote control page.

Image1.jpg


Image2.jpg


Image3.jpg


Image4.jpg


How DRINKS TOOLKIT work

Installation

Installing Drinks is simply. Just download the toolkit from www.goincompany.com/drinks.php , extract and upload the folder in the server where you want to place your application.

In your html page you need to link the javascript files just inserting the script tag:

               <script type=\"text/Javascript\" src=\"Path to Drinks.js\"></script>.

Your application is ready to work.

First Design

Creating a dashboard is very simple with Drinks. You just know a little bit of HTML and your application is ready to work. For example now, I want to create a simple Knob that controls the value of a Gauge.

First, we have to declare our Knob:

               <knob id=”k1”></knob>

Note that, the presence of the id is mandatory: every widget must have its own id. Also the tags must be closed.

Second, We have to declare our Gauge:

               <display id=”gau”></display>

Then we have to connecting the instruments together so, the value of the Knob, will propagate to the Gauge. We add the onchange event to the Knob.

               <knob id=”k1” onchange=”gau.value = this.value;”></knob>


Example 1

   <html>
      <head>
          <script type="text/javascript" src="Drinks.js"></script>
     </head>
     <body>
          <knob id="k1" onchange="gau.value=this.value"></knob>
          <display id="gau"></display>
     </body>
     </html>

Example1.jpg

For more info pls download DRINKS user manual http://www.goincompany.com/DTManual01.pdf

Personal tools
Namespaces

Variants
Actions
START HERE
DEVELOPMENT
HARDWARE INFO
RESOURCES
PHASED OUT
Toolbox