anchor.diff:  	<script type="text/javascript"
   		src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
   	<script type="text/javascript" src="assets/js/materialize.min.js"></script>
  +	<script type="text/javascript"
  +		src="assets/js/jquery.star.rating.min.js"></script>
   	<script>
   		$(document).ready(function() {
   			$(".button-collapse").sideNav({});
  
positive.code: 				alignment : 'right',
  				belowOrigin : true,
  			});
  		});
  	</script>
  </body>
  
  
negative.code: 
  	<div class="container">
  		<div class="spacer-normal"></div>
  
  		<c:if test="${rateCount < 6}">
  			<div class="row">
  				<div class="spacer-thin"></div>
  				<div class="col s12">
  					<div class="card-panel teal lighten-2">
  						<span class="white-text">It seems that you have not rated
  							enough movie yet. Please rate the movies below so that we can
  							recommend you more movies that you will like.</span>
  					</div>
  				</div>
  				<div class="col s12">
  					<div class="card white">
  						<div class="card-content">
  							<div id="rateLoadingPanel" class="row center">
  								<div class="col s12">
  									<div class="preloader-wrapper small active">
  										<div class="spinner-layer spinner-red-only">
  											<div class="circle-clipper left">
  												<div class="circle"></div>
  											</div>
  											<div class="gap-patch">
  												<div class="circle"></div>
  											</div>
  											<div class="circle-clipper right">
  												<div class="circle"></div>
  											</div>
  										</div>
  									</div>
  								</div>
  							</div>
  							<div id="rateLoadedPanel" class="row hide">
  								<div class="col s12 m4 l3">
  									<img id="rateImg" class="responsive-img hide-on-small-only"
  										src=""> <img id="rateImgBackdrop"
  										class="responsive-img hide-on-med-and-up" src="">
  								</div>
  								<div class="col s12 m8 l9">
  									<h5 id="rateTitle"></h5>
  									<p id="rateSubText"></p>
  									<div class="spacer-thin"></div>
  									<div id="rateGenre"></div>
  									<div class="spacer-thin"></div>
  									<div id="rateDesc"></div>
  									<div class="spacer-thin"></div>
  									<div id="rateWidget"></div>
  								</div>
  							</div>
  						</div>
  						<div id="rateMsgPanel" class="row hide center">
  							<p id="rateErrorMsg" class="col s10 offset-s1">So
  								embarrassing, we are unable to generate any more movies for you
  								to rate.</p>
  						</div>
  						<div id="rateCardAction" class="card-action hide">
  							<a id="rateSkip" href="javascript:void(0)">Skip</a>
  						</div>
  					</div>
  				</div>
  			</div>
  		</c:if>
  
  		<div class="row">
  			<div class="col s12">
  				<ul class="tabs">
  