diff --git a/src/data/index.htm b/src/data/index.htm
index b0b56fc..4211b9d 100644
--- a/src/data/index.htm
+++ b/src/data/index.htm
@@ -8,8 +8,6 @@
   <link href="main.css" rel="stylesheet" type="text/css" />
   <link rel="manifest" href="manifest.json">
   <script type="text/javascript">
-    var button = document.getElementById("button");
-    var led = document.getElementById("led");
 
     function ajaxGet(url, responseCallback) {
       var xh = new XMLHttpRequest();
@@ -25,16 +23,23 @@
       xh.send(null);
     };
 
+    function showMessage(s) {
+      var displayMessageId = document.getElementById("displayMessageId");
+      displayMessageId.innerHTML = "<pre>" + s + "</pre>";
+    }
+
     function handleFwdClockResponse(result) {
+      var led = document.getElementById("led");
+      var msg = "";
       if (result.result == "OK") {
         led.src = "led-on.png";
         var clockName = document.getElementById("clockNameId");
         clockName.html = result.clockName;
-        var displayedTime = document.getElementById("displayedTimeId");
-        displayedTime.html = result.hours + ":" + result.minutes + " " + result.seconds;
+        msg = result.real_hours + ":" + result.real_minutes + " " + result.real_seconds + "<br>";
       } else {
         led.src = "led-off.png";
       }
+      showMessage(msg + JSON.stringify(result, null, 2));
     };
 
     function fwdClock() {
@@ -42,6 +47,10 @@
     };
 
     function handleClockStatusResponse(result) {
+      //showMessage(JSON.stringify(result));
+      document.getElementById("clockNameId").textContent = result.clockName;
+      document.getElementById("realTimeId").textContent = result.real_hours + ":" + result.real_minutes + " " + result.real_seconds;
+      document.getElementById("modelTimeId").textContent = result.model_hours + ":" + result.model_minutes + " " + result.model_seconds;
 
     };
 
@@ -52,10 +61,26 @@
       }, 400);
     };
 
+    function handleSetDisplayedTimeResponse(result) {
+      showMessage(JSON.stringify(result, null, 2));
+    };
+
     function setDisplayedTime() {
       var hoursInput = document.getElementById("displayedHoursInputId");
       var minutesInput = document.getElementById("displayedMinutesInputId");
-      alert("Values=" + hoursInput.value + ":" + minutesInput.value);
+      ajaxGet("/setDT?h=" + hoursInput.value + "&m=" + minutesInput.value, handleSetDisplayedTimeResponse);
+    }
+
+    function handleChangeClockResponse(result) {
+      showMessage(JSON.stringify(result, null, 2));
+    };
+
+    function setClockToModel() {
+      ajaxGet("/clock/model", handleChangeClockResponse);
+    }
+
+    function setClockToReal() {
+      ajaxGet("/clock/real", handleChangeClockResponse);
     }
 
     function onBodyLoad() {
@@ -82,12 +107,18 @@
 <body id="index" onload="onBodyLoad()">
   <div class="hdr"><img src="fremoei.gif"></div>
   <div><label>Clock name: </label><span id="clockNameId"></span></div>
-  <div><label>Time: </label><span id="displayedTimeId"></span></div>
+  <div><label>Real time (h:m): </label><span id="realTimeId"></span></div>
+  <div><label>Model time (h:m): </label><span id="modelTimeId"></span></div>
   <div>
-    <input type="number" min="0" max="23" id="displayedHoursInputId">
+    <input type="number" min="0" max="23" id="displayedHoursInputId">:
     <input type="number" min="0" max="59" id="displayedMinutesInputId">
-    <input type="button" onclick="setDisplayedTime">
+    <button onclick="setDisplayedTime()">Adjust to actual time</button>
   </div>
+  <div>
+    <button onClick="setClockToModel()">Model time</button>
+    <button onClick="setClockToReal()">Real time</button>
+  </div>
+  <div id="displayMessageId" class="logmsg"></div>
   <div class="btn_cnt"><img id="led" src="led-off.png"><a href="#"><img id="button" src="btn.png"></a></div>
 </body>
 
diff --git a/src/data/main.css b/src/data/main.css
index 4f53364..d7ef713 100644
--- a/src/data/main.css
+++ b/src/data/main.css
@@ -31,6 +31,13 @@ body {
   color: #555;
 }
 
+.logmsg {
+  background: #CFC;
+  text-align: left;
+  color: #555;
+  padding-top: 8px;
+}
+
 .hdr {
   width: 100%;
   padding: 15px 0 15px 0;
