'Inteligenty' dom ze sterownikiem PLC

Główna => Programowanie => Wątek zaczęty przez: lucarasp w Listopada 25, 2012, 07:44:40 pm

Tytuł: jQuery and TIME_OF_DAY
Wiadomość wysłana przez: lucarasp w Listopada 25, 2012, 07:44:40 pm
Hi all,

I've managed to write a small web page with buttons and icons that let me switch between scenarios.
I'm now trying to setup a input field for changing morning wake-up time.

I was able to add new variable format for reading, but I have no clue of how to decode HH:MM format to DINT before writing it back to PLC.

Any hint is appreciated!!

Regards, Luca

P.S.: On the reading side i added the "TOD" datatype to jquery.e-dom.2.0.js:

if (CurrentField.attr('data-valuetype')==='TOD') {
CurrentField.bind('OnReadSuccess', function(event, data){
if (data>86399999) {data-=0;};
CurrentField.html('<p>'+Math.floor(data/3600000)+':'+Math.floor((data%3600000)/60000)+'</p>');
return false;
})
}

TOD is actually a DINT containing the number of millisecond from midnight, and 86399999 is the value reached at 23:59:59.999
Tytuł: Odp: jQuery and TIME_OF_DAY
Wiadomość wysłana przez: admin w Listopada 27, 2012, 10:16:16 am
Hello Luca,

It's good to see you here :)

Please see below the code, which should do the trick. I have not had a chance to test in on PLC, but form the JavaScript side it works fine:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.e-dom.2.0.js" ></script>

<script type="text/javascript">

var ServerName = "http://X.X.X.X/";

$(document).ready(function() {
$('#ReadButton').click(function(){
$(this).ReadValue({
address: "XXX"
});
});

$('#ReadButton').bind('OnReadSuccess', function(event, data){
//if (data>86399999) {data-=0;}; I am not sure what you want to do here... -=0 is...doing nothing?
$('#ToD').val(Math.floor(data/3600000)+':'+Math.floor((data%3600000)/60000));
return false;
})

$('#WriteButton').click(function(){
var ErrorMessage='';
var TimeCandidate=$('#ToD').val();
if (TimeCandidate.length==5&&TimeCandidate.substring(2,3)==":"){
var HourCandidate = parseInt(TimeCandidate.substring(0,2));
var MinuteCandidate = parseInt(TimeCandidate.substring(3,5));
if (HourCandidate>=0&&HourCandidate<24&&MinuteCandidate>=0&&MinuteCandidate<60){
var TOD = HourCandidate * 3600000 + MinuteCandidate * 60000;
$(this).WriteValue({
address:  "XXX",
value: TOD,
successfn: function() {
$('#Status').text("TOD data successfully sent");
}
});
$('#Status').text("Sending... "+TOD);
}
else {
ErrorMessage = "Hour/Minute conversion failure";
}
}
else {
ErrorMessage = "Time Format error";
}
if (ErrorMessage.length>0) {
$('#Status').text(ErrorMessage);
}
});

});
</script>

 
</head>

<body>
<div id="ReadButton"> Read Time </div>
<p><input id="ToD" type="text" size="10" value=""></p>
<div id="WriteButton"> Write Time </div>
<div id="Status">.....idle </div>
</body>
</html>

Please let me know if it works for you,

P.
Tytuł: Odp: jQuery and TIME_OF_DAY
Wiadomość wysłana przez: lucarasp w Listopada 27, 2012, 10:19:10 pm
Hi, it works!!

I'm now trying to let it accept short format like "H:MM" without trailing zero.


      //if (data>86399999) {data-=0;}; I am not sure what you want to do here... -=0 is...doing nothing?


I meant to reset values higher than 86399999 to prevent bad results, maybe I ended in subtracting..... nothing??

Later I will try to write a few routines with useful conversions to be kept in a separate library. I will let you know.

Thanks a lot

Ciao

Luca.
Tytuł: Odp: jQuery and TIME_OF_DAY
Wiadomość wysłana przez: admin w Listopada 28, 2012, 08:52:02 am
Hello Luca,

I am glad it works :)

Maybe instead of making it accept different formats, you could enforce that the format is always right.  One thing would be to extend the OnReadSuccess function:

$('#ReadButton').bind('OnReadSuccess', function(event, data){
var Hour = Math.floor(data/3600000);
var Minute = Math.floor((data%3600000)/60000);
$('#ToD').val(((Hour<10)?"0":"")+Hour+":"+((Minute<10)?"0":"")+Minute);
return false;
})

The other could be creating a validation function, which checks and corrects the value of the textfield:

$('#ToD').bind("change", function(){
    //validate it here by working with $(this).val()....
});

Good luck!

P.