Index: lams_monitoring/web/gate/scheduleGateContent.jsp
===================================================================
diff -u -ra0aafa6930f1fd155293fe0955b2b6ee3d82f6b2 -r225d293907a5e2976e367ee3aa790239bad38699
--- lams_monitoring/web/gate/scheduleGateContent.jsp	(.../scheduleGateContent.jsp)	(revision a0aafa6930f1fd155293fe0955b2b6ee3d82f6b2)
+++ lams_monitoring/web/gate/scheduleGateContent.jsp	(.../scheduleGateContent.jsp)	(revision 225d293907a5e2976e367ee3aa790239bad38699)
@@ -26,6 +26,56 @@
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
 
+	<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-bootstrap-theme.css" rel="stylesheet">
+	<link rel="stylesheet" href="<lams:LAMSURL/>css/jquery-ui.timepicker.css" type="text/css" media="screen" />
+	
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery-ui.js"></script>
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery-ui.timepicker.js"></script>
+
+	<script type="text/javascript">
+		var shown = true;
+		
+		$(document).ready(function(){
+			toggleDateWidget();
+			// sets up calendar for schedule date choice
+			$('#scheduleDate').datetimepicker({
+				'minDate' : 0
+			});
+		});
+		
+		function toggleDateWidget() {
+			if ( shown ) {
+				$('#scheduleDate').hide();	
+				$('#scheduleDatetimeApply').hide();
+				shown = false;
+			} else {
+				$('#scheduleDate').show();	
+				$('#scheduleDatetimeApply').show();
+				shown = true;
+			}
+		}
+/* 		
+		function applyDate() {
+			var date = $('#scheduleDatetimeField').val();
+			if (date) {
+				$.ajax({
+					url : LAMS_URL + 'monitoring/gate.do',
+					cache : false,
+					data : {
+						'method'        : ??,
+						'openDate' : date
+					},
+					success : function() {
+						refreshMonitor('lesson');
+					}
+				});
+			} else {
+				alert('<fmt:message key="error.lesson.schedule.date"/>');
+			}
+		}
+ */	</script>
+	
 	<c:set var="title"><fmt:message key="label.schedule.gate.title"/></c:set>
 	<lams:Page title="${title}" type="monitoring">
 
@@ -37,11 +87,27 @@
 			<c:otherwise>
 				<c:if test="${not GateForm.map.gate.gateOpen}" >
 					<p><fmt:message key="label.schedule.gate.open.message"/> <lams:Date value="${GateForm.map.startingTime}"/></p>
+					
+					<html:form action="/gate?method=scheduleGate" target="_self" styleClass="form-inline">
+					<input type="hidden" name="activityId" value="${GateForm.map.activityId}" />
+
+					<div class="form-group">
+						<a id="rescheduleShowButton" class="btn btn-default btn-sm" href="#" onClick="javascript:toggleDateWidget()">
+							   <i class="fa fa-calendar"></i>
+							   <fmt:message key="label.reschedule"/>
+						</a>
+						<%-- padding keeps the inputs the same height as the buttons. No flicking when shown/hidden --%>
+						<html:text styleClass="input input-sm" property="scheduleDate" styleId="scheduleDate" style="vertical-align:bottom"/> 
+						<html:submit styleId="scheduleDatetimeApply" styleClass="btn btn-primary btn-sm loffset2"><fmt:message key="button.apply"/></html:submit>
+					</div>
+					</html:form>
 				</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>
 				</c:if>
+				
+				
 			</c:otherwise>
 		</c:choose>