Index: lams_monitoring/web/emailnotifications/courseNotifications.jsp
===================================================================
RCS file: /usr/local/cvsroot/lams_monitoring/web/emailnotifications/courseNotifications.jsp,v
diff -u -r1.1.2.1 -r1.1.2.2
--- lams_monitoring/web/emailnotifications/courseNotifications.jsp	31 Aug 2011 20:36:35 -0000	1.1.2.1
+++ lams_monitoring/web/emailnotifications/courseNotifications.jsp	3 Sep 2011 23:01:16 -0000	1.1.2.2
@@ -3,89 +3,150 @@
 <%@ taglib uri="tags-fmt" prefix="fmt" %>
 <%@ taglib uri="tags-core" prefix="c" %>
 <%@ taglib uri="tags-lams" prefix="lams" %>
+<%@ taglib uri="tags-function" prefix="fn"%>
+<% pageContext.setAttribute("newLineChar", "\n"); %>
 
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 <lams:html>
 <lams:head>
 	<html:base/>
 	<link rel="shortcut icon" href="<lams:LAMSURL/>/favicon.ico" type="image/x-icon" />
 	<title><fmt:message key="${title}"/></title>
+	
 	<lams:css style="learner"/>
-	<script language="JavaScript" type="text/JavaScript" src="<lams:LAMSURL/>/includes/javascript/changeStyle.js"></script>
-	<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery-1.1.4.pack.js"></script>
-	<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.tablesorter.pack.js"></script>
-	<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.tablesorter.pager.js"></script>
+	<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-1.8.11.redmont-theme.css" rel="stylesheet">
+	<link rel="stylesheet" type="text/css" href="<lams:LAMSURL/>/css/ui.jqgrid-4.1.2.css" />	
+	<style media="screen,projection" type="text/css">
+		div#content {min-height: 250px; }
+		#emailTextareaDiv {float: right;}
+		#emailButton {text-align: right; float: right;}
+		#additionalParameters {min-height: 50px;}
+		#lessonsDiv {display: none;}
+	</style>	
+	
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery-1.5.1.min.js"></script>
+	<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/grid.locale-en.js"></script>
+	<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.jqGrid.min.js"></script>
+	<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.jstepper.min.js"></script>
 	<script language="JavaScript" type="text/javascript">
-		<!--
+	<!--
 		jQuery(document).ready(function() {
-			$("table.tablesorter-admin").tablesorter({widthFixed:true, sortList:[[0,0]], headers:{0:{sorter:'integer'},5:{sorter:false}}})
-				.tablesorterPager({container: jQuery("#pager")});
+		
+			jQuery("#list3").jqGrid({
+			   	url: getUrl(),
+				datatype: "json",
+			   	colNames:['<fmt:message key="email.notifications.user.name"/>'],
+			   	colModel:[
+			   		{name:'name',index:'name', width:260, firstsortorder:'desc', sorttype: 'text'}
+			   	],
+			   	rowNum:50,
+			   	rowList:[50,75,100,150,200],
+			   	pager: '#pager3',
+			   	sortname: 'name',
+			   	multiselect: true,
+			    sortorder: "asc",
+			    loadonce: true,
+			    height:'auto',
+			    pagerpos:'left'
+			});
+			jQuery("#list3").jqGrid('navGrid','#pager3',{add:false,del:false,edit:false,refresh:false,position:'left'});
+			$("#list3").parents('div.ui-jqgrid-bdiv').css("max-height","1000px");
 			
-			$("#checkboxAll").click(function() {
-				var isChecked = this.checked;
-				$("input[name='userId']").each(function() {
-					this.checked = isChecked;
-				});
+			jQuery("#lessonsTable").jqGrid({
+				datatype: "local",
+			   	colNames:['Id', '<fmt:message key="email.notifications.lesson.name"/>'],
+			   	colModel:[
+					{name:'id2',index:'id2', width:35, sorttype:"int"},
+			   		{name:'name',index:'name', width:225, firstsortorder:'desc', sorttype: 'text'}
+			   	],
+			   	sortname: 'id2',
+			   	multiselect: true,
+			    sortorder: "asc",
+			    height:'auto'
 			});
-			$("input[name=userId]").click(function() {
-				if ($("input[name=userId]:checked").length == 0) {
-					$("#checkboxAll").attr('checked', false);
-				} else if ($("input[name=userId]:checked").length == $("input[name=userId]").length) {
-					$("#checkboxAll").attr('checked', true);
-				}
-			});
 			
-//			$('#startLessonWithClassButton').click(function() {
-//				document.location.href = baseUrl + "startLesson.do?dispatch=startLessonWithClass&sessionMapID=" + sessionMapID + "&" + $("#emailNotificationsForm").serialize(true);
-//			});
+			<c:forEach var="lesson" items="${lessons}" varStatus="i">
+				jQuery("#lessonsTable").jqGrid('addRowData',${lesson.lessonId}, {id2:'${lesson.lessonId}',name:'${lesson.lessonName}'});
+			</c:forEach>
 			
+			$("#lessonsTable").parents('div.ui-jqgrid-bdiv').css("max-height","10000px");
+			
+			$("#daysToDeadline").jStepper({minValue:0, maxValue:999, defaultValue:3, allowDecimals:false});
+			
+    		$('#emailButton').click(function() {
+    			
+    			var ids = jQuery("#list3").getGridParam('selarrrow');
+    			var params;
+    			if(ids.length) {
+    			    for (var i=0;i<ids.length;i++) {
+    			    	params += "&userId=" + ids[i];
+    			    }
+    			} else {
+    				return;
+    			}
+    			
+    			var emailBody = escape(document.getElementById("emailBody").value);
+    	        $.ajax({
+    	        	async: false,
+    	            url: '<c:url value="/emailNotifications.do"/>',
+    	            data: 'method=emailUsers&' + params+ "&emailBody=" + emailBody,
+    	            dataType: 'json',
+    	            type: 'post',
+    	            success: function (json) {
+    		            if (json.isSuccessfullySent) {
+    		            	alert('<fmt:message key="email.notifications.emails.successfully.sent" />');
+    					} else {
+    						alert('<fmt:message key="email.notifications.problems.sending.emails" />');
+    					}
+    	            }
+    	       	});
+    		});
 
 		});
-		
-		function resizeIframe() {
-			if (document.getElementById('TB_iframeContent') != null) {
-			    var height = top.window.innerHeight;
-			    if ( height == undefined || height == 0 ) {
-			    	// IE doesn't use window.innerHeight.
-			    	height = document.documentElement.clientHeight;
-			    	// alert("using clientHeight");
-			    }
-				// alert("doc height "+height);
-			    height -= document.getElementById('TB_iframeContent').offsetTop + 60;
-			    document.getElementById('TB_iframeContent').style.height = height +"px";
-		
-				TB_HEIGHT = height + 28;
-				tb_position();
+	
+	
+		function getUsers(){
+			var url = getUrl();
+			if (url.length) {
+				$("#list3").setGridParam({datatype:'json', page:1, url: url}).trigger('reloadGrid');	
 			}
-		};
-		window.onresize = resizeIframe;
+			return false;
+		}
 		
-		function refreshThickbox(){   
-			tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply thickbox
-			imgLoader = new Image();// preload image
-			imgLoader.src = tb_pathToImage;
-		};
+		function getUrl() {
+			var searchType = document.getElementById("searchType").value;
+			
+			//process in case of "Have finished particular lesson" | "Haven't started particular lesson"
+			var lessonId = "";
+			if ((searchType == 7) || (searchType == 8)) {
+				$("#lessonDiv").show();
+				lessonId = "&lessonId=" + document.getElementById("lessonId").value;
+			} else {
+				$("#lessonDiv").hide();
+			}
+			
+			//process in case of "Have finished these lessons"
+			var lessonIds = "";
+			if (searchType == 10) {
+				$("#lessonsDiv").show();
 
-		function createNewQuestionInitHref() {
-			var questionTypeDropdown = document.getElementById("questionType");
-			var questionType = questionTypeDropdown.selectedIndex + 1;
-			var newQuestionInitHref = "${newQuestionInitUrl}&questionType=" + questionType + "&KeepThis=true&TB_iframe=true&height=540&width=850&modal=true";
-			$("#newQuestionInitHref").attr("href", newQuestionInitHref)
-		};
-		
-		function getUsers(idx){
-			var searchType = document.getElementById("searchType");
-			var url= "<c:url value='/monitoring/emailNotifications.do'/>";
-			$("#userListArea").load(
-				url,
-				{
-					method: "getUsers",					
-					searchType: searchType
-				}
-			);
+    			var ids = jQuery("#lessonsTable").getGridParam('selarrrow');
+    			if(ids.length) {
+    			    for (var i=0;i<ids.length;i++) {
+    			    	lessonIds += "&lessonId=" + ids[i];
+    			    }
+    			} else {
+    				return "";
+    			}
+			} else {
+				$("#lessonsDiv").hide();
+			}
+			
+			var url = "<c:url value='/emailNotifications.do'/>?method=getUsers&orgId=${org.organisationId}&searchType=" + searchType + lessonId + lessonIds;
+			return url;
+			
 		}
-
-		//-->
+	//-->
 	</script>
 	
 </lams:head>
@@ -97,64 +158,56 @@
 		<h2><fmt:message key="email.notifications.notify.sudents.that"/></h2>
 		
 		<form action="<c:url value="/emailNotifications.do"/>?method=emailUsers" method="post" id="emailNotificationsForm" >	
-		<input type="hidden" property="searched" />
 		
-		<div align="center">
-			<html:errors />
+		<div id="emailTextareaDiv">
+			<c:set var="emailBody"><fmt:message key="email.notifications.lesson.email.body" >
+					<fmt:param>${lesson.lessonName}</fmt:param>
+					<fmt:param><lams:LAMSURL/>home.do?method=learner&lessonID=${lesson.lessonId}</fmt:param>
+				</fmt:message>
+			</c:set>
+			<textarea rows="8" name="emailBody" id="emailBody" cols="45" >${fn:replace(emailBody, '<br/>', newLineChar)}</textarea>
+			<br/><br/>
+			<input class="button" type="button" id="emailButton" value="<fmt:message key="email.notifications.send"/>" />
 		</div>
 		
-		<p align="right">
-			<input class="button" type="button" value="<fmt:message key="admin.user.create"/>" onclick=javascript:document.location='user.do?method=edit' />
-		</p>
-		
-		<p align="right">
-			<fmt:message key="admin.search" />:&nbsp;
-			 <fmt:message key="label.or" /> <a onclick="document.UserSearchForm.term.value='';document.UserSearchForm.submit();"><fmt:message key="label.show.all.users"/></a>
-		</p>
-		
 		<!-- Dropdown menu for choosing a user search type -->
-		<p>
-			<select id="searchType" style="float: left">
-				<option selected="selected"><fmt:message key="email.notifications.user.search.property.0" /></option>
-				<option><fmt:message key="email.notifications.user.search.property.1" /></option>
-				<option><fmt:message key="email.notifications.user.search.property.2" /></option>
-				<option><fmt:message key="email.notifications.user.search.property.3" /></option>
-				<option><fmt:message key="email.notifications.user.search.property.4" /></option>
-				<option><fmt:message key="email.notifications.user.search.property.5" /></option>
-				<option><fmt:message key="email.notifications.user.search.property.6" /></option>
+		<div>
+			<select id="searchType" onchange="getUsers();">
+				<option selected="selected" value="7"><fmt:message key="email.notifications.user.search.property.7" /></option>
+				<option value="8"><fmt:message key="email.notifications.user.search.property.8" /></option>
+				<option value="9"><fmt:message key="email.notifications.user.search.property.9" /></option>
+				<option value="10"><fmt:message key="email.notifications.user.search.property.10" /></option>
 			</select>
-			
-			<a onclick="createNewQuestionInitHref();return false;" href="" class="button-add-item space-left thickbox" id="newQuestionInitHref">  
-				<fmt:message key="label.authoring.basic.add.question" />
-			</a>
-		</p>
+		</div>
 		
-		<%@ include file="userList.jsp"%>
-		
-		</form>
-		
-		<br/>
-		
-		<div id="pager" class="pager">
-			<form onsubmit="return false;">
-				<img src="<lams:LAMSURL/>/images/first.png" class="first"/>
-				<img src="<lams:LAMSURL/>/images/prev.png" class="prev">
-				<input type="text" class="pagedisplay"/>
-				<img src="<lams:LAMSURL/>/images/next.png" class="next">
-				<img src="<lams:LAMSURL/>/images/last.png" class="last">
-				<select class="pagesize">
-					<option selected="selected"  value="50">10&nbsp;&nbsp;</option>
-					<option value="20">75</option>
-					<option value="30">100</option>
-					<option value="40">150</option>
-					<option value="50">200</option>
-				</select>
-			</form>
+		<div id="additionalParameters">
+			<div id="lessonDiv">
+				<h3>
+					<fmt:message key="email.notifications.lesson" />
+				</h3>
+				<select id="lessonId" onchange="getUsers();">
+					<c:forEach var="lesson" items="${lessons}">
+						<option <c:if test="${lesson.lessonId==firstLesson.lessonId}">selected="selected"</c:if> value="${lesson.lessonId}">${lesson.lessonName}</option>
+					</c:forEach>
+				</select>				
+			</div>
+			
+			<div id="lessonsDiv">
+				<h3>
+					<fmt:message key="email.notifications.lessons" />
+				</h3>
+				
+				<table id="lessonsTable"></table>
+				<input class="button space-left small-space-bottom" type="button" value="<fmt:message key="button.ok"/>" onclick="getUsers();" />			
+			</div>
 		</div>
 
+		<table id="list3"></table>
+		<div id="pager3"></div>	
 
+		</form>
+		<br/>
 
-
 	</div>
 </div>
 </body>
