From 65a0bf540a97824ad60d771d4681d0c1b181e66c Mon Sep 17 00:00:00 2001 From: Anthony Talarico Date: Tue, 14 Mar 2017 16:40:22 -0400 Subject: [PATCH] adding styles to hide and show buttons to collapse the search menu in mobile views --- css/front.css | 36 +++++++++++---- js/front.js | 21 ++++++++- models/front/obits/search.php | 20 +++++--- views/front/obits/search.html | 8 +++- views/front/obits/searchResults.html | 68 ++++++++++++++++++---------- 5 files changed, 109 insertions(+), 44 deletions(-) diff --git a/css/front.css b/css/front.css index 32dd68c..f7c2dc3 100644 --- a/css/front.css +++ b/css/front.css @@ -25,12 +25,6 @@ .search-sidebar-container{ clear: both; } - .results-container{ - padding: 0; - } - .search-sidebar-container{ - padding: 0; - } } .search-label{ font-size: 13px; @@ -63,13 +57,19 @@ /* width: 50%;*/ margin: 0 auto; } + .search-container input, .search-container select{ - margin: 5px 0; + margin: 5px auto; } .search-container div{ margin: 0; padding: 0 10px; } +@media(max-width: 1024px){ + .sidebar-container{ + display: none; + } +} .options-wrapper{ display: none; } @@ -99,7 +99,8 @@ font-weight: bold; } .search-container .results-limit-container { - margin-bottom: 20px; + margin-bottom: 15px; + margin-top: 10px; text-align: center; } .search-container .results-limit-container input:nth-child(2){ @@ -140,7 +141,7 @@ input.sidebar-criteria{ margin-top: 7px; } .search-input input, .search-input select{ - max-width: 320px; +/* max-width: 320px;*/ } .search-input select{ /* max-width: 222px;*/ @@ -172,4 +173,21 @@ input.sidebar-criteria{ .no-results{ font-weight: bold; text-align: center; +} + +.search-container .search-options{ + margin-top: 10px; +} +@media(max-width: 640px){ + .not-input, .logic-input{ + display: none; + } +} +.show-search{ + background: #a62800; + color: white; + text-align: center; + padding: 5px 0; + margin: 5px 0 5px 15px; + width: 150px; } \ No newline at end of file diff --git a/js/front.js b/js/front.js index 9f8c19f..742a93c 100644 --- a/js/front.js +++ b/js/front.js @@ -9,7 +9,21 @@ $(document).ready(function(){ e.preventDefault(); $('.options-wrapper').slideToggle(500, function () {}); }); - + + $(".expand-collapse-main").on("click", function(e){ + if( $(this).text() === "Show Options" ){ + $(this).text("Hide Options"); + } else if( $(this).text() === "Hide Options" ){ + $(this).text("Show Options"); + } + e.preventDefault(); + + if( $(window).width() < 640 ){ + $('.not-input').slideToggle(400); + $('.logic-input').slideToggle(400); + } + }); + $('.obits-link').on("click", function(){ $('#obits-search').submit(); }); @@ -20,6 +34,11 @@ $(document).ready(function(){ console.log("test"); }); + if( $(window).width() < 1024 ){ + $('.show-search').on("click", function(){ + $('.sidebar-container').slideToggle(500) ; + }); + } $('#results-limit').on('change', function(){ // $('#obits-search').submit(); diff --git a/models/front/obits/search.php b/models/front/obits/search.php index 8840390..89e8fdf 100644 --- a/models/front/obits/search.php +++ b/models/front/obits/search.php @@ -95,7 +95,7 @@ class GlmMembersFront_obits_search extends GlmDataObits $this->table = GLM_MEMBERS_OBITS_PLUGIN_DB_PREFIX . 'obits'; $view = 'search'; - + $placeholders = array('Last Name', 'First Middle', 'Birth Year', 'Death Year', 'Maiden or Other Name', 'Spouse or Partner Name'); $year_ranges = new glmObitSupportFunctions($this->wpdb, $this->config); $birth_death_range = array('birth' => $year_ranges->getObitYearRange(BIRTH_YEAR_START), 'death' => $year_ranges->getObitYearRange(DEATH_YEAR_START)); @@ -109,7 +109,7 @@ class GlmMembersFront_obits_search extends GlmDataObits $form_data = $_POST; - // build array of potential search fields , will be used in the paging urls + // build array of potential search fields , will be used in the paging url $form_fields = array( 'last' => filter_var($form_data['last_name'],FILTER_SANITIZE_STRING), 'first' => filter_var($form_data['first_mid'],FILTER_SANITIZE_STRING), @@ -120,7 +120,13 @@ class GlmMembersFront_obits_search extends GlmDataObits 'spouse' => filter_var($form_data['spouse_partner'],FILTER_SANITIZE_STRING), 'maiden' => filter_var($form_data['maiden_other'],FILTER_SANITIZE_STRING) ); - + + //clear the placeholder values from the jquery html input fix + foreach($form_fields as $field=>$f){ + if( in_array($f, $placeholders) ){ + $form_fields[$field] = ''; + } + } $get_fields = array( 'last_name' => filter_var($_GET['last'],FILTER_SANITIZE_STRING), 'first_mid' => filter_var($_GET['first'],FILTER_SANITIZE_STRING), @@ -145,7 +151,7 @@ class GlmMembersFront_obits_search extends GlmDataObits // separate the search fields from the logic ('not', 'contains, 'equals') etc. foreach($form_data as $key=>$value){ - if (isset($value) && $value !== ''){ + if (isset($value) && $value !== '' && !in_array($value,$placeholders) ){ if( $value !== 'Search' && $key !== 'conditions' && $key !== 'results-limit'){ if(strpos($key,'-logic') === false && strpos($key,'not-') === false ) { $value = filter_var($value, FILTER_SANITIZE_STRING); @@ -167,7 +173,6 @@ class GlmMembersFront_obits_search extends GlmDataObits } } - // check to see if there are 8 empty values, if there are, there are no search values if(count($empty_values) === 8){ $empty_search = 'true'; @@ -229,7 +234,8 @@ class GlmMembersFront_obits_search extends GlmDataObits $where = $search; } - + + // begin paging if (isset($_REQUEST['pageSelect'])) { @@ -246,7 +252,7 @@ class GlmMembersFront_obits_search extends GlmDataObits $start = $newStart; } } - + $obits = $this->getList($where, 'last_name', $fieldVals = true, $idField = 'id', $start, $per_page); $returned = $obits['returned']; diff --git a/views/front/obits/search.html b/views/front/obits/search.html index 29f251f..fcb426d 100644 --- a/views/front/obits/search.html +++ b/views/front/obits/search.html @@ -3,8 +3,12 @@