Remember port search columns/settings in a Cookie

Squashed commit of the following:

commit 5bb8dc3bc1
Author: Oliver Gorwits <oliver@cpan.org>
Date:   Thu Sep 5 23:48:04 2013 +0100

    parse cookie and set column defaults

commit 05e6acfee5
Author: Oliver Gorwits <oliver@cpan.org>
Date:   Tue Sep 3 07:12:00 2013 +0100

    add list of cols to cookie

commit 7c5c1b7882
Author: Oliver Gorwits <oliver@cpan.org>
Date:   Mon Sep 2 23:23:48 2013 +0100

    submit cookie with port columns options

commit f350c34074
Author: Oliver Gorwits <oliver@cpan.org>
Date:   Mon Sep 2 22:46:14 2013 +0100

    remove unecessary JS using template var

commit 7ca1623d2f
Author: Oliver Gorwits <oliver@cpan.org>
Date:   Mon Sep 2 22:35:36 2013 +0100

    factor out tab-specific stuff to common.js

Netdisco/Makefile.PL

@@ -36,6 +36,7 @@ requires 'Starman' => 0.3008;
 requires 'SNMP::Info' => 3.05;
 requires 'SQL::Translator' => 0.11016;
 requires 'Template' => 2.24;
+requires 'URL::Encode' => 0.01;
 requires 'YAML' => 0.84;
 requires 'YAML::XS' => 0.41;
 requires 'namespace::clean' => 0.24;

Netdisco/lib/App/Netdisco/Web/Device.pm

@@ -4,6 +4,7 @@ use Dancer ':syntax';
 use Dancer::Plugin::Ajax;
 use Dancer::Plugin::DBIC;
 use Dancer::Plugin::Auth::Extensible;
+use URL::Encode 'url_params_mixed';
 
 hook 'before' => sub {
   my @default_port_columns_left = (
@@ -53,6 +54,36 @@ hook 'before' => sub {
   return unless (request->path eq uri_for('/device')->path
     or index(request->path, uri_for('/ajax/content/device')->path) == 0);
 
+  # override ports form defaults with cookie settings
+
+  my $cookie = cookie('nd_ports-form');
+  my $cdata = url_params_mixed($cookie);
+
+  if ($cdata and ref {} eq ref $cdata) {
+      foreach my $item (@{ var('port_columns') }) {
+          my $key = $item->{name};
+          next unless defined $cdata->{$key}
+            and $cdata->{$key} =~ m/^[[:alnum:]_]+$/;
+          $item->{default} = $cdata->{$key};
+      }
+
+      foreach my $item (@{ var('connected_properties') }) {
+          my $key = $item->{name};
+          next unless defined $cdata->{$key}
+            and $cdata->{$key} =~ m/^[[:alnum:]_]+$/;
+          $item->{default} = $cdata->{$key};
+      }
+
+      foreach my $key (qw/age_num age_unit mac_format/) {
+          params->{$key} ||= $cdata->{$key}
+            if defined $cdata->{$key}
+               and $cdata->{$key} =~ m/^[[:alnum:]_]+$/;
+      }
+  }
+
+  # copy ports form defaults into request query params if this is
+  # a redirect from within the application (tab param is not set)
+
   foreach my $col (@{ var('port_columns') }) {
       next unless $col->{default} eq 'on';
       params->{$col->{name}} = 'checked'
@@ -66,9 +97,9 @@ hook 'before' => sub {
   }
 
   if (not param('tab') or param('tab') ne 'ports') {
-      params->{'age_num'} = 3;
+      params->{'age_num'} ||= 3;
-      params->{'age_unit'} = 'months';
+      params->{'age_unit'} ||= 'months';
-      params->{'mac_format'} = 'IEEE';
+      params->{'mac_format'} ||= 'IEEE';
   }
 };
 
@@ -76,12 +107,13 @@ hook 'before_template' => sub {
   my $tokens = shift;
 
   # new searches will use these defaults in their sidebars
-  $tokens->{device_ports} = uri_for('/device', {
+  $tokens->{device_ports} = uri_for('/device', { tab => 'ports' });
-    tab => 'ports',
+
-    age_num => 3,
+  # copy ports form defaults into helper values for building template links
-    age_unit => 'months',
+
-    mac_format => 'IEEE',
+  foreach my $key (qw/age_num age_unit mac_format/) {
-  });
+      $tokens->{device_ports}->query_param($key, params->{$key});
+  }
 
   # for Net::MAC method
   $tokens->{mac_format_call} = 'as_'. params->{'mac_format'}
@@ -121,7 +153,10 @@ get '/device' => require_login sub {
     }
 
     params->{'tab'} ||= 'details';
-    template 'device', { d => $dev };
+    template 'device', {
+      d => $dev,
+      device => params->{'tab'},
+    };
 };
 
 true;

Netdisco/lib/App/Netdisco/Web/Search.pm

@@ -105,6 +105,7 @@ get '/search' => require_login sub {
     my $vendor_list = [ $s->resultset('Device')->get_distinct_col('vendor') ];
 
     template 'search', {
+      search => params->{'tab'},
       model_list  => $model_list,
       os_ver_list => $os_ver_list,
       vendor_list => $vendor_list,

Netdisco/share/public/javascripts/jquery.cookie.js

@@ -0,0 +1,96 @@
+/*!
+ * jQuery Cookie Plugin v1.3.1
+ * https://github.com/carhartl/jquery-cookie
+ *
+ * Copyright 2013 Klaus Hartl
+ * Released under the MIT license
+ */
+(function (factory) {
+	if (typeof define === 'function' && define.amd) {
+		// AMD. Register as anonymous module.
+		define(['jquery'], factory);
+	} else {
+		// Browser globals.
+		factory(jQuery);
+	}
+}(function ($) {
+
+	var pluses = /\+/g;
+
+	function decode(s) {
+		if (config.raw) {
+			return s;
+		}
+		return decodeURIComponent(s.replace(pluses, ' '));
+	}
+
+	function decodeAndParse(s) {
+		if (s.indexOf('"') === 0) {
+			// This is a quoted cookie as according to RFC2068, unescape...
+			s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
+		}
+
+		s = decode(s);
+
+		try {
+			return config.json ? JSON.parse(s) : s;
+		} catch(e) {}
+	}
+
+	var config = $.cookie = function (key, value, options) {
+
+		// Write
+		if (value !== undefined) {
+			options = $.extend({}, config.defaults, options);
+
+			if (typeof options.expires === 'number') {
+				var days = options.expires, t = options.expires = new Date();
+				t.setDate(t.getDate() + days);
+			}
+
+			value = config.json ? JSON.stringify(value) : String(value);
+
+			return (document.cookie = [
+				config.raw ? key : encodeURIComponent(key),
+				'=',
+				config.raw ? value : encodeURIComponent(value),
+				options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
+				options.path    ? '; path=' + options.path : '',
+				options.domain  ? '; domain=' + options.domain : '',
+				options.secure  ? '; secure' : ''
+			].join(''));
+		}
+
+		// Read
+		var cookies = document.cookie.split('; ');
+		var result = key ? undefined : {};
+		for (var i = 0, l = cookies.length; i < l; i++) {
+			var parts = cookies[i].split('=');
+			var name = decode(parts.shift());
+			var cookie = parts.join('=');
+
+			if (key && key === name) {
+				result = decodeAndParse(cookie);
+				break;
+			}
+
+			if (!key) {
+				result[name] = decodeAndParse(cookie);
+			}
+		}
+
+		return result;
+	};
+
+	config.defaults = {};
+
+	$.removeCookie = function (key, options) {
+		if ($.cookie(key) !== undefined) {
+			// Must not alter options, thus extending a fresh object...
+			$.cookie(key, '', $.extend({}, options, { expires: -1 }));
+			return true;
+		}
+		return false;
+	};
+
+}));

Netdisco/share/public/javascripts/netdisco.js

@@ -3,28 +3,11 @@
 function do_search (event, tab) {
   var form   = '#' + tab + '_form';
   var target = '#' + tab + '_pane';
+  var query  = $(form).serialize();
 
   // stop form from submitting normally
   event.preventDefault();
 
-  // page title
-  var pgtitle = 'Netdisco';
-  if ($('#nd_device-name').text().length) {
-    var pgtitle = $('#nd_device-name').text() +' - '+ $('#'+ tab + '_link').text();
-  }
-
-  // each sidebar search form has a hidden copy of the main navbar search
-  // query. when the tab query takes place, copy the navbar locally, then
-  // replicate to all other tabs.
-  if (path != 'report' && path != 'admin') {
-    if ($('#nq').val()) {
-      $(form).find("input[name=q]").val( $('#nq').val() );
-    }
-    $('form').find("input[name=q]").each( function() {
-      $(this).val( $(form).find("input[name=q]").val() );
-    });
-  }
-
   // hide or show sidebars depending on previous state,
   // and whether the sidebar contains any content (detected by TT)
   if (has_sidebar[tab] == 0) {
@@ -41,21 +24,6 @@ function do_search (event, tab) {
     }
   }
 
-  // get the form params
-  var query = $(form).serialize();
-
-  // update browser search history with the new query.
-  // however if it's the same tab, this is a *replace* of the query url.
-  // and just skip this bit if it's the report or admin display.
-  if (path != 'report' && path != 'admin' && window.History && window.History.enabled) {
-    is_from_history_plugin = 1;
-    window.History.replaceState(
-      {name: tab, fields: $(form).serializeArray()},
-      pgtitle, uri_base + '/' + path + '?' + query
-    );
-    is_from_history_plugin = 0;
-  }
-
   // in case of slow data load, let the user know
   $(target).html(
     '<div class="span2 alert">Waiting for results...</div>'

Netdisco/share/views/js/common.js

@@ -1,22 +1,90 @@
+  function update_page_title (tab) {
+    var pgtitle = 'Netdisco';
+    if ($('#nd_device-name').text().length) {
+      var pgtitle = $('#nd_device-name').text() +' - '+ $('#'+ tab + '_link').text();
+    }
+    return pgtitle;
+  }
+
+  // update browser search history with the new query.
+  // however if it's the same tab, this is a *replace* of the query url.
+  // and just skip this bit if it's the report or admin display.
+  function update_browser_history (tab, pgtitle) {
+    var form = '#' + tab + '_form';
+    var query = $(form).serialize();
+
+    if (window.History && window.History.enabled) {
+      is_from_history_plugin = 1;
+      window.History.replaceState(
+        {name: tab, fields: $(form).serializeArray()},
+        pgtitle, uri_base + '/' + path + '?' + query
+      );
+      is_from_history_plugin = 0;
+    }
+  }
+
+  // each sidebar search form has a hidden copy of the main navbar search
+  // query. when the tab query takes place, copy the navbar locally, then
+  // replicate to all other tabs.
+  function copy_navbar_to_sidebar (tab) {
+    var form = '#' + tab + '_form';
+
+    if ($('#nq').val()) {
+      $(form).find("input[name=q]").val( $('#nq').val() );
+    }
+    $('form').find("input[name=q]").each( function() {
+      $(this).val( $(form).find("input[name=q]").val() );
+    });
+  }
+
   $(document).ready(function() {
+    [% IF search %]
     // search tabs
     [% FOREACH tab IN settings._search_tabs %]
-    $('[% "#${tab.tag}_form" %]').submit(function(event){ do_search(event, '[% tab.tag %]'); });
+    $('[% "#${tab.tag}_form" %]').submit(function (event) {
+      var pgtitle = update_page_title('[% tab.tag %]');
+      update_browser_history('[% tab.tag %]', pgtitle);
+      copy_navbar_to_sidebar('[% tab.tag %]');
+      do_search(event, '[% tab.tag %]');
+    });
+    [% END %]
     [% END %]
 
+    [% IF device %]
     // device tabs
     [% FOREACH tab IN settings._device_tabs %]
-    $('[% "#${tab.tag}_form" %]').submit(function(event){ do_search(event, '[% tab.tag %]'); });
+    $('[% "#${tab.tag}_form" %]').submit(function (event) {
+      var pgtitle = update_page_title('[% tab.tag %]');
+      update_browser_history('[% tab.tag %]', pgtitle);
+      copy_navbar_to_sidebar('[% tab.tag %]');
+      [% IF tab.tag == 'ports' %]
+      var cookie = $('#ports_form').find('input,select')
+        .not('#nd_port-query,input[name="q"],input[name="tab"]')
+        .serializeArray();
+      $('#ports_form').find('input[type="checkbox"]').map(function() {
+        cookie.push({'name': 'columns', 'value': $(this).attr('name')});
+      });
+      $.cookie('nd_ports-form', $.param(cookie) ,{ expires: 365 });
+      [% END %]
+      do_search(event, '[% tab.tag %]');
+    });
+    [% END %]
     [% END %]
 
     [% IF report %]
     // for the report pages
-    $('[% "#${report.tag}_form" %]').submit(function(event){ do_search(event, '[% report.tag %]'); });
+    $('[% "#${report.tag}_form" %]').submit(function (event) {
+      update_page_title('[% tab.tag %]');
+      do_search(event, '[% report.tag %]');
+    });
     [% END -%]
 
     [% IF task %]
     // for the admin pages
-    $('[% "#${task.tag}_form" %]').submit(function(event){ do_search(event, '[% task.tag %]'); });
+    $('[% "#${task.tag}_form" %]').submit(function (event) {
+      update_page_title('[% tab.tag %]');
+      do_search(event, '[% task.tag %]');
+    });
     [% END %]
 
     // on page load, load the content for the active tab

Netdisco/share/views/layouts/main.tt

@@ -15,6 +15,7 @@
 <!--  <script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.1.1.js"></script> -->
   <script type="text/javascript" src="[% uri_base %]/javascripts/jquery-ui.custom.min.js"></script>
   <script type="text/javascript" src="[% uri_base %]/javascripts/jquery-history.js"></script>
+  <script type="text/javascript" src="[% uri_base %]/javascripts/jquery.cookie.js"></script>
   <script type="text/javascript" src="[% uri_base %]/javascripts/jquery-deserialize.js"></script>
   <script type="text/javascript" src="[% uri_base %]/javascripts/bootstrap.min.js"></script>
   <script type="text/javascript" src="[% uri_base %]/javascripts/underscore.min.js"></script>