Setting up members

update members to work with the site.
Adding in photoswipe for member photos

diff --git a/Toolkit/Members/ProfileWriter.php b/Toolkit/Members/ProfileWriter.php
index d193f64..a94b512 100644 (file)
--- a/Toolkit/Members/ProfileWriter.php
+++ b/Toolkit/Members/ProfileWriter.php
@@ -199,14 +199,18 @@ class Toolkit_Members_ProfileWriter implements SplSubject
      */
        public function toHtml(Toolkit_Members_ProfilePage $profile)
        {
-               $GLOBALS['bottomScripts'][]
-                       = MEDIA_APP_BASE_URL . 'gallery/thickbox-3.1.1.js';
+               //$GLOBALS['bottomScripts'][]
+                       //= MEDIA_APP_BASE_URL . 'gallery/thickbox-3.1.1.js';
                $GLOBALS['bottomScripts'][]
                        = MEDIA_BASE_URL . 'Toolkit/Members/libjs/business-detail.js';
 
                $GLOBALS['styleSheets'][] = MEDIA_BASE_URL . 'Toolkit/Members/css/member.css';
-               $GLOBALS['styleSheets'][] = MEDIA_APP_BASE_URL . 'gallery/gallery.css';
-               $GLOBALS['styleSheets'][] = MEDIA_APP_BASE_URL . 'gallery/thickbox.css';
+               //$GLOBALS['styleSheets'][] = MEDIA_APP_BASE_URL . 'gallery/gallery.css';
+               //$GLOBALS['styleSheets'][] = MEDIA_APP_BASE_URL . 'gallery/thickbox.css';
+        $GLOBALS['styleSheets'][] = BASE_URL . 'photoswipe/photoswipe.css';
+        $GLOBALS['bottomScripts'][] = BASE_URL . 'photoswipe/lib/klass.min.js';
+        $GLOBALS['bottomScripts'][] = BASE_URL . 'photoswipe/code.photoswipe.jquery-3.0.5.js';
+        $GLOBALS['bottomScripts'][] = BASE_URL . 'js/photoGallery.js';
 
                $profileCache = "Member-{$profile->getMemberId()}";
                $out = $this->_cache->get($profileCache, 'Profile');

diff --git a/Toolkit/Members/templates/memberDetail.tpl b/Toolkit/Members/templates/memberDetail.tpl
index e13e130..98663b8 100644 (file)
--- a/Toolkit/Members/templates/memberDetail.tpl
+++ b/Toolkit/Members/templates/memberDetail.tpl
@@ -168,13 +168,17 @@ catid="catid"
         {end:}
     </div>
 
-    <div flexy:if="photos" id="photo-gallery">
-        <h2>Photo Gallery</h2>
-        <div flexy:foreach="photos,v" class="thumb {v[class]:h}">
-            <a class="thickbox" title="{v[alt]:h}" rel="gallery-photos" href="{v[id]:h}">
-                <img alt="{v[alt]:h}" src="{v[src]:h}">
-            </a>
-        </div>
+    <div id="photo_wrapper" flexy:if="photos" class="small-12 columns">
+        <h3>Photo Gallery</h3>
+        <ul id="Gallery" class="gallery">
+            {foreach:photos,photo}
+            <li>
+                <a class="photoimg" href="{photo[id]:h}" title="{photo[alt]}" rel="{photo[description]}">
+                <img src="{photo[src]}" alt="{photo[alt]}">
+                {if:photo[alt]}<span class="phototitle">{photo[alt]}</span>{end:}</a>
+            </li>
+            {end:}
+        </ul>
     </div>
 
     <div flexy:if="golf_info" class="member-golf-result">

diff --git a/Toolkit/Members/templates/membersList.tpl b/Toolkit/Members/templates/membersList.tpl
index f269b5a..0d2a005 100644 (file)
--- a/Toolkit/Members/templates/membersList.tpl
+++ b/Toolkit/Members/templates/membersList.tpl
@@ -20,7 +20,9 @@
 
     <div flexy:foreach="recordSet,k,row" class="search-result-item vcard small-12 columns">
 
-        <div class="memberSR">
+
+        <h2 class="fn org text-left"><a title="More Info" href="{row[url]:h}">{row[member_name]:h}</a></h2>
+        <div class="memberSR right">
             {if:row[addToLink]}
                 <a id="add-{row[member_id]}" class="list-add-link" rel="{row[member_id]}" flexy:if="row[plink]" title="Add to Your Travel List" href="{row[plink]:h}">
                     <img alt="Add to Your Travel List" src="baseurl/assets/addto.gif">
@@ -34,8 +36,6 @@
                 <img class="search-result-img" alt="{row[logo]}" src="{row[logo]}">
             {end:}
         </div><!-- /.memberSR -->
-
-        <h2 class="fn org text-left"><a title="More Info" href="{row[url]:h}">{row[member_name]:h}</a></h2>
         <div class="search-result-item-info">
             {if:row[map_icon]}
                 <div class="map-link right" rel="{row[map_icon][id]}">
@@ -85,7 +85,7 @@
     </div>
 
 {getPaging():h}
-<div flexy:if="letters" class="business-first-letter">
+<div flexy:if="letters" class="business-first-letter small-12 columns">
     <div>Narrow result by letter:</div>
     <a flexy:foreach="letters,k,v" class="{v[class]:h}" href="{v[url]:h}">{k}</a>
 </div>

diff --git a/js/photoGallery.js b/js/photoGallery.js
new file mode 100755 (executable)
index 0000000..044ed74
--- /dev/null
+++ b/js/photoGallery.js
@@ -0,0 +1,79 @@
+(function(window, PhotoSwipe){
+   if ($(".photoimg").length > 0) {
+               if(document.addEventListener) {
+                       document.addEventListener('DOMContentLoaded', function(){
+                       var
+                               options = {
+                                       getImageCaption: function(el){
+                                               var captionText, captionDesc, captionId, captionEl;
+                                               if (el.nodeName === "A") {
+                                                       captionText = el.getAttribute('title');
+                                                       captionDesc = el.getAttribute('rel');
+                                                       captionId = el.getAttribute('data-photoid');
+                                               }
+                                               // Return a DOM element with custom styling
+                                               if((captionText != null && captionText != "") || (captionDesc != null && captionDesc != "")) {
+                                                       captionEl = document.createElement('div');
+                                                       captionEl.className = 'captionWrapper';
+                                                       // Add Caption Title.
+                                                       if(captionText != null && captionText != "") {
+                                                               captionTitleOutput = document.createElement('h2');
+                                                               captionTitleOutput.className = "captionTitleWrapper";
+                                                               captionTitleOutput.appendChild(document.createTextNode(captionText));
+                                                               captionEl.appendChild(captionTitleOutput);
+                                                       }
+                                                       // Add Caption Description.
+                                                       if(captionDesc != null && captionDesc != "") {
+                                                               captionDescOutput = document.createElement('p');
+                                                               captionDescOutput.className = "captionDescWrapper";
+                                                               captionDescOutput.appendChild(document.createTextNode(captionDesc));
+                                                               captionEl.appendChild(captionDescOutput);
+                                                       }
+                                               } else {
+                                                       captionEl = "";
+                                               }
+                                               return captionEl;
+                                       }, captionAndToolbarAutoHideDelay:0, imageScaleMethod: "fitNoUpscale", captionAndToolbarFlipPosition: true, backButtonHideEnabled: true
+                               },
+                               instance = PhotoSwipe.attach( window.document.querySelectorAll('a.photoimg'), options );
+                       }, false);
+               } else { // You are using IE8- and you should feel bad.
+                       document.attachEvent('onreadystatechange', function(){
+                       var
+                               options = {
+                                       getImageCaption: function(el){
+                                               var captionText, captionDesc, captionId, captionEl;
+                                               if (el.nodeName === "A") {
+                                                       captionText = el.getAttribute('title');
+                                                       captionDesc = el.getAttribute('rel');
+                                                       captionId = el.getAttribute('data-photoid');
+                                               }
+                                               // Return a DOM element with custom styling
+                                               if((captionText != null && captionText != "") || (captionDesc != null && captionDesc != "")) {
+                                                       captionEl = $('<div style="display: block;width: 100%;overflow: hidden;"></div>');
+                                                       captionEl.addClass = 'captionWrapper';
+                                                       // Add Caption Title.
+                                                       if(captionText != null && captionText != "") {
+                                                               captionTitleOutput = $('<h2 style="display: block;width: 50%;float: left;font-size: 18px;font-weight: bold;color: #FFF;text-align: left;padding: 10px 20px;margin: 0;"></h2>');
+                                                               captionTitleOutput.addClass = "captionTitleWrapper";
+                                                               captionTitleOutput.append(captionText);
+                                                               captionEl.append(captionTitleOutput);
+                                                       }
+                                                       // Add Caption Description.
+                                                       if(captionDesc != null && captionDesc != "") {
+                                                               captionDescOutput = $('<p style="display: block;width: 50%;float: left;clear: left;font-size: 14px;color: #FFF;text-align: left;padding: 0 20px 10px 20px;margin: 0;"></p>');
+                                                               captionDescOutput.addClass = "captionDescWrapper";
+                                                               captionDescOutput.append(document.createTextNode(captionDesc));
+                                                               captionEl.append(captionDescOutput);
+                                                       }
+                                               } else {
+                                                       captionEl = "";
+                                               }
+                                               return captionEl;
+                                       }, captionAndToolbarAutoHideDelay:0, imageScaleMethod: "fitNoUpscale", captionAndToolbarFlipPosition: true, backButtonHideEnabled: true
+                               },
+                               instance = PhotoSwipe.attach( window.document.querySelectorAll('a.photoimg'), options );
+                       }, false);
+               }
+       }
+}(window, window.Code.PhotoSwipe));
\ No newline at end of file