(11.12.2017, 11:15)Daniel. Wrote: I do it always in private browsing then you are sure all is fresh.  Good practice is to clear browser cache when strange things start to happen.

(11.12.2017, 11:52)admin Wrote:

Code:

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('1/1/2', function(object, state) {
     if (object.value) {
       showPlan(42);
     }
   });

   grp.listen('1/1/3', function(object, state) {
     if (object.value) {
       showPlan(42);
     }
   });
 }
});

(16.12.2016, 14:58)admin Wrote: Please post in English next time
The task is to show a specific plan depending on a certain object value.

Code:

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('1/1/1', function(object, state) {
     var value = object.value;
     if (state == 'value') {
       if (value == 1) {
         showPlan(11);
       }
       else if (value == 2) {
         showPlan(12);
       }
       else if (value == 3) {
         showPlan(13);
       }
     }
   });
 }
});

(22.01.2018, 08:35)Erwin van der Zwart Wrote: Hi,

Change line 16 with extra parameter to execute on same object value like this:

 },true);

BR,

Erwin

(02.03.2018, 11:07)Erwin van der Zwart Wrote: Hi,

Use custom JS like below and add custom class 'hidebyknx' to your elements that needs to be included:

Code:

$(function(){
  grp.listen('1/1/1', function(object, state) {
     if (state == 'value' && object.value == true) {
         $(".hidebyknx").addClass("hide");
     } else if (state == 'value' && object.value == false) {
         $(".hidebyknx").removeClass("hide");
     }
  }, true);
});

BR,

Erwin

(02.03.2018, 19:42)Erwin van der Zwart Wrote: Hi,

Objects are always refreshed on changes so i don’t see why you need to do that..

There is no list of classnames and they have nothing to do with KNX ...

BR,

Erwin

(11.10.2016, 09:59)buuuudzik Wrote: Here is some svg image and custom script which can be used for learning manipulating svg images by custom javascript. I used Inkscape for editing svg image(e.g. adding new elements).

1. Copy to "Custom javascript":

Code:

$(function(){

 $('object').load(function() {
   
   var svg = $('object')[0]; // Choosing svg

   var svgDoc = svg.contentDocument; // Choosing content from svg
   var svgItem = svgDoc.getElementById("rect4136"); // Choosing blind from content
   var svgItem1 = svgDoc.getElementById("g4136"); // Choosing window from content
   var svgItem2 = svgDoc.getElementById("rect4154-4"); // Choosing light from content
    
   position_plus = Scada.encodeGroupAddress('6/0/54'); // Position
      objectStore.addListener(position_plus, function(obj, type) {
   height = Number( svgItem.getAttribute("height") ) + 10;
   if ( height >= 100 ) { svgItem.setAttribute('height', '100') } else if ( height < 100 ) { svgItem.setAttribute('height', height) }
   height = svgItem.getAttribute("height");
   if (height > 50) {svgItem.style.fill='black'; svgItem2.style.opacity= '0'} else {svgItem.style.fill='red'; svgItem2.style.opacity= '80'}
   });
   
   position_minus = Scada.encodeGroupAddress('6/0/53'); // Position
      objectStore.addListener(position_minus, function(obj, type) {
   height = Number( svgItem.getAttribute("height") ) - 10;
   if ( height <= 0 ) { svgItem.setAttribute('height', '0') } else if ( height > 0 ) { svgItem.setAttribute('height', height) }
   height = svgItem.getAttribute("height");
   if (height > 50) {svgItem.style.fill='black'; svgItem2.style.opacity= '0'} else {svgItem.style.fill='red'; svgItem2.style.opacity= '80'}
   });
   
   // onclick blind-up
   svgItem.addEventListener('click', function (event) {
        }, false);
        svgItem.addEventListener('click', function (event) {
        svgItem.setAttribute('height', '0')
        }, true);
   
   // onclick blind-down
   svgItem1.addEventListener('click', function (event) {
        }, false);
        svgItem1.addEventListener('click', function (event) {
        svgItem.setAttribute('height', '100');
        }, true);
 
});
 
});

2. Upload 'interactive.svg' to /Images/Backgrounds'.

3. You can also add some buttons which change +/-10% height.
Currently they should be created in this way:
For +10%:  '6/0/54' which send 0 and 1
For -10%:  '6/0/53' which send 0 and 1

4. Try manipulating this svg

(05.03.2018, 07:45)Alphaplasti Wrote: Thank you ! It work perfect, now i can learn about Js and svg manipulation !

(05.03.2018, 08:13)buuuudzik Wrote:

(05.03.2018, 07:45)Alphaplasti Wrote: Thank you ! It work perfect, now i can learn about Js and svg manipulation !

Good luck, if you have some question please ask