Changeset 11217 for extensions/Front2Back/template/Front2Back.tpl

Timestamp:

Jun 3, 2011, 1:57:17 PM (13 years ago)

Author:

mistic100

Message:

clean code, add some options

File:

• extensions/Front2Back/template/Front2Back.tpl (modified) (1 diff)

extensions/Front2Back/template/Front2Back.tpl

@@ -1 @@
-{combine_css path=$F2B_PATH|@cat:"template/Front2Back.css"}
+{combine_css path=$F2B_PATH|@cat:"template/style.css"}
+{combine_script id="jquery" load="header" path = "themes/default/js/jquery.min.js"}
 
 {footer_script require="jquery"}
-        jQuery('.reverse').click(function() {ldelim}
-                if (jQuery(this).attr('name') == 'front') {ldelim}
-                        /* picture attributes */
-                        jQuery('#theImage img:first-child').attr({ldelim}
-                                src: '{$VERSO_URL}',
-                                style: 'width:;height:;',
-                        });
-                        
-                        /* hd link atributes */
-                        {if isset($VERSO_HD)}
-                        jQuery('#theImage a:first-child').attr({ldelim}
-                                href: "javascript:phpWGOpenWindow('{$VERSO_HD}','{$high.UUID}','scrollbars=yes,toolbar=no,status=no,resizable=yes')"
-                        });
-                        {/if}
-                        
-                        /* f2b link content */
-                        jQuery(this).html('<img src="{$F2B_PATH}template/rotate_2.png"/> {'Front2Back_front'|@translate}');
-                        jQuery(this).attr('name', 'back');
-                        
-                } else if (jQuery(this).attr('name') == 'back') {ldelim}
-                        jQuery('#theImage img:first-child').attr({ldelim}
-                                src: '{$SRC_IMG}',
-                                style: 'width:{$WIDTH_IMG}px;height:{$HEIGHT_IMG}px;',
-                        });
-                        
-                        {if isset($VERSO_HD)}
-                        jQuery('#theImage a:first-child').attr({ldelim}
-                                href: "javascript:phpWGOpenWindow('{$high.U_HIGH}','{$high.UUID}','scrollbars=yes,toolbar=no,status=no,resizable=yes')')"
-                        });
-                        {/if}
-                        
-                        jQuery(this).html('<img src="{$F2B_PATH}template/rotate_1.png"/> {'Front2Back_back'|@translate}');
-                        jQuery(this).attr('name', 'front');
-                }
-        });
+jQuery(document).ready(function () {ldelim}
+
+{if $F2B_switch_mode == 'click'}
+  jQuery('.reverse').click(function() {ldelim}
+    if (jQuery(this).attr('rel') == 'front') {ldelim}
+{else}
+  jQuery('.reverse').hover(function() {ldelim}
+{/if}
+
+      /* picture switch */
+    {if $F2B_transition == 'fade'}
+      jQuery('img[alt="{$ALT_IMG}"]').animate({ldelim}
+        opacity:0
+      }, 400, function() {ldelim}
+        jQuery(this).attr({ldelim}
+          src: '{$VERSO_URL}',
+          style: 'max-width:{$WIDTH_IMG}px;max-height:{$HEIGHT_IMG}px;',
+        });
+        jQuery(this).animate({ldelim}
+          opacity:1
+        }, 400);
+      });
+    {else}
+      jQuery('img[alt="{$ALT_IMG}"]').attr({ldelim}
+        src: '{$VERSO_URL}',
+        style: 'max-width:{$WIDTH_IMG}px;max-height:{$HEIGHT_IMG}px;',
+      });
+    {/if}
+
+    {if $F2B_switch_mode == 'click'}
+      /* hd link */
+      {if isset($VERSO_HD)}
+      jQuery('img[alt="{$ALT_IMG}"]').parent().attr({ldelim}
+        href: "javascript:phpWGOpenWindow('{$VERSO_HD}','{$high.UUID}','scrollbars=yes,toolbar=no,status=no,resizable=yes')"
+      });
+      {/if}
+      
+      /* f2b link content */
+      jQuery(this).html('<img src="{$F2B_PATH}template/rotate_2.png"/> {$F2B_see_front}');
+      jQuery(this).attr('rel', 'back');
+    {/if}
+      
+{if $F2B_switch_mode == 'click'}
+    } else if (jQuery(this).attr('rel') == 'back') {ldelim}
+{else}
+  }, function() {ldelim}
+{/if} 
+      /* picture switch */
+    {if $F2B_transition == 'fade'}
+      jQuery('img[alt="{$ALT_IMG}"]').animate({ldelim}
+        opacity:0
+      }, 400, function() {ldelim}
+        jQuery(this).attr({ldelim}
+          src: '{$SRC_IMG}',
+          style: 'width:{$WIDTH_IMG}px;height:{$HEIGHT_IMG}px;',
+        });
+        jQuery(this).animate({ldelim}
+          opacity:1
+        }, 400);
+      });
+    {else}
+      jQuery('img[alt="{$ALT_IMG}"]').attr({ldelim}
+        src: '{$SRC_IMG}',
+        style: 'width:{$WIDTH_IMG}px;height:{$HEIGHT_IMG}px;',
+      });
+    {/if}
+    
+    {if $F2B_switch_mode == 'click'}
+       /* hd link */
+      {if isset($high.U_HIGH)}
+      jQuery('img[alt="{$ALT_IMG}"]').parent().attr({ldelim}
+        href: "javascript:phpWGOpenWindow('{$high.U_HIGH}','{$high.UUID}','scrollbars=yes,toolbar=no,status=no,resizable=yes')"
+      });
+      {/if}
+      
+      /* f2b link content */
+      jQuery(this).html('<img src="{$F2B_PATH}template/rotate_1.png"/> {$F2B_see_back}');
+      jQuery(this).attr('rel', 'front');
+    {/if}
+    
+{if $F2B_switch_mode == 'click'}
+    }
+  });
+{else}
+  });
+{/if} 
+  
+});
 {/footer_script}
 
-<a class="reverse" name="front">
-        <img src="{$F2B_PATH}template/rotate_1.png"/>
-        {'Front2Back_back'|@translate}
+<img src="{$VERSO_URL}" style="display:none;"/> {* <!-- force preload the verso --> *}
+
+{if $F2B_position != 'toolbar'}<div>{/if}
+<a class="reverse" rel="front" {if $F2B_position == 'toolbar'}style="border:none !important;"{/if} {if $F2B_switch_mode == 'hover'}href="javascript:phpWGOpenWindow('{$VERSO_HD}','{$high.UUID}','scrollbars=yes,toolbar=no,status=no,resizable=yes')"{/if}>
+  <img src="{$F2B_PATH}template/rotate_1.png"/> {$F2B_see_back}
 </a>
+{if $F2B_position != 'toolbar'}</div>{/if}