AgrupacionesTerritoriales.vm

#set ($LayoutLocalService = $serviceLocator.findService("com.liferay.portal.service.LayoutLocalService"))
#set ($JournalArticleLocalService = $serviceLocator.findService("com.liferay.portlet.journal.service.JournalArticleLocalService"))


#if(!$entries.isEmpty())

#set($baseUrl = "#getFRIndlUrl1('/agrupaciones-territoriales')")

<script type="text/javascript">

safeInit(function(){
   var originalWidth = 767;
   widthImg = parseInt($("#mapilla").width());
   
   function proportion(width){
        var propor = 1;
        propor = widthImg / 767;
    
       $(".puntoAgrupacion").each(function(){
            var left = parseInt($(this).attr("data-left").trim());
            var top = parseInt($(this).attr("data-top").trim());
            
            var newLeft = left * propor;
            var newTop = top * propor;
            
            $(this).css("left",newLeft+"px");
            $(this).css("top",newTop+"px");
       });
       
       $(".puntoAgrupacion").fadeIn();
   }
   
   proportion(widthImg);
   var resizeTimer;
   
   $(window).on('resize', function(e) {
      $(".puntoAgrupacion").hide();
          
      clearTimeout(resizeTimer);
      resizeTimer = setTimeout(function() {
        
        widthImg = parseInt($("#mapilla").width());
       proportion(widthImg);
 
      }, 500);
    });
    
	$(".puntoAgrupacion").click(function(e){
	   
	   if($(this).children(".tooltipCirculos").css("display") == "none"){
    	   $(".tooltipCirculos").fadeOut("400");
    	   $(this).children(".tooltipCirculos").slideDown(400); 
	   }else{
			if(e.target.tagName != 'A'){
			   $(this).children(".tooltipCirculos").slideUp(400);  
			   $(".tooltipCirculos").fadeOut("400");
		   }
	   }
	});
	
	
	$(".toggleSpain").click(function(){
	    $(this).siblings("ul").slideToggle();
	    return false; #*Desactiva el href*#
	});
	
	$("#puntoSpain .puntoSpainToggle").click(function(){
	    $(".listaPuntoSpain").slideToggle();
	    return false; #*Desactiva el href*#
	});
	
});


</script>


<div class="mapaPuntos margin-top0">
	<div class="container">

		## ------- Sort by continent --------

		#set($continentsMap={})

		#foreach ($entry in $entries)

			#set( $renderer = $entry.getAssetRenderer() )
			#set( $journalArticle = $renderer.getArticle() )
			#set( $doc = $saxReaderUtil.read($journalArticle.getContentByLocale($themeDisplay.languageId)) )
			#set( $root = $doc.getRootElement() )
			#set( $continentId = $getterUtil.getInteger("#getField2($root 'Continente')", -1) )
			
			#set( $chapterList = $continentsMap.get($continentId) )
			#if($validator.isNull($chapterList))
				#set( $chapterList = [] )	
			#end
			
			#set( $void = $chapterList.add({
			   'weight' : $getterUtil.getInteger("#getField2($root 'peso')", 0),
			   'name' : "#getField2($root 'nombre')",
			   'top': "#getField2($root 'top')",
			   'left': "#getField2($root 'left')",
			   'numero': "#getField2($root 'numero')",
			   'isSpain': $getterUtil.getBoolean("#getField2($root 'Es_Espana')"),
			   'urlTitle' : $journalArticle.urlTitle
			}))
			#set( $void = $continentsMap.put($continentId, $chapterList) )

			#set($chapterList=[])
		
		#end

		<!-- Header -->

		<h1 >#language("at.titulo")</h1>
		<p> 
			#language("at.descripcion")
		</p>
		
		<!-- Map -->
		
        <div class="mapaAgrupaciones" style="position:relative;">
        
            <img id="mapilla" usemap="#mapaAgrupaciones" src="/iese-theme/images/mapaPuntos.png" alt="mapa de verdad" title="mapa" width="100%">
           
           #* SPAIN *#
            <div id="puntoSpain" data-left="345" data-top="163" class="puntoAgrupacion">
    			<div class="tooltipCirculos">
                				
    				<a class="puntoSpainToggle" href="#">#language("pais.esp")</a>
    								
                	<p>
                		<span>18679</span> <img src="/iese-theme/images/menWomen.png" alt="">
                	</p>
                
                	     <ul class="listaPuntoSpain">
                        #foreach ($continentId in $sortTool.sort($continentsMap.keySet()))
				            #set( $chapterList = $continentsMap.get($continentId) )
                            #foreach ($chapter in $sortTool.sort($chapterList, ['weight:desc','name:asc']))
                                #if($chapter.isSpain)
						            <li><a href="$baseUrl/$chapter.urlTitle">$chapter.name      <span>$chapter.numero</span></a></li>
						        #end
						    #end
						 #end
						</ul>
				
					
                </div>
            </div>
            #* FIN SPAIN*#
            
            #foreach ($continentId in $sortTool.sort($continentsMap.keySet()))
				
				#set( $chapterList = $continentsMap.get($continentId) )
				
                    #foreach ($chapter in $sortTool.sort($chapterList, ['weight:desc','name:asc']))
                         #if(!$chapter.isSpain)
                            <div data-left="$chapter.left" data-top="$chapter.top" class="puntoAgrupacion">
    							<div class="tooltipCirculos">
                				
    								<a href="$baseUrl/$chapter.urlTitle">$chapter.name</a>
    								
                					<p>
                						<span>$chapter.numero</span> <img src="/iese-theme/images/menWomen.png" alt="">
                					</p>
                				</div>
                			</div>
						#end
        			#end
			#end

			
		</div>
  
		<!-- Country list -->

		<div class="listadoMapaPuntos">

			<!-- Continent list -->
			
			#foreach ($continentId in $sortTool.sort($continentsMap.keySet()))
				
				#set( $chapterList = $continentsMap.get($continentId) )

				    #if($validator.equals("$continentId","1"))
				        <div class="span4">
        					<h1>#language("continent.$continentId")</h1>
        					<ul>
        					        #*SPAIN*#
        					    <li class="toggleSpain"><a href="#">#language("pais.esp")</a></li>
        					    
        					            <ul class="spainChapters">
        					               #foreach ($chapter in $sortTool.sort($chapterList, ['weight:desc','name:asc']))
        						            #if($chapter.isSpain)
                					            <li><a href="$baseUrl/$chapter.urlTitle">$chapter.name</a></li>
                					        #end
                					       #end
                					       
        					            </ul>
        					            
        					        #*FIN SPAIN*#
        					    
        						#foreach ($chapter in $sortTool.sort($chapterList, ['weight:desc','name:asc']))
        						    
        						    #if(!$chapter.isSpain)
        							    <li><a href="$baseUrl/$chapter.urlTitle">$chapter.name</a></li>
        							#end
        							
        						#end
        						
        					</ul>
        				</div>

				    #else
        				<div class="span4">
        					<h1>#language("continent.$continentId")</h1>
        					<ul>
        						#foreach ($chapter in $sortTool.sort($chapterList, ['weight:desc','name:asc']))
        							<li><a href="$baseUrl/$chapter.urlTitle">$chapter.name</a></li>
        						#end
        					</ul>
        				</div>
        				
                    #end
			#end

		</div>
	</div>
</div>

#end

#macro (getField2 $root $fName)#*
	*##set ($xPathSelector = $saxReaderUtil.createXPath("dynamic-element[@name='$fName']"))#*
	*#$!xPathSelector.selectSingleNode($root).getStringValue()#*
*##end




#macro (getFRIndlUrl1 $fUrl)#*
    *##set ($currLayout = $LayoutLocalService.getFriendlyURLLayout($themeDisplay.getScopeGroupId(), false, $fUrl))#*
	*#$portalUtil.getLayoutFriendlyURL($currLayout, $themeDisplay)#*
*##end