Index: lams_learning/web/gate/scheduleGateContent.jsp
===================================================================
diff -u -r849974951204f4b6aae6c21564e3a815fec12162 -r5d896b9c108705c770d5294510f60ae9aa027f6d
--- lams_learning/web/gate/scheduleGateContent.jsp	(.../scheduleGateContent.jsp)	(revision 849974951204f4b6aae6c21564e3a815fec12162)
+++ lams_learning/web/gate/scheduleGateContent.jsp	(.../scheduleGateContent.jsp)	(revision 5d896b9c108705c770d5294510f60ae9aa027f6d)
@@ -19,81 +19,50 @@
   http://www.gnu.org/licenses/gpl.txt
 --%>
 
-<%@ taglib uri="tags-html" prefix="html" %>
-<%@ taglib uri="tags-bean" prefix="bean" %>
-<%@ taglib uri="tags-logic" prefix="logic" %>
-<%@ taglib uri="tags-core" prefix="c" %>		
-<%@ taglib uri="tags-fmt" prefix="fmt" %>
-<%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="tags-html" prefix="html"%>
+<%@ taglib uri="tags-bean" prefix="bean"%>
+<%@ taglib uri="tags-logic" prefix="logic"%>
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-fmt" prefix="fmt"%>
+<%@ taglib uri="tags-lams" prefix="lams"%>
 
-<lams:out value="${GateForm.map.gate.description}" escapeHtml="true"/>
+<div class="panel">
+	<lams:out value="${GateForm.map.gate.description}" escapeHtml="true" />
+</div>
 
+<lams:Alert type="info" close="false" id="whenOpens">
+<fmt:message key="label.schedule.gate.open.remaining" />&nbsp;<strong><time class="timeago" datetime="<fmt:formatDate value='${GateForm.map.startingTime}' pattern="yyyy-MM-dd'T'HH:mm:ss.S"/>"></time></strong>
+</lams:Alert>
+
 <c:choose>
 	<c:when test="${not empty GateForm.map.reachDate}">
-		<p><fmt:message key="label.schedule.gate.reach"/> <lams:Date value="${GateForm.map.reachDate}"/><br />
-		   <fmt:message key="label.schedule.gate.offset.1"/> <span id="offset"></span> <fmt:message key="label.schedule.gate.offset.2"/>
+		<p>
+			<fmt:message key="label.schedule.gate.reach" />
+			<strong><lams:Date value="${GateForm.map.reachDate}" /></strong>
+			<br />
+			<fmt:message key="label.schedule.gate.offset.1" />
+			<span id="offset"></span>
+			<fmt:message key="label.schedule.gate.offset.2" />
 		</p>
 	</c:when>
 	<c:otherwise>
 		<c:if test="${GateForm.map.startingTime!=null}">
-			<p><fmt:message key="label.schedule.gate.open.message"/> <lams:Date value="${GateForm.map.startingTime}"/></p>
+			<p>
+				<fmt:message key="label.schedule.gate.open.message" />&nbsp;<strong><lams:Date value="${GateForm.map.startingTime}" /></strong>
+			</p>
 		</c:if>
 		<c:if test="${GateForm.map.endingTime!=null}">
-			<p><fmt:message key="label.schedule.gate.close.message"/> <lams:Date value="${GateForm.map.endingTime}"/></p>
+			<p>
+				<fmt:message key="label.schedule.gate.close.message" />
+				<lams:Date value="${GateForm.map.endingTime}" />
+			</p>
 		</c:if>
 	</c:otherwise>
 </c:choose>
 
-<fmt:message key="label.schedule.gate.open.remaining"/> <span id="remaining"></span>
-
-<script type="text/javascript">
-	function buildDateString(offset, longFormat) {
-		var result = "",
-			day = 24*60*60,
-			offsetDay = Math.floor(offset/day);
-		offset -= offsetDay * day;
-		var offsetHour = Math.floor(offset/(60*60));
-		offset -= offsetHour * 60 * 60;
-		var offsetMinute =  Math.floor(offset/60);
-		
-		if (offsetDay > 0) {
-			result = offsetDay + " " + dayLabel + " ";
-		}
-		if (offsetHour > 0) {
-			result += offsetHour + " " + hourLabel + " ";
-		}
-		if (offsetMinute > 0) {
-			result += offsetMinute + " " + minuteLabel + " ";
-		}
-		if (longFormat) {
-			var offsetSecond = offset - offsetMinute * 60;
-			result += offsetSecond + " " + secondLabel;
-		}
-		return result;
-	}
-
-	var dayLabel = '<fmt:message key="label.days"/>',
-		hourLabel = '<fmt:message key="label.hours"/>',
-		minuteLabel = '<fmt:message key="label.minutes"/>',
-		secondLabel = '<fmt:message key="label.seconds"/>',
-		offsetField = document.getElementById('offset'),
-		remainingField = document.getElementById('remaining'),
-		remainTime = ${GateForm.map.remainTime};
-
-	setInterval(function(){
-		remainTime--;
-		if (remainTime <= 0) {
-			document.location.reload();
-		} else {
-			var remainingFieldText = buildDateString(remainTime, true);
-			remainingField.innerHTML = remainingFieldText;
-		}
-	}, 1000);
-		
-	if (offsetField != null) {
-		var offset = '${GateForm.map.startOffset}',
-			offsetFieldText = buildDateString(+offset, false);
-		offsetField.innerHTML = offsetFieldText;
-	}
-
-</script>
\ No newline at end of file
+  <script type="text/javascript">
+    jQuery(document).ready(function() {
+    	jQuery.timeago.settings.allowFuture = true;
+      jQuery("time.timeago").timeago();
+    });
+  </script>
\ No newline at end of file