{literal}
		<link rel="stylesheet" type="text/css" href="{/literal}{$_module.wwwpath}{literal}css/component.css" />
        <link rel="stylesheet" type="text/css" href="{/literal}{$_module.wwwpath}{literal}css/animate.css">
		<script src="{/literal}{$_module.wwwpath}{literal}js/modernizr.custom.70736.js"></script>
		<noscript><link rel="stylesheet" type="text/css" href="{/literal}{$_module.wwwpath}{literal}css/noJS.css"/></noscript>
		<!--[if lte IE 7]><style>.main{display:none;} .support-note .note-ie{display:block;}</style><![endif]-->
{/literal}
{php} 
header('X-UA-Compatible: IE=edge,chrome=1');
header('viewport: width=device-width, initial-scale=1.0');
{/php}

{if $_vars.view == 'albs'}
	
    <div class="albs">
    
    <div class="albs_text">{$_config.albs.albs_text}</div>
    
    {foreach from=$_vars.albs item=album}
    
    	{assign var="cover_src" value=$_module.ressources|cat:$album.cover.name}
        
        {capture name="title"}
        	{if $_config.albs.title_show == 'true' && !empty($album.title)}
            <div class="title">
            
                {if $_config.albs.title_link == 'true'}
                	<a href="{linkToParams vars0=$album.id vars1=$album.urlw}">
                {/if}
                
                {$album.title}
                
                {if $_config.albs.title_link == 'true'}
                	</a>
                {/if}
                
            </div>
            {/if}
        {/capture}
    
        {capture name="description"}
        	{if $_config.albs.description_show == 'true' && !empty($album.description)}
            <div class="description">
                {$album.description}
            </div>
            {/if}
        {/capture}
    
        {capture name="date"}
        	{if ($_config.albs.date_show == 'true' ||  $_config.albs.heur_show == 'true') && !empty($album.datetaken)}
            <div class="date">
                {if $_config.albs.date_show=='true'}{$_config.albs.date_btext}{$_Extra->env->dates->convertDate($_config.albs.date_style, $album.date)}{/if}
                {if $_config.albs.heur_show=='true'}{$_config.albs.heur_btext}{$_Extra->env->dates->convertDate('hour', $album.date)}{/if}
            </div>
            {/if}
        {/capture}
    
        {capture name="cover"}
        	{if $_config.albs.img_show == 'true'}
            <div class="cover">
            	<a href="{linkToParams vars0=$album.id vars1=$album.urlw}">
                    {if $_config.albs.img_crop == 'true'}
                        <img src="images/{$_config.albs.img_width}x{$_config.albs.img_height}/{$cover_src}" />
                    {else}
                        <img src="{$cover_src}" {$_Extra->media->image->showResized($cover_src, $_config.albs.img_width, $_config.albs.img_height)} />
                    {/if}
                </a>
            </div>
            {/if}
        {/capture}

        {if $_config.albs.mode == '1'}
        	
            <div class="album">
                {$smarty.capture.cover}
                {$smarty.capture.title}
                {$smarty.capture.date}
            </div>
            
        {elseif $_config.albs.mode == '2'}
        	
            <div class="album">
                <table>
                    <tr>
                        {if $_config.albs.img_show == 'true'}
                        <td>
                            {$smarty.capture.cover}
                        </td>
                        {/if}
                        <td>
                            {$smarty.capture.title}
                            {$smarty.capture.date}
                            {$smarty.capture.description}
                        </td>
                    </tr>
                </table>
            </div>
            
        {/if}
        
     {/foreach}
     
    <div style="clear:both; height:0;">&nbsp;</div>
    
     </div>
     
    {if $_vars.nbpages>1}
    <div class="albs_pagination">
    {if $_vars.cp!=1 && $_config.albs.link_page_before!=''}<a href="{linkToParams vars0='page' vars1=$_vars.cp-1}">{$_config.albs.link_page_before}</a>{$_config.albs.link_page_separator}{/if}
    {section name=pages loop=$_vars.nbpages}<a href="{linkToParams vars0='page' vars1=$smarty.section.pages.iteration}" {if $smarty.section.pages.iteration == $_vars.cp}class="current"{/if}>{$smarty.section.pages.iteration}</a>{if !$smarty.section.pages.last}{$_config.albs.link_page_separator}{/if}{/section}
    {if $_vars.cp<$smarty.section.pages.total && $_config.albs.link_page_after!=''}{$_config.albs.link_page_separator}<a href="{linkToParams vars0='page' vars1=$_vars.cp+1}">{$_config.albs.link_page_after}</a>{/if}
    </div>
    {/if}
{literal}
<script language="javascript" type="text/javascript">
    $jQuery('.album').each(function(){
        $jQuery(this).mouseenter(function() {
            $jQuery(this).addClass('hover');
        }).mouseleave(function() {
            $jQuery(this).removeClass('hover');
        });
    });
</script>
{/literal}

{elseif $_vars.view == 'pics'}
       
        {if $_vars.return_albs == 'true' && !empty($_config.pic.albs_link_text)}
        <div class="albs_link">
            <a href="{linkToParams vars0='page' vars1=$_vars.return_albs_page}">{$_config.pic.albs_link_text}</a>
        </div>
        {/if}

    
    
    <div class="pics">
    
        <div class="pics_text">{$_config.pic.pics_text}</div> 
       
       
				<div class="gamma-container gamma-loading" id="gamma-container">

					<ul class="gamma-gallery">
          {foreach from=$_vars.pics item=picture}
                {assign var="picture_src" value=$_module.ressources}                                        
				<li>
                            <div data-alt="" data-title="{if $_config.pic.title_show=='true' && $_mconfig.title=='true'}{$picture.title}{/if}" data-description="{if $_config.pic.description_show=='true' && $_mconfig.description=='true'}<p>{$picture.description}</p>{/if}" data-max-width="1800" data-max-height="1350">
								<div data-src="{$picture_src}{$picture.name}" data-min-width="1300"></div>
								<div data-src="{$picture_src}{$picture.name}" data-min-width="1000"></div>
								<div data-src="{$picture_src}{$picture.name}" data-min-width="700"></div>
								<div data-src="{$picture_src}{$picture.name}" data-min-width="300"></div>
								<div data-src="{$picture_src}{$picture.name}" data-min-width="200"></div>
								<div data-src="{$picture_src}{$picture.name}" data-min-width="140"></div>
								<div data-src="{$picture_src}{$picture.name}"></div>
								<noscript>
									<img src="{$picture_src}miniatures/{$picture.name}" alt=""/>
								</noscript>
							</div>
                </li>
           {/foreach}
           
           
			</ul>
					<div class="gamma-overlay"></div>

     </div>
			
			<div style="height:300px;clear:both;"></div>
    
    </div>

 {literal}
		<script src="{/literal}{$_module.wwwpath}{literal}js/jquery.scrollzip.js"></script>
		<script src="{/literal}{$_module.wwwpath}{literal}js/jquery.masonry.min.js"></script>
		<script src="{/literal}{$_module.wwwpath}{literal}js/jquery.history.js"></script>
		<script src="{/literal}{$_module.wwwpath}{literal}js/js-url.min.js"></script>
		<script src="{/literal}{$_module.wwwpath}{literal}js/jquerypp.custom.js"></script>
		<script src="{/literal}{$_module.wwwpath}{literal}js/gamma.js"></script>
		<script type="text/javascript">
            
            $jQuery(function() {

                var GammaSettings = {
                        viewport : [ {
                            width : 1200,
                            columns : 5
                        }, {
                            width : 900,
                            columns : 4
                        }, {
                            width : 500,
                            columns : 3
                        }, { 
                            width : 320,
                            columns : 2
                        }, { 
                            width : 0,
                            columns : 2
                        } ]
                };

                Gamma.init( GammaSettings );

            });

$jQuery(document).ready(function(){
    
    $jQuery(window).on("load scroll resize", function(){
        $jQuery('.masonry-brick').scrollzip({
            showFunction    : function() { $jQuery(this).css("visibility", "visible").addClass('animated {/literal}{if $_config.pic.effet!=''} {$_config.pic.effet}{else} fadeIn {/if}{literal}'); },
            hideFunction    : function() { $jQuery(this).css("visibility", "hidden").removeClass('animated'); }
        });
    });
    $jQuery("html, body").animate({ scrollTop: 1 }, "slow");

});












		</script>	
{/literal}

{/if}