<%
	
	import org.exoplatform.webui.form.UIFormInputBase;
	
	def rcontext = _ctx.getRequestContext() ;
	def jsManager = rcontext.getJavascriptManager();
	jsManager.require("SHARED/portalControl", "portalControl");
	
    
%>
<% 
	uicomponent.loadData();
	def addon = uicomponent.getAddon();
	def itemName = addon.getName();
	def itemLink = uicomponent.getURL();
	def imgSrc = uicomponent.getImageCover();	
	def itemDownloadUrl = addon.getDownloadLink();
	def itemDescription = addon.getDescription();
	def canEdit = uicomponent.canEdit();
	def itemAuthor = addon.getAuthor();
		def itemCategory = addon.getCategory();
	  
  Double voteRate= addon.getVoteRate();
  Double modul = voteRate % 1.0;
  Integer totalStar = 0;
  if(modul >= 0.5){
    totalStar = (Integer)(voteRate-modul+1);
  }else{
    totalStar = (Integer)(voteRate-modul);
  }
  
  Integer totalVote = addon.getTotalVote();
%>


<div id="$uicomponent.id" class="NormalNews span4">
	<div class="media"> 
		<img  alt="$imgSrc" src="$imgSrc" />

		<div class="contentHover">
				<div class="addonsDescription" onclick="location.href='<%= itemLink%>'">
				  <p>$itemDescription</p>
				</div>	
				<div class="actionButton">
				  <button class="btn btn-primary" onclick="window.open('<%= itemDownloadUrl %>','blank');">Download</button>
					<% if(canEdit){ %>
					<button class="btn btn-primary" onclick="<%=uicomponent.event("Edit")%>"><i class="uiIconEdit"></i></btn>
					<% } %>
			</div>
	</div>	


	</div>
	<div class="content">
		<div class="left">
			<h4><a class="TitleContentNormalNews" href="<%= itemLink%>"><%= itemName %></a></h4>
			<p><%= itemAuthor%></p>
		</div>
		<hr/>
	</div>
	
	<!--BEGIN VOTE-->
  <div class="uiVote clearfix" rel="tooltip" data-toggle="tooltip" data-original-title="Avg. Rating: $voteRate  Votes: $totalVote" title="Avg. Rating: $voteRate  Votes: $totalVote">
		<div class="avgRatingImages clearfix">
		  <% for(int i=1; i <= totalStar; i++){%>
			  <i rel="tooltip" class="voted"></i>
		  <%
			}
			for(int i=1; i <= 5-totalStar; i++){
		  %>
			  <i rel="tooltip" class="unvoted"></i>
		  <%}%>
		</div>
		<div class="right categoryLabel">
			<h5><%= itemCategory%></h5>
		</div>
  </div>
  <!--END VOTE-->

</div>
				<script type="text/javascript">
						function loadCoverImage(){

					jQuery('.media').hover(function(){

						jQuery(this).find('img').hide();
						jQuery(this).find('.contentHover').animate({top:'0px'},{queue:false,duration:300}).show();
					},function(){
						jQuery(this).find('img').show();
						jQuery(this).find('.contentHover').animate({top:'185px'},{queue:false,duration:300});
					}

					);
				}
				</script>