Adding the Current Date and Time Formatted


#1

Hey. I am trying to add text that will add the current date and time. I added an HTML widget box and added this to it…

  <texty>
         <script language="javascript"> 
              var today = new Date();
              document.write(today);
         </script>
    </texty>

In the HTML Head I have this:

 <style>
    texty {
        font-family: Lato, sans-serif;
        font-style: oblique;
        font-size: 18 pt;
        color: #ffffff;
    }
    </style>

So it doesn’t work at all. It comes in black (on a black background) and the next problem is that I want to format the results as “02/29/16 1:52pm”

Anybody have any insight in how to format script in an HTML widget box and also the correct JavaScript language to make the date and time display as stated? Thank you for any help with this.

Previously in Edge Animate I created this code to make it all happen…

var theTimeBox = sym.getSymbol("timeTxt_symbol");
var cbcDate = new Date();
var datestring = cbcDate.toDateString();

var cbcTime = new Date();
var h = cbcTime.getHours();
var m = cbcTime.getMinutes();
var y = cbcDate.getFullYear();
var mo = cbcDate.getMonth();
var d = cbcDate.getDate();

var mStr = m;

if (m <= 9) {
	mStr = "0" + m;
}

var hStr = h;

if (h > 12) {
	hStr = h % 12;
}
if (h == 12) {
	hStr = "12";
} 
if ((h % 12) < 10) {
	hStr = "0" + hStr;
}


var moStr = mo + 1;

//alert("moStr is " + moStr + "/hStr is " + hStr + "/mStr is " + mStr);

var theDateAndTime = (moStr + "/" + d + "/" + y + "   " + hStr + ":" +  mStr);

theTimeBox.$("timeTxt").text(theDateAndTime);

(Gerfried) #2

Try this (see HEAD in the attachment). Not pretty, but should get you started.
datetime.hype.zip (15.5 KB)


#3

So many thanks! Here are the steps for others looking to do the same:

  1. I made a function called “tellTheTime” and put this code into it:

    setInterval(function() {
    var d = new Date();
    var hours = d.getHours();
    var minutes = d.getMinutes();
    var ampm = hours >= 12 ? ‘pm’ : ‘am’;
    hours = hours % 12;
    hours = hours ? hours : 12; // the hour ‘0’ should be '12’
    minutes = minutes < 10 ? ‘0’+minutes : minutes;
    var strTime = hours + ‘:’ + minutes + ’ ’ + ampm;
    document.getElementById(“timeText”).innerHTML = d.getMonth()+1+"/"+d.getDate()+"/"+d.getFullYear() + " " + strTime;
    }, 1000);

(setInterval was the key)

  1. Call the function “tellTheTime” onSceneLoad
  2. make sure to name the formatted text box “timeText” in Identity/Unique Element ID

It works great! Thanks again.


(Mark Hunte) #4

Well since I was having a quick look at it any way.

dateFormat.hype.zip (11.9 KB)