Index: lams_tool_preview/conf/language/lams/ApplicationResources.properties
===================================================================
diff -u -rb91f46a77fa9a30a9c970e61ca6a7a868f8dba4d -r609767222710b5960b019fdb34908f682554935e
--- lams_tool_preview/conf/language/lams/ApplicationResources.properties	(.../ApplicationResources.properties)	(revision b91f46a77fa9a30a9c970e61ca6a7a868f8dba4d)
+++ lams_tool_preview/conf/language/lams/ApplicationResources.properties	(.../ApplicationResources.properties)	(revision 609767222710b5960b019fdb34908f682554935e)
@@ -81,7 +81,6 @@
 label.sort.by.user.name  =Sort by user name
 label.user.name  =User name
 label.rating  =Rating
-label.ratings  =Ratings
 label.comment  =Comment
 label.show.ratings.left.for.user  =After completion, show feedback left for student
 label.ratings.by.others  =Ratings by other users
Index: lams_tool_preview/web/WEB-INF/tags/TSTable.tag
===================================================================
diff -u
--- lams_tool_preview/web/WEB-INF/tags/TSTable.tag	(revision 0)
+++ lams_tool_preview/web/WEB-INF/tags/TSTable.tag	(revision 609767222710b5960b019fdb34908f682554935e)
@@ -0,0 +1,49 @@
+<%-- Tablesorter Table and Pager --%>
+<%@ tag body-content="scriptless"%>
+<%@ taglib uri="tags-core" prefix="c"%>
+
+<%@ attribute name="numColumns" required="true" rtexprvalue="true"%>
+<%@ attribute name="sessionId" required="false" rtexprvalue="true"%>
+<%@ attribute name="tableClass" required="false" rtexprvalue="true"%>
+<%@ attribute name="pagerClass" required="false" rtexprvalue="true"%>
+<%@ attribute name="test" required="false" rtexprvalue="true"%>
+
+<c:if test="${empty tableClass}">
+	<c:set var="tableClass" value="tablesorter" />
+</c:if>
+
+<c:if test="${empty pagerClass}">
+	<c:set var="pagerClass" value="ts-pager" />
+</c:if>
+
+<table class="${tableClass}" data-session-id="${sessionId}">
+	<thead>
+		<tr>
+			<jsp:doBody />
+		</tr>
+	</thead>
+	<tfoot>
+		<tr>
+	    	<th colspan="${numColumns}" class="${pagerClass} form-horizontal">
+	        <button type="button" class="btn first"><i class="fa fa-step-backward"></i></button>
+	        <button type="button" class="btn prev"><i class="fa fa-backward"></i></button>
+	        <span class="pagedisplay"></span> <!-- this can be any element, including an input -->
+	        <button type="button" class="btn next"><i class="fa fa-forward"></i></button>
+	        <button type="button" class="btn last"><i class="fa fa-step-forward"></i></button>
+	        <select class="pagesize input-mini" title="Select page size">
+	      		<c:if test="${not empty test}"><option value="2">2</option></c:if>
+	      		<option selected="selected" value="10">10</option>
+	      		<option value="20">20</option>
+	      		<option value="30">30</option>
+	      		<option value="40">40</option>
+	      		<option value="50">50</option>
+	      		<option value="100">100</option>
+	        </select>
+	      </th>
+	    </tr>
+	</tfoot>
+	<tbody>
+	</tbody>
+</table>
+
+	
\ No newline at end of file
Index: lams_tool_preview/web/WEB-INF/tlds/lams/lams.tld
===================================================================
diff -u -rb91f46a77fa9a30a9c970e61ca6a7a868f8dba4d -r609767222710b5960b019fdb34908f682554935e
--- lams_tool_preview/web/WEB-INF/tlds/lams/lams.tld	(.../lams.tld)	(revision b91f46a77fa9a30a9c970e61ca6a7a868f8dba4d)
+++ lams_tool_preview/web/WEB-INF/tlds/lams/lams.tld	(.../lams.tld)	(revision 609767222710b5960b019fdb34908f682554935e)
@@ -448,6 +448,10 @@
 		<path>/WEB-INF/tags/Page.tag</path>
    	</tag-file>  
    	<tag-file>
+	    <name>TSTable</name>
+		<path>/WEB-INF/tags/TSTable.tag</path>
+   	</tag-file>  
+   	<tag-file>
 	    <name>ImgButtonWrapper</name>
 		<path>/WEB-INF/tags/ImgButtonWrapper.tag</path>
    	</tag-file>
Index: lams_tool_preview/web/includes/css/learning.css
===================================================================
diff -u -rb91f46a77fa9a30a9c970e61ca6a7a868f8dba4d -r609767222710b5960b019fdb34908f682554935e
--- lams_tool_preview/web/includes/css/learning.css	(.../learning.css)	(revision b91f46a77fa9a30a9c970e61ca6a7a868f8dba4d)
+++ lams_tool_preview/web/includes/css/learning.css	(.../learning.css)	(revision 609767222710b5960b019fdb34908f682554935e)
@@ -3,7 +3,7 @@
 		tr.odd:hover .jStar {background-image: url(/lams/images/css/jquery.jRating-stars-grey.png)!important;}
 		tr.even:hover .jStar {background-image: url(/lams/images/css/jquery.jRating-stars-light-grey.png)!important;}
 		tr.odd .jStar {background-image: url(/lams/images/css/jquery.jRating-stars-light-blue.png)!important;}
-		td.username {min-width: 250px;}
+		td.username {min-width: 150px;}
 		td.rating {width:150px;}
 		td.comment {min-width: 250px;}
 		.alert {padding:8px}
Index: lams_tool_preview/web/pages/learning/learning.jsp
===================================================================
diff -u -rb91f46a77fa9a30a9c970e61ca6a7a868f8dba4d -r609767222710b5960b019fdb34908f682554935e
--- lams_tool_preview/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision b91f46a77fa9a30a9c970e61ca6a7a868f8dba4d)
+++ lams_tool_preview/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 609767222710b5960b019fdb34908f682554935e)
@@ -15,8 +15,8 @@
 	<title><fmt:message key="label.learning.title" /></title>
 	
 	<%@ include file="/common/header.jsp"%>
-	<link type="text/css" href="${lams}css/jquery.jRating.css" rel="stylesheet"/>
-	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme-blue.css">
+	<link rel="stylesheet" href="${lams}css/jquery.jRating.css">
+	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap.css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager.css">
 	<link rel="stylesheet" href="<html:rewrite page='/includes/css/learning.css'/>">
 	<style media="screen,projection" type="text/css">
@@ -41,6 +41,7 @@
 	<script src="${lams}includes/javascript/jquery.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.jRating.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.tablesorter.js" type="text/javascript"></script>
+	<script src="${lams}includes/javascript/jquery.tablesorter-widgets.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.tablesorter-pager.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/common.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/rating.js" type="text/javascript" ></script> 	
@@ -54,22 +55,29 @@
 	$(document).ready(function(){
 		
 		$(".tablesorter").tablesorter({
-			theme: 'blue',
+			theme: 'bootstrap',
 		    widthFixed: true,
-		    widgets: ['zebra'],
+		    sortInitialOrder: 'desc',
+		    headerTemplate : '{content} {icon}',
+		    widgets: ['uitheme', 'zebra'],
 	        headers: { 
 	            1: { 
 	                sorter: false 
 	            }, 
 	            2: {
 	                sorter: false 
 	            } 
-	        } 
+	        }
 		});
 		
 		$(".tablesorter").each(function() {
 			$(this).tablesorterPager({
 				savePages: false,
+			    container: $(this).find(".ts-pager"),
+			    output: '{startRow} to {endRow} ({totalRows})',
+				cssPageDisplay: '.pagedisplay',
+				cssPageSize: '.pagesize',
+				cssDisabled: 'disabled',
 				ajaxUrl : "<c:url value='/learning/getUsers.do'/>?page={page}&size={size}&{sortList:column}&sessionMapID=${sessionMapID}&toolContentId=${peerreview.contentId}&toolSessionId=${toolSessionId}&userId=<lams:user property='userID' />",
 				ajaxProcessing: function (data) {
 			    	if (data && data.hasOwnProperty('rows')) {
@@ -174,22 +182,11 @@
 							rows += '</tr>';
 						}
 			            
-						json.total = data.total_rows; // only allow 100 rows in total
-						//json.filteredRows = 100; // no filtering
+						json.total = data.total_rows;
 						json.rows = $(rows);
 						return json;
 			    	}
-				},
-			    container: $(this).next(".tablesorter-pager"),
-			    output: '{startRow} to {endRow} ({totalRows})',
-			    cssNext: '.tablesorter-next',
-				cssPrev: '.tablesorter-prev',
-				cssFirst: '.tablesorter-first',
-				cssLast: '.tablesorter-last',
-				cssGoto: '.gotoPage',
-				cssPageDisplay: '.pagedisplay',
-				cssPageSize: '.pagesize',
-				cssDisabled: 'disabled'
+				}
 			})
 			
 			// bind to pager events
@@ -289,74 +286,39 @@
 			<c:out value="${peerreview.instructions}" escapeXml="false"/>
 		</p>
 
-		<!-- Ratings UI -->
-		<div class="panel panel-default">
-		<div class="panel-heading panel-title">
-			<fmt:message key="label.ratings" />
-		</div>
-		<div class="panel-body">
+		<c:set var="numColumns" value="2"/>
+		<c:if test="${isCommentsEnabled}">
+			<c:set var="numColumns" value="3"/>
+		</c:if>
 	
-		<table class="tablesorter">
-			<thead>
-				<tr>
-					<th class="username" title="<fmt:message key='label.sort.by.user.name'/>" >
-						<fmt:message key="label.user.name" />
-					</th>
-					<th class="rating">
-						<fmt:message key="label.rating" />
-					</th>
-					<c:if test="${isCommentsEnabled}">
-						<th class="comment">
-							<fmt:message key="label.comment" />
-						</th>
-					</c:if>
-				</tr>
-			</thead>
-			<tbody>
-
-			</tbody>
-		</table>
-					
-		<!-- pager -->
-		<div class="tablesorter-pager">
-			<form>
-		   	<img class="tablesorter-first"/>
-		    	<img class="tablesorter-prev"/>
-		    	<span class="pagedisplay"></span> <!-- this can be any element, including an input -->
-		   		<img class="tablesorter-next"/>
-		    	<img class="tablesorter-last"/>
-		    	<select class="pagesize">
-		      		<option value="2">2</option>
-		      		<option selected="selected" value="10">10</option>
-		      		<option value="20">20</option>
-		      		<option value="30">30</option>
-		      		<option value="40">40</option>
-		      		<option value="50">50</option>
-		      		<option value="100">100</option>
-		    	</select>
-			</form>
-		</div>
-		
+		<lams:TSTable numColumns="${numColumns}">
+			<th class="username" title="<fmt:message key='label.sort.by.user.name'/>" > 
+				<fmt:message key="label.user.name" />
+			</th>
+			<th class="rating">  
+				<fmt:message key="label.rating" />
+			</th>
+			<c:if test="${isCommentsEnabled}">
+				<th class="comment"> 
+					<fmt:message key="label.comment" />
+				</th>
+			</c:if>
+		</lams:TSTable>
+							
 		<div id="no-users-info">
 			<fmt:message key="label.no.users" />
 		</div>
 	
-		</div>
-		</div>
-	
 		<!-- Reflection -->
 		<c:if test="${sessionMap.userFinished and sessionMap.reflectOn}">
 			<%@ include file="notebookdisplay.jsp"%>
 		</c:if>
 		<!-- End Reflection -->
 
 		<c:if test="${mode != 'teacher'}">
-			<div class="space-bottom-top align-left">
 				<html:button property="FinishButton" styleId="finishButton" onclick="refresh()" styleClass="btn btn-default voffset5 pull-left">
 					<fmt:message key="label.refresh" />
 				</html:button>
-			</div>
-			<div class="space-bottom-top align-right" id="learner-submit">
 				<c:choose>
 					<c:when test="${sessionMap.reflectOn && (not sessionMap.userFinished)}">
 						<html:button property="FinishButton" onclick="return continueReflect()" styleClass="btn btn-primary voffset5 pull-right">
@@ -381,7 +343,6 @@
 						</html:link>
 					</c:otherwise>
 				</c:choose>
-			</div>
 		</c:if>
 		
 	</lams:Page>
Index: lams_tool_preview/web/pages/learning/results.jsp
===================================================================
diff -u -rb91f46a77fa9a30a9c970e61ca6a7a868f8dba4d -r609767222710b5960b019fdb34908f682554935e
--- lams_tool_preview/web/pages/learning/results.jsp	(.../results.jsp)	(revision b91f46a77fa9a30a9c970e61ca6a7a868f8dba4d)
+++ lams_tool_preview/web/pages/learning/results.jsp	(.../results.jsp)	(revision 609767222710b5960b019fdb34908f682554935e)
@@ -20,12 +20,9 @@
 	<%@ include file="/common/header.jsp"%>
 
 	<link type="text/css" href="${lams}css/jquery.jRating.css" rel="stylesheet"/>
-	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme-blue.css">
+	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap.css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager.css">
 	<link rel="stylesheet" href="<html:rewrite page='/includes/css/learning.css'/>">
-	<style media="screen,projection" type="text/css">
-		.tablesorter {width: 80%;}
-	</style>
 
 	<script type="text/javascript">
 		//var for jquery.jRating.js
@@ -45,6 +42,7 @@
 	<script src="${lams}includes/javascript/jquery.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.jRating.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.tablesorter.js" type="text/javascript"></script>
+	<script src="${lams}includes/javascript/jquery.tablesorter-widgets.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.tablesorter-pager.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/common.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/rating.js" type="text/javascript" ></script>	
@@ -53,9 +51,11 @@
 		$(document).ready(function(){
 			
 			$(".tablesorter").tablesorter({
-				theme: 'blue',
+				theme: 'bootstrap',
 			    widthFixed: true,
-			    widgets: ['zebra'],
+			    sortInitialOrder: 'desc',
+			    headerTemplate : '{content} {icon}',
+			    widgets: ['uitheme', 'zebra'],
 		        headers: { 
 		            1: { 
 		                sorter: false 
@@ -66,7 +66,6 @@
 		        } 
 			});
 			
-			//initializeJRating();
 		 });
 	
 		function finishSession(){
@@ -97,49 +96,32 @@
 		<c:if test="${not empty itemRatingDtos}">
 
 		<!-- Ratings UI -->
-		<div class="panel panel-default">
-		<div class="panel-heading panel-title">
-			<fmt:message key="label.ratings" />
-		</div>
-		<div class="panel-body">
-	
 		<table class="tablesorter">
 			<thead>
 				<tr>
-					<th title="<fmt:message key='label.sort.by.user.name'/>" >
+					<th class="username" title="<fmt:message key='label.sort.by.user.name'/>" > 
 						<fmt:message key="label.user.name" />
 					</th>
-					<th>
+					<th class="comment">
 						<fmt:message key="label.rating" />
 					</th>
-	
-			<table class="tablesorter">
-				<thead>
+				</tr>
+			</thead>
+			<tbody>
+				<c:forEach var="itemRatingDto" items="${itemRatingDtos}">
 					<tr>
-						<th title="<fmt:message key='label.sort.by.user.name'/>" >
-							<fmt:message key="label.user.name" />
-						</th>
-						<th>
-							<fmt:message key="label.rating" />
-						</th>
+						<td>
+							<c:out value="${userNameMap[itemRatingDto.itemId]}" escapeXml="true"/>
+						</td>
+						
+						<td>
+							<lams:Rating itemRatingDto="${itemRatingDto}" disabled="true" isItemAuthoredByUser="false"/>
+						</td>
 					</tr>
-				</thead>
-				<tbody>
-					<c:forEach var="itemRatingDto" items="${itemRatingDtos}">
-						<tr>
-							<td>
-								<c:out value="${userNameMap[itemRatingDto.itemId]}" escapeXml="true"/>
-							</td>
-							
-							<td style="width:50%; text-align: right;">
-								<lams:Rating itemRatingDto="${itemRatingDto}" disabled="true" isItemAuthoredByUser="false"/>
-							</td>
-						</tr>
-					</c:forEach>
-				</tbody>
-			</table>
-		</div>
-		</div>
+				</c:forEach>
+			</tbody>
+		</table>
+		
 		</c:if>
 		
 		<c:if test="${peerreview.showRatingsLeftForUser}">