1: $website.addCss("/info/photo-gallery.css")
2: 
3: $website.include("options")
4: #set ($options = $request.getAttribute("options"))
5: 
6: #if ($page.title.length() > 0)
7:   <h1 class="gallery-title">$page.title</h1>
8: #end
9: 
10: #if ($page.leadIn.length() > 0)
11:  <div class="align-center">
12:   <em>$page.leadIn</em>
13:  </div>
14: #end
15: 
16: #if ($page.contentType.equals("loki/headlines") && $headlines.size() > 0)
17: 
18: #set ($instance = 0)
19: #if ($request.getAttribute("photoGalleryInstance"))
20:   #set ($instance = $request.getAttribute("photoGalleryInstance"))
21: #end
22: #set ($instance = $tool.math.add($instance, 1))
23: $!request.setAttribute("photoGalleryInstance", $instance)
24: #set ($id = "photo-gallery${instance}")
25: 
26: #if ($request.getParameter("id"))
27:   #set ($id = $formatter.escapeXml($request.getParameter("id")))
28: #end
29: 
30: <div id="${id}" class="gallery loadMore grid" itemscope itemtype="http://schema.org/ImageGallery">
31: #foreach ($photo in $headlines)
32: 
33: #set ($storeURL = "")
34: #set ($storeURL = $website.storeURL($photo))
35: #set ($imgAlt = "${page.title} image ${velocityCount}")
36: #if ($photo.altText.length() > 0)
37:   #set ($imgAlt = $photo.altText)
38: #elseif( $photo.title.length() > 0 )
39:     #set ($imgAlt = $photo.title)
40: #end
41: 
42:     <figure class="block thumbnail grid-item" itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
43:         <div class="gal-wrapper">
44:             <a href="$photo.url" data-thumb="${photo.url}?max_width=500" data-caption="$photo.title" data-width="1200" data-height="900" itemprop="contentUrl">
45:                 <img itemprop="thumbnail" src="/info/images/spacer.gif" alt="$imgAlt" class="masgal">
46:             </a>
47:             #if ($storeURL.length() > 0)
48:             <button data-url="$storeURL" class="buynow-link btn btn-primary" title="View this item in photo store." aria-label="open this item in photo store">Buy Now</button>
49:             #end
50:         #if ($options.get("photo_gallery_hide_photo_tags") != "true" && $photo.taggedPlayers.size() > 0)
51:             <ul class="tag-list clearfix">
52:                 #foreach ($playerBio in $photo.taggedPlayers)
53:                     <li><a href="$playerBio.url?view=photos" aria-label="$playerBio.firstName $playerBio.lastName: full bio">$playerBio.firstName $playerBio.lastName</a></li>
54:                 #end
55:             </ul>
56:         #end
57:         
58:         #if( $photo.title.length() > 0 )
59:             <figcaption class="figure-caption small clamp-2 image-caption-overlay">$photo.title</figcaption>
60:         #end
61: 
62:         #if( $formatter.formatDate($photo.date, "MMM dd, yyyy").length() > 0 )
63:         <span class="photo-date small">$formatter.formatDate($photo.date, "MMM dd, yyyy")</span>
64:         #end
65: 
66:         </div>
67:         
68:     </figure>
69: 
70: #end
71: </div>
72: 
73: 
74: <link rel="stylesheet" href="/info/photogallery/css/photoswipe-min-4.1.3.css">
75: <link rel="stylesheet" href="/info/photogallery/css/photoswipe-default-skin-min-4.1.3.css">
76: <script src="/info/photogallery/js/imagesloaded-min-4.1.4.js"></script>
77: <script src="/info/photogallery/js/masonry-min-4.2.2.js"></script>
78: <script src="/info/photogallery/js/photoswipe-min-4.1.0.js"></script>
79: <script src="/info/photogallery/js/photoswipe-ui-default-min-4.1.0.js"></script>
80: <script src="/info/photogallery/js/gallery-load-more.js"></script>
81: <script src="/info/photogallery/js/init-gallery.js"></script>
82: 
83: #if ($request.getParameter("ajax") == true)
84:   $website.decorate("")
85: #end
86: 
87: #else ## contentType is not headlines or size equals 0
88: 
89: <div>No photos featured in this gallery</div>
90: 
91: #end
92: 
93:   <div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
94:       <div class="pswp__bg"></div>
95:       <div class="pswp__scroll-wrap">
96:           <div class="pswp__container">
97:               <div class="pswp__item"></div>
98:               <div class="pswp__item"></div>
99:               <div class="pswp__item"></div>
100:           </div>
101:           <div class="pswp__ui pswp__ui--hidden">
102:               <div class="pswp__top-bar">
103:                   <div class="pswp__counter"></div>
104:                   <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
105:                   <button class="pswp__button pswp__button--share" title="Share"></button>
106:                   <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
107:                   <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
108:                   <div class="pswp__preloader">
109:                       <div class="pswp__preloader__icn">
110:                         <div class="pswp__preloader__cut">
111:                           <div class="pswp__preloader__donut"></div>
112:                         </div>
113:                       </div>
114:                   </div>
115:               </div>
116:               <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
117:                   <div class="pswp__share-tooltip"></div> 
118:               </div>
119:               <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
120:               </button>
121:               <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
122:               </button>
123:               <div class="pswp__caption">
124:                   <div class="pswp__caption__center text-center"></div>
125:               </div>
126:           </div>
127:       </div>
128:   </div>