Offsite images, grid and list view updated and fixed
authorlaury <laury@gaslightmedia.com>
Fri, 13 May 2016 14:22:46 +0000 (10:22 -0400)
committerlaury <laury@gaslightmedia.com>
Fri, 13 May 2016 14:22:46 +0000 (10:22 -0400)
assets/offsite-link_blk.png [new file with mode: 0644]
assets/offsite-link_gry.png [new file with mode: 0644]
assets/offsite-link_wht.png [new file with mode: 0644]
controllers/front.php
css/front.css
js/shortcodeBuilder.js
models/front/members/list.php
nbproject/private/private.xml [new file with mode: 0644]
setup/shortcodes.php
views/front/members/grid.html
views/front/members/list.html

diff --git a/assets/offsite-link_blk.png b/assets/offsite-link_blk.png
new file mode 100644 (file)
index 0000000..b448cd8
Binary files /dev/null and b/assets/offsite-link_blk.png differ
diff --git a/assets/offsite-link_gry.png b/assets/offsite-link_gry.png
new file mode 100644 (file)
index 0000000..f90d751
Binary files /dev/null and b/assets/offsite-link_gry.png differ
diff --git a/assets/offsite-link_wht.png b/assets/offsite-link_wht.png
new file mode 100644 (file)
index 0000000..e4b23d5
Binary files /dev/null and b/assets/offsite-link_wht.png differ
index 61d1201..6205079 100644 (file)
@@ -53,7 +53,6 @@ class glmMembersFront extends GlmPluginSupport
 
         // Now add any shortcodes from the config 'shortcodes' table
         while (list($key, $val) = each($this->config['shortcodes'])) {
-
             add_shortcode($key,
                 array(
                     $this,
index 576ce32..7acdc9b 100644 (file)
     top: 0;
     margin: 0;
     border-radius: 4px;
-}
-#glm-member-list-map-toggle {
-    
 }
 .glm-member-db-list-grid-view.map-closed #glm-member-list-map-toggle:before {
     content: "View ";
 }
+.glm-member-db-list-view.map-closed #glm-member-list-map-toggle:before {
+    content: "View ";
+}
 .glm-member-db-list-grid-view.map-opened #glm-member-list-map-toggle:before {
     content: "Hide ";
 }
-.glm-member-db-list-grid-view #glm-locationMap-container {
-    
+.glm-member-db-list-view.map-opened #glm-member-list-map-toggle:before {
+    content: "Hide ";
 }
 .glm-member-db-list-grid-view .glm-member-list-listing-container {
     transition: all 0.5s;
     margin-bottom: 40px;
     overflow: hidden;
 }
+.glm-member-db-list-view #glm-locationMap-container  {
+    margin-bottom: 40px;
+    overflow: hidden;
+}
 .glm-member-db-list-grid-view.map-closed #glm-locationMap-container {
     margin-bottom: 0;
     height: 0;
 }
-.glm-member-db-list-grid-view.map-closed #glm-locationMap-container #glm-locationMap {
-}
-.glm-member-db-list-grid-view.map-opened #glm-locationMap-container {
-    
+.glm-member-db-list-view.map-closed #glm-locationMap-container {
+    margin-bottom: 0;
+    height: 0;
 }
 .glm-member-list-sub-links {
     color: black;
 /*    text-align: right;*/
 }
 #glm-directions,
-.glm-member-entry-container.glm-member-search {
+.glm-member-db-list-grid-view .glm-member-entry-container.glm-member-search {
     margin-top: 0;
 }
+.glm-member-db-list-view .glm-member-entry-container.glm-member-search {
+    margin-top: 50px;
+}
 .glm-member-entry-container {
     border: 1px #ccc solid;
     padding: .4em;
     text-align: center;
     padding: 15px;
 }
+#glm-member-detail-website-link a:before {
+    //content: url("../assets/offsite-link_wht.png");
+    background-image: url("../assets/offsite-link_wht.png");
+    background-repeat: no-repeat;
+    background-size: contain;
+    content: " ";
+    display: inline-block;
+    height: 15px;
+    margin-right: 10px;
+    width: 15px;
+    
+}
 #glm-member-detail-website-link a {
     color: white;
 }
index ed2cb81..34b0be1 100644 (file)
@@ -39,7 +39,7 @@ jQuery(document).ready(function ($) {
             $("#blank-start-scDropdown").show();
             $("#id-scDropdown").hide();
             $("#view-scDropdown").show();
-            $("#map-collapsed-scDropdown").show();
+            $("#map-opened-scDropdown").show();
             $("[id^='packageList']").hide();
         }
         
index 09c23bd..2eaec5f 100644 (file)
@@ -434,14 +434,14 @@ class GlmMembersFront_members_list extends GlmDataMemberInfo
         }
 
         /*
-         * Check for which view file to use, else default to bars
+         * Check for which view file to use, else default to list
          */
         $view = "front/members/list.html";
         if (isset($actionData['request']['view']) &&
             strtolower($actionData['request']['view']) == "grid") {
             $view = "front/members/grid.html";
         }
-        
+      
         /*
          * Check for a blank start - No members selected, just search form
          */
@@ -519,4 +519,4 @@ class GlmMembersFront_members_list extends GlmDataMemberInfo
 
 }
 
-?>
\ No newline at end of file
+?>
diff --git a/nbproject/private/private.xml b/nbproject/private/private.xml
new file mode 100644 (file)
index 0000000..4750962
--- /dev/null
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project-private xmlns="http://www.netbeans.org/ns/project-private/1">
+    <editor-bookmarks xmlns="http://www.netbeans.org/ns/editor-bookmarks/2" lastBookmarkId="0"/>
+</project-private>
index b7dc61f..64f774b 100644 (file)
@@ -241,12 +241,12 @@ $glmMembersShortcodesDescription = '
                     <tr><td>all</td><td>none</td></tr>
                     <tr><th colspan=3">Map Options</th></tr>
                     <tr><td>map</td><td>map-name-link</td><td>map-logo</td></tr>
-                    <tr><td>map-collapsed</td><td>map-collapsed</td><td>map-collapsed</td></tr>
-                    <tr><td>map-description</td><td>map-short-description</td><td>map-address</td></tr>
-                    <tr><td>map-street</td><td>map-city-state-zip</td><td>map-country</td></tr>
-                    <tr><td>map-region</td><td>map-phone</td><td>map-toll-free</td></tr>
-                    <tr><td>map-url</td><td>map-url-new-target</td><td>map-email</td></tr>
-                    <tr><td>map-categories</td><td>map-credit-cards</td><td>map-amenities</td></tr>
+                    <tr><td>map-opened</td><td>map-description</td><td>map-short-description</td></tr>
+                    <tr><td>map-street</td><td>map-city-state-zip</td><td>map-address</td></tr>
+                    <tr><td>map-region</td><td>map-phone</td><td>map-country</td></tr>
+                    <tr><td>map-url</td><td>map-url-new-target</td><td>map-toll-free</td></tr>
+                    <tr><td>map-categories</td><td>map-credit-cards</td><td>map-email</td></tr>
+                    <tr><td>map-amenities</td></tr>
                     <tr><th colspan=3">Search Form Options</th></tr>
                     <tr><td>search</td><td>search-text</td><td>search-categories</td></tr>
                     <tr><td>search-amenities</td><td>search-alpha</td></tr>
index 3574086..6141d31 100644 (file)
@@ -2,6 +2,7 @@
     {if $settings.list_show_map_opened}map-opened{else}map-closed{/if}
     {if $settings.list_show_search_filters_opened}filters-opened{else}filters-closed{/if}
 ">
+    <div id="testdiv">---testdiv---{if $settings.view.value}$settings.view.value{else}null{/if}---testdiv---</div>
 {include file='front/members/header.html'}
 
         {apply_filters('glm-member-db-front-members-list-pageTop', '')}
             <form action="{$thisUrl}?glm_action=list" method="post" enctype="multipart/form-data">
                 <div class="small-12 columns glm-member-search glm-member-entry-container glm-member-container">
                     {apply_filters('glm-member-db-front-members-list-searchFormTop', '')}
+                    <div>
+                        <h3>Filter {$terms.term_member_cap}s</h3>
+                    </div>
+                    {if $settings.list_show_search_category}
                         <div>
-                            <h3>Filter {$terms.term_member_cap}s</h3>
+                            {$terms.term_member_cap} Category:
+                            <select name="categorySearch" id="categorySelect">
+                            {if !$singleCategory}
+                                <option value="">(all)</option>
+                            {/if}
+                            {foreach from=$categories item=v}
+                                <option value="{$v.id}"{if $v.default} selected="selected"{/if}>
+                                    {if $v.parent}&nbsp;&nbsp;&nbsp;&nbsp;{/if}{$v.name}
+                                </option>
+                            {/foreach}
+                            </select>
                         </div>
-                        {if $settings.list_show_search_category}
-                            <div>
-                                {$terms.term_member_cap} Category:
-                                <select name="categorySearch" id="categorySelect">
-                                {if !$singleCategory}
-                                    <option value="">(all)</option>
-                                {/if}
-                                {foreach from=$categories item=v}
-                                    <option value="{$v.id}"{if $v.default} selected="selected"{/if}>
-                                        {if $v.parent}&nbsp;&nbsp;&nbsp;&nbsp;{/if}{$v.name}
+                    {/if}
+                    {if $settings.list_show_search_amenities}
+                        <div>
+                            {$terms.term_member_cap} Amenity:
+                            <select name="amenitySearch" id="amenitySelect">
+                                <option value=""></option>
+                                {foreach from=$amenities item=v}
+                                    <option value="{$v.id}" {if $v.default} selected="selected"{/if}>
+                                        {$v.name}
                                     </option>
                                 {/foreach}
-                                    </select>
-                            </div>
-                        {/if}
-                    {if $settings.list_show_search_amenities}
-                            <div>
-                                {$terms.term_member_cap} Amenity:
-                                <select name="amenitySearch" id="amenitySelect">
-                                    <option value=""></option>
-                                    {foreach from=$amenities item=v}
-                                        <option value="{$v.id}" {if $v.default} selected="selected"{/if}>
-                                            {$v.name}
-                                        </option>
-                                    {/foreach}
-                                </select>
-                            </div>
+                            </select>
+                        </div>
                     {/if}
-                    
+
                     {if $settings.list_show_search_text}
                         <div>
                             Text Search: <input type="text" name="textSearch" value="{$textSearch}" class="glm-form-text-input">
     <script type="text/javascript">
         jQuery(document).ready(function($) {
 
-            
-        
-
-        {if $settings.list_show_search}
-            var fixmeTop = $('#glm-member-list-filters-button').offset().top;       // get initial position of the element
-            $(window).scroll(function() {                  // assign scroll event listener
+            // Show search filters box
+            {if $settings.list_show_search}
+                var fixmeTop = $('#glm-member-list-filters-button').offset().top;
+                $(window).scroll(function() { 
 
-                var currentScroll = $(window).scrollTop(); // get current position
+                    var currentScroll = $(window).scrollTop();
 
-                if (currentScroll >= fixmeTop) {           // apply position: fixed if you
-                    if ($(window).width() < 1024) {
-                        $('#glm-member-list-filters-wrapper').css({                      // scroll to that element or below it
-                            position: 'fixed',
-                            top: '5px',
-                            transform: 'translateX(0%)'
-                        });
+                    if (currentScroll >= fixmeTop) {
+                        if ($(window).width() < 1024) {
+                            $('#glm-member-list-filters-wrapper').css({
+                                position: 'fixed',
+                                top: '5px',
+                                transform: 'translateX(0%)'
+                            });
+                        } else {
+                            $('#glm-member-list-filters-wrapper').css({
+                                position: 'fixed',
+                                top: '30px',
+                                transform: 'translateX(0%)'
+                            });
+                        }
                     } else {
-                        $('#glm-member-list-filters-wrapper').css({                      // scroll to that element or below it
-                            position: 'fixed',
-                            top: '30px',
+                        $('#glm-member-list-filters-wrapper').css({
+                            position: 'static',
+                            top: '0',
                             transform: 'translateX(0%)'
                         });
                     }
-                } else {
-                    $('#glm-member-list-filters-wrapper').css({                      // if you scroll above it
-                        position: 'static',
-                        top: '0',
-                        transform: 'translateX(0%)'
-                    });
-                }
-
-            });
-            $(".glm-member-list-filters-toggle").click( function() {
-                $(".glm-member-db-list-grid-view").toggleClass("filters-opened");
-                $(".glm-member-db-list-grid-view").toggleClass("filters-closed");
-            });
-        {/if}
-        {if $settings.list_show_map}
-        
-            $("#glm-member-list-map-toggle").click( function() {
-                $(".glm-member-db-list-grid-view").toggleClass("map-opened");
-                $(".glm-member-db-list-grid-view").toggleClass("map-closed");
-                var currentScroll = $(window).scrollTop(); // get current position
-                var mapTop = $("#glm-locationMap-container").offset().top-10;
-                {if $settings.list_show_search}fixmeTop = $('#glm-member-list-filters-button').offset().top;{/if}
-                if (currentScroll >= mapTop) {
-                    $('body,html').animate({
-                        scrollTop: $("#glm-locationMap-container").offset().top-10
-                    }, 50);
-                } else {
-                    $('body,html').animate({
-                        scrollTop: $("#glm-locationMap-container").offset().top-10
-                    }, 400);
-                }
-            });
-                    /*
-                     * Google Maps
-                     *  API reference: https://developers.google.com/maps/documentation/javascript/reference
-                     */
-
-                    // Create a Google Map object
-                    var map = new google.maps.Map(document.getElementById('glm-locationMap'), {
-                            center: new google.maps.LatLng({$settings.maps_default_lat}, {$settings.maps_default_lon}),
-                            zoom: {$settings.maps_default_zoom},
-                        disableDefaultUI: false,
-                        mapTypeId: google.maps.MapTypeId.MAP,
-                    });
-
-                    var geocoder = new google.maps.Geocoder();
-                    var bounds = new google.maps.LatLngBounds();
-                    var infowindow = new google.maps.InfoWindow();
-
-                    // Try HTML5 to get user geolocation
-                    if(navigator.geolocation) {
-                        navigator.geolocation.getCurrentPosition(function(position) {
-                            var myLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
-                            var pinIcon = new google.maps.MarkerImage(
-                                    'https://maps.google.com/mapfiles/kml/shapes/man.png',
-                                null, /* size is determined at runtime */
-                                null, /* origin is 0,0 */
-                                null, /* anchor is bottom center of the scaled image */
-                                new google.maps.Size(30, 30)
-                            );
-                            var myMarker = new google.maps.Marker({
-                                map: map,
-                                position: myLocation,
-                                draggable: false,
-                                animation: google.maps.Animation.DROP,
-                                title: 'My Location',
-                                icon: pinIcon,
-                                zIndex: 100
-                            });
-                        });
+
+                });
+                $(".glm-member-list-filters-toggle").click( function() {
+                    $(".glm-member-db-list-grid-view").toggleClass("filters-opened");
+                    $(".glm-member-db-list-grid-view").toggleClass("filters-closed");
+                });
+            {/if}
+
+            {if $settings.list_show_map}
+
+                $("#glm-member-list-map-toggle").click( function() {
+                    $(".glm-member-db-list-grid-view").toggleClass("map-opened");
+                    $(".glm-member-db-list-grid-view").toggleClass("map-closed");
+                    var currentScroll = $(window).scrollTop(); // get current position
+                    var mapTop = $("#glm-locationMap-container").offset().top-10;
+                    {if $settings.list_show_search}fixmeTop = $('#glm-member-list-filters-button').offset().top;{/if}
+                    if (currentScroll >= mapTop) {
+                        $('body,html').animate({
+                            scrollTop: $("#glm-locationMap-container").offset().top-10
+                        }, 50);
+                    } else {
+                        $('body,html').animate({
+                            scrollTop: $("#glm-locationMap-container").offset().top-10
+                        }, 400);
                     }
+                });
+                        /*
+                         * Google Maps
+                         *  API reference: https://developers.google.com/maps/documentation/javascript/reference
+                         */
+
+                        // Create a Google Map object
+                        var map = new google.maps.Map(document.getElementById('glm-locationMap'), {
+                                center: new google.maps.LatLng({$settings.maps_default_lat}, {$settings.maps_default_lon}),
+                                zoom: {$settings.maps_default_zoom},
+                            disableDefaultUI: false,
+                            mapTypeId: google.maps.MapTypeId.MAP,
+                        });
 
-            {if $haveMembers}
-                {foreach $members as $m}
-                  {if $m.lat != 0 && $m.lon != 0}
-
-                    // Create a marker for this member
-                    var marker = new google.maps.Marker({
-                        map: map,
-                        position: new google.maps.LatLng({$m.lat}, {$m.lon}),
-                        draggable: false,
-                        animation: google.maps.Animation.DROP,
-                        title: '{$m.member|escape}',
-                        descr: $('#map_info_' + {$m.id}).html(),
-                        memberID: {$m.id}
-                    });
-
-                    // Add a click listener for this marker
-                    marker.addListener('click', function() {
-                            infowindow.setOptions({
-                                    content: this.descr
+                        var geocoder = new google.maps.Geocoder();
+                        var bounds = new google.maps.LatLngBounds();
+                        var infowindow = new google.maps.InfoWindow();
+
+                        // Try HTML5 to get user geolocation
+                        if(navigator.geolocation) {
+                            navigator.geolocation.getCurrentPosition(function(position) {
+                                var myLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
+                                var pinIcon = new google.maps.MarkerImage(
+                                        'https://maps.google.com/mapfiles/kml/shapes/man.png',
+                                    null, /* size is determined at runtime */
+                                    null, /* origin is 0,0 */
+                                    null, /* anchor is bottom center of the scaled image */
+                                    new google.maps.Size(30, 30)
+                                );
+                                var myMarker = new google.maps.Marker({
+                                    map: map,
+                                    position: myLocation,
+                                    draggable: false,
+                                    animation: google.maps.Animation.DROP,
+                                    title: 'My Location',
+                                    icon: pinIcon,
+                                    zIndex: 100
+                                });
                             });
-                        infowindow.open(map,this);
-                    });
+                        }
 
-                    // Extend the map bounds to include this marker
-                    bounds.extend(marker.position);
+                {if $haveMembers}
+                    {foreach $members as $m}
+                      {if $m.lat != 0 && $m.lon != 0}
+
+                        // Create a marker for this member
+                        var marker = new google.maps.Marker({
+                            map: map,
+                            position: new google.maps.LatLng({$m.lat}, {$m.lon}),
+                            draggable: false,
+                            animation: google.maps.Animation.DROP,
+                            title: '{$m.member|escape}',
+                            descr: $('#map_info_' + {$m.id}).html(),
+                            memberID: {$m.id}
+                        });
 
-                 {/if}
-                {/foreach}
+                        // Add a click listener for this marker
+                        marker.addListener('click', function() {
+                                infowindow.setOptions({
+                                        content: this.descr
+                                });
+                            infowindow.open(map,this);
+                        });
 
-                    // Fit map to bounds of all markers
-                    map.fitBounds(bounds);
+                        // Extend the map bounds to include this marker
+                        bounds.extend(marker.position);
 
-                    // Check for first map idle (completely loaded) - Check max zoom
-                    var mapLoadedListener = google.maps.event.addListener(map, 'idle', function() {
-                        if (map.getZoom() > 14) {
-                            this.setZoom(14);
-                        }
-                        google.maps.event.removeListener(mapLoadedListener);
-                    });
+                     {/if}
+                    {/foreach}
 
-            {else}
+                        // Fit map to bounds of all markers
+                        map.fitBounds(bounds);
 
+                        // Check for first map idle (completely loaded) - Check max zoom
+                        var mapLoadedListener = google.maps.event.addListener(map, 'idle', function() {
+                            if (map.getZoom() > 14) {
+                                this.setZoom(14);
+                            }
+                            google.maps.event.removeListener(mapLoadedListener);
+                        });
 
-            {/if}
+                {else}
+
+
+                {/if}
 
 
-        {/if}
+            {/if}
         });
             </script>
             </ul>
         </div>
-    {include file='front/footer.html'}
-
     </div>
-</div>
\ No newline at end of file
+</div>
+    {include file='front/footer.html'}
index 459b617..08756cb 100644 (file)
@@ -1,17 +1,23 @@
+<div class="glm-member-db-list-view 
+    {if $settings.list_show_map_opened}map-opened{else}map-closed{/if}
+">
 {include file='front/members/header.html'}
-
         {apply_filters('glm-member-db-front-members-list-pageTop', '')}
-
+<div id="testdiv">---testdiv---{if $settings.view.value}$settings.view.value{else}{$settings}{/if}---testdiv---</div>
         <script src="http://maps.googleapis.com/maps/api/js?sensor=true&key={$settings.google_maps_api_key}"></script>
 
 {if $settings.list_show_map}
         {apply_filters('glm-member-db-front-members-list-mapTop', '')}
-        <div id="glm-locationMap" class="glm-map">(map loads here)</div>
+        <div id="glm-locationMap-container">
+            <div id="glm-locationMap" class="glm-map">(map loads here)</div>
+        </div>
         {apply_filters('glm-member-db-front-members-list-mapBottom', '')}
 {/if}
-
-{if $settings.list_show_search}
-
+    <div class="glm-member-list-inner-wrapper">
+    {if $settings.list_show_map}
+        <div id="glm-member-list-map-toggle" class="button glm-button">Map</div>
+    {/if}
+    {if $settings.list_show_search}
         <form action="{$thisUrl}?glm_action=list" method="post" enctype="multipart/form-data">
             <div class="row">
                 <div class="small-12 columns glm-member-search glm-member-entry-container glm-member-container">
                 </div>
             </div>
         </form>
-{/if} {*list_show_search*}
-
-{apply_filters('glm-member-db-front-members-list-listHeaderTop', '')}
-{if $settings.list_show_list && !$blankStart}
-    <h3>List of {$terms.term_member_plur_cap}</h3>
-    {if $haveMembers}
-
-        {if $settings.list_show_search_alpha}
-            <div class="glm-alpha-links">
-                <a href="{$thisUrl}?glm_action=list&textSearch={$textSearch}&categorySearch={$catSelected}" class="glm-alpha-link{if !$alphaSelected} glm-alpha-link-selected{/if}">All</a>
-                {foreach $alphaList as $a}
-                    <a href="{$thisUrl}?glm_action=list&alpha={$a.alpha}&textSearch={$textSearch}&categorySearch={$catSelected}" class="glm-alpha-link{if $a.default} glm-alpha-link-selected{/if}">{$a.alpha}</a>
-                {/foreach}
-            </div>
-        {/if}
-    {apply_filters('glm-member-db-front-members-list-listHeaderBottom', '')}
-
-    <!-- Member information displayed in list -->
+ {/if} {*list_show_search*}
 
   {foreach $members as $m}
{apply_filters('glm-member-db-front-members-list-listHeaderTop', '')}
 
-            {apply_filters('glm-member-db-front-members-list-memberAbove', '', $m.id)}
-        <div class="row">
-            <div class="glm-member-list-container glm-member-container small-12 columns">
-                    {apply_filters('glm-member-db-front-members-list-memberTop', '', $m.id)}
-                    <div class="row">
-                <!-- Member Logo - Medium and up-->
-                        {if $m.logo && $settings.list_show_logo}
-                            <div class="glm-member-list-image-wrapper small-12 medium-4 columns">
-                                <div class="glm-member-list-image-border">
-                                   <img class="glm-member-list-image" src="{$glmPluginMediaUrl}/images/{$settings.list_logo_size}/{$m.logo}">
-<!--                            <img class="glm-member-list-image left" src="http://placehold.it/500x300">-->
-                                </div>
-                            </div>
-                    <div class="glm-member-list-active-info small-12 medium-4 columns">
-                        {else}
-                    <div class="glm-member-list-image-wrapper small-12 medium-4 columns"><br></div>
-                    <div class="glm-member-list-active-info small-12 medium-4 columns">
-                        {/if}
-<!-- Member name, address, and basic information -->
-                            {apply_filters('glm-member-db-front-members-list-memberInfoTop', '', $m.id)}
-                            <h4 class="glm-member-title">
-                            {if $settings.list_show_detail_link}
-                                <a href="{$siteBaseUrl}{$settings.canonical_member_page}/{$m.member_slug}/">{$m.member}</a>
-                            {else}
-                                {$m.member}
-                            {/if}
-                            </h4>
-                            {if $settings.list_show_address}
-                                  {apply_filters('glm-member-db-front-members-list-memberAddressTop', '', $m.id)}
-                                {if $settings.list_show_street}
-                                {if $m.addr1 && $settings.list_show_address}<div>{$m.addr1}</div>{/if}
-                                {if $m.addr2 && $settings.list_show_addr2}<div>{$m.addr2}</div>{/if}
-                                {/if}
-                                {if $settings.list_show_citystatezip}
-                                {if $m.city}<span>{$m.city}</span>{if $m.state.value}, {/if}{/if}<span>{if $m.state.value}{$m.state.value}</span>{/if}{if $m.zip} {$m.zip}{/if}
-                                {/if}
-                                {if $m.country.name && $settings.list_show_country}<div>{$m.country.name}</div>{/if}
-                                {apply_filters('glm-member-db-front-members-list-memberAddressBottom', '', $m.id)}
-                            {/if}
-                            {apply_filters('glm-member-db-front-members-list-memberDetailTop', '', $m.id)}
-                            {if $m.phone && $settings.list_show_phone}<div>Phone: {$m.phone}</div>{/if}
-                            {if $m.toll_free && $settings.list_show_tollfree}<div><b>Toll Free:</b> {$m.toll_free}</div>{/if}
-                            {if $m.region && $settings.list_show_region}<div><b>Region:</b> {$m.region}</div>{/if}
+ {if $settings.list_show_list && !$blankStart}
+        <h3>List of {$terms.term_member_plur_cap}</h3>
+  {if $haveMembers}
 
-                            <div class="glm-member-list-links"><br>
-                                {if $m.url && $settings.list_show_url}<a href="{$m.url}"{if $settings.list_show_url_newtarget} target="_blank"{/if}>Website</a>{/if}
-                                {if $m.email && $settings.list_show_email}<a href="mailto:{$m.email}">Email</a>{/if}
-                            </div>
-                            {apply_filters('glm-member-db-front-members-list-memberDetailBottom', '', $m.id)}
-                        </div>
-                        <div class="glm-member-list-description small-12 medium-4 left columns">
-                            <div>
-                            {apply_filters('glm-member-db-front-members-list-memberDescriptionTop', '', $m.id)}
-                            {if $m.short_descr && $settings.list_show_short_descr}
-                                {$m.short_descr|nl2br}
-                            {elseif $m.descr && $settings.list_show_description}
-                                {$m.descr|nl2br}
-                            {/if}
-                            {apply_filters('glm-member-db-front-members-list-memberDescriptionBottom', '', $m.id)}
-                            </div>
-                            {if $m.categories && $settings.list_show_categories}
-                                        <b>{$terms.term_member_cap} Categories</b>
-                                        <ul>
-                                {foreach $m.categories as $c}
-                                            <li>
-                                                {if $c.parent_name}{$c.parent_name}: {/if}{$c.name}
-                                            </li>
-                                {/foreach}
-                                        </ul>
-                            {/if}
-                            {if $m.cc_type && $settings.list_show_creditcards}
-                                        <b>Credit Cards Accepted:</b>
-                                        <ul>
-                                {foreach $m.cc_type.names as $c}
-                                            <li>{$c}</li>
-                                {/foreach}
-                                        </ul>
-                            {/if}
-                            {if $m.amenities && $settings.list_show_amenities}
-                                        <b>{$terms.term_member_cap} Amenities</b>
-                                        <ul>
-                                {foreach $m.amenities as $A}
-                                            <li>
-                                                {$A.name}
-                                            </li>
-                                {/foreach}
-                                        </ul>
-                            {/if}
+    {if $settings.list_show_search_alpha}
+        <div class="glm-alpha-links">
+            <a href="{$thisUrl}?glm_action=list&textSearch={$textSearch}&categorySearch={$catSelected}" class="glm-alpha-link{if !$alphaSelected} glm-alpha-link-selected{/if}">All</a>
+      {foreach $alphaList as $a}
+            <a href="{$thisUrl}?glm_action=list&alpha={$a.alpha}&textSearch={$textSearch}&categorySearch={$catSelected}" class="glm-alpha-link{if $a.default} glm-alpha-link-selected{/if}">{$a.alpha}</a>
+      {/foreach}
+       </div>
+    {/if}
+        {apply_filters('glm-member-db-front-members-list-listHeaderBottom', '')}
+     <!-- Member information displayed in list -->
+     {foreach $members as $m}
+        {apply_filters('glm-member-db-front-members-list-memberAbove', '', $m.id)}
+
+         <div class="row">
+             <div class="glm-member-list-container glm-member-container small-12 columns">
+                {apply_filters('glm-member-db-front-members-list-memberTop', '', $m.id)}
+                <div class="row">
+                 <!-- Member Logo - Medium and up-->
+                {if $m.logo && $settings.list_show_logo}
+                    <div class="glm-member-list-image-wrapper small-12 medium-4 columns">
+                        <div class="glm-member-list-image-border">
+                           <img class="glm-member-list-image" src="{$glmPluginMediaUrl}/images/{$settings.list_logo_size}/{$m.logo}">
+ <!--                            <img class="glm-member-list-image left" src="http://placehold.it/500x300">-->
                         </div>
+                   </div>
+                     <div class="glm-member-list-active-info small-12 medium-4 columns">
+                {else}
+                     <div class="glm-member-list-image-wrapper small-12 medium-4 columns"><br></div>
+                     <div class="glm-member-list-active-info small-12 medium-4 columns">
+                {/if}
+ <!-- Member name, address, and basic information -->
+                    {apply_filters('glm-member-db-front-members-list-memberInfoTop', '', $m.id)}
+                    <h4 class="glm-member-title">
+          {if $settings.list_show_detail_link}
+                        <a href="{$siteBaseUrl}{$settings.canonical_member_page}/{$m.member_slug}/">{$m.member}</a>
+
+          {else}
+                        {$m.member}
+          {/if}
+                    </h4>
+              {if $settings.list_show_address}
+                    {apply_filters('glm-member-db-front-members-list-memberAddressTop', '', $m.id)}
+                  {if $settings.list_show_street}
+                  {if $m.addr1 && $settings.list_show_address}<div>{$m.addr1}</div>{/if}
+                  {if $m.addr2 && $settings.list_show_addr2}<div>{$m.addr2}</div>{/if}
+                  {/if}
+                  {if $settings.list_show_citystatezip}
+                  {if $m.city}<span>{$m.city}</span>{if $m.state.value}, {/if}{/if}<span>{if $m.state.value}{$m.state.value}</span>{/if}{if $m.zip} {$m.zip}{/if}
+                  {/if}
+                  {if $m.country.name && $settings.list_show_country}<div>{$m.country.name}</div>{/if}
+                  {apply_filters('glm-member-db-front-members-list-memberAddressBottom', '', $m.id)}
+              {/if}
+                    {apply_filters('glm-member-db-front-members-list-memberDetailTop', '', $m.id)}
+                    {if $m.phone && $settings.list_show_phone}<div>Phone: {$m.phone}</div>{/if}
+                    {if $m.toll_free && $settings.list_show_tollfree}<div><b>Toll Free:</b> {$m.toll_free}</div>{/if}
+                    {if $m.region && $settings.list_show_region}<div><b>Region:</b> {$m.region}</div>{/if}
+
+                    <div class="glm-member-list-links"><br>
+                        {if $m.url && $settings.list_show_url}<a href="{$m.url}"{if $settings.list_show_url_newtarget} target="_blank"{/if}>Website</a>{/if}
+                        {if $m.email && $settings.list_show_email}<a href="mailto:{$m.email}">Email</a>{/if}
+                     </div>
+                    {apply_filters('glm-member-db-front-members-list-memberDetailBottom', '', $m.id)}
+                 </div>
+                <div class="glm-member-list-description small-12 medium-4 left columns">
+                    <div>
+                    {apply_filters('glm-member-db-front-members-list-memberDescriptionTop', '', $m.id)}
+                    {if $m.short_descr && $settings.list_show_short_descr}
+                        {$m.short_descr|nl2br}
+                    {elseif $m.descr && $settings.list_show_description}
+                        {$m.descr|nl2br}
+                     {/if}
+                    {apply_filters('glm-member-db-front-members-list-memberDescriptionBottom', '', $m.id)}
+                    </div>
+                {if $m.categories && $settings.list_show_categories}
+                        <div class="glm-member-list-items">
+                             <b>{$terms.term_member_cap} Categories</b>
+                             <ul>
+                    {foreach $m.categories as $c}
+                                 <li>
+                                     {if $c.parent_name}{$c.parent_name}: {/if}{$c.name}
+                                 </li>
+                    {/foreach}
+                             </ul>
+                {/if}
+                {if $m.cc_type && $settings.list_show_creditcards}
+                             <b>Credit Cards Accepted:</b>
+                             <ul>
+                    {foreach $m.cc_type.names as $c}
+                                 <li>{$c}</li>
+                    {/foreach}
+                             </ul>
+                {/if}
+                {if $m.amenities && $settings.list_show_amenities}
+                            <b>{$terms.term_member_cap} Amenities</b>
+                             <ul>
+                    {foreach $m.amenities as $A}
+                                <li>
+                                    {$A.name}
+                                </li>
+                    {/foreach}
+                             </ul>
+                {/if}
+                    </div>
                     </div>
                     <!-- Laury - This is the one that should go underneath all the address and description area -->
                     {apply_filters('glm-member-db-front-members-list-memberDataBelow', '', $m.id)}
 
                     {apply_filters('glm-member-db-front-members-list-memberBottom', '', $m.id)}
-                </div>
+                 </div>
                  {apply_filters('glm-member-db-front-members-list-memberBelow', '', $m.id)}
 <!-- Member Description -->
-                        </div>
-                
-            <!-- Member information displayed in map bubbles -->
-            <div id="map_info_{$m.id}" class="glm-hidden">
-                {apply_filters('glm-member-db-front-members-list-mapBubbleTop', '', $m.id)}
+        </div>
+
+        <!-- Member information displayed in map bubbles -->
+        <div id="map_info_{$m.id}" class="glm-hidden">
+            {apply_filters('glm-member-db-front-members-list-mapBubbleTop', '', $m.id)}
             {if $m.logo && $settings.list_map_show_logo}<div class="glm-member-list-image"><img src="{$glmPluginMediaUrl}/images/{$settings.list_map_logo_size}/{$m.logo}"></div>{/if}
-                <div class="glm-map-member-name">
-                    {if $settings.list_map_show_detaillink}
-                        <a href="{$siteBaseUrl}{$settings.canonical_member_page}/{$m.member_slug}/">{$m.member}</a>
-                    {else}
-                        {$m.member}
-                    {/if}
-                </div>
-                {if $settings.list_map_show_address}
-                    <p class="glm-map-member-address">
-                        {if $settings.list_map_show_street}
-                            {if $m.addr1}{$m.addr1}<br>{/if}
-                            {if $m.addr2}{$m.addr2}<br>{/if}
-                        {/if}
-                        {if $settings.list_map_show_citystatezip}
-                            {if $m.city}{$m.city}{if $m.state.value}, {/if}{/if}{if $m.state.value}{$m.state.value}{/if}{if $m.zip} {$m.zip}{/if}
-                        {/if}
+            <div class="glm-map-member-name">
+              {if $settings.list_map_show_detaillink}
+                <a href="{$siteBaseUrl}{$settings.canonical_member_page}/{$m.member_slug}/">{$m.member}</a>
+              {else}
+                {$m.member}
+              {/if}
+            </div>
+          {if $settings.list_map_show_address}
+            <p class="glm-map-member-address">
+              {if $settings.list_map_show_street}
+                {if $m.addr1}{$m.addr1}<br>{/if}
+                {if $m.addr2}{$m.addr2}<br>{/if}
+              {/if}
+              {if $settings.list_map_show_citystatezip}
+                {if $m.city}{$m.city}{if $m.state.value}, {/if}{/if}{if $m.state.value}{$m.state.value}{/if}{if $m.zip} {$m.zip}{/if}
+              {/if}
                 {if $m.country.name && $settings.list_map_show_country}<br>{$m.country.name}{/if}
-                    </p>
-                {/if} {*list_map_show_address*}
-                <div class="glm-member-list-info">
-                    <p>
-                        {if $m.phone && $settings.list_map_show_phone}<b>Phone:</b> {$m.phone}<br>{/if}
-                        {if $m.toll_free && $settings.list_map_show_tollfree}<b>Toll Free:</b> {$m.toll_free}<br>{/if}
-                        {if $m.url && $settings.list_map_show_url}<b>Web site:</b> <a href="{$m.url}"{if $settings.list_map_show_url_newtarget} target="_blank"{/if}>{$m.url}</a><br>{/if}
-                        {if $m.email && $settings.list_map_show_email}<b>E-Mail Address:</b> <a href="mailto:{$m.email}">{$m.email}</a><br>{/if}
-                        {if $m.region && $settings.list_map_show_region}<b>Region:</b> {$m.region}{/if}
-                    </p>
-                    {if $m.descr && $settings.list_map_show_descr}{$m.descr|nl2br}<br>{/if}
-                    {if $m.short_descr && $settings.list_map_show_short_descr}{$m.short_descr}<br>{/if}
-                    {if $m.categories && $settings.list_map_show_categories}
-                        <div class="glm-member-list-items">
-                            <b>{$terms.term_member_cap} Categories</b>
-                            <ul>
-                            {foreach $m.categories as $c}
-                                <li>
-                                    {if $c.parent_name}{$c.parent_name}: {/if}{$c.name}
-                                </li>
-                            {/foreach}
-                            </ul>
-                        </div>
-                    {/if}
-                    {if $m.cc_type && $settings.list_map_show_creditcards}
-                        <div class="glm-member-list-items">
-                            <b>Credit Cards Accepted:</b>
-                            <ul>
-                            {foreach $m.cc_type.names as $c}
-                                <li>{$c}</li>
-                            {/foreach}
-                            </ul>
-                        </div>
-                    {/if}
-                    {if $settings.list_map_show_amenities}
-                        <div class="glm-member-list-items">
-                            <b>Amenities:</b>
-                            <ul>
-                            {foreach $m.amenities as $a}
-                                <li>{$a.name}</li>
-                            {/foreach}
-                            </ul>
-                        </div>
-                    {/if}
+            </p>
+          {/if} {*list_map_show_address*}
+            <div class="glm-member-list-info">
+                <p>
+                    {if $m.phone && $settings.list_map_show_phone}<b>Phone:</b> {$m.phone}<br>{/if}
+                    {if $m.toll_free && $settings.list_map_show_tollfree}<b>Toll Free:</b> {$m.toll_free}<br>{/if}
+                    {if $m.url && $settings.list_map_show_url}<b>Web site:</b> <a href="{$m.url}"{if $settings.list_map_show_url_newtarget} target="_blank"{/if}>{$m.url}</a><br>{/if}
+                    {if $m.email && $settings.list_map_show_email}<b>E-Mail Address:</b> <a href="mailto:{$m.email}">{$m.email}</a><br>{/if}
+                    {if $m.region && $settings.list_map_show_region}<b>Region:</b> {$m.region}{/if}
+                </p>
+                {if $m.descr && $settings.list_map_show_descr}{$m.descr|nl2br}<br>{/if}
+                {if $m.short_descr && $settings.list_map_show_short_descr}{$m.short_descr}<br>{/if}
+        {if $m.categories && $settings.list_map_show_categories}
+                <div class="glm-member-list-items">
+                    <b>{$terms.term_member_cap} Categories</b>
+                    <ul>
+            {foreach $m.categories as $c}
+                        <li>
+                            {if $c.parent_name}{$c.parent_name}: {/if}{$c.name}
+                        </li>
+            {/foreach}
+                    </ul>
                 </div>
-                {apply_filters('glm-member-db-front-members-list-mapBubbleBottom', '', $m.id)}
-            </div> <!-- End of information displayed in map bubbles -->
-
-    {/foreach} {*$members*}
-    {apply_filters('glm-member-db-front-members-list-pageBottom', '')}
-{else}
-    <div>(no {$terms.term_member_plur} listed)</div>
-{/if}
-
-{/if} {*list_show_list*}
-<script type="text/javascript">
-            jQuery(document).ready(function($) {
+        {/if}
+        {if $m.cc_type && $settings.list_map_show_creditcards}
+                <div class="glm-member-list-items">
+                    <b>Credit Cards Accepted:</b>
+                    <ul>
+            {foreach $m.cc_type.names as $c}
+                        <li>{$c}</li>
+            {/foreach}
+                    </ul>
+                </div>
+        {/if}
+        {if $settings.list_map_show_amenities}
+                <div class="glm-member-list-items">
+                    <b>Amenities:</b>
+                    <ul>
+            {foreach $m.amenities as $a}
+                        <li>{$a.name}</li>
+            {/foreach}
+                    </ul>
+                 </div>
+        {/if}
+            </div>
+            {apply_filters('glm-member-db-front-members-list-mapBubbleBottom', '', $m.id)}
+        </div> <!-- End of information displayed in map bubbles -->
+     {/foreach} {*$members*}
+        {apply_filters('glm-member-db-front-members-list-pageBottom', '')}
+ {else}
+        <div>(no {$terms.term_member_plur} listed)</div>
+ {/if}
+ {/if} {*list_show_list*}
+        <script type="text/javascript">
+             jQuery(document).ready(function($) {
 
     {if $settings.list_show_map}
+    
+                $("#glm-member-list-map-toggle").click( function() {
+                    $(".glm-member-db-list-view").toggleClass("map-opened");
+                    $(".glm-member-db-list-view").toggleClass("map-closed");
+                    var currentScroll = $(window).scrollTop(); // get current position
+                    var mapTop = $("#glm-locationMap-container").offset().top-10;
+                    if (currentScroll >= mapTop) {
+                        $('body,html').animate({
+                            scrollTop: $("#glm-locationMap-container").offset().top-10
+                        }, 50);
+                    } else {
+                        $('body,html').animate({
+                            scrollTop: $("#glm-locationMap-container").offset().top-10
+                        }, 400);
+                    }
+                });
+                
                 /*
                  * Google Maps
                  *  API reference: https://developers.google.com/maps/documentation/javascript/reference
     {/if}
             });
         </script>
-
+        </div><!-- glm-member-list-inner-wrapper-->
+    </div><!-- glm-member-db-list-view -->
 {include file='front/footer.html'}