Logic Machine Forum
Make the text blink when the value is 1 - Printable Version

+- Logic Machine Forum (https://forum.logicmachine.net)
+-- Forum: LogicMachine eco-system (https://forum.logicmachine.net/forumdisplay.php?fid=1)
+--- Forum: Visualization (https://forum.logicmachine.net/forumdisplay.php?fid=9)
+--- Thread: Make the text blink when the value is 1 (/showthread.php?tid=4116)



Make the text blink when the value is 1 - Fahd - 29.06.2022

Hi, 

I am using the Java code below to change the color of the object when it's 1 (1 = Alarm, 0 = No Alarm) 
However, Is it possible to make the text blink when it's equal to 1?
If yes, how could I do that?
Thankfully in advance 
Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;

        if (obj.value) {
          color = 'red';
        }
        else  {
          color = 'Green';
        }

        $(el).css('color', color);
      });
    }
  });
});
e to change the color of the


RE: Make the text blink when the value is 1 - admin - 29.06.2022

Add to custom CSS:
Code:
@keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{
  animation-name: blinker;
  animation-duration: 0.6s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-direction: alternate;
}

Modify custom JS like this:
Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;

        if (obj.value) {
          color = 'red';
        }
        else  {
          color = 'Green';
        }

        $(el).css('color', color).toggleClass('blink', obj.value);
      });
    }
  });
});



RE: Make the text blink when the value is 1 - Fahd - 29.06.2022

(29.06.2022, 08:04)admin Wrote: Add to custom CSS:
Code:
@keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{
  animation-name: blinker;
  animation-duration: 0.6s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-direction: alternate;
}

Modify custom JS like this:
Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;

        if (obj.value) {
          color = 'red';
        }
        else  {
          color = 'Green';
        }

        $(el).css('color', color).toggleClass('blink', obj.value);
      });
    }
  });
});

Thanks a lot  Big Grin


RE: Make the text blink when the value is 1 - AlexLV - 01.08.2022

Hi,

for me blink not working for latest Mozilla (v.103.0) Chrome and MS Edge are OK. Is it possible to start work blink function for Mozilla? I use it because with Mozilla is possible to see video stream from cams. Or .blink is obsolete function for Mozilla and no variants?

BR,

Alex


RE: Make the text blink when the value is 1 - admin - 01.08.2022

Works for me in Firefox 103. It uses CSS animation for blinking. This is a standard feature supported by all modern browsers.


RE: Make the text blink when the value is 1 - Fahd - 10.08.2022

(01.08.2022, 13:05)admin Wrote: Works for me in Firefox 103. It uses CSS animation for blinking. This is a standard feature supported by all modern browsers.

Hi Guys, 

In the last two weeks, the function worked fine, but I just find out that it doesn't work anymore as long as the object is read-only,  
If I disable the read-only function it will start working again. 
nb: I didn't change anything form the CSS and JS code


RE: Make the text blink when the value is 1 - admin - 10.08.2022

Read-only class overrides the animation. Modify Custom JS like this:
Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var $el = $(el), addr = $el.data('object');
    
    if ($el.hasClass('item-read-only')) {
      $el.removeClass('item-read-only').css('pointer-events', 'none');
    }

    if (addr) {
      grp.listen(addr, function(obj) {
        var color = obj.value ? 'red' : 'green';
        $el.css('color', color).toggleClass('blink', obj.value);
      });
    }
  });
});



RE: Make the text blink when the value is 1 - AlexLV - 10.08.2022

admin thanks !!
My problem also solved when I modified Custom JS Smile So it was linked with read-only settings.

Alex


RE: Make the text blink when the value is 1 - Re-G - 12.02.2023

Hi.

Im trying to use this code:


Code:
$(function() {
  $('.java_test').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color_1;

        if (obj.value) {
          color_1 = 'red';
        }
        else  {
          color_1 = 'Green';
        }

        $(el).css('color_1',obj.value).toggleClass('class_for_1', obj.value);
      });
    }
  });
});
to toggle a css class. For value 1 i would like to set css class f.e. class_for_1 with parameter filter: drop-shadow (x1, y1, b1, c1), if value is 0 class should be changed to class_for_0 with parameter filter: drop-shadow (x2, y2, b2, c2). It's working only for value=1. Please help.

Thanks


RE: Make the text blink when the value is 1 - admin - 13.02.2023

Use this:
Code:
$(el).css('color_1',obj.value).toggleClass('class_for_1', obj.value).toggleClass('class_for_0', !obj.value);



RE: Make the text blink when the value is 1 - Re-G - 13.02.2023

(13.02.2023, 07:03)admin Wrote: Use this:
Code:
$(el).css('color_1',obj.value).toggleClass('class_for_1', obj.value).toggleClass('class_for_0', !obj.value);

Thanks.


RE: Make the text blink when the value is 1 - Krists - 07.08.2023

Hello.What I have to change for text blinking ,if I want:
object value 0 = blink
object value 1 = no blink

The code below works opposite!!


Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;
        if (obj.value) {
          color = 'red';
        }
        else  {
          color = 'Green';
        }
        $(el).css('color', color).toggleClass('blink', obj.value);
      });
    }
  });
});



RE: Make the text blink when the value is 1 - RomansP - 07.08.2023

(07.08.2023, 12:13)Krists Wrote: Hello.What I have to change for text blinking ,if I want:
object value 0 = blink
object value 1 = no blink

The code below works opposite!!


Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;
        if (obj.value) {
          color = 'red';
        }
        else  {
          color = 'Green';
        }
        $(el).css('color', color).toggleClass('blink', obj.value);
      });
    }
  });
});
Code:
$(function() {
  $('.color-by-value').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;
        if (obj.value) {
          color = 'red';
        }
        else  {
          color = 'Green';
        }
        $(el).css('color', color).toggleClass('blink', !obj.value);
      });
    }
  });
});



RE: Make the text blink when the value is 1 - Krists - 08.08.2023

Great!
It works!

Thank you


RE: Make the text blink when the value is 1 - victor.back - 03.09.2023

Code:
$(function() {
  $('.color-by-door-opacity').each(function(_, el) {
    var addr = $(el).data('object');
    if (addr) {
      grp.listen(addr, function(obj) {
        var color;
        var opacityValue;

        if (obj.value) {
          color = '#f44236';
          opacityValue = 1; // Synlig
        }
        else  {
          color = 'transparent'; // Istället för att ändra färgen till grön, gör vi den genomskinlig
          opacityValue = 0; // Osynlig
        }

        $(el).css({'color': color, 'opacity': opacityValue}).toggleClass('blink', obj.value);
      });
    }
  });
});
Hi.

I use this script for visu an icon to blink when 1 and not be visable when 0. works well except from that my android 12 10" touch screen that runs the visu on Fully Kiosk Browser is crashing when the scripts reslut is 1, that is not happening when script result is 0.
Is this somthing with the script? Or maybe something that Fully Kiosk Browser cannot handle