This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm that you accept these cookies being set.

change value to ## when condition meet
#1
Hello 
I read data from generator, but when its off some values gives unreal measurements.
so I want to convert these values to ## when generator is off.
BR,
Reply
#2
Similar to this example: https://forum.logicmachine.net/showthread.php?tid=4091

When <body> element has generator-off class then all elements with generator-status additional class will have the current value hidden by setting the text color to transparent and showing a pseudo-element with ## before the value text.
Code:
body.generator-off .generator-status.item-value,
body.generator-off .generator-status .value {
  color: transparent;  
}
body.generator-off .generator-status.item-value:before,
body.generator-off .generator-status .value:before {
  color: #333;
  content: '##';
}
Reply
#3
Thank you admin
So I need the JS from the example before?
But what is the <body> element? Do I need to change it? Is it a variable?
I am not familiar with JS and CSS
Reply
#4
Code:
$(function(){
  if (window.grp) {
    grp.listen('62/7/0', function(object) {
      $('body').toggleClass('generator-off', object.value == false);
    });
  }
});
this is the JS Used with the CSS code:
Code:
body.generator-off .generator-status.item-value,
body.generator-off .generator-status .value {
  color: transparent; 
}
body.generator-off .generator-status.item-value:before,
body.generator-off .generator-status .value:before {
  color: #333;
  content: '##';
}
 
and this is what I got:

Attached Files Thumbnail(s)
   
Reply
#5
You've probably set custom text color in element properties.
Use this CSS instead:
Code:
body.generator-off .generator-status.item-value,
body.generator-off .generator-status .value {
  color: transparent !important;  
}

body.generator-off .generator-status.item-value:before,
body.generator-off .generator-status .value:before {
  color: #000;
  content: '##';
}
Reply
#6
Thanks Admin
Work Perfect
Reply


Forum Jump: