### WebSocket Implement Clock

A simple example to show the actual date & time and update every 2 seconds.
HTML define the label showing Daten & Time in Index.html
<!DOCTYPE html>
<html>
<head>
<title>WebApp Clock</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="/b4j_ws.js"></script>
</head>
<body>
<H1>WebApp Clock Example</H1>
<HR>
<div id="lbldatetime"></div>
<div class="author">by Robert W.B. Linn</div>
<!-- Script Area -->
<script>
$( document ).ready(function() {
//Use console logging for tests - example FireFox with FireBug
console.log('Document ready started.');
// Connect to the B4J Server = the handler helloworld.bas is called
b4j_connect("/ws");
});
</script>
</body>
</html>
B4J define the logic
'B4J project webclock.b4j
`Sub Process_Globals
Public srvr As Server
End Sub`
`Sub AppStart (Args() As String)
srvr.Initialize("srvr")
srvr.AddWebSocket("/ws", "webclock")
srvr.Port = 51042
srvr.Start
StartMessageLoop
End Sub`
'BAS file webclock.bas
`Sub Class_Globals
Private ws As WebSocket
Private btnabout As JQueryElement 'Alert to show info about this app
Private lbldatetime As JQueryElement 'Label showing date and time
Private tmr As Timer
End Sub`
`Public Sub Initialize
'NOT USED - DO NOT DELETE
End Sub`
'The user opens via browser :51042. The html file index.html is displayed.
`Private Sub WebSocket_Connected (WebSocket1 As WebSocket)
ws = WebSocket1
tmr.Initialize("Timer1", "2000")
tmr.Enabled = True
lbldatetime.SetHtml("" & DateTime.Date(DateTime.Now) & " " & DateTime.Time(DateTime.Now) & "")
End Sub`
'Stop the timer
`Private Sub WebSocket_Disconnected
tmr.Enabled = False
End Sub`
`Sub Timer1_tick
Log("Timer Tick")
lbldatetime.SetHtml("" & DateTime.Date(DateTime.Now) & " " & DateTime.Time(DateTime.Now) & "")
'IMPORTANT as this will cause the page to refresh
ws.Flush
End Sub`

Changed: , Category: WebApps, File: T6C277M2086.htm, ID: 2086