Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- {% extends "LljmHomeBundle::layout.html.twig" %}
- {% block body %}
- <script type="text/javascript" >
- var vscpConn = null;
- // Create a VSCP websocket
- vscpConn = new vscp.Connection();
- // Connect to VSCP server
- vscpConn.connect({
- url: settings.url,
- userName: settings.user,
- password: settings.password,
- vscpkey: settings.vscpkey,
- authdomain: settings.authdomain,
- onSuccess: function( conn ) {
- // Start receiving VSCP events
- // Initialize canvas
- // Don't do this without a established connection, because
- // the button needs the connection object!
- initCanvas();
- vscpConn.start({
- onError: function( conn ) {
- alert("Couldn't start receiving events.");
- }
- });
- },
- onError: function( conn ) {
- alert("Couldn't establish a connection.");
- },
- });
- // User interface data
- var ui = {
- enable: function() {
- $( "#ui :input" ).attr( "disabled", false );
- },
- disable: function() {
- $( "#ui :input" ).attr( "disabled", true );
- }
- };
- function vscpTurnOnEvent(data1, data2, data3) {
- ui.disable();
- vscpConn.sendEvent({
- event: new vscp.Event({
- vscpClass: vscp.constants.classes.VSCP_CLASS1_CONTROL,
- vscpType: vscp.constants.types.VSCP_TYPE_CONTROL_TURNON,
- vscpPriority: vscp.constants.priorities.PRIORITY_3_NORMAL,
- vscpData: [ data1, data2, data3 ]
- }),
- onSuccess: function( conn ) {
- console.info( "TURNON event sent." );
- ui.enable();
- },
- onError: function( conn ) {
- alert( "Failed to send TURNON event." );
- ui.enable();
- }
- });
- }
- function vscpTurnOffEvent(data1, data2, data3) {
- ui.disable();
- vscpConn.sendEvent({
- event: new vscp.Event({
- vscpClass: vscp.constants.classes.VSCP_CLASS1_CONTROL,
- vscpType: vscp.constants.types.VSCP_TYPE_CONTROL_TURNOFF,
- vscpPriority: vscp.constants.priorities.PRIORITY_3_NORMAL,
- vscpData: [ data1, data2, data3 ]
- }),
- onSuccess: function( conn ) {
- console.info( "TURNOFF event sent." );
- ui.enable();
- },
- onError: function( conn ) {
- alert( "Failed to send TURNOFF event." );
- ui.enable();
- }
- });
- }
- </script>
- <div id="header" class="hero-unit">
- <h1>{{'Light management' | trans }}</h1>
- </div>
- {% set buttonTop = 0 %}
- <style type="text/css">
- table{
- width: 20%;
- border: 1px solid black;
- }
- th, td{
- padding: 10px;
- text-align: left;
- border: 1px solid black;
- }
- </style>
- <table>
- {% for lightswitch in lightswitches %}
- <tr>
- <td>{{ lightswitch.zonename | trans }}</td>
- <td>{{ lightswitch.subzonename | trans }}</td>
- <td><button onclick="vscpTurnOnEvent(0, {{ lightswitch.zoneid }}, {{ lightswitch.subzoneid }})">ON </button></td>
- <td><button onclick="vscpTurnOffEvent(0, {{ lightswitch.zoneid }}, {{ lightswitch.subzoneid }})">OFF</button></td>
- <td>
- <canvas id="buttonVentilation{{ buttonTop }}" width="50px" height="50px">
- Your browser does not support HTML5 Canvas.
- </canvas>
- <script>
- function initCanvas() {
- // Show background image
- // var backgroundImage = new vscp.widget.Image({
- // canvasName: "#myCanvas",
- // url: "{{ asset('bundles/lljmhome/images/kvarnvillan_plan1_800.jpg') }}"
- // });
- // Create ventilation buttonn
- button{{ buttonTop }} = new vscp.widget.Button({
- connection: vscpConn, // VSCP connection object
- canvasName: "#buttonVentilation{{ buttonTop }}", // Canvas id
- type: 85, // Button type
- scale: 0.3, // Scale factor
- x: 25, // x position in the canvas
- y: 25, // y position in the canvas
- transmitZone: {{ lightswitch.zoneid }}, // Zone where button event will be sent to
- transmitSubZone: {{ lightswitch.subzoneid }}, // Sub-zone where button event will be sent to
- receiveZone: {{ lightswitch.zoneid }}, // Zone where state events will come from
- receiveSubZone: {{ lightswitch.subzoneid }}, // Sub-zone where state events will come from
- bindToRemoteState: true, // Button state depends on remote state
- enable: false // Disable button by default
- });
- // The user interface (buttons) make only sense
- // in case that the event communication is ready
- button{{ buttonTop }}.setEnabled( true );
- };
- initCanvas();
- </script>
- </td>
- </tr>
- {% set buttonTop = buttonTop + 1 %}
- {% else %}
- <p>{{ 'No record in this table' | trans }}.</p>
- {% endfor %}
- </table>
- {% endblock %}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement