Index: lams_central/web/WEB-INF/tags/StyledRating5.tag
===================================================================
diff -u -r8b7dd9324557fea52f4d89582ae7c0bc96d53ee1 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_central/web/WEB-INF/tags/StyledRating5.tag	(.../StyledRating5.tag)	(revision 8b7dd9324557fea52f4d89582ae7c0bc96d53ee1)
+++ lams_central/web/WEB-INF/tags/StyledRating5.tag	(.../StyledRating5.tag)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -96,18 +96,23 @@
 								</td>
 								
 								<td class="rating">
-									<div class="rating-stars-holder text-center center-block">
+									<div class="starability-holder">
 										<c:set var="objectId">${criteriaRatings.ratingCriteria.ratingCriteriaId}-${rating.itemId}</c:set>
-										<div class="rating-stars-disabled rating-stars-new" data-average="${rating.averageRating}" data-id="${objectId}">
+										<c:set var="dataRating">
+											<fmt:formatNumber value="${rating.averageRating-(rating.averageRating%1)}" pattern="#"></fmt:formatNumber>
+											${(rating.averageRating%1) >= 0.5 ? '.5' : ''}
+										</c:set>
+										<div class="starability starability-result" data-rating="${dataRating}">
+											Rated: ${dataRating} stars
 										</div>
-										<c:set var="userRating">${rating.userRating}</c:set>
-										<div class="rating-stars-caption" id="rating-stars-caption-${objectId}">
+										
+										<div class="starability-caption" id="starability-caption-${objectId}">
 											<c:choose>
-												<c:when test="${empty userRating}">
+												<c:when test="${empty rating.userRating}">
 													<fmt:message key="label.not.rated"></fmt:message>
 												</c:when>
 												<c:otherwise>
-													<fmt:message key="label.you.gave.rating"><fmt:param><span id="user-rating-${objectId}">${userRating}</span></fmt:param></fmt:message>
+													<fmt:message key="label.you.gave.rating"><fmt:param><span id="user-rating-${objectId}">${rating.userRating}</span></fmt:param></fmt:message>
 												</c:otherwise>
 											</c:choose>
 											<br/>
@@ -135,10 +140,17 @@
 				<c:forEach var="rating" items="${criteriaRatings.ratingDtos}" varStatus="status">
 					<c:if test="${status.first && not empty rating.averageRating}">
 						<div class="rating">
-							<div class="rating-stars-holder text-center center-block">
+							<div class="starability-holder">
 								<c:set var="objectId">${criteriaRatings.ratingCriteria.ratingCriteriaId}-${rating.itemId}</c:set>
-								<div class="rating-stars-disabled rating-stars-new" data-average="${rating.averageRating}" data-id="${objectId}"></div>
-								<div class="rating-stars-caption" id="rating-stars-caption-${objectId}-currentUser">
+								<c:set var="dataRating">
+									<fmt:formatNumber value="${rating.averageRating-(rating.averageRating%1)}" pattern="#"></fmt:formatNumber>
+									${(rating.averageRating%1) >= 0.5 ? '.5' : ''}
+								</c:set>
+								<div class="starability starability-result" data-rating="${dataRating}">
+									Rated: ${dataRating} stars
+								</div>
+								
+								<div class="starability-caption" id="starability-caption-${objectId}-currentUser">
 									<fmt:message key="label.avg.rating">
 										<fmt:param><span id="average-rating-${objectId}-currentUser">${rating.averageRating}</span></fmt:param>
 										<fmt:param><span id="number-of-votes-${objectId}-currentUser">${rating.numberOfVotes}</span></fmt:param>
Index: lams_tool_assessment/web/pages/learning/results.jsp
===================================================================
diff -u -r21aea119939539ce08a947354f84cb7dc6980d38 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_assessment/web/pages/learning/results.jsp	(.../results.jsp)	(revision 21aea119939539ce08a947354f84cb7dc6980d38)
+++ lams_tool_assessment/web/pages/learning/results.jsp	(.../results.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -18,7 +18,7 @@
 
 <lams:PageLearner title="${assessment.title}" toolSessionID="${toolSessionID}">
 	<link href="<lams:WebAppURL/>includes/css/assessment.css" rel="stylesheet" type="text/css">
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<style>
 		.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {
 		    opacity: 1 !important; /* overwrite bootstrap rule only for results page */ 
Index: lams_tool_assessment/web/pages/learning/results/allquestions.jsp
===================================================================
diff -u -rddd6d9e928bdcfbd5dbb76e89351a9a7ec16ee8b -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_assessment/web/pages/learning/results/allquestions.jsp	(.../allquestions.jsp)	(revision ddd6d9e928bdcfbd5dbb76e89351a9a7ec16ee8b)
+++ lams_tool_assessment/web/pages/learning/results/allquestions.jsp	(.../allquestions.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -10,7 +10,7 @@
 <c:set var="showQuestionMonitoringActionButtons" value="${not empty sessions}" />
 
 <c:if test="${param.embedded}">
-    <lams:css suffix="jquery.jRating"/>
+    <link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
     <link href="<lams:WebAppURL/>includes/css/assessment.css" rel="stylesheet" type="text/css">
 </c:if>
 
@@ -24,12 +24,8 @@
 
 <script type="text/javascript" src="${lams}includes/javascript/jquery.timeago.js"></script>
 <script type="text/javascript" src="${lams}includes/javascript/timeagoi18n/jquery.timeago.${fn:toLowerCase(localeLanguage)}.js"></script>
-<lams:JSImport src="includes/javascript/rating.js" />
-<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.jRating.js"></script>
+<lams:JSImport src="includes/javascript/rating5.js" />
 <script type="text/javascript">
-    //var for jquery.jRating.js
-    var pathToImageFolder = "${lams}images/css/",
-
         //vars for rating.js
         AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
         YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message></spring:escapeBody>',
@@ -38,8 +34,7 @@
         MIN_RATES = 0,
         COUNT_RATED_ITEMS = true,
         COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.comment.textarea.tip"/></spring:escapeBody>',
-        WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="error.resource.image.comment.blank"/></spring:escapeBody>',
-        ALLOW_RERATE = false;
+        WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="error.resource.image.comment.blank"/></spring:escapeBody>';
     <%-- Do not allow rating if it is a teacher view --%>
     <c:if test="${not empty toolSessionID}">
     var SESSION_ID = ${toolSessionID};
Index: lams_tool_assessment/web/pages/learning/results/attemptsummary.jsp
===================================================================
diff -u -r8121ab6e6a1166176a6c77a34a4eeee03ff0787c -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_assessment/web/pages/learning/results/attemptsummary.jsp	(.../attemptsummary.jsp)	(revision 8121ab6e6a1166176a6c77a34a4eeee03ff0787c)
+++ lams_tool_assessment/web/pages/learning/results/attemptsummary.jsp	(.../attemptsummary.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -1,4 +1,4 @@
-<div id="attempt-summary" class="alert alert-success shadow mx-auto col-sm-8 ltable no-header table-hover">
+<div id="attempt-summary" class="alert alert-secondary shadow mx-auto col-sm-8 ltable no-header table-hover">
 	<div class="row">
 		<div class="col-sm-5">
 			<fmt:message key="label.learning.summary.started.on" />
Index: lams_tool_assessment/web/pages/learning/results/essay.jsp
===================================================================
diff -u -red8157abf61ac150a859ecff549295195fc42582 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_assessment/web/pages/learning/results/essay.jsp	(.../essay.jsp)	(revision ed8157abf61ac150a859ecff549295195fc42582)
+++ lams_tool_assessment/web/pages/learning/results/essay.jsp	(.../essay.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -61,7 +61,7 @@
 			
 			<%-- Show answers for all other teams, and just rating if someone has already commented on this team's answer --%>
 			<c:if test="${not empty sessionResults and (toolSessionID != session.sessionId or showRating)}">
-				<div class="row ${toolSessionID == session.sessionId ? 'bg-success' : ''}">
+				<div class="row">
 					<div class="w-25">
 						<lams:Portrait userId="${session.groupLeader.userId}"/>
 						
@@ -91,26 +91,25 @@
 						</c:if>
 				
 						<c:if test="${showRating}">
-							<%-- Do not allow voting for own answer, and for non-leaders if leader is enabled --%>
+							<%-- Do not allow voting for non-leaders if leader is enabled --%>
 							<lams:Rating5 itemRatingDto="${itemRatingDto}"
-										 isItemAuthoredByUser="${not canRate}"
+										 isDisplayOnly="${not canRate}"
 										 showAllComments="true"
 										 refreshOnComment="rating-table-${question.uid}" />
 						</c:if>	
 					</div>
 				</div>
 			</c:if>
 		</c:forEach>
-		
-		<c:if test="${question.groupsAnswersDisclosed and not empty toolSessionID}">
-			<div>
-				<button type="button"
-					class="btn btn-sm btn-secondary btn-icon-refresh float-end mt-2"
-					onClick="javascript:refreshToRating(${question.uid})">
-					<fmt:message key="label.refresh" />
-				</button>
-			</div>
-		</c:if>
 	</div>
-
+		
+	<c:if test="${question.groupsAnswersDisclosed and not empty toolSessionID}">
+		<div>
+			<button type="button"
+				class="btn btn-sm btn-secondary btn-icon-refresh float-end"
+				onClick="javascript:refreshToRating(${question.uid})">
+				<fmt:message key="label.refresh" />
+			</button>
+		</div>
+	</c:if>
 </c:if>
\ No newline at end of file
Index: lams_tool_doku/web/pages/learning/galleryWalk.jsp
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_doku/web/pages/learning/galleryWalk.jsp	(.../galleryWalk.jsp)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_doku/web/pages/learning/galleryWalk.jsp	(.../galleryWalk.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -9,7 +9,7 @@
 <c:set var="localeLanguage"><lams:user property="localeLanguage" /></c:set>
 	
 <lams:PageLearner title="${dokumaran.title}" toolSessionID="${toolSessionID}">
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<style>
 		#gallery-walk-rating-table {
 			width: 60%;
@@ -42,8 +42,6 @@
 
 	<script type="text/javascript" src="${lams}includes/javascript/etherpad.js"></script>
 	<script type="text/javascript">
-			//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/",
 			//vars for rating.js
 			AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape='true'><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
 			YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape='true'><fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message></spring:escapeBody>',
@@ -53,7 +51,6 @@
 			COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape='true'><fmt:message key="label.comment.textarea.tip" /></spring:escapeBody>',
 			WARN_COMMENTS_IS_BLANK_LABEL = '<fmt:message key="warning.comment.blank"/>',
 			COUNT_RATED_ITEMS = true,
-			ALLOW_RERATE = true,
 			SESSION_ID = ${toolSessionID};
 			
 		checkNextGateActivity('finish-button', '${toolSessionID}', '', finishSession);
@@ -78,8 +75,7 @@
 			document.location.href ='<c:url value="/learning/finish.do?sessionMapID=${sessionMapID}&mode=${mode}&toolSessionID=${toolSessionID}"/>';
 		}
 	</script>
-	<lams:JSImport src="includes/javascript/rating.js" />
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.jRating.js"></script>
+	<lams:JSImport src="includes/javascript/rating5.js" />
 	<%@ include file="websocket.jsp"%>	
 
 <div id="container-main">
@@ -116,7 +112,7 @@
 					</div>
 					<div class="col">
 						<lams:Rating5 itemRatingDto="${groupSummary.itemRatingDto}" 
-									 isItemAuthoredByUser="true"
+									 isDisplayOnly="true"
 									 hideCriteriaTitle="true" />
 					</div>
 				</div>
@@ -158,7 +154,7 @@
 		       	<c:if test="${not dokumaran.galleryWalkReadOnly and (dokumaran.galleryWalkFinished or mode == 'teacher' or toolSessionID != groupSummary.sessionId)}">
 		       	   	<lams:Rating5 itemRatingDto="${groupSummary.itemRatingDto}" 
 		       	   			showComments="true"
-							isItemAuthoredByUser="${dokumaran.galleryWalkFinished or not hasEditRight or mode == 'teacher'}" />
+							isDisplayOnly="${dokumaran.galleryWalkFinished or not hasEditRight or mode == 'teacher'}" />
 		       	</c:if>
 		 
 				<lams:Etherpad groupId="${groupSummary.sessionId}"
Fisheye: Tag 169520b6cf03e63865f09db66f593677b1c5580b refers to a dead (removed) revision in file `lams_tool_images/web/includes/css/jquery.rating.css'.
Fisheye: No comparison available.  Pass `N' to diff?
Fisheye: Tag 169520b6cf03e63865f09db66f593677b1c5580b refers to a dead (removed) revision in file `lams_tool_images/web/includes/javascript/jquery.rating.1.1.js'.
Fisheye: No comparison available.  Pass `N' to diff?
Index: lams_tool_images/web/pages/learning/learning.jsp
===================================================================
diff -u -r7f9edd11aea8b509da3cbafb63b66ffd768f32ae -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_images/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 7f9edd11aea8b509da3cbafb63b66ffd768f32ae)
+++ lams_tool_images/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -31,7 +31,7 @@
 <lams:PageLearner title="${imageGallery.title}" toolSessionID="${toolSessionID}" >
     <link rel="stylesheet" type="text/css" href="<lams:WebAppURL/>/includes/css/fotorama.css"/>
     <link href="<lams:WebAppURL/>includes/css/imageGallery.css" rel="stylesheet" type="text/css">
-    <lams:css suffix="jquery.jRating"/>
+    <link rel="stylesheet" href="${lams}css/rating.css">
     <link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css">
     <link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
     <link href="${lams}css/uppy.min.css" rel="stylesheet" type="text/css" />
@@ -46,9 +46,7 @@
     </script>
     <lams:JSImport src="includes/javascript/imageGallerycommon.js" relative="true" />
     <lams:JSImport src="includes/javascript/imageGalleryitem.js" relative="true" />
-
 	<%@ include file="/common/uppylang.jsp"%>
-
     <lams:JSImport src="includes/javascript/uploadImageLearning.js" relative="true" />
     <lams:JSImport src="includes/javascript/upload.js" />
     <script type="text/javascript" src="${lams}includes/javascript/jquery.form.js"></script>
@@ -58,7 +56,7 @@
 
         $(document).ready(function(){
             $('.fotorama')
-                .on('fotorama:show ',
+            	.on('fotorama:show ',
                     function (e, fotorama, extra) {
                         loadImageData(fotorama.activeFrame.id);
                     }
@@ -67,38 +65,37 @@
                     //TODO history   : true,
                     width: ${mediumImageDimensions + 60},
                     height: Math.round(${mediumImageDimensions + 60}*9/16),
-                maxwidth: '100%',
-                //ratio: 16/9,
-                allowfullscreen: true,
-                keyboard: true,
-                nav: 'thumbs',
-                fit: 'scaledown',
-                //thumbfit: 'contain',
-                loop: true,
-                thumbwidth: 80,//${thumbnailImageDimensions},
-                thumbheight: 80,//${thumbnailImageDimensions},
-                data: [
-                <c:forEach var="image" items="${sessionMap.imageGalleryList}" varStatus="status">
-                {
-                    img: "<lams:WebAppURL />download/?uuid=${image.mediumFileDisplayUuid}&preferDownload=false",
-                    full: "<lams:WebAppURL />download/?uuid=${image.originalFileDisplayUuid}&preferDownload=false",
-                    id: '${image.uid}', // Custom anchor is used with the hash:true option.
-                    caption:'<div class="card-subheader fw-bold fs-6">${image.titleEscaped}</div>' +
-                        '<div>${image.descriptionEscaped}</div>'
-                        <c:if test="${!image.createByAuthor && (image.createBy != null)}">
-                        <c:set var="portrait"><lams:Portrait userId="${image.createBy.userId}"/></c:set>
-                        <c:set var="portrait">${fn:replace(portrait, "'", "\\'")}</c:set> <%-- escape the url --%>
-                        + '<div class="fst-italic"><fmt:message key="label.learning.added.by" /> <span class="mx-2">${portrait}</span><c:out value="${image.createBy.firstName} ${image.createBy.lastName}" escapeXml="true"/></div>'
-                    </c:if>
-                    //html: $('selector'), // ...or '<div>123</div>'. Custom HTML inside the frame.
-                    //fit: 'cover' // Override the global fit option.
-                    //any: 'Any data relative to the frame you want to store'
-                },
-                </c:forEach>
-            ]
-        }
-        );
-
+	                maxwidth: '100%',
+	                //ratio: 16/9,
+	                allowfullscreen: true,
+	                keyboard: true,
+	                nav: 'thumbs',
+	                fit: 'scaledown',
+	                //thumbfit: 'contain',
+	                loop: true,
+	                thumbwidth: 80,//${thumbnailImageDimensions},
+	                thumbheight: 80,//${thumbnailImageDimensions},
+	                data: [
+	                <c:forEach var="image" items="${sessionMap.imageGalleryList}" varStatus="status">
+	                {
+	                    img: "<lams:WebAppURL />download/?uuid=${image.mediumFileDisplayUuid}&preferDownload=false",
+	                    full: "<lams:WebAppURL />download/?uuid=${image.originalFileDisplayUuid}&preferDownload=false",
+	                    id: '${image.uid}', // Custom anchor is used with the hash:true option.
+	                    caption:'<div class="card-subheader fw-bold fs-6">${image.titleEscaped}</div>' +
+	                        '<div>${image.descriptionEscaped}</div>'
+	                        <c:if test="${!image.createByAuthor && (image.createBy != null)}">
+	                        <c:set var="portrait"><lams:Portrait userId="${image.createBy.userId}"/></c:set>
+	                        <c:set var="portrait">${fn:replace(portrait, "'", "\\'")}</c:set> <%-- escape the url --%>
+	                        + '<div class="fst-italic"><fmt:message key="label.learning.added.by" /> <span class="mx-2">${portrait}</span><c:out value="${image.createBy.firstName} ${image.createBy.lastName}" escapeXml="true"/></div>'
+	                    </c:if>
+	                    //html: $('selector'), // ...or '<div>123</div>'. Custom HTML inside the frame.
+	                    //fit: 'cover' // Override the global fit option.
+	                    //any: 'Any data relative to the frame you want to store'
+	                },
+	                </c:forEach>
+	            	]
+				}
+        	);
         });
 
         function checkNew(){
Index: lams_tool_images/web/pages/learning/parts/commentsarea.jsp
===================================================================
diff -u -r81f928586161dd03042b6353f68c7d7b8279ccde -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_images/web/pages/learning/parts/commentsarea.jsp	(.../commentsarea.jsp)	(revision 81f928586161dd03042b6353f68c7d7b8279ccde)
+++ lams_tool_images/web/pages/learning/parts/commentsarea.jsp	(.../commentsarea.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -17,9 +17,6 @@
 <lams:JSImport src="includes/javascript/common.js" />
 <c:if test="${isImageSelected}">
 	<script type="text/javascript">
-		//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/";
-		
 		//vars for rating.js
 		var AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
 		YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message></spring:escapeBody>',
@@ -30,13 +27,11 @@
 		COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.comment.textarea.tip"/></spring:escapeBody>',
 		WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="error.resource.image.comment.blank"/></spring:escapeBody>',
 		WARN_MIN_NUMBER_WORDS_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="warning.minimum.number.words"><fmt:param value="${sessionMap.commentsMinWordsLimit}"/></fmt:message></spring:escapeBody>',
-		ALLOW_RERATE = false,
 		SESSION_ID = ${toolSessionID};
 	</script>
-	<lams:JSImport src="includes/javascript/rating.js" />
+	<lams:JSImport src="includes/javascript/rating5.js" />
 </c:if>
 <lams:JSImport src="includes/javascript/uploadImageLearning.js" relative="true" />
-<script type="text/javascript" src="${lams}includes/javascript/jquery.jRating.js"></script>
 <script type="text/javascript">
 	$(document).ready(function(){
 		$('#voting-form-checkbox').click(function() {
@@ -64,9 +59,9 @@
 	<%--Ranking area---------------------------------------%>
 	
 	<c:if test="${imageGallery.allowRank && isImageSelected}">
-		<lams:Rating5 itemRatingDto="${sessionMap.itemRatingDto}" disabled="${finishedLock}" isItemAuthoredByUser="${sessionMap.isAuthor}"
+		<lams:Rating5 itemRatingDto="${sessionMap.itemRatingDto}" disabled="${finishedLock}" isDisplayOnly="${sessionMap.isAuthor}"
 				maxRates="${imageGallery.maximumRates}" countRatedItems="${sessionMap.countRatedItems}"
-				minNumberWordsLabel="label.minimum.number.words" />
+				minNumberWordsLabel="label.minimum.number.words"/>
 	</c:if>
 
 	<div id="extra-controls" class="mb-3">
Index: lams_tool_laqa/src/java/org/lamsfoundation/lams/tool/qa/web/controller/LearningController.java
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_laqa/src/java/org/lamsfoundation/lams/tool/qa/web/controller/LearningController.java	(.../LearningController.java)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_laqa/src/java/org/lamsfoundation/lams/tool/qa/web/controller/LearningController.java	(.../LearningController.java)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -1130,8 +1130,9 @@
 		    }
 		}
 
-		boolean isItemAuthoredByUser = response.getQaQueUser().getQueUsrId().equals(userId);
-		responseRow.put("isItemAuthoredByUser", isItemAuthoredByUser);
+		//display only in case user is an author of the response
+		boolean isDisplayOnly = response.getQaQueUser().getQueUsrId().equals(userId);
+		responseRow.put("isDisplayOnly", isDisplayOnly);
 
 		ArrayNode criteriasRows = JsonNodeFactory.instance.arrayNode();
 		for (ItemRatingCriteriaDTO criteriaDto : itemRatingDto.getCriteriaDtos()) {
Index: lams_tool_laqa/web/learning/LearnerRep.jsp
===================================================================
diff -u -r8b47c3282bdf668831f60df54fab447ce226d34f -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_laqa/web/learning/LearnerRep.jsp	(.../LearnerRep.jsp)	(revision 8b47c3282bdf668831f60df54fab447ce226d34f)
+++ lams_tool_laqa/web/learning/LearnerRep.jsp	(.../LearnerRep.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -11,9 +11,7 @@
 <c:set var="localeLanguage"><lams:user property="localeLanguage" /></c:set>
 
 <lams:PageLearner title="${generalLearnerFlowDTO.activityTitle}" toolSessionID="${sessionMap.toolSessionID}" >
-
-	<lams:css suffix="jquery.jRating"/>
-
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
 	<link rel="stylesheet" href="<lams:WebAppURL/>includes/css/qalearning.css">
@@ -121,7 +119,7 @@
 									<div class="text-center fs-4">
 										<fmt:message key="label.learning.rating" />
 									</div>
-									<lams:Rating5 itemRatingDto="${userResponse.itemRatingDto}" disabled="true" isItemAuthoredByUser="true"
+									<lams:Rating5 itemRatingDto="${userResponse.itemRatingDto}" disabled="true" isDisplayOnly="true"
 												 maxRates="${qaContent.maximumRates}" />
 								</div>
 							</c:if>
@@ -130,46 +128,6 @@
 
 					<!-- Others users' responses -->
 					<c:if test="${generalLearnerFlowDTO.showOtherAnswers}">
-
-						<!-- Rating limits info -->
-						<c:if test="${generalLearnerFlowDTO.allowRateAnswers && (qaContent.minimumRates ne 0 || qaContent.maximumRates ne 0)}">
-							<lams:Alert5 id="rating-info" type="warning" close="true">
-								<c:choose>
-									<c:when test="${qaContent.minimumRates ne 0 and qaContent.maximumRates ne 0}">
-										<fmt:message key="label.rate.limits.reminder">
-											<fmt:param value="${qaContent.minimumRates}" />
-											<fmt:param value="${qaContent.maximumRates}" />
-										</fmt:message>
-									</c:when>
-				
-									<c:when test="${qaContent.minimumRates ne 0 and qaContent.maximumRates eq 0}">
-										<fmt:message key="label.rate.limits.reminder.min">
-											<fmt:param value="${qaContent.minimumRates}" />
-										</fmt:message>
-									</c:when>
-				
-									<c:when test="${qaContent.minimumRates eq 0 and qaContent.maximumRates ne 0}">
-										<fmt:message key="label.rate.limits.reminder.max">
-											<fmt:param value="${qaContent.maximumRates}" />
-										</fmt:message>
-									</c:when>
-								</c:choose>
-								<br>
-				
-								<fmt:message key="label.rate.limits.topic.reminder">
-									<fmt:param value="<span id='count-rated-items'>${sessionMap.countRatedItems}</span>" />
-								</fmt:message>
-							</lams:Alert5>
-						</c:if>
-					
-						<c:if test="${isCommentsEnabled && sessionMap.commentsMinWordsLimit != 0}">
-							<lams:Alert5 id="rating-comment-info-${status.count}" type="info" close="false" >
-								<fmt:message key="label.comment.minimum.number.words">
-									<fmt:param>: ${sessionMap.commentsMinWordsLimit}</fmt:param>
-								</fmt:message>
-							</lams:Alert5>
-						</c:if>
-
 						<c:choose>
 							<c:when test="${isCommentsEnabled}">
 								<c:set var="numColumns" value="3" />
@@ -186,7 +144,46 @@
 							<div class="card-subheader mb-2">
 								<fmt:message key="label.other.learners.answers" />
 							</div>
+
+							<!-- Rating limits info -->
+							<c:if test="${generalLearnerFlowDTO.allowRateAnswers && (qaContent.minimumRates ne 0 || qaContent.maximumRates ne 0)}">
+								<lams:Alert5 id="rating-info" type="info">
+									<c:choose>
+										<c:when test="${qaContent.minimumRates ne 0 and qaContent.maximumRates ne 0}">
+											<fmt:message key="label.rate.limits.reminder">
+												<fmt:param value="${qaContent.minimumRates}" />
+												<fmt:param value="${qaContent.maximumRates}" />
+											</fmt:message>
+										</c:when>
+					
+										<c:when test="${qaContent.minimumRates ne 0 and qaContent.maximumRates eq 0}">
+											<fmt:message key="label.rate.limits.reminder.min">
+												<fmt:param value="${qaContent.minimumRates}" />
+											</fmt:message>
+										</c:when>
+					
+										<c:when test="${qaContent.minimumRates eq 0 and qaContent.maximumRates ne 0}">
+											<fmt:message key="label.rate.limits.reminder.max">
+												<fmt:param value="${qaContent.maximumRates}" />
+											</fmt:message>
+										</c:when>
+									</c:choose>
+									<br>
+					
+									<fmt:message key="label.rate.limits.topic.reminder">
+										<fmt:param value="<span id='count-rated-items'>${sessionMap.countRatedItems}</span>" />
+									</fmt:message>
+								</lams:Alert5>
+							</c:if>
 						
+							<c:if test="${isCommentsEnabled && sessionMap.commentsMinWordsLimit != 0}">
+								<lams:Alert5 id="rating-comment-info-${status.count}" type="info">
+									<fmt:message key="label.comment.minimum.number.words">
+										<fmt:param>: ${sessionMap.commentsMinWordsLimit}</fmt:param>
+									</fmt:message>
+								</lams:Alert5>
+							</c:if>
+						
 							<lams:TSTable5 numColumns="${numColumns}" dataId='data-question-uid="${question.uid}"' tableClass="tablesorter jRating">
 								<th title="<fmt:message key='label.sort.by.answer'/>">
 									<fmt:message key="label.learning.answer" />
@@ -251,9 +248,6 @@
 	</form:form>
 
 	<script type="text/javascript">
-		//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/";
-
 		//vars for rating.js
 		var MAX_RATES = ${qaContent.maximumRates},
 				MIN_RATES = ${qaContent.minimumRates},
@@ -262,27 +256,24 @@
 				COMMENT_TEXTAREA_TIP_LABEL = '<fmt:message key="label.comment.textarea.tip"/>',
 				WARN_COMMENTS_IS_BLANK_LABEL = '<fmt:message key="warning.comment.blank"/>',
 				WARN_MIN_NUMBER_WORDS_LABEL = "<fmt:message key="warning.minimum.number.words"><fmt:param value="${sessionMap.commentsMinWordsLimit}"/></fmt:message>",
-				ALLOW_RERATE = false,
 				SESSION_ID = ${toolSessionID};
 	</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-pager.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.timeago.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>
+	<script src="${lams}includes/javascript/rating5.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/jquery.tablesorter-widgets.js" type="text/javascript"></script>
 	<script src="${lams}includes/javascript/timeagoi18n/jquery.timeago.${fn:toLowerCase(localeLanguage)}.js" type="text/javascript"></script>
 	<lams:JSImport src="includes/javascript/portrait5.js" />
-
 	<script type="text/javascript">
 		checkNextGateActivity('finishButton', '${toolSessionID}', '', function(){
 			submitMethod('endLearning');
 		});
 
 		var AVG_RATING_LABEL = '<fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message>',
-				YOUR_RATING_LABEL = '<fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message>',
-				IS_DISABLED =  ${sessionMap.isDisabled};
+			YOUR_RATING_LABEL = '<fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message>',
+			IS_DISABLED =  ${sessionMap.isDisabled};
 
 		$(document).ready(function(){
 
@@ -320,7 +311,7 @@
 							for (i = 0; i < data.rows.length; i++){
 								var userData = data.rows[i];
 								var itemId = userData["responseUid"];
-								var isItemAuthoredByUser = userData["isItemAuthoredByUser"];
+								var isDisplayOnly = userData["isDisplayOnly"];
 
 								rows += '<tr>';
 								rows += '<td style="vertical-align:top;">';
@@ -354,7 +345,7 @@
 									rows += '<td style="width:150px;vertical-align:top;">';
 
 									if (userData["visible"] == 'true') {
-										rows += '<div class="rating-stars-holder">';
+										rows += '<div class="starability-holder">';
 
 										// if the user has left a comment or done a rating in a batch of ratings, we need to keep all related ratings open.
 										usesRatings = true;
@@ -366,40 +357,16 @@
 										}
 										hasStartedRating = hasStartedRating || ${isCommentsEnabled} && userData["commentPostedByUser"] != "";
 
-										for (j = 0; j < userData.criteriaDtos.length; j++){
-											var criteriaDto = userData.criteriaDtos[j];
-											var objectId = criteriaDto["ratingCriteriaId"] + "-" + itemId;
-											var averageRating = criteriaDto.averageRating;
-											var numberOfVotes = criteriaDto.numberOfVotes;
-											var userRating = criteriaDto.userRating;
-											var isCriteriaNotRatedByUser = userRating == "";
-											var averageRatingDisplayed = (isItemAuthoredByUser || !isCriteriaNotRatedByUser) ? averageRating : 0;
-											var ratingStarsClass = (IS_DISABLED || isItemAuthoredByUser || (MAX_RATES > 0) && (countRatedItems >= MAX_RATES)  && (!hasStartedRating) || !isCriteriaNotRatedByUser) ? "rating-stars-disabled" : "rating-stars";
-
-											rows += '<strong>';
-											rows += 	 criteriaDto.title;
-											rows += '</strong>';
-
-											rows += '<div class="'+ ratingStarsClass +' rating-stars-new" data-average="'+ averageRatingDisplayed +'" data-id="'+ objectId +'">';
-											rows += '</div>';
-
-											if (isItemAuthoredByUser) {
-												rows += '<div class="rating-stars-caption">';
-												rows += 	AVG_RATING_LABEL.replace("@1@", averageRating).replace("@2@", numberOfVotes);
-												rows += '</div>';
-
-											} else {
-												rows += '<div class="rating-stars-caption" id="rating-stars-caption-'+ objectId +'"';
-												if (isCriteriaNotRatedByUser) {
-													rows += ' style="visibility: hidden;"';
-												}
-												rows += '>';
-												var temp = YOUR_RATING_LABEL.replace("@1@", '<span id="user-rating-'+ objectId +'">'+ userRating + '</span>');
-												temp = temp.replace("@2@", '<span id="average-rating-'+ objectId +'">'+ averageRating + '</span>');
-												temp = temp.replace("@3@", '<span id="number-of-votes-'+ objectId +'">'+ numberOfVotes + '</span>');
-												rows += 	temp;
-												rows += '</div>';
-											}
+										for (j = 0; j < userData.criteriaDtos.length; j++){											
+											const criteriaDto = userData.criteriaDtos[j],
+												objectId = criteriaDto["ratingCriteriaId"] + "-" + itemId,
+												averageRating = criteriaDto.averageRating,
+												numberOfVotes = criteriaDto.numberOfVotes,
+												userRating = criteriaDto.userRating,
+												isCriteriaRatedByUser = userRating != "",
+												isWidgetDisabled = (IS_DISABLED || isDisplayOnly || (MAX_RATES > 0) && (countRatedItems >= MAX_RATES) && (!hasStartedRating) || isCriteriaRatedByUser),
+												criteriaTitle = criteriaDto.title;
+											rows += createStarability(isDisplayOnly, objectId, averageRating, numberOfVotes, userRating, isWidgetDisabled, criteriaTitle);
 										}
 
 										rows += '</div>';
@@ -419,7 +386,7 @@
 										var commentPostedByUser = userData["commentPostedByUser"];
 
 										//show all comments needs to be shown
-										if (isItemAuthoredByUser) {
+										if (isDisplayOnly) {//user is an author of the response
 											for (j = 0; i < userData.comments.length; j++){
 												var comment = userData.comments[j];
 												rows += '<div class="rating-comment">';
@@ -469,7 +436,7 @@
 
 				// bind to pager events
 				.bind('pagerInitialized pagerComplete', function(event, options){
-					initializeJRating();
+					initializeStarability();
 					jQuery("time.timeago").timeago();
 				});
 			});
Fisheye: Tag 169520b6cf03e63865f09db66f593677b1c5580b refers to a dead (removed) revision in file `lams_tool_laqa/web/learning/ratingStarsDisabled.jsp'.
Fisheye: No comparison available.  Pass `N' to diff?
Index: lams_tool_larsrc/web/pages/itemreview/itemContent.jsp
===================================================================
diff -u -r2c398b9b4e7840b53fbc359124dadff13c6b2810 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_larsrc/web/pages/itemreview/itemContent.jsp	(.../itemContent.jsp)	(revision 2c398b9b4e7840b53fbc359124dadff13c6b2810)
+++ lams_tool_larsrc/web/pages/itemreview/itemContent.jsp	(.../itemContent.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -9,7 +9,7 @@
 <script>
 	$(document).ready(function(){
 		<c:if test="${sessionMap.rateItems}">
-			initializeJRating();
+			initializeStarability();
 		</c:if>
 		
 		var isDownload = ${isDownload},
Index: lams_tool_larsrc/web/pages/learning/learning.jsp
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_larsrc/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_larsrc/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -16,8 +16,7 @@
 <%-- If you change this file, remember to update the copy made for CNG-36 --%>
 
 <lams:PageLearner title="${resource.title}" toolSessionID="${toolSessionID}" >
-
-    <lams:css suffix="jquery.jRating"/>
+    <link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
     <link href="${lams}css/uppy.min.css" rel="stylesheet" type="text/css" />
     <link href="${lams}css/uppy.custom.css" rel="stylesheet" type="text/css" />
     <style media="screen,projection" type="text/css">
@@ -87,17 +86,14 @@
 
     <c:if test="${sessionMap.rateItems}">
         <script>
-            var pathToImageFolder = "${lams}images/css/",
-                MAX_RATES = MAX_RATINGS_FOR_ITEM = MIN_RATES = COUNT_RATED_ITEMS = 0, // no restrictions
+            var MAX_RATES = MAX_RATINGS_FOR_ITEM = MIN_RATES = COUNT_RATED_ITEMS = 0, // no restrictions
                 COMMENTS_MIN_WORDS_LIMIT = 0, // comments not used,
                 COMMENT_TEXTAREA_TIP_LABEL = WARN_COMMENTS_IS_BLANK_LABEL = WARN_MIN_NUMBER_WORDS_LABEL = '',
                 AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
                 YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message></spring:escapeBody>',
-                ALLOW_RERATE = true,
                 SESSION_ID = ${toolSessionID};
         </script>
-        <lams:JSImport src="includes/javascript/rating.js" />
-        <script src="${lams}includes/javascript/jquery.jRating.js"></script>
+        <lams:JSImport src="includes/javascript/rating5.js" />
     </c:if>
     <lams:JSImport src="includes/javascript/rsrccommon.js" relative="true" />
     <lams:JSImport src="includes/javascript/rsrcembed.js" relative="true" />
Index: lams_tool_mindmap/web/pages/learning/galleryWalk.jsp
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_mindmap/web/pages/learning/galleryWalk.jsp	(.../galleryWalk.jsp)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_mindmap/web/pages/learning/galleryWalk.jsp	(.../galleryWalk.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -4,8 +4,7 @@
 <c:set var="tool"><lams:WebAppURL/></c:set>
 	
 <lams:PageLearner title="${mindmapDTO.title}" toolSessionID="${toolSessionID}" >
-	
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<style>
 		#gallery-walk-rating-table {
 			width: 60%;
@@ -34,18 +33,15 @@
 	
 	<lams:JSImport src="includes/javascript/common.js" />
 	<script type="text/javascript">
-			//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/",
-			//vars for rating.js
-			AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
+		//vars for rating.js
+		var	AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
 			YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message></spring:escapeBody>',
 			MAX_RATES = 0,
 			MIN_RATES = 0,
 			COUNT_RATED_ITEMS = true,
 			COMMENTS_MIN_WORDS_LIMIT = 0,
 			COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.comment.textarea.tip"/></spring:escapeBody>',
 			WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="warning.comment.blank"/></spring:escapeBody>',
-			ALLOW_RERATE = true,
 			SESSION_ID = ${toolSessionID};
 			
 		checkNextGateActivity('finish-button', '${toolSessionID}', '', finishSession);
@@ -69,8 +65,7 @@
 			document.location.href ='<c:url value="/learning/finishActivity.do?toolSessionID=${toolSessionID}"/>';
 		}
 	</script>
-	<lams:JSImport src="includes/javascript/rating.js" />
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.jRating.js"></script>	
+	<lams:JSImport src="includes/javascript/rating5.js" />
 	<%@ include file="websocket.jsp"%>	
 
 <div id="container-main">
@@ -104,7 +99,7 @@
 					</div>
 					<div class="col">
 						<lams:Rating5 itemRatingDto="${mindmapSession.itemRatingDto}" 
-									 isItemAuthoredByUser="true"
+									 isDisplayOnly="true"
 									 hideCriteriaTitle="true" />
 					</div>
 				</div>
@@ -146,7 +141,7 @@
 	       	    <c:if test="${not mindmapDTO.galleryWalkReadOnly and (mindmapDTO.galleryWalkFinished or mode == 'teacher' or toolSessionID != mindmapSession.sessionID)}">
 	       	    	<div class="gallery-walk-rating-comment-container">
 	       	    		<lams:Rating5 itemRatingDto="${mindmapSession.itemRatingDto}"
-								     isItemAuthoredByUser="${mindmapDTO.galleryWalkFinished or mode == 'teacher'}" />
+								     isDisplayOnly="${mindmapDTO.galleryWalkFinished or mode == 'teacher'}" />
 					 </div>
 	       	    </c:if>
 	 			
Index: lams_tool_nb/web/WEB-INF/tags/Rating5.tag
===================================================================
diff -u -r76e2ef1e524594fd572167511caaf8c713027922 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_nb/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 76e2ef1e524594fd572167511caaf8c713027922)
+++ lams_tool_nb/web/WEB-INF/tags/Rating5.tag	(.../Rating5.tag)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -16,8 +16,8 @@
 <%@ attribute name="itemRatingDto" required="true" rtexprvalue="true" type="org.lamsfoundation.lams.rating.dto.ItemRatingDTO" %>
 
 <%-- Optional attribute --%>
-<%@ attribute name="disabled" required="false" rtexprvalue="true" %>
-<%@ attribute name="isItemAuthoredByUser" required="false" rtexprvalue="true" %>
+<%@ attribute name="disabled" required="false" rtexprvalue="true" %><%-- i.e. user has rating/comment rights but rating/comment should be disabled --%>
+<%@ attribute name="isDisplayOnly" required="false" rtexprvalue="true" %><%-- i.e. user has no rating/comment rights  --%>
 <%@ attribute name="maxRates" required="false" rtexprvalue="true" %>
 <%@ attribute name="countRatedItems" required="false" rtexprvalue="true" %>
 <%@ attribute name="yourRatingLabel" required="false" rtexprvalue="true" %>
@@ -36,8 +36,8 @@
 <c:if test="${empty disabled}">
 	<c:set var="disabled" value="false" scope="request"/>
 </c:if>
-<c:if test="${empty isItemAuthoredByUser}">
-	<c:set var="isItemAuthoredByUser" value="false" scope="request"/>
+<c:if test="${empty isDisplayOnly}">
+	<c:set var="isDisplayOnly" value="false" scope="request"/>
 </c:if>
 <c:if test="${empty maxRates}">
 	<c:set var="maxRates" value="0" scope="request"/>
@@ -90,7 +90,7 @@
 <%--Rating stars area---------------------------------------%>
 
 <div class="extra-controls-inner">
-<div class="rating-stars-holder text-center center-block">
+<div class="starability-holder">
 
 	<c:set var="hasStartedRating" value="false"/>
 	<c:forEach var="criteriaDto" items="${itemRatingDto.criteriaDtos}">
@@ -100,31 +100,71 @@
 	
 	<c:forEach var="criteriaDto" items="${itemRatingDto.criteriaDtos}" varStatus="status">
 		<c:set var="objectId" value="${criteriaDto.ratingCriteria.ratingCriteriaId}-${itemRatingDto.itemId}"/>
-		<c:set var="isCriteriaNotRatedByUser" value='${criteriaDto.userRating == ""}'/>
-		<c:set var="isWidgetDisabled" value="${disabled || isItemAuthoredByUser || ((maxRates > 0) && (countRatedItems >= maxRates)  && !hasStartedRating) || !(isCriteriaNotRatedByUser || allowRetries)}"/>
-			
-		<c:if test="${not hideCriteriaTitle}">
-			<div class="text-muted fw-bold">
-				${criteriaDto.ratingCriteria.title}
-			</div>
-		</c:if>
-			
+		<c:set var="isCriteriaRatedByUser" value='${criteriaDto.userRating != ""}'/>
+		<c:set var="isWidgetDisabled" value="${disabled || isDisplayOnly || ((maxRates > 0) && (countRatedItems >= maxRates) && !hasStartedRating) || (isCriteriaRatedByUser && !allowRetries)}"/>
+		<c:set var="dataRating">
+			<c:choose>
+				<c:when test='${isDisplayOnly || isCriteriaRatedByUser}'>
+					<fmt:formatNumber value="${criteriaDto.averageRating-(criteriaDto.averageRating%1)}" pattern="#"></fmt:formatNumber>
+					${isWidgetDisabled && (criteriaDto.averageRating%1) >= 0.5 ? '.5' : ''}
+				</c:when>
+				<c:otherwise>
+					0
+				</c:otherwise>
+			</c:choose>
+		</c:set>
+		<c:set var="legend">
+			<c:if test="${not hideCriteriaTitle}">
+				<legend class="text-muted fw-bold">
+					${criteriaDto.ratingCriteria.title}
+				</legend>
+			</c:if>
+		</c:set>
+
 		<c:choose>
-			<c:when test='${isItemAuthoredByUser || not isCriteriaNotRatedByUser}'>
-				<c:set var="ratingDataAverage" value="${criteriaDto.averageRating}"/>
+			<c:when test='${isWidgetDisabled}'>
+				${legend}
+			
+				<div class="starability starability-result" data-rating="${dataRating}">
+					Rated: ${dataRating} stars
+				</div>
 			</c:when>
+			
 			<c:otherwise>
-				<c:set var="ratingDataAverage" value="0"/>
+				<fieldset class="starability starability-grow starability-new" data-average="${dataRating}" data-id="${objectId}" aria-label="<fmt:message key="${starsRateLabel}"/>">
+					${legend}
+					
+					<input type="radio" id="${objectId}-0" class="input-no-rate" name="${objectId}" value="0" aria-label="No rating." 
+							${dataRating == 0? 'checked' : ''}/>
+					
+					<input type="radio" id="${objectId}-1" name="${objectId}" value="1" 
+							${dataRating == 1? 'checked' : ''}/>
+					<label for="${objectId}-1" title="Terrible">1 star</label>
+					
+					<input type="radio" id="${objectId}-2" name="${objectId}" value="2" 
+							${dataRating == 2? 'checked' : ''}/>
+					<label for="${objectId}-2" title="Not good">2 stars</label>
+					
+					<input type="radio" id="${objectId}-3" name="${objectId}" value="3" 
+							${dataRating == 3? 'checked' : ''}/>
+					<label for="${objectId}-3" title="Average">3 stars</label>
+					
+					<input type="radio" id="${objectId}-4" name="${objectId}" value="4" 
+							${dataRating == 4? 'checked' : ''}/>
+					<label for="${objectId}-4" title="Very good">4 stars</label>
+					
+					<input type="radio" id="${objectId}-5" name="${objectId}" value="5" 
+							${dataRating == 5? 'checked' : ''}/>
+					<label for="${objectId}-5" title="Amazing">5 stars</label>
+					
+					<span class="starability-focus-ring"></span>
+				</fieldset>
 			</c:otherwise>
 		</c:choose>
-		
-		<div class="${isWidgetDisabled? 'rating-stars-disabled' : 'rating-stars'} rating-stars-new" data-average="${ratingDataAverage}" data-id="${objectId}" role="button" aria-label="<fmt:message key="${starsRateLabel}"/>"
-			<c:if test="${!isWidgetDisabled}">tabindex="0"</c:if>>
-		</div>
 			
 		<c:choose>
-			<c:when test="${isItemAuthoredByUser}">
-				<div class="rating-stars-caption">
+			<c:when test="${isDisplayOnly}">
+				<div class="starability-caption">
 					<fmt:message key="${averageRatingLabel}" >
 						<fmt:param>
 							<fmt:formatNumber value="${criteriaDto.averageRating}" type="number" maxFractionDigits="1" />
@@ -137,8 +177,8 @@
 			</c:when>
 				
 			<c:otherwise>
-				<div class="rating-stars-caption" id="rating-stars-caption-${objectId}"
-					<c:if test="${isCriteriaNotRatedByUser}">style="visibility: hidden;"</c:if>
+				<div class="starability-caption" id="starability-caption-${objectId}"
+					<c:if test="${!isCriteriaRatedByUser}">style="visibility: hidden;"</c:if>
 				>
 					<fmt:message key="${yourRatingLabel}" >
 						<fmt:param>
@@ -167,7 +207,7 @@
 <c:if test="${isCommentsEnabled}">
 	<div id="comments-area-${itemRatingDto.itemId}">
 		<c:choose>
-			<c:when test='${isItemAuthoredByUser or (showAllComments and not empty commentLeftByUser)}'>
+			<c:when test='${isDisplayOnly or (showAllComments and not empty commentLeftByUser)}'>
 				<c:forEach var="comment" items="${itemRatingDto.commentDtos}">
 					<div class="rating-comment">
 						<c:out value="${comment.comment}" escapeXml="false" />
Index: lams_tool_preview/web/WEB-INF/tags/StyledRating5.tag
===================================================================
diff -u -r8b7dd9324557fea52f4d89582ae7c0bc96d53ee1 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_preview/web/WEB-INF/tags/StyledRating5.tag	(.../StyledRating5.tag)	(revision 8b7dd9324557fea52f4d89582ae7c0bc96d53ee1)
+++ lams_tool_preview/web/WEB-INF/tags/StyledRating5.tag	(.../StyledRating5.tag)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -96,18 +96,23 @@
 								</td>
 								
 								<td class="rating">
-									<div class="rating-stars-holder text-center center-block">
+									<div class="starability-holder">
 										<c:set var="objectId">${criteriaRatings.ratingCriteria.ratingCriteriaId}-${rating.itemId}</c:set>
-										<div class="rating-stars-disabled rating-stars-new" data-average="${rating.averageRating}" data-id="${objectId}">
+										<c:set var="dataRating">
+											<fmt:formatNumber value="${rating.averageRating-(rating.averageRating%1)}" pattern="#"></fmt:formatNumber>
+											${(rating.averageRating%1) >= 0.5 ? '.5' : ''}
+										</c:set>
+										<div class="starability starability-result" data-rating="${dataRating}">
+											Rated: ${dataRating} stars
 										</div>
-										<c:set var="userRating">${rating.userRating}</c:set>
-										<div class="rating-stars-caption" id="rating-stars-caption-${objectId}">
+										
+										<div class="starability-caption" id="starability-caption-${objectId}">
 											<c:choose>
-												<c:when test="${empty userRating}">
+												<c:when test="${empty rating.userRating}">
 													<fmt:message key="label.not.rated"></fmt:message>
 												</c:when>
 												<c:otherwise>
-													<fmt:message key="label.you.gave.rating"><fmt:param><span id="user-rating-${objectId}">${userRating}</span></fmt:param></fmt:message>
+													<fmt:message key="label.you.gave.rating"><fmt:param><span id="user-rating-${objectId}">${rating.userRating}</span></fmt:param></fmt:message>
 												</c:otherwise>
 											</c:choose>
 											<br/>
@@ -135,10 +140,17 @@
 				<c:forEach var="rating" items="${criteriaRatings.ratingDtos}" varStatus="status">
 					<c:if test="${status.first && not empty rating.averageRating}">
 						<div class="rating">
-							<div class="rating-stars-holder text-center center-block">
+							<div class="starability-holder">
 								<c:set var="objectId">${criteriaRatings.ratingCriteria.ratingCriteriaId}-${rating.itemId}</c:set>
-								<div class="rating-stars-disabled rating-stars-new" data-average="${rating.averageRating}" data-id="${objectId}"></div>
-								<div class="rating-stars-caption" id="rating-stars-caption-${objectId}-currentUser">
+								<c:set var="dataRating">
+									<fmt:formatNumber value="${rating.averageRating-(rating.averageRating%1)}" pattern="#"></fmt:formatNumber>
+									${(rating.averageRating%1) >= 0.5 ? '.5' : ''}
+								</c:set>
+								<div class="starability starability-result" data-rating="${dataRating}">
+									Rated: ${dataRating} stars
+								</div>
+								
+								<div class="starability-caption" id="starability-caption-${objectId}-currentUser">
 									<fmt:message key="label.avg.rating">
 										<fmt:param><span id="average-rating-${objectId}-currentUser">${rating.averageRating}</span></fmt:param>
 										<fmt:param><span id="number-of-votes-${objectId}-currentUser">${rating.numberOfVotes}</span></fmt:param>
Index: lams_tool_preview/web/pages/learning/comment.jsp
===================================================================
diff -u -r7806cbb45faeff792419ef43f67c4fee6ffb03e9 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_preview/web/pages/learning/comment.jsp	(.../comment.jsp)	(revision 7806cbb45faeff792419ef43f67c4fee6ffb03e9)
+++ lams_tool_preview/web/pages/learning/comment.jsp	(.../comment.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -2,16 +2,13 @@
 <c:set var="minRates" value="${rateAllUsers > 0 ? rateAllUsers : criteriaRatings.ratingCriteria.minimumRates}"/>
 
 <!-- ********************  CSS ********************** -->
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
 	<link rel="stylesheet" href="<lams:WebAppURL/>/includes/css/learning.css'/>">
 
 <!-- ********************  javascript ********************** -->
 	<script type="text/javascript">
-		//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/";
-
 		//vars for rating.js
 		var MAX_RATES = 0, // only applies to stars
 		MIN_RATES = 0, // only applies to stars
@@ -21,19 +18,17 @@
 		COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.comment.textarea.tip"/></spring:escapeBody>',
 		WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="warning.comment.blank"/></spring:escapeBody>',
 		WARN_MIN_NUMBER_WORDS_LABEL = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='warning.minimum.number.words'><fmt:param value='${criteriaRatings.ratingCriteria.commentsMinWordsLimit}'/></fmt:message></spring:escapeBody>",
-		ALLOW_RERATE = true,
 		SESSION_ID = ${toolSessionId}; 
 
 		var	commentsSaved = true,
 			commentsLocked = false;
 			commentsOnOtherPages = ${countRatedItems};
 			numCommentsOnPage = 0;
 	</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/rating.js" type="text/javascript" ></script> 	
+	<script src="${lams}includes/javascript/rating5.js" type="text/javascript" ></script> 	
 	<script src="${lams}includes/javascript/portrait5.js" type="text/javascript" ></script>
 	<script type="text/javascript">
 	$(document).ready(function(){
@@ -153,7 +148,7 @@
 			// bind to pager events
 			.bind('pagerInitialized pagerComplete', function(event, options){
 				commentsSaved = false;
-				initializeJRating();
+				initializeStarability();
 				checkButtons();
 			});
 
Index: lams_tool_preview/web/pages/learning/results.jsp
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_preview/web/pages/learning/results.jsp	(.../results.jsp)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_preview/web/pages/learning/results.jsp	(.../results.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -15,16 +15,13 @@
 
 <lams:PageLearner title="${peerreview.title}" toolSessionID="${toolSessionId}">
 	<!-- ********************  CSS ********************** -->
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
 	<link rel="stylesheet" href="<lams:WebAppURL/>includes/css/learning.css">
 
 	<!-- ********************  javascript ********************** -->
 	<script type="text/javascript">
-		//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/";
-		
 		//vars for rating.js
 		var MAX_RATES = 0,
 		MIN_RATES = 0,
@@ -36,12 +33,11 @@
 		WARN_COMMENTS_IS_BLANK_LABEL = '<fmt:message key="warning.comment.blank"/>',
 		WARN_MIN_NUMBER_WORDS_LABEL = "<fmt:message key="warning.minimum.number.words"><fmt:param value="${criteriaRatings.ratingCriteria.commentsMinWordsLimit}"/></fmt:message>";
 	</script>
-	<lams:JSImport src="includes/javascript/jquery.jRating.js" />
 	<lams:JSImport src="includes/javascript/jquery.tablesorter.js" />
 	<lams:JSImport src="includes/javascript/jquery.tablesorter-widgets.js" />
 	<lams:JSImport src="includes/javascript/jquery.tablesorter-pager.js" />
 	<lams:JSImport src="includes/javascript/common.js" />
-	<lams:JSImport src="includes/javascript/rating.js" />
+	<lams:JSImport src="includes/javascript/rating5.js" />
 	<script type="text/javascript">
 		checkNextGateActivity('finishButton', '${toolSessionId}', '', finishSession);
 	
@@ -68,7 +64,7 @@
 		            } 
 		        } 
 			});
-			initializeJRating();
+			initializeStarability();
 		 });
 	
 		function finishSession(){
Index: lams_tool_preview/web/pages/learning/star.jsp
===================================================================
diff -u -r7806cbb45faeff792419ef43f67c4fee6ffb03e9 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_preview/web/pages/learning/star.jsp	(.../star.jsp)	(revision 7806cbb45faeff792419ef43f67c4fee6ffb03e9)
+++ lams_tool_preview/web/pages/learning/star.jsp	(.../star.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -3,15 +3,13 @@
 <c:set var="minRates" value="${rateAllUsers > 0 ? rateAllUsers : criteriaRatings.ratingCriteria.minimumRates}"/>
 
 <!-- ********************  CSS ********************** -->
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css">
 	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
+	<link rel="stylesheet" href="${lams}css/starability-basic.css">
 
 <!-- ********************  javascript ********************** -->	
-<script type="text/javascript">
-		//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/";
-
+	<script type="text/javascript">
 		//vars for rating.js
 		var MAX_RATES = ${maxRates},
 		MIN_RATES = ${minRates},
@@ -22,14 +20,12 @@
 		COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape="true">:message key="label.comment.textarea.tip"/></spring:escapeBody>',
 		WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="warning.comment.blank"/></spring:escapeBody>',
 		WARN_MIN_NUMBER_WORDS_LABEL = "<spring:escapeBody javaScriptEscape='true'><fmt:message key='warning.minimum.number.words'><fmt:param value='${criteriaRatings.ratingCriteria.commentsMinWordsLimit}'/></fmt:message></spring:escapeBody>",
-		ALLOW_RERATE = true,
 		SESSION_ID = ${toolSessionId};
-</script>
-	<script src="${lams}includes/javascript/jquery.jRating.js" type="text/javascript"></script>
+	</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/rating.js" type="text/javascript" ></script> 	
+	<script src="${lams}includes/javascript/rating5.js" type="text/javascript" ></script> 	
 	<script src="${lams}includes/javascript/portrait5.js" type="text/javascript" ></script>
 <script type="text/javascript">	
 	var YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.you.gave.rating"><fmt:param>@1@</fmt:param></fmt:message></spring:escapeBody>',
@@ -94,45 +90,34 @@
 							
 							var isMaximumRatesPerUserReached = (${peerreview.maximumRatesPerUser} != 0) && (userData.ratesPerUser >= ${peerreview.maximumRatesPerUser});
 							
-							rows += '<tr>' +
-										'<td class="username">' + 
-											'<div class="float-start me-2">' +
-												definePortrait( userData["itemDescription2"], itemId, 'small', true, '${lams}' ) +
-										 	'</div>' +
-											'<span class="portrait-sm-lineheight" id="username-' + itemId + '">' +
-												userData["itemDescription"] +
-											'</span>';
-								
+							rows += 
+								'<tr>' +
+									'<td class="username">' + 
+										'<div class="float-start me-2">' +
+											definePortrait( userData["itemDescription2"], itemId, 'small', true, '${lams}' ) +
+									 	'</div>' +
+										'<span class="portrait-sm-lineheight" id="username-' + itemId + '">' +
+											userData["itemDescription"] +
+										'</span>';
 							if (isMaximumRatesPerUserReached) {
-								rows += '<br/><div class="alert alert-warning"><i class="fa fa-exclamation-circle text-muted"></i> <spring:escapeBody javaScriptEscape="true"><fmt:message key="label.cant.rate" /></spring:escapeBody></div>';
+								rows +=	'<br/><div class="alert alert-warning"><i class="fa fa-exclamation-circle text-muted"></i> <spring:escapeBody javaScriptEscape="true"><fmt:message key="label.cant.rate" /></spring:escapeBody></div>';
 							}
+							rows += '</td>' +
+									'<td class="rating">' +
+										'<div class="starability-holder">';	
 
-							rows += '</td>';
-							rows += '<td class="rating">';
-							rows += 	'<div class="rating-stars-holder text-center center-block">';		
+							let isDisplayOnly = false,
+								objectId = "${criteriaRatings.ratingCriteria.ratingCriteriaId}-" + itemId,
+								averageRating = userData["userRating"],//use userRating instead of averageRating for display only
+								numberOfVotes = null,
+								userRating = userData["userRating"],
+								isCriteriaRatedByUser = userRating != "",
+								isWidgetDisabled = (IS_DISABLED || isDisplayOnly || (MAX_RATES > 0) && (COUNT_RATED_ITEMS >= MAX_RATES) || isMaximumRatesPerUserReached) && !isCriteriaRatedByUser,
+								criteriaTitle = null;
+							rows +=		 	createStarability(isDisplayOnly, objectId, averageRating, numberOfVotes, userRating, isWidgetDisabled, criteriaTitle) +
+										'</div>' +	
+									'</td>';
 							
-							var isDisabled = IS_DISABLED || (MAX_RATES > 0) && ( COUNT_RATED_ITEMS >= MAX_RATES) || isMaximumRatesPerUserReached;
-							
-							var objectId = "${criteriaRatings.ratingCriteria.ratingCriteriaId}-" + itemId;
-							var userRating = userData["userRating"];
-							var isCriteriaNotRatedByUser = userRating == "";
-							var userRatingDisplayed = (!isCriteriaNotRatedByUser) ? userRating : 0;
-							let isWidgetDisabled = (isDisabled && isCriteriaNotRatedByUser);
-							var ratingStarsClass = isWidgetDisabled ? "rating-stars-disabled" : "rating-stars";
-							var tabindex = isWidgetDisabled ? "" : 'tabindex="0"';
-							
-							rows += '<div class="'+ ratingStarsClass +' rating-stars-new" data-average="'+ userRatingDisplayed +'" data-id="'+ objectId +'" role="button" aria-labelledby="theader-rating username-' + itemId + '" ' + tabindex + '>';
-							rows += '</div>';
-									
-							rows += '<div class="rating-stars-caption" id="rating-stars-caption-'+ objectId +'"';
-							if (isCriteriaNotRatedByUser) {
-								rows += ' style="visibility: hidden;"';	
-							}
-							rows += '>';
-							rows += YOUR_RATING_LABEL.replace("@1@", '<span id="user-rating-'+ objectId +'">'+ userRating + '</span>');							rows += '</div>';
-									
-							rows += '</td>';
-							
 							if (${criteriaRatings.ratingCriteria.commentsEnabled}) {
 								rows += '<td class="comment" id="comments-area-' + itemId + '">';
 								
@@ -147,7 +132,7 @@
 								//show comments textarea and a submit button
 								} else if (!IS_DISABLED) {
 									rows += '<div id="add-comment-area-' + itemId;
-									if ( isCriteriaNotRatedByUser )
+									if ( !isCriteriaRatedByUser )
 										rows += '" style="visibility: hidden;';
 									rows += '">';	
 									commentPostedByUser = commentPostedByUser.replace(/<BR>/gi, '\n');
@@ -171,16 +156,15 @@
 			// bind to pager events
 			.bind('pagerInitialized pagerComplete', function(event, options){
 				commentsSaved = false;
-				initializeJRating();
+				initializeStarability();
 				onRatingSuccessCallback(); // show buttons if appropriate
 			});
 		});
 	 });
 
 <c:choose>
 <c:when test="${criteriaRatings.ratingCriteria.commentsEnabled}">
-	function submitEntry(next, url){	
-
+	function submitEntry(next, url){
 		hideButtons();
 
 		var validationFailed = false, 
Index: lams_tool_whiteboard/web/pages/learning/galleryWalk.jsp
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r169520b6cf03e63865f09db66f593677b1c5580b
--- lams_tool_whiteboard/web/pages/learning/galleryWalk.jsp	(.../galleryWalk.jsp)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_whiteboard/web/pages/learning/galleryWalk.jsp	(.../galleryWalk.jsp)	(revision 169520b6cf03e63865f09db66f593677b1c5580b)
@@ -9,7 +9,7 @@
 <c:set var="localeLanguage"><lams:user property="localeLanguage" /></c:set>
 	
 <lams:PageLearner title="${whiteboard.title}" toolSessionID="${toolSessionID}">
-	<lams:css suffix="jquery.jRating"/>
+	<link href="${lams}css/rating.css" rel="stylesheet" type="text/css">
 	<style>
 		#gallery-walk-rating-table {
 			width: 60%;
@@ -63,18 +63,15 @@
 
 	<script type="text/javascript" src="${lams}includes/javascript/fullscreen.js"></script>
 	<script type="text/javascript">
-			//var for jquery.jRating.js
-		var pathToImageFolder = "${lams}images/css/",
-			//vars for rating.js
-			AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
+		//vars for rating.js
+		var	AVG_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.average.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param></fmt:message></spring:escapeBody>',
 			YOUR_RATING_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.your.rating"><fmt:param>@1@</fmt:param><fmt:param>@2@</fmt:param><fmt:param>@3@</fmt:param></fmt:message></spring:escapeBody>',
 			MAX_RATES = 0,
 			MIN_RATES = 0,
 			COUNT_RATED_ITEMS = true,
 			COMMENTS_MIN_WORDS_LIMIT = 0,
 			COMMENT_TEXTAREA_TIP_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.comment.textarea.tip"/></spring:escapeBody>',
 			WARN_COMMENTS_IS_BLANK_LABEL = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="warning.comment.blank"/></spring:escapeBody>',
-			ALLOW_RERATE = true,
 			SESSION_ID = ${toolSessionID};
 			
 		checkNextGateActivity('finish-button', '${toolSessionID}', '', finishSession);
@@ -100,8 +97,7 @@
 			document.location.href ='<c:url value="/learning/finish.do?sessionMapID=${sessionMapID}&mode=${mode}&toolSessionID=${toolSessionID}"/>';
 		}
 	</script>
-	<lams:JSImport src="includes/javascript/rating.js" />
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.jRating.js"></script>	
+	<lams:JSImport src="includes/javascript/rating5.js" />
 	<%@ include file="websocket.jsp"%>	
 
 <div id="container-main">
@@ -135,7 +131,7 @@
 					</div>
 					<div class="col">
 						<lams:Rating5 itemRatingDto="${groupSummary.itemRatingDto}" 
-								isItemAuthoredByUser="true"
+								isDisplayOnly="true"
 								hideCriteriaTitle="true" />
 					</div>
 				</div>
@@ -176,7 +172,7 @@
 	       	    <c:if test="${not whiteboard.galleryWalkReadOnly and (whiteboard.galleryWalkFinished or mode == 'teacher' or toolSessionID != groupSummary.sessionId)}">
 	       	    	<div class="gallery-walk-rating-comment-container">
 	       	    		<lams:Rating5 itemRatingDto="${groupSummary.itemRatingDto}"
-								     isItemAuthoredByUser="${whiteboard.galleryWalkFinished or not hasEditRight or mode == 'teacher'}" />
+								     isDisplayOnly="${whiteboard.galleryWalkFinished or not hasEditRight or mode == 'teacher'}" />
 					 </div>
 	       	    </c:if>