Jump to content

Recommended Posts

Grid List is remembered via Cookie.

This means loading in this file; 
https://github.com/gburton/Responsive-osCommerce/blob/master/ext/jquery/cookie.js

It's not a big file, but it can be got rid of as so;

Change these two lines:
https://github.com/gburton/Responsive-osCommerce/blob/master/includes/modules/header_tags/ht_grid_list_view.php#L46-L47

To:

          $grid_list_js = <<<EOD
<script>$(function() { var cc = localStorage['list_grid']; if (cc == 'list') { $('#products .item').removeClass('grid-group-item').addClass('list-group-item'); } else { $('#products .item').removeClass('list-group-item').addClass('grid-group-item'); } $(document).ready(function() { $('#list').click(function(event){ event.preventDefault(); $('#products .item').addClass('list-group-item').removeClass('grid-group-item'); localStorage['list_grid'] = 'list'; }); $('#grid').click(function(event){ event.preventDefault(); $('#products .item').removeClass('list-group-item').addClass('grid-group-item'); localStorage['list_grid'] = 'grid'; });});});</script>
EOD;
          $oscTemplate->addBlock($grid_list_js . PHP_EOL, $this->group);

Save file and upload.

You should see no change at all in functionality.  HOwever your site is now loading faster as it does not have to load the cookie.js file.

Thoughts and Feedback appreciated.  And code changes.  Etc and so on.  Pitch in.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Hmmmm. I do see an improvement in the overall load time of category pages. I notice a boost in loading of product pages, especially in the server response time or time till first byte. Which can be critical during peak times.

For a site as large as mine, it's a huge plus.  

What about areas of the site where cookies are required in order to function? And the EU cookie law?

 

Share this post


Link to post
Share on other sites

Didn't work for me in one of my firefoxes - until I enabled DOM Storage again in about:config, had this one disabled years ago to avoid flash cookies.

Best regards

Christoph

Share this post


Link to post
Share on other sites

@burt

Because everyone doesn't use localstorage you might want to check if it's enabled first and use the old code as a backup if it's not.

if (window.localStorage) {
    // use localStorage script
}else{
	//fallback to cookies here
}

 


Matt

Share this post


Link to post
Share on other sites

Also found this https://developer.mozilla.org/en-US/docs/Web/API/Storage/LocalStorage which could be used as a cookie patch for users who can't/don't use localStorage in their browser.

if (!window.localStorage) {
  Object.defineProperty(window, "localStorage", new (function () {
    var aKeys = [], oStorage = {};
    Object.defineProperty(oStorage, "getItem", {
      value: function (sKey) { return sKey ? this[sKey] : null; },
      writable: false,
      configurable: false,
      enumerable: false
    });
    Object.defineProperty(oStorage, "key", {
      value: function (nKeyId) { return aKeys[nKeyId]; },
      writable: false,
      configurable: false,
      enumerable: false
    });
    Object.defineProperty(oStorage, "setItem", {
      value: function (sKey, sValue) {
        if(!sKey) { return; }
        document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";
      },
      writable: false,
      configurable: false,
      enumerable: false
    });
    Object.defineProperty(oStorage, "length", {
      get: function () { return aKeys.length; },
      configurable: false,
      enumerable: false
    });
    Object.defineProperty(oStorage, "removeItem", {
      value: function (sKey) {
        if(!sKey) { return; }
        document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
      },
      writable: false,
      configurable: false,
      enumerable: false
    });    
    Object.defineProperty(oStorage, "clear", {
      value: function () {
        if(!aKeys.length) { return; }
        for (var sKey in aKeys) {
          document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
        }
      },
      writable: false,
      configurable: false,
      enumerable: false
    });
    this.get = function () {
      var iThisIndx;
      for (var sKey in oStorage) {
        iThisIndx = aKeys.indexOf(sKey);
        if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); }
        else { aKeys.splice(iThisIndx, 1); }
        delete oStorage[sKey];
      }
      for (aKeys; aKeys.length > 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); }
      for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx < aCouples.length; nIdx++) {
        aCouple = aCouples[nIdx].split(/\s*=\s*/);
        if (aCouple.length > 1) {
          oStorage[iKey = unescape(aCouple[0])] = unescape(aCouple[1]);
          aKeys.push(iKey);
        }
      }
      return oStorage;
    };
    this.configurable = false;
    this.enumerable = true;
  })());
}

 


Matt

Share this post


Link to post
Share on other sites

I didn't even consider those weird people who browse with stuff turned off.   Says this weirdo who browses almost all sites with .js off :laugh:

If anyone wants to put the jigsaw puzzle together to get it working I'd be very happy...


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Maybe this? I haven't tested it but it should work I think

<?php
/*
  $Id$

  osCommerce, Open Source E-Commerce Solutions
  http://www.oscommerce.com

  Copyright (c) 2014 osCommerce

  Released under the GNU General Public License
*/

  class ht_grid_list_view {
    var $code = 'ht_grid_list_view';
    var $group = 'footer_scripts';
    var $title;
    var $description;
    var $sort_order;
    var $enabled = false;

    function __construct() {
      $this->title = MODULE_HEADER_TAGS_GRID_LIST_VIEW_TITLE;
      $this->description = MODULE_HEADER_TAGS_GRID_LIST_VIEW_DESCRIPTION;

      if ( defined('MODULE_HEADER_TAGS_GRID_LIST_VIEW_STATUS') ) {
        $this->sort_order = MODULE_HEADER_TAGS_GRID_LIST_VIEW_SORT_ORDER;
        $this->enabled = (MODULE_HEADER_TAGS_GRID_LIST_VIEW_STATUS == 'True');
      }
    }

    function execute() {
      global $PHP_SELF, $oscTemplate;

      if (tep_not_null(MODULE_HEADER_TAGS_GRID_LIST_VIEW_PAGES)) {
        $pages_array = array();

        foreach (explode(';', MODULE_HEADER_TAGS_GRID_LIST_VIEW_PAGES) as $page) {
          $page = trim($page);

          if (!empty($page)) {
            $pages_array[] = $page;
          }
        }

        if (in_array(basename($PHP_SELF), $pages_array)) {          
          
$grid_list_js = <<<EOD
<script>
$(function() { 
    
    if (window.localStorage) {
    
    let cc = localStorage['list_grid']; 
    
    if (cc == 'list') { 
        $('#products .item').removeClass('grid-group-item').addClass('list-group-item'); 
    } else { 
        $('#products .item').removeClass('list-group-item').addClass('grid-group-item'); 
    } 
        
    $('#list').click(function(event){ 
        event.preventDefault(); 
        $('#products .item').addClass('list-group-item').removeClass('grid-group-item'); 
        localStorage['list_grid'] = 'list'; 
    }); 
        
    $('#grid').click(function(event){ 
        event.preventDefault(); 
        $('#products .item').removeClass('list-group-item').addClass('grid-group-item'); 
        localStorage['list_grid'] = 'grid'; 
    });
    
    }else{
        
        //cookie fallback
        $('head').append('<script src="ext/jquery/cookie.js"><\/script>');
        
        try {
            
        let cc = $.cookie('list_grid');
        
        if (cc == 'list') {
            $('#products .item').removeClass('grid-group-item').addClass('list-group-item');
        }else{
            $('#products .item').removeClass('list-group-item').addClass('grid-group-item');
        }
        
        $('#list').click(function(event){
            event.preventDefault();
            $('#products .item').addClass('list-group-item').removeClass('grid-group-item');
            $.cookie('list_grid', 'list');
        });
        
        $('#grid').click(function(event){
            event.preventDefault();
            $('#products .item').removeClass('list-group-item').addClass('grid-group-item');
            $.cookie('list_grid', 'grid');
        });
        
        }catch(error){
            console.log(error);
        }
    }
    
});
</script>
EOD;
          $oscTemplate->addBlock($grid_list_js . PHP_EOL, $this->group);
          
        }
      }
    }

    function isEnabled() {
      return $this->enabled;
    }

    function check() {
      return defined('MODULE_HEADER_TAGS_GRID_LIST_VIEW_STATUS');
    }

    function install() {
      tep_db_query("insert into " . TABLE_CONFIGURATION . " (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) values ('Enable Grid List javascript', 'MODULE_HEADER_TAGS_GRID_LIST_VIEW_STATUS', 'True', 'Do you want to enable the Grid/List Javascript module?', '6', '1', 'tep_cfg_select_option(array(\'True\', \'False\'), ', now())");
	    tep_db_query("insert into " . TABLE_CONFIGURATION . " (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, use_function, set_function, date_added) values ('Pages', 'MODULE_HEADER_TAGS_GRID_LIST_VIEW_PAGES', '" . implode(';', $this->get_default_pages()) . "', 'The pages to add the Grid List JS Scripts to.', '6', '4', 'ht_grid_list_view_show_pages', 'ht_grid_list_view_edit_pages(', now())");
	    tep_db_query("insert into " . TABLE_CONFIGURATION . " (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, date_added) values ('Sort Order', 'MODULE_HEADER_TAGS_GRID_LIST_VIEW_SORT_ORDER', '0', 'Sort order of display. Lowest is displayed first.', '6', '5', now())");
    }

    function remove() {
      tep_db_query("delete from " . TABLE_CONFIGURATION . " where configuration_key in ('" . implode("', '", $this->keys()) . "')");
    }

    function keys() {
      return array('MODULE_HEADER_TAGS_GRID_LIST_VIEW_STATUS', 'MODULE_HEADER_TAGS_GRID_LIST_VIEW_PAGES', 'MODULE_HEADER_TAGS_GRID_LIST_VIEW_SORT_ORDER');
    }

    function get_default_pages() {
      return array('advanced_search_result.php',
                   'index.php',
                   'products_new.php',
                   'specials.php');
    }
  }

  function ht_grid_list_view_show_pages($text) {
    return nl2br(implode("\n", explode(';', $text)));
  }

  function ht_grid_list_view_edit_pages($values, $key) {
    global $PHP_SELF;

    $file_extension = substr($PHP_SELF, strrpos($PHP_SELF, '.'));
    $files_array = array();
	  if ($dir = @dir(DIR_FS_CATALOG)) {
	    while ($file = $dir->read()) {
	      if (!is_dir(DIR_FS_CATALOG . $file)) {
	        if (substr($file, strrpos($file, '.')) == $file_extension) {
            $files_array[] = $file;
          }
        }
      }
      sort($files_array);
      $dir->close();
    }

    $values_array = explode(';', $values);

    $output = '';
    foreach ($files_array as $file) {
      $output .= tep_draw_checkbox_field('ht_grid_list_view_file[]', $file, in_array($file, $values_array)) . '&nbsp;' . tep_output_string($file) . '<br />';
    }

    if (!empty($output)) {
      $output = '<br />' . substr($output, 0, -6);
    }

    $output .= tep_draw_hidden_field('configuration[' . $key . ']', '', 'id="htrn_files"');

    $output .= '<script>
                function htrn_update_cfg_value() {
                  var htrn_selected_files = \'\';

                  if ($(\'input[name="ht_grid_list_view_file[]"]\').length > 0) {
                    $(\'input[name="ht_grid_list_view_file[]"]:checked\').each(function() {
                      htrn_selected_files += $(this).attr(\'value\') + \';\';
                    });

                    if (htrn_selected_files.length > 0) {
                      htrn_selected_files = htrn_selected_files.substring(0, htrn_selected_files.length - 1);
                    }
                  }

                  $(\'#htrn_files\').val(htrn_selected_files);
                }

                $(function() {
                  htrn_update_cfg_value();

                  if ($(\'input[name="ht_grid_list_view_file[]"]\').length > 0) {
                    $(\'input[name="ht_grid_list_view_file[]"]\').change(function() {
                      htrn_update_cfg_value();
                    });
                  }
                });
                </script>';

    return $output;
  }
  

 


Matt

Share this post


Link to post
Share on other sites

Great thanks Matt you're a star @mattjt83

If you @beerbee could revert your Firefox setting, and then test Matts code, that would be super helpful.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Hi reverted, cleaned cache and cookies works,  also tried in private FF window works, thanks a lot!

Best regards

Christoph

Share this post


Link to post
Share on other sites
1 hour ago, beerbee said:

Hi reverted, cleaned cache and cookies works,  also tried in private FF window works, thanks a lot!

Best regards

Christoph

Just so I'm clear, you tried my code or just reverted to the old code?


Matt

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×