Changeset 16501 for extensions/flop_style/thumbnails

Timestamp:

Jul 8, 2012, 5:45:23 PM (12 years ago)

Author:

flop25

Message:

adding a gif loader (introduced in 2.4.2)
fixing the height of medium_cat.tpl
adding a custom size for spotlight.tpl

Location:

extensions/flop_style/thumbnails

Files:

• fancy_hover.tpl (modified) (2 diffs)
• jPolaroid.tpl (modified) (2 diffs)
• polaroid.tpl (modified) (2 diffs)

extensions/flop_style/thumbnails/fancy_hover.tpl

@@ -1 +1 @@
 {combine_css path="template-extension/flop_style/thumbnails/fancy_hover.css"}
 {combine_script id='jquery' path='themes/default/js/jquery.min.js'}
+{combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='footer'}
+{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'}
 {define_derivative name='derivative_fh' width=$derivative_params->max_width() height=$derivative_params->max_height() crop=true}
 {html_head}
   {literal}
 <script type="text/javascript">
-$(document).ready(function(){ 
+jQuery(document).ready(function(){ 
 $("ul.thumbnails li").hover(function() {
         $(this).css({'z-index' : '10'}); /*Add a higher z-index value so this image stays on top*/ 
@@ -50 +52 @@
 {if !empty($thumbnails)}
 {strip}{foreach from=$thumbnails item=thumbnail}
+{assign var=derivative value=$pwg->derivative($derivative_fh, $thumbnail.src_image)}
         <li>
     <a href="{$thumbnail.URL}" title="{if isset($thumbnail.NAME)}{$thumbnail.NAME|truncate:11:" [...]"|@replace:'"':' '}{/if}">
-      <img src="{$pwg->derivative_url($derivative_fh, $thumbnail.src_image)}" class="thumb_jpolaroid" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}" >
+      <img {if $derivative->is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.img_dir}/ajax-loader-big.gif" data-src="{$derivative->get_url()}"{/if} class="thumb_jpolaroid" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}" >
     </a>
         </li>

extensions/flop_style/thumbnails/jPolaroid.tpl

@@ -2 +2 @@
 {combine_css path="template-extension/flop_style/mainpage_categories/jPolaroid/jpolaroid.minified.css"}
 {combine_script id="jquery.jpolaroid.minified" load="header" path="template-extension/flop_style/mainpage_categories/jPolaroid/jquery.jpolaroid.min.js"}
+{combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='footer'}
+{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'}
 {html_head}
   {literal}
@@ -32 +34 @@
 {if !empty($thumbnails)}
 {strip}{foreach from=$thumbnails item=thumbnail}
+{assign var=derivative value=$pwg->derivative($derivative_jPolaroid, $thumbnail.src_image)}
         <li>
-                        <a href="{$thumbnail.URL}" title="{if isset($thumbnail.NAME)}{$thumbnail.NAME|truncate:11:" [...]"|@replace:'"':' '}{/if}">
-                                <img src="{$pwg->derivative_url($derivative_jPolaroid, $thumbnail.src_image)}" class="thumb_jpolaroid" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}" >
-                        </a>
+    <a href="{$thumbnail.URL}" title="{if isset($thumbnail.NAME)}{$thumbnail.NAME|truncate:11:" [...]"|@replace:'"':' '}{/if}">
+      <img {if $derivative->is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.img_dir}/ajax-loader-big.gif" data-src="{$derivative->get_url()}"{/if} class="thumb_jpolaroid" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}" >
+    </a>
         </li>
 {/foreach}{/strip}

extensions/flop_style/thumbnails/polaroid.tpl

@@ -1 +1 @@
 {combine_css path="template-extension/flop_style/thumbnails/polaroid.css"}
+{combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='footer'}
+{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'}
 {html_style}{literal}
 ul.thumbnails a {
@@ -14 +16 @@
 {if !empty($thumbnails)}
 {strip}{foreach from=$thumbnails item=thumbnail}
+{assign var=derivative value=$pwg->derivative($derivative_polaroid, $thumbnail.src_image)}
         <li>
-                        <a href="{$thumbnail.URL}" title="{if isset($thumbnail.NAME)}{$thumbnail.NAME|truncate:11:" [...]"|@replace:'"':' '}{/if}">
-                                <img src="{$pwg->derivative_url($derivative_polaroid, $thumbnail.src_image)}"  alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}" >
+                        <a href="{$thumbnail.URL}" title="{if isset($thumbnail.NAME)}{$thumbnail.NAME|truncate:20:" [...]"|@replace:'"':' '}{/if}">
+                                <img {if $derivative->is_cached()}src="{$derivative->get_url()}"{else}src="{$ROOT_URL}{$themeconf.img_dir}/ajax-loader-big.gif" data-src="{$derivative->get_url()}"{/if}  alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}" >
                         </a>
         </li>