skins/photo_layout_macros.pt

   1 <html xmlns:tal="http://xml.zope.org/namespaces/tal" xmlns:metal="http://xml.zope.org/namespaces/metal">
   2   <head>
   3     <title>Display macros for arbitrary set of photos</title>
   4     <meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
   5   </head>
   6   <body>
   7     <div metal:define-macro="grid"
   8          tal:define="slide_size portal_object/slide_size;"
   9          i18n:domain="portfolio">
  10       <div metal:use-macro="here/batch_macros/macros/navigation">batch navigation</div>
  11       <div id="lightbox" class="lightbox photo-drop-target">
  12         <span tal:repeat="info infos" tal:omit-tag="">
  13           <span tal:define="size info/thumbSize;
  14                             margin_top python:(slide_size - size['height']) / 2;
  15                             margin_left python:(slide_size - size['width']) / 2;
  16                             selected info/selected|nothing"
  17                 tal:attributes="class info/className;
  18                                 name info/cmf_uid">
  19             <a class="slide" tal:attributes="href info/href; title info/title">
  20               <img border="0" tal:attributes="src info/thumbUrl;
  21                                  alt info/title;
  22                                  height size/height;
  23                                  width size/width;
  24                                  style string:margin-top : ${margin_top}px ;;margin-left:${margin_left}px;"/>
  25             </a>
  26             <tal:block tal:condition="python:features.has_key('select')">
  27               <span class="button slide-select" tal:condition="not:selected">
  28                 <a name="add_to_selection" title="Add to selection" i18n:attributes="title"
  29                    tal:attributes="href python:features['select'](info['o'], False)">
  30                   <img tal:attributes="src string:${portal_url}/transparent.gif" height="17" width="12"
  31                        alt="Add to selection" i18n:attributes="alt"/>
  32                   </a>
  33               </span>
  34               <span class="button slide-deselect" tal:condition="selected">
  35                 <a name="remove_to_selection" title="Remove to selection" i18n:attributes="title"
  36                    tal:attributes="href python:features['select'](info['o'], True)">
  37                   <img tal:attributes="src string:${portal_url}/transparent.gif" height="17" width="12"
  38                        alt="Remove to selection" i18n:attributes="alt"/>
  39                   </a>
  40               </span>
  41             </tal:block>
  42             <span class="button slide-cart" tal:condition="python:info.get('buyable')">
  43               <a name="add_to_cart" title="Add to cart" i18n:attributes="title"
  44                  tal:attributes="href python:features['cart'](info['o'])">
  45                 <img tal:attributes="src string:${portal_url}/transparent.gif" height="17" width="20"
  46                      alt="Add to cart" i18n:attributes="alt"/>
  47                 </a>
  48             </span>
  49             <span class="button slide-del" tal:condition="python:features.has_key('del')">
  50               <a title="Delete" i18n:attributes="title"
  51                  tal:attributes="href python:features['del'](info['o'])">
  52                 <img tal:attributes="src string:${portal_url}/transparent.gif" height="19" width="18"
  53                      alt="Delete" i18n:attributes="alt"/>
  54                 </a>
  55             </span>
  56             <tal:block tal:condition="features/hideAnonymous|nothing">
  57               <span class="button slide-hide" tal:condition="not:info/hiddenForAnonymous"
  58                     tal:define="mtop python:margin_top + 4;
  59                                 mleft python:margin_left + size['width'] - 17"
  60                     tal:attributes="style python:'margin-top:%dpx;; margin-left:%dpx' % (mtop, mleft)">
  61                 <a title="Hide for anonymous" i18n:attributes="title"
  62                    name="hide_for_anonymous"
  63                    tal:attributes="href string:${info/href}/hideForAnonymous">
  64                   <img tal:attributes="src string:${portal_url}/transparent.gif" height="15" width="16"
  65                        alt="Hide for anonymous" i18n:attributes="alt"/>
  66                 </a>
  67               </span>
  68               <span class="button slide-show" tal:condition="info/hiddenForAnonymous"
  69                     tal:define="mtop python:margin_top + 4;
  70                                 mleft python:margin_left + size['width'] - 17"
  71                     tal:attributes="style python:'margin-top:%dpx;; margin-left:%dpx' % (mtop, mleft)">
  72                 <a title="Show for anonymous" i18n:attributes="title"
  73                    name="show_for_anonymous"
  74                    tal:attributes="href string:${info/href}/resetHide">
  75                   <img tal:attributes="src string:${portal_url}/transparent.gif" height="15" width="16"
  76                        alt="Show for anonymous" i18n:attributes="alt"/>
  77                 </a>
  78               </span>
  79             </tal:block>
  80           </span>
  81         </span>
  82       </div>
  83       <br clear="all"/>
  84       <div metal:use-macro="here/batch_macros/macros/navigation">batch navigation</div>
  85       <script type="text/javascript">
  86       // <!--
  87       (function(){
  88         new Lightbox(document.getElementById('lightbox'));
  89       })();
  90       // -->
  91       </script>
  92     </div>
  93
  94
  95     <div metal:define-macro="film_bar" tal:omit-tag="">
  96       <div id="film_bar">
  97         <table cellspacing="0">
  98           <tr tal:define="slide_size python:portal_object.thumb_height/2 + 10">
  99             <td tal:repeat="info contextInfos/infos">
 100                 <a href="." tal:attributes="href info/href;
 101                                             class info/className;
 102                                             portfolio:position info/index"
 103                   ><img
 104                      tal:define="size info/thumbSize;
 105                                  margin_top python:(slide_size - size['height']) / 2"
 106                      tal:attributes="src    info/src;
 107                                      alt    info/title;
 108                                      height size/height;
 109                                      width  size/width;
 110                                      style  string:margin-top : ${margin_top}px ;"/></a>
 111             </td>
 112           </tr>
 113         </table>
 114       </div>
 115       <div class="jsslider">
 116         <span id="slider"></span>
 117       </div>
 118       <script type="text/javascript" tal:content="python:'''
 119           var startSlideShow, slideShowNext, stopSlideShow;
 120           (function(){
 121
 122             var ctxInfos = {'filmLength': %(filmLength)s
 123                            ,'center': %(center)s
 124                            ,'slideSize': %(slideSize)d
 125                            ,'ctxUrlTranslation' : [%(reBaseCtxUrl)s, %(canonicalUrl)s]
 126                            };
 127             var fs = new FilmSlider(document.getElementById('film_bar'),
 128                            document.getElementById('slider'),
 129                            ctxInfos,
 130                            document.getElementById('medium_image').getElementsByTagName('img')[0],
 131                            document.getElementById('image_toolbar'),
 132                            document.getElementById('Breadcrumbs'));
 133             startSlideShow = function() {return fs.startSlideShow();};
 134             stopSlideShow = function() {return fs.stopSlideShow();};
 135             slideShowPrevious = function() {return fs.slideShowPrevious();};
 136             slideShowNext = function() {return fs.slideShowNext();};
 137             slideShowImageLoaded = function() {return fs.slideShowImageLoaded();};
 138           })();
 139           ''' % {'filmLength': len(contextInfos['infos'])
 140                 ,'center': index
 141                 ,'slideSize': portal_object.thumb_width/2 + 11
 142                 ,'reBaseCtxUrl':contextInfos['reBaseCtxUrl']
 143                 ,'canonicalUrl':contextInfos['canonicalUrl']
 144                 }">
 145       </script>
 146     </div>
 147
 148   </body>
 149 </html>