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         var lb = document.getElementById('lightbox');
  89         new Lightbox(lb);
  90         new DDFileUploader(lb);
  91       })();
  92       // -->
  93       </script>
  94     </div>
  95
  96
  97     <div metal:define-macro="film_bar" tal:omit-tag="">
  98       <div id="film_bar">
  99         <table cellspacing="0">
 100           <tr tal:define="slide_size python:portal_object.thumb_height/2 + 10">
 101             <td tal:repeat="info contextInfos/infos">
 102                 <a href="." tal:attributes="href info/href;
 103                                             class info/className;
 104                                             portfolio:position info/index"
 105                   ><img
 106                      tal:define="size info/thumbSize;
 107                                  margin_top python:(slide_size - size['height']) / 2"
 108                      tal:attributes="src    info/src;
 109                                      alt    info/title;
 110                                      height size/height;
 111                                      width  size/width;
 112                                      style  string:margin-top : ${margin_top}px ;"/></a>
 113             </td>
 114           </tr>
 115         </table>
 116       </div>
 117       <div class="jsslider">
 118         <span id="slider"></span>
 119       </div>
 120       <script type="text/javascript" tal:content="python:'''
 121           var startSlideShow, slideShowNext, stopSlideShow;
 122           (function(){
 123
 124             var ctxInfos = {'filmLength': %(filmLength)s
 125                            ,'center': %(center)s
 126                            ,'slideSize': %(slideSize)d
 127                            ,'ctxUrlTranslation' : [%(reBaseCtxUrl)s, %(canonicalUrl)s]
 128                            };
 129             var fs = new FilmSlider(document.getElementById('film_bar'),
 130                            document.getElementById('slider'),
 131                            ctxInfos,
 132                            document.getElementById('medium_image').getElementsByTagName('img')[0],
 133                            document.getElementById('image_toolbar'),
 134                            document.getElementById('Breadcrumbs'));
 135             startSlideShow = function() {return fs.startSlideShow();};
 136             stopSlideShow = function() {return fs.stopSlideShow();};
 137             slideShowPrevious = function() {return fs.slideShowPrevious();};
 138             slideShowNext = function() {return fs.slideShowNext();};
 139             slideShowImageLoaded = function() {return fs.slideShowImageLoaded();};
 140           })();
 141           ''' % {'filmLength': len(contextInfos['infos'])
 142                 ,'center': index
 143                 ,'slideSize': portal_object.thumb_width/2 + 11
 144                 ,'reBaseCtxUrl':contextInfos['reBaseCtxUrl']
 145                 ,'canonicalUrl':contextInfos['canonicalUrl']
 146                 }">
 147       </script>
 148     </div>
 149
 150   </body>
 151 </html>