Merge pull request #65 from jnew-gh/options_page

Implement cookie-based options page

9 files changed, 1099 insertions, 193 deletions

diff --git a/default.css b/default.css
index 334df25..d6e1ac3 100644
--- a/default.css
+++ b/default.css
@@ -49,6 +49,22 @@ a {
   color: var(--link);

 }

 

+option.green {

+	background-color: var(--green);

+}

+

+option.yellow {

+	background-color: var(--yellow);

+}

+

+option.orange {

+	background-color: var(--orange);

+}

+

+option.red {

+	background-color: var(--red);

+}

+

 a:visted {

   color: var(--link_visited);

 }

@@ -70,6 +86,52 @@ a:visted {
     z-index: 1;

 }

 

+table.optionlist tr.option_title {

+	font-size: 120%;

+	font-weight: bold;

+	text-align: left;

+	background-color: var(--header);

+}

+

+table.optionlist {

+	margin: auto;

+	border-spacing: 0 15px;

+	clear: both;

+	cursor: inherit;

+}

+

+table.optionlist td {

+	padding-right: 10px;

+	vertical-align: baseline;

+	padding-left: 10px;

+}

+

+table.optionlist td.left_column {

+	padding-right: 10px;

+	padding-left: 10px;

+	vertical-align: baseline;

+	border-right: 1px solid  var(--text);

+	width: 50%

+}

+

+table.optionlist td.right_column {

+	vertical-align: middle;

+}

+table.optionlist td {

+	vertical-align: baseline;

+}

+

+table.optionlist span.bold {

+	vertical-align: baseline;

+	font-weight: bold;

+}

+

+.option_description {

+	font-family: sans-serif;

+	font-size: 95%;

+	font-style: italic;

+}

+

 table.reportlist {

 	margin: auto;

 	border-collapse: collapse;

@@ -201,8 +263,8 @@ table.reportdata td.yellow {
 	text-align: center;

 	border-top: 2px solid var(--shadow);

 	width: 100%;

-	margin: 10px auto 0px auto;

-	padding-top: 10px;

+	margin: 0px auto;

+	padding: 10px 0px;

 	position: fixed;

 	bottom: 0;

 	background-color: var(--background);

@@ -230,6 +292,57 @@ table.reportdata td.yellow {
 	cursor: default;

 }

 

+.menu_icon {

+	display: inline-block;

+	cursor: default;

+	font-size: 300%;

+}

+

+.menu_icon:hover{

+	/* font-weight: bold; */

+	background-color: var(--selected);

+}

+

+.menu {

+  font-family: arial, sans-serif;

+  color: var(--text);

+  position: absolute;

+  display: none;

+  z-index: 2;

+  background: var(--hover);

+  margin-top: 5px; /* Controls how close the main bubble is the the calling div */

+  border-radius: 2px;

+  box-shadow: 7px 7px 3px var(--shadow);

+}

+

+/* menu callout tail */

+.menu::after {

+  position: absolute;

+  content: '';

+  border: 15px solid transparent; /* The 'border-width' property controls the size of the tail and should be the same as .top.menu::after {top: } */

+}

+

+/* Tail position on top */

+.top.menu::after {

+  /* up triangle */

+  border-bottom-color: var(--hover);

+  border-top: 0;

+  top: -15px;	/* Controls how close the tail is to the main bubble and should be the same as .menu::after {border-width:} */

+  left: 95%;	/* Controls how close the tail is to the right corner of the main bubble */

+  margin-left: -20px;

+}

+

+.menu_option {

+	width: 100%;

+	padding: 7px 0;

+	margin-right: 20px;

+	cursor: default;

+}

+

+.menu_option:hover {

+	background-color: var(--selected);

+}

+

 .center {

 	text-align: center;

 }

diff --git a/dmarcts-report-viewer-common.php b/dmarcts-report-viewer-common.php
index 3e6b3d2..47146c3 100644
--- a/dmarcts-report-viewer-common.php
+++ b/dmarcts-report-viewer-common.php
@@ -34,6 +34,8 @@
 //### variables ######################################################
 //####################################################################
 
+$cookie_name = "dmarcts-options";
+
 // The order in which the options appear here is the order they appear in the DMARC Results dropdown box
 $dmarc_result = array(
 
@@ -67,6 +69,170 @@ $dmarc_result = array(
 	),
 );
 
+// Sortable Report List column headers
+// --------------------------------------------------------------------------
+// Array to be used in 'Default sort column' option in dmarcts-report-viewer-options.php
+
+$report_list_columns = array(
+	"mindate" => "Start Date",
+	"maxdate" => "End Date",
+	"domain" => "Domain",
+	"org" => "Reporter",
+	"reportid" => "Report ID",
+	"rcount" => "# Messages"
+);
+
+// Program Options
+// --------------------------------------------------------------------------
+
+// When a new option is added, check the size of the cookie stored. The cookie size should be less than half of the maximum cookie size allowed per domain.
+// Less than half because sometimes the cookie is stored twice (once as dmarcts-options and once as dmarcts-options-tmp). Most browsers have a cookie limit of 4KB.
+// Currently, the following options generate a cookie of about 0.5KB
+
+// Option Names must be unique.
+// The order in which the options appear below is the order they are rendered in the browser.
+// If sections are re-arranged, you don't have to re-name the corresponding heading (i.e. the heading option name (e.g. option_group_3_heading)) because it has no bearing on the order rendered in the browser.
+$options = array(
+	"option_group_1_heading" => array(
+			"option_type" => "heading",
+			"option_label" => "Appearance",
+			"option_values" => "",
+			"option_value" => "",
+			"option_description" => "",
+	),
+	"cssfile" => array(
+			"option_type" => "select",
+			"option_label" => "Default css file",
+			"option_values" => "\$cssfiles",
+			"option_value" => "default.css",
+			"option_description" => "Name of the css file to be used.<br>The dropdown list is automatically generated from any css files in the main dmarcts-report-viewer directory. The css is immediately applied to this page when selected.",
+	),
+	// This option will be implemented in a future version of dmarcts-reports-viewer.
+	// "xml_data_highlight" => array(
+	// 		"option_type" => "radio",
+	// 		"option_label" => "Use Report Data to Raw XML Highlighting",
+	// 		"option_values" => array(1,"On",0,"Off"),
+	// 		"option_value" => "1",
+	// 		"option_description" => "When the raw XML view is open, and when the mouse hovers over, or clicks on, a line of the Report Data table or the Report Data description, highlight the section in the raw XML that corresponds to that row or description. Also works in the opposite direction (i.e. hover/click on a XML record to highlight the corresponding Report Data table line or description). Facilitates determining which XML record corresponds to which line of the table.",
+	// ),
+	// This option will be implemented in a future version of dmarcts-reports-viewer.
+	// "xml_data_hljs" => array(
+	// 		"option_type" => "radio",
+	// 		"option_label" => "Use XML Syntax Highlighting",
+	// 		"option_values" => array(1,"On",0,"Off"),
+	// 		"option_value" => "1",
+	// 		"option_description" => "Use syntax highlighting on the Raw XML. This uses a small external javascript file which may or may not slow down the program.",
+	// ),
+	"option_group_2_heading" => array(
+			"option_type" => "heading",
+			"option_label" => "Filters",
+			"option_values" => "",
+			"option_value" => "",
+			"option_description" => "Default filters",
+	),
+	"DMARC" => array(
+			"option_type" => "select",
+			"option_label" => "Default DMARC Result",
+			"option_values" => "\$dmarc_result_select",
+			"option_value" => "all",
+			"option_description" => "Default for DMARC Result drop-down list.",
+	),
+	"dmarc_results_matching_only" => array(
+			"option_type" => "radio",
+			"option_label" => "Show Only Matching Report Data records.",
+			"option_values" => array(1,"On",0,"Off"),
+			"option_value" => 0,
+			"option_description" => "When enabled, only those records matching the DMARC Results dropdown box are shown in the Report Data table.",
+	),
+	"ReportStatus" => array(
+			"option_type" => "select",
+			"option_label" => "Default Report Data Status",
+			"option_values" => "\$report_status_select",
+			"option_value" => "all",
+			"option_description" => "Default for Report Data Status drop-down list.",
+	),
+	"Period" => array(
+			"option_type" => "radio",
+			"option_label" => "Default period",
+			"option_values" => array(0,"All",1,"Current Month"),
+			"option_value" => 1,
+			"option_description" => "Default for the Month drop-down.",
+	),
+	"Domain" => array(
+			"option_type" => "select",
+			"option_label" => "Default domain",
+			"option_values" => "\$domains",
+			"option_value" => "all",
+			"option_description" => "Default for the Domain(s) drop-down list.",
+	),
+	"Organisation" => array(
+			"option_type" => "select",
+			"option_label" => "Default reporter",
+			"option_values" => "\$orgs",
+			"option_value" => "all",
+			"option_description" => "Default for the Reporter(s) drop-down list.",
+	),
+	"option_group_3_heading" => array(
+			"option_type" => "heading",
+			"option_label" => "Initial Settings",
+			"option_values" => "",
+			"option_value" => "",
+			"option_description" => "Startup Defaults",
+	),
+	"HostLookup" => array(
+			"option_type" => "radio",
+			"option_label" => "Host lookup",
+			"option_values" => array(1,"On",0,"Off"),
+			"option_value" => 1,
+			"option_description" => "Turning off host lookup speeds up the display of the results, especially in the case of mail servers that have ceased to exist.",
+	),
+	"report_list_height_percent" => array(
+			"option_type" => "number",
+			"option_label" => "Report List - Initial Height",
+			"option_values" => array("units"=>"percent","min"=>"0","max"=>100),
+			"option_value" => 60,
+			"option_description" => "Initial height of the Report List window, a percentage of the height of the main browser window.",
+	),
+	"sort_column" => array(
+			"option_type" => "select",
+			"option_label" => "Default sort column",
+			"option_values" => "\$report_list_columns",
+			"option_value" => "maxdate",
+			"option_description" => "Report List column to sort initially.",
+	),
+	"sort" => array(
+			"option_type" => "radio",
+			"option_label" => "Default sort order",
+			"option_values" => array(1,"Ascending",0,"Descending"),
+			"option_value" => 0,
+			"option_description" => "Default sort order of Report List column chosen above.",
+	),
+	"xml_data_open" => array(
+			"option_type" => "radio",
+			"option_label" => "Show Report Data XML",
+			"option_values" => array(1,"On",0,"Off"),
+			"option_value" => 0,
+			"option_description" => "When a report is selected in the Report List, automatically open the XML view along with the Report Table.",
+	),
+	"report_data_xml_width_percent" => array(
+			"option_type" => "number",
+			"option_label" => "Report Data XML - Initial Width",
+			"option_values" => array("units"=>"percent","min"=>"0","max"=>"100"),
+			"option_value" => 25,
+			"option_description" => "Initial width of the Report Data XML window when it is opened, a percentage of the width of the main browser window.",
+	)
+	// This option will be implemented in a future version of dmarcts-reports-viewer.
+	// ),
+	// "alignment_unknown" => array(
+	// 		"option_type" => "radio",
+	// 		"option_label" => "Unknown SPF/DKIM Alignments",
+	// 		"option_values" => array(1,"Consider \"Failed\"",0,"Keep as \"Unknown\""),
+	// 		"option_value" => "0",
+	// 		"option_description" => "The DMARC specification dictates that reporting SPF/DKIM alignments is mandatory. However, there could be a situation where this information is not included. This option specifies whether or not those unknown results are included as an \"alignment failure\" or remain as \"unknown\".",
+	// )
+);
+
+
 //####################################################################
 //### functions ######################################################
 //####################################################################
@@ -170,3 +336,70 @@ function format_date($date, $format) {
     $answer = date($format, strtotime($date));
     return $answer;
 };
+
+// Get all configuration options
+// --------------------------------------------------------------------------
+function configure() {
+
+	global $cookie_name;
+	global $cookie_options;
+	global $options;
+
+	$option = array_keys($options);
+	$cookie_options = array();
+	$cookie_timeout = 60*60*24*365;
+
+	if(!isset($_COOKIE[$cookie_name]) || $_COOKIE[$cookie_name] == "" ) {
+		// No Cookie
+		foreach ($option as $option_name) {
+			if ( $options[$option_name]['option_type'] != "heading" ) {
+				$cookie_options += array($option_name => $options[$option_name]['option_value']);
+			// 		foreach($options[$option_name] as $key=>$value) {
+			}
+		}
+		setcookie($cookie_name, json_encode($cookie_options), time() + $cookie_timeout, "/");
+	} else {
+		// Cookie exists
+		if ($_SERVER["REQUEST_METHOD"] == "POST") {
+			// POST
+			foreach ($option as $option_name) {
+				if ( $options[$option_name]['option_type'] != "heading" ) {
+					if ( is_null($_POST[$option_name]) ) {
+						$cookie_options += array($option_name => "");
+					} else {
+						$cookie_options += array($option_name => test_input($_POST[$option_name]));
+					}
+				}
+			}
+			setcookie($cookie_name, json_encode($cookie_options), time() + $cookie_timeout, "/");
+			header("Location: dmarcts-report-viewer.php");
+			exit;
+		} else {	// Not POST
+			$cookie_options = json_decode($_COOKIE[$cookie_name], true);
+
+			// Check if any options have been removed or added to $options[]
+			// Update $cookie_options with any new options from $options (excluding headings)
+			foreach ($option as $option_name) {
+				if ( $options[$option_name]['option_type'] != "heading" && is_null($cookie_options[$option_name]) ) {
+					$cookie_options[$option_name] = $options[$option_name]['option_value'];
+				}
+			}
+			// Remove any options from $cookie_options which are not in $options
+			foreach ($cookie_options as $key => $value) {
+				if ( $options[$key] == null ) {
+					unset($cookie_options[$key]);
+				}
+			}
+			setcookie($cookie_name, json_encode($cookie_options), time() + $cookie_timeout, "/");
+		}
+	}
+}
+
+function test_input($data) {
+
+  $data = trim($data);
+  $data = stripslashes($data);
+  $data = htmlspecialchars($data);
+
+  return $data;
+}
diff --git a/dmarcts-report-viewer-config.php.sample b/dmarcts-report-viewer-config.php.sample
index d74de4a..c0e0771 100644
--- a/dmarcts-report-viewer-config.php.sample
+++ b/dmarcts-report-viewer-config.php.sample
@@ -10,29 +10,4 @@ $dbuser="dmarc";
 $dbpass="xxx";
 $dbport="3306";
 
-$cssfile="default.css";
-
-$default_hostlookup = 1;  // Hostname resolution: 1=on 0=off (Turning off host lookup greatly speeds up the program in the case of mail servers that have ceased to exist)
-$default_sort = 1;  // Report listing Start Date: 1=ASCdending 0=DESCending (ASCending is default behaviour )
-
-
-// configure defaults (used on initial page load) for drop-downs
-
-// default for drop-down 'Domain(s)'
-// $default_domain = 'example.org';
-
-// default for drop-down ''Reporter(s)'
-// $default_reporter = 'google.com';
-
-// default for drop-down 'DMARC Result'
-// one of:
-// - DKIM_AND_SPF_PASS
-// - DKIM_OR_SPF_FAIL
-// - DKIM_AND_SPF_FAIL
-// - OTHER_CONDITION
-// $default_dmarc_result = 'DKIM_AND_SPF_FAIL';
-
-// show only records of a report that match the 'DMARC Result' drop-down?
-// $dmarc_results_matching_only = 0;
-
 ?>
diff --git a/dmarcts-report-viewer-options.php b/dmarcts-report-viewer-options.php
new file mode 100644
index 0000000..7aed408
--- /dev/null
+++ b/dmarcts-report-viewer-options.php
@@ -0,0 +1,351 @@
+<?php
+
+// dmarcts-report-viewer - A PHP based viewer of parsed DMARC reports.
+// Copyright (C) 2016 TechSneeze.com, John Bieling and John P. New
+// with additional extensions (sort order) of Klaus Tachtler.
+//
+// Available at:
+// https://github.com/techsneeze/dmarcts-report-viewer
+//
+// This program is free software: you can redistribute it and/or modify it
+// under the terms of the GNU General Public License as published by the Free
+// Software Foundation, either version 3 of the License, or (at your option)
+// any later version.
+//
+// This program is distributed in the hope that it will be useful, but WITHOUT
+// ANY WARRANTY; without even the implied warranty of  MERCHANTABILITY or
+// FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
+// more details.
+//
+// You should have received a copy of the GNU General Public License along with
+// this program.  If not, see <http://www.gnu.org/licenses/>.
+//
+//####################################################################
+//### configuration ##################################################
+//####################################################################
+
+// Copy dmarcts-report-viewer-config.php.sample to
+// dmarcts-report-viewer-config.php and edit with the appropriate info
+// for your database authentication and location.
+//
+// Edit the configuration variables in dmarcts-report-viewer.js with your preferences.
+//
+//####################################################################
+//### functions ######################################################
+//####################################################################
+
+function html ($domains = array(), $orgs = array(), $dmarc_result_select = array(), $report_status_select = array(), $report_list_columns = array(), $cssfiles = array() ) {
+
+	global $dmarc_result;
+	global $options;
+	global $cookie_options;
+
+	global $html;
+
+	$html[] = "<!DOCTYPE html>";
+	$html[] = "<html>";
+	$html[] = "	<head>";
+	$html[] = "		<title>DMARC Report Viewer</title>";
+	$html[] = "		<link id='css_stylesheet' rel='stylesheet' href='" . $cookie_options["cssfile"] . "'>";
+	$html[] = "		<script src='dmarcts-report-viewer.js'></script>";
+	$html[] = "		<meta charset=\"UTF-8\" />";
+	$html[] = "		<meta name='google' content='notranslate' />";
+	$html[] = "		<meta http-equiv=\"Content-Language\" content=\"en_US\" />";
+	$html[] = "	</head>";
+
+	$html[] = "	<body id='body')>";
+
+// 	if ($_SERVER["REQUEST_METHOD"] == "POST") {
+// 		$html[] = "<div  style='top: 0px;left: 0px;height: 100%;width: 100%;position: absolute;display: block;z-index: 1;align-items: center;display: flex;justify-content: center;height: 50%;'>";
+// 		$html[] = "<div style='padding: 20px;background-color: whitesmoke;border: 1px solid black;border-radius: 2px;box-shadow: 7px 7px 3px grey;text-align: center;'>";
+// 		$html[] = "Your settings have been saved to the database.<br><br>";
+// 		$html[] = "<button type=\"button\" onclick=\"window.location.href = 'dmarcts-report-viewer.php';\" title=\"Return to Reports\">Return to Reports</button>&nbsp;";
+// 		$html[] = "<button type=\"button\" onclick=\"window.location.href = 'dmarcts-report-viewer-options.php';\" title=\"Return to Options.\">Return to Options</button>";
+// 		$html[] = "</div>";
+// 		$html[] = "</div>";
+// 		$filter = "style='filter: blur(3px);opacity: 50%;'";
+// 	}
+// 	Note: If the above is implemented, and a blur effect behind the dialog is wanted, instead of using the $filter method, simply use backdrop-filter/-webkit-backdrop-filter on screen_overlay (see https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter)
+
+	$html[] = "		<div id='title' class='title'>DMARCTS Options</div>";
+
+	$html[] = "		<form method='post'>";
+	$html[] = "			<table class='optionlist'>";
+
+	$option = array_keys($options);
+
+	foreach ($option as $option_name) {
+		foreach($options[$option_name] as $key=>$value) {
+			switch ($options[$option_name]['option_type']) {
+				case "heading":
+					create_heading($options[$option_name]['option_label']);
+					break 2;
+				case "text":
+				case "number":
+					create_input_text($option_name, $options[$option_name]);
+					break 2;
+				case "radio":
+				case "checkbox":
+					create_input_radio($option_name);
+					break 2;
+				case "select":
+					// For a select option, the option_values column contains the name of an array variable, e.g.$org, that is built in dmarcts-report-viewer.php
+					$var = str_replace("$", "", $options[$option_name]['option_values']);	// Remove the '$', so e.g. '$org' becomes 'org'
+					create_select($option_name, $options[$option_name], $$var);	// Double $$ explanation: $var = org, so $$var = ${$var} = ${org} = $org
+					break 2;
+				default:
+					break 2;
+			}
+		}
+	}
+	$html[] = "			</table>";
+
+	$html[] = "			<div style='text-align: center;'>";
+	$html[] = "				<button type=\"button\" onclick=\"cancelOptions();\" title=\"Cancel changes and return to reports.\">Cancel</button>";
+
+	$html[] = "				<button type=\"button\" onclick=\"resetOptions()\" title=\"Reset all options to their default values.\">Reset</button>";
+	$html[] = "				<input type=\"submit\" title=\"Save changes and return to reports.\" value=\"Save\">";
+	$html[] = "			</div>";
+	$html[] = "		</form>";
+	$html[] = "		<br /><br />";
+
+	//	Page Footer
+	//	--------------------------------------------------------------------------
+	$html[] = "		<div id='footer' class='footer'>&copy; 2016-" . date("Y") . " by <a href='http://www.techsneeze.com'>TechSneeze.com</a>, John Bieling and <a href='mailto:dmarcts-report-viewer@hazelden.ca'>John P. New</a>.</div>";
+	$html[] = "	</body>";
+	$html[] = "</html>";
+
+	return implode("\n",$html);
+}
+
+function create_heading($option_label) {
+
+	global $html;
+
+	$html[] = "				<tr class='option_title'>";
+	$html[] = "					<td colspan='2'>";
+	$html[] = "						<span>" . $option_label . "</span>";
+	$html[] = "					</td>";
+	$html[] = "				</tr>";
+}
+
+function create_input_text($option_name, $option = array()) {
+
+	global $html;
+	global $cookie_options;
+
+	$extra_options = "";
+	$after = "";
+
+	$values = $option["option_values"];
+
+	if (isset($cookie_options[$option_name]) ) {
+		$value = "value='" . $cookie_options[$option_name] . "'";
+	} else {
+		$value = "";
+	}
+	$html[] = "				<tr>";
+	$html[] = "					<td class='left_column'>";
+	$html[] = "						<span class='bold'><label for=" . $option_name . ">" . $option["option_label"] . " </label></span>";
+	$html[] = "						<br>";
+	$html[] = "						<span class='option_description'>" . $option["option_description"] . "</span>";
+	$html[] = "					</td>";
+	$html[] = "					<td class='right_column'>";
+
+	switch ($option["option_type"]) {
+		case "number":
+			if ( $values['min'] != "" && $values['max'] != "" ) {
+				$extra_options = " min='" . $values['min'] . "' max='" . $values['max'] . "'";
+			}
+			if ( $values['units'] != "" ) {
+				$after = " " . $values['units'];
+			}
+			break;
+		default:
+			break;
+	}
+
+	$html[] = "						<input $value type=" . $option["option_type"] . " id=" . $option_name . " name=" . $option_name . $extra_options . ">" . $after . "<br>";
+	$html[] = "					</td>";
+	$html[] = "				</tr>";
+}
+
+function create_input_radio($option_name) {
+
+	global $html;
+	global $options;
+	global $cookie_options;
+
+	$values = $options[$option_name]["option_values"];
+	$html[] = "				<tr>";
+	$html[] = "					<td class='left_column'>";
+	$html[] = "						<span  class='bold'>" . $options[$option_name]["option_label"] . "</span>";
+	$html[] = "						<br>";
+	$html[] = "						<span class='option_description'>" . $options[$option_name]["option_description"] . "</span>";
+	$html[] = "					</td>";
+	$html[] = "					<td class='right_column'>";
+	for ($i = 0; $i < sizeof($values); $i+=2) {
+		$html[] =	"						<input type=" . $options[$option_name]["option_type"] . " id=" . strtolower(str_replace(" ", "_", $values[$i+1])) . " name=" . $option_name . ($options[$option_name]["option_type"] == "checkbox" ? "[]" : "" ) . " value='" . $values[$i] . "'" . checked($option_name, $values[$i]) . "><label for=" . $option_name . ">" . $values[$i+1] . " </label><br />";
+	}
+	$html[] = "					</td>";
+	$html[] = "				</tr>";
+}
+
+function checked($option_name, $values) {
+
+	global $options;
+	global $cookie_options;
+	$option_values = $options[$option_name]["option_values"];
+
+	if ( is_array($cookie_options[$option_name]) ) {
+		foreach ( $cookie_options[$option_name] as $cookie_option_value ) {
+			if ( $cookie_option_value == $values ) {
+				return " checked=\"checked\"";
+			}
+		}
+	} else {
+		if ( $cookie_options[$option_name] == $values ) {
+			return " checked=\"checked\"";
+		}
+	}
+}
+
+function create_select($option_name, $option = array(), $var) {
+
+	global $html;
+	global $cookie_options;
+	// $ var is the array variable, e.g. $org
+
+	$values = $option["option_values"];
+	$selected = "";
+	$js = "";
+
+	$html[] = "					<tr>";
+	$html[] = "						<td class='left_column'>";
+	$html[] = "							<span  class='bold'><label for=" . $option_name . ">" . $option["option_label"] . " </label></span>";
+	$html[] = "							<br>";
+	$html[] = "							<span class='option_description'>" . $option["option_description"] . "</span>";
+	$html[] = "						</td>";
+	$html[] = "					<td class='right_column'>";
+
+	if ( $option_name == "cssfile" ) {
+		$js = " onchange='change_stylesheet();'";
+	}
+
+	$html[] = "						<select name='" . $option_name . "' id='sel" . $option_name . "'" . $js . ">";
+	foreach ($var as $key => $value) {
+		if ( $cookie_options[$option_name] == $key ) {
+			$selected = "selected";
+		} else {
+			$selected = "";
+		}
+		$html[] =	"							<option value='" . $key . "' " . $selected . ">" . $value . "</option>";
+	}
+
+	$html[] = "					</td>";
+	$html[] = "				</tr>";
+}
+
+
+//####################################################################
+//### main ###########################################################
+//####################################################################
+
+// These files must exist, in the same folder as this script.
+include "dmarcts-report-viewer-config.php";
+include "dmarcts-report-viewer-common.php";
+
+// Get all configuration options
+// --------------------------------------------------------------------------
+configure();
+
+
+// Make a MySQL Connection using mysqli
+// --------------------------------------------------------------------------
+$mysqli = new mysqli($dbhost, $dbuser, $dbpass, $dbname, $dbport);
+if ($mysqli->connect_errno) {
+	echo "Error: Failed to make a MySQL connection<br />";
+	echo "Errno: " . $mysqli->connect_errno . " ";
+	echo "Error: " . $mysqli->connect_error . " ";
+// Debug ONLY. This will expose database credentials when database connection fails
+// 	echo "Database connection information: <br />dbhost: " . $dbhost . "<br />dbuser: " . $dbuser . "<br />dbpass: " . $dbpass . "<br />dbname: " . $dbname . "<br />dbport: " . $dbport . "<br />";
+	exit;
+}
+
+
+// Get all css files in dmartcts directory
+// --------------------------------------------------------------------------
+$cssfiles = array();
+$dir = dirname(__FILE__);
+$scan_arr = scandir($dir);
+$files_arr = array_diff($scan_arr, array('.','..') );
+
+foreach ($files_arr as $file) {
+	$file_ext = pathinfo($file, PATHINFO_EXTENSION);
+	if ( $file_ext=="css" ) {
+		$cssfiles[$file] = $file;
+	}
+}
+
+
+// Get all domains reported
+// --------------------------------------------------------------------------
+$sql="
+SELECT
+	DISTINCT domain
+FROM
+	report
+ORDER BY domain";
+
+$query = $mysqli->query($sql) or die("Query failed: ".$mysqli->error." (Error #" .$mysqli->errno.")");
+
+$domains['all'] = "[all]";
+while($row = $query->fetch_assoc()) {
+	$domains[$row['domain']] = $row['domain'];
+}
+
+// Get all reporters
+// --------------------------------------------------------------------------
+$sql="
+SELECT
+	DISTINCT org
+FROM
+	report
+ORDER BY org";
+
+
+$i = 1;
+$dmarc_result_select['all'] = "[all]";
+foreach($dmarc_result as $key => $value) {
+			$dmarc_result_select[$key] = $value['text'];
+			$i++;
+}
+
+
+$i = 1;
+$report_status_select['all'] = "[all]";
+foreach($dmarc_result as $key => $value) {
+			$report_status_select[$key] = $value['status_text'];
+			$i++;
+}
+
+
+$query = $mysqli->query($sql) or die("Query failed: ".$mysqli->error." (Error #" .$mysqli->errno.")");
+$orgs['all'] = "[all]";
+while($row = $query->fetch_assoc()) {
+	$orgs[$row['org']] = $row['org'];
+}
+
+
+// Generate Page with report list and report data (if a report is selected).
+// --------------------------------------------------------------------------
+echo html(
+	$domains,
+	$orgs,
+	$dmarc_result_select,
+	$report_status_select,
+	$report_list_columns,
+	$cssfiles
+);
+// }
+?>
diff --git a/dmarcts-report-viewer-report-data.php b/dmarcts-report-viewer-report-data.php
index 107e9d1..1d5e4da 100644
--- a/dmarcts-report-viewer-report-data.php
+++ b/dmarcts-report-viewer-report-data.php
@@ -38,6 +38,7 @@
 function tmpl_reportData($reportnumber, $reports, $host_lookup = 1) {
 
 	global $dmarc_where;
+	global $cookie_options;
 
 	$title_message = "Click to toggle sort direction by this column";
 
@@ -60,7 +61,7 @@ function tmpl_reportData($reportnumber, $reports, $host_lookup = 1) {
 		$reportdata[] = "<div id='report_desc_container' class='center reportdesc_container'>";
 		$reportdata[] = "<div id='report_desc' class='center reportdesc'>Report from ".$row['org']." for ".$row['domain']."<br>(". format_date($row['mindate'], "r" ). " - ".format_date($row['maxdate'], "r" ).")<br> Policies: adkim=" . $row['policy_adkim'] . ", aspf=" . $row['policy_aspf'] .  ", p=" . $row['policy_p'] .  ", sp=" . $row['policy_sp'] .  ", pct=" . $row['policy_pct'] . "</div>";
 
-		$reportdata[] = "<div style='display:inline-block;margin-left:20px;'><img src='xml.png' id='xml_html_img' width='30px' alt='Show Raw Report XML' title='Show Raw Report XML' onclick='showXML()'></div>";
+		$reportdata[] = "<div style='display:inline-block;margin-left:20px;'><img src='xml.png' id='xml_html_img' width='30px' alt='Show Raw Report XML' title='Show Raw Report XML' onclick='report_data_xml_display_toggle()'></div>";
 
 		$reportdata[] = "</div>";
 
@@ -73,6 +74,9 @@ function tmpl_reportData($reportnumber, $reports, $host_lookup = 1) {
 	$reportdata[] = "</div>";
 
 	$reportdata[] = "<div id='report_data_table_div' style='overflow-y:auto;'>";
+	if ( $cookie_options['dmarc_results_matching_only'] ) {
+		$reportdata[] = "\"Show Only Matching Report Data records\" option is \"On\".<br>Report records may not be all displayed.";
+	}
 	$reportdata[] = "<table id='report_data_table' class='reportdata'>";
 	$reportdata[] = "  <thead>";
 	$reportdata[] = "    <tr>";
@@ -129,9 +133,6 @@ ORDER BY
 	ip ASC
 ";
 
-// Debug
-// echo "<br><b>sql reportdata =</b> $sql<br>";
-
 	$query = $mysqli->query($sql) or die("Query failed: ".$mysqli->error." (Error #" .$mysqli->errno.")");
 	while($row = $query->fetch_assoc()) {
 		if ( $row['ip'] ) {
@@ -172,7 +173,6 @@ ORDER BY
 
 	$reportdata[] = "</div>";
 
-
 	$reportdata[] = "";
 
 	#indent generated html by 2 extra spaces
@@ -180,6 +180,7 @@ ORDER BY
 }
 
 function formatXML($xml) {
+
 	$dom = new DOMDocument();
 
 	// Initial block (must before load xml string)
@@ -201,6 +202,11 @@ function formatXML($xml) {
 include "dmarcts-report-viewer-config.php";
 include "dmarcts-report-viewer-common.php";
 
+// Get all configuration options
+// --------------------------------------------------------------------------
+configure();
+
+
 // Parameters of GET
 // --------------------------------------------------------------------------
 
@@ -228,7 +234,7 @@ if(isset($_GET['sortorder']) && is_numeric($_GET['sortorder'])){
 	die('Invalid sortorder flag');
 }
 
-if($dmarc_results_matching_only && isset($_GET['dmarc'])){
+if( $cookie_options['dmarc_results_matching_only'] && isset($_GET['dmarc']) ) {
 	$dmarc_select=$_GET['dmarc'];
 }else{
 	$dmarc_select= '';
diff --git a/dmarcts-report-viewer-report-list.php b/dmarcts-report-viewer-report-list.php
index 82bf647..50f15a6 100644
--- a/dmarcts-report-viewer-report-list.php
+++ b/dmarcts-report-viewer-report-list.php
@@ -37,6 +37,9 @@
 
 function tmpl_reportList($reports, $sort) {
 
+	global $options;
+	global $cookie_options;
+
     $reportlist[] = "";
 
 	if (sizeof($reports) == 0) {
@@ -44,7 +47,7 @@ function tmpl_reportList($reports, $sort) {
 	} else {
 		$title_message_th = "Click to toggle sort direction by this column.";
 		$title_message_tr = "Click to view detailed report data.";
-	// echo $sort;
+
 		//	Resizer handles
 		//	--------------------------------------------------------------------------
 		$reportlist[] = "<div id='resizer_horizontal' class='resizer resizer_horizontal'></div>";
@@ -52,15 +55,17 @@ function tmpl_reportList($reports, $sort) {
 		$reportlist[] = "<table id='reportlistTbl' class='reportlist'>";
 		$reportlist[] = "  <thead>";
 		$reportlist[] = "    <tr>";
+
+		$triangle = ($cookie_options['sort'] ? "asc":"desc") . "_triangle ";
 		$reportlist[] = "      <th class='circle_container' style='padding-left: 5px' title='DMARC Result. " . $title_message_th . "'><div class='circle circle_left circle_black'></div><span style='display:none;'>1</span></span></th>";
 		$reportlist[] = "      <th class='circle_container'></th>";
 		$reportlist[] = "      <th class='circle_container' title='SPF/DKIM/DMARC Results. " . $title_message_th . "'><div class='circle circle_right circle_black'></div><span style='display:none;'>1</span></span></th>";
-		$reportlist[] = "      <th class=\"" . strtolower($sort) . "_triangle\" title='" . $title_message_th . "'>Start Date</th>";
-		$reportlist[] = "      <th title='" . $title_message_th . "'>End Date</th>";
-		$reportlist[] = "      <th title='" . $title_message_th . "'>Domain</th>";
-		$reportlist[] = "      <th title='" . $title_message_th . "'>Reporting Organization</th>";
-		$reportlist[] = "      <th title='" . $title_message_th . " (currently doesn&#39;t really sort well)'>Report ID</th>";
-		$reportlist[] = "      <th title='" . $title_message_th . "'>Messages</th>";
+		$reportlist[] = "      <th id='mindate' class=\"" . ($cookie_options['sort_column'] == 'mindate' ? $triangle : "") . "\" title='" . $title_message_th . "'>Start Date</th>";
+		$reportlist[] = "      <th id='maxdate' class=\"" . ($cookie_options['sort_column'] == 'maxdate' ? $triangle : "") . "\" title='" . $title_message_th . "'>End Date</th>";
+		$reportlist[] = "      <th id='domain' class=\"" . ($cookie_options['sort_column'] == 'domain' ? $triangle : "") . "\" title='" . $title_message_th . "'>Domain</th>";
+		$reportlist[] = "      <th id='org' class=\"" . ($cookie_options['sort_column'] == 'org' ? $triangle : "") . "\" title='" . $title_message_th . "'>Reporting Organization</th>";
+		$reportlist[] = "      <th id='reportid' class=\"" . ($cookie_options['sort_column'] == 'reportid' ? $triangle : "") . "\" title='" . $title_message_th . " (currently doesn&#39;t really sort well)'>Report ID</th>";
+		$reportlist[] = "      <th id='rcount' class=\"" . ($cookie_options['sort_column'] == 'rcount' ? $triangle : "") . "\" title='" . $title_message_th . "'>Messages</th>";
 		$reportlist[] = "    </tr>";
 		$reportlist[] = "  </thead>";
 
@@ -104,6 +109,10 @@ function tmpl_reportList($reports, $sort) {
 include "dmarcts-report-viewer-config.php";
 include "dmarcts-report-viewer-common.php";
 
+// Get all configuration options
+// --------------------------------------------------------------------------
+configure();
+
 $dom_select= '';
 $org_select= '';
 $per_select= '';
@@ -114,14 +123,6 @@ $where = '';
 // Parameters of GET
 // --------------------------------------------------------------------------
 
-if(isset($_GET['hostlookup']) && is_numeric($_GET['hostlookup'])){
-	$hostlookup=$_GET['hostlookup']+0;
-}elseif(!isset($_GET['hostlookup'])){
-	$hostlookup= isset( $default_lookup ) ? $default_lookup : 1;
-}else{
-	die('Invalid hostlookup flag');
-}
-
 if(isset($_GET['sortorder']) && is_numeric($_GET['sortorder'])){
 	$sortorder=$_GET['sortorder']+0;
 }elseif(!isset($_GET['sortorder'])){
@@ -226,7 +227,7 @@ switch ($dmarc_select) {
 
 // Report Status
 // --------------------------------------------------------------------------
-if ( $report_status != "all" ) {
+if ( $report_status != "all" && $report_status != "" ) {
 	$where .= ( $where <> '' ? " AND" : " WHERE" ) . " " . $dmarc_result[$report_status]['status_sql_where'];
 }
 
@@ -347,9 +348,8 @@ $where
 GROUP BY
 	serial
 ORDER BY
-    mindate $sort,
-    org
-";
+    " . $cookie_options['sort_column'] . ( $cookie_options['sort'] ? " ASC" : " DESC" )
+;
 
 // Debug
 // echo "<br />sql where = $where<br />";
diff --git a/dmarcts-report-viewer.js b/dmarcts-report-viewer.js
index b778672..046479f 100644
--- a/dmarcts-report-viewer.js
+++ b/dmarcts-report-viewer.js
@@ -26,22 +26,21 @@
 // dmarcts-report-viewer-config.php and edit with the appropriate info
 // for your database authentication and location.
 //
-// Edit the configuration variables in dmarcts-report-viewer.js with your preferences.
+//####################################################################
 
 // ----------------------------------------------------------------------------
+// Main Program
 // ----------------------------------------------------------------------------
-// Supplemental Configuration
-
-var default_reportlist_height = 60; // Main Report List height as a percentage of browser window height (without the % mark)
 
-// End Supplemental Configuration
-// ----------------------------------------------------------------------------
+var current_report = "";
+var report_list_height = 0;
+var available_height = 0;
+var report_data_xml_width = 0;
 
-var current_report;
 const getCellValue = (tr, idx) => tr.children[idx].innerText || tr.children[idx].textContent;
 const comparer = (idx, asc) => (a, b) => ((v1, v2) => v1 !== '' && v2 !== '' && !isNaN(v1) && !isNaN(v2) ? v1 - v2 : v1.toString().localeCompare(v2))(getCellValue(asc ? a : b, idx), getCellValue(asc ? b : a, idx));
 
-var report_data_xml_width_last = 0;
+var cookie_name = "dmarcts-options";
 
 // ----------------------------------------------------------------------------
 //Functions
@@ -92,6 +91,9 @@ function sorttable (table_id) {
 
 function showReportlist(str) { // str is the name of the <div> to be filled
 
+	// Clear current reportid because Report List is being reset
+	current_report = "";
+
 	var GETstring = "?";
 
 	var domain = document.getElementById('selDomain').options[document.getElementById('selDomain').selectedIndex].value;
@@ -112,17 +114,10 @@ function showReportlist(str) { // str is the name of the <div> to be filled
 			if (this.readyState == 4 && this.status == 200) {
 				document.getElementById("report_list").innerHTML = this.responseText;
 				document.getElementById("report_data").innerHTML = "";
+				set_heights();
 				sorttable(str);
 				set_title(domain);
 				makeResizableDiv();
-				if 	(
-					(document.getElementById('resizer_horizontal') != 'undefined' && document.getElementById('resizer_horizontal') != null)
-					||
-					(document.getElementById('resizer_vertical') != 'undefined' && document.getElementById('resizer_vertical') != null)
-					) {
-							document.getElementById('resizer_horizontal').style.display = 'none';
-							document.getElementById('resizer_vertical').style.display = 'none';
-				}
 			}
 		};
 
@@ -130,6 +125,38 @@ function showReportlist(str) { // str is the name of the <div> to be filled
 	xhttp.send();
 }
 
+function showMenu() {
+
+		document.getElementById('menu').style.display = 'block';
+		document.getElementById('screen_overlay').style.display = 'block';
+}
+
+function hideMenu() {
+
+		document.getElementById('menu').style.display = 'none';
+		document.getElementById('screen_overlay').style.display = 'none';
+}
+
+function optionMenu(_element) {
+
+	var _div = document.getElementById('menu');
+	var input = _element.getBoundingClientRect();
+
+	_div.style.right = window.innerWidth - input.right + 'px';
+	_div.style.top = document.getElementById('optionblock').bottom + 'px';
+
+	if ( document.getElementById('menu').style.display == 'none' || document.getElementById('menu').style.display == '' ) {
+		showMenu();
+	} else {
+		hideMenu();
+	}
+}
+
+function change_stylesheet() {
+
+	document.getElementById('css_stylesheet').href = document.getElementById('selcssfile').value;
+}
+
 function set_title(domain) {
 
 	domain == 'all' ? document.getElementById('title').innerText = "DMARC Reports" : document.getElementById('title').innerText = "DMARC Reports for " + domain;
@@ -137,22 +164,43 @@ function set_title(domain) {
 
 function set_heights() {
 
-	var report_list_height_percentage = default_reportlist_height/100;
-	var taken_height =
-		parseInt(window.getComputedStyle(document.getElementById('body')).getPropertyValue('margin-top'))
-		+ parseInt(window.getComputedStyle(document.getElementById('body')).getPropertyValue('margin-bottom'))
-		+ document.getElementById('optionblock').offsetHeight
-		+ document.getElementById('title').offsetHeight
-		+ document.getElementById('footer').offsetHeight
-		+ parseInt(window.getComputedStyle(document.getElementById('footer')).getPropertyValue('margin-top'))
-	;
-	var available_height = window.innerHeight - taken_height;
-	var report_list_height = parseInt(report_list_height_percentage * available_height);
-	var report_data_height = available_height - report_list_height;
+	if ( document.getElementById('reportlistTbl') != 'undefined' && document.getElementById('reportlistTbl') != null ) {
+		var taken_height =
+			parseInt(window.getComputedStyle(document.getElementById('body')).getPropertyValue('margin-top'))
+			+ parseInt(window.getComputedStyle(document.getElementById('body')).getPropertyValue('margin-bottom'))
+			+ document.getElementById('optionblock').offsetHeight
+			+ document.getElementById('title').offsetHeight
+			+ document.getElementById('footer').offsetHeight
+			+ parseInt(window.getComputedStyle(document.getElementById('footer')).getPropertyValue('margin-top'))
+		;
+
+		available_height = window.innerHeight - taken_height;
+		report_list_height = parseInt(report_list_height_percent * available_height / 100 );
+
+		// See at least the header and the first row of the Report List even if the Report List-Initial Height is set to 0 percent
+		var min_height_report_list =
+			+ document.getElementById('title').offsetHeight
+			+ document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].offsetHeight
+		;
 
+		// The Report List should not be large enough to cover the Report Data description div (report_desc) but that div has not been rendered yet, so we can't get its height.
+		// However, a good proxy for the height of the description is about 3 times the height of the first row of the Report List
+		var max_height_report_list =
+			available_height
+			- document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].offsetHeight * 3
+		;
+
+		if ( report_list_height < min_height_report_list ) {
+			report_list_height = min_height_report_list;
+		}
+		if ( report_list_height > max_height_report_list ) {
+			report_list_height = max_height_report_list;
+		}
+		var report_data_height = available_height - report_list_height;
 
-	document.getElementById('report_list').style.height = report_list_height + "px";
-	document.getElementById('report_data').style.height = report_data_height + "px";
+		document.getElementById('report_list').style.height = report_list_height + "px";
+		document.getElementById('report_data').style.height = report_data_height + "px";
+	}
 }
 
 function set_report_data_heights() {
@@ -166,11 +214,42 @@ function set_report_data_heights() {
 	document.getElementById('report_data_xml').style.height = report_data_table_div_height;
 
 }
-function showXML() {
+function report_data_xml_display_toggle() {
+
+	if (xml_data_open == 0) {
+		xml_data_open = 1;
+		set_report_data_widths();
+	} else {
+		xml_data_open = 0;
+		set_report_data_widths();
+	}
+}
+
+function set_report_data_widths () {
+
+	// An allowance to accomodate Report Data table width expanding/contracting when sorting arrow is added to/removed from the column title
+	// HTML5 doesn't seem to currently have a built-in onresize event for divs, so to do this automatically would take some decent JS library like https://github.com/marcj/css-element-queries
+	// May not need this anymore
+	allowance = getScrollBarWidth() * 2;
+	// allowance = 30;
+
+	if ( xml_data_open == 1 ) {
+		var min_width_xml_data =
+			document.getElementById('report_data_table').getElementsByTagName('thead')[0].getElementsByTagName('tr')[0].getElementsByTagName('th')[0].offsetWidth // i.e. the width of the first column of the Report Data table
+		;
+		var max_width_xml_data =
+		document.getElementById('report_data').offsetWidth
+		- min_width_xml_data
+		;
+		report_data_xml_width = parseInt(document.getElementById('report_data').offsetWidth * report_data_xml_width_percent / 100);
+		if ( report_data_xml_width < min_width_xml_data ) {
+			report_data_xml_width = min_width_xml_data;
+		}
+		if ( report_data_xml_width > max_width_xml_data ) {
+			report_data_xml_width = max_width_xml_data;
+		}
 
-	if (document.getElementById('report_data_xml').style.display == 'none') {
-		var div_height = document.getElementById('report_data_table_div').style.height
-		set_report_data_widths("open_xml");
+		report_data_table_div_width = document.getElementById('report_data').offsetWidth - report_data_xml_width - allowance;
 		document.getElementById('report_data_xml').style.display = 'inline-block';
 		document.getElementById('report_data_table_div').style.display = 'inline-block';
 		document.getElementById('report_data_table_div').style.float = 'left';
@@ -179,8 +258,8 @@ function showXML() {
 		document.getElementById('xml_html_img').alt = 'Hide Raw Report XML';
 		document.getElementById('resizer_vertical').style.display = "block";
 	} else {
-		var div_height = document.getElementById('report_data_xml').style.height
-		set_report_data_widths("close_xml");
+		report_data_xml_width = 0;
+		report_data_table_div_width = document.getElementById('report_data').offsetWidth;
 		document.getElementById('report_data_xml').style.display = 'none';
 		document.getElementById('report_data_table_div').style.display = 'block';
 		document.getElementById('report_data_table_div').style.float = '';
@@ -189,54 +268,53 @@ function showXML() {
 		document.getElementById('xml_html_img').alt = 'Show Raw Report XML';
 		document.getElementById('resizer_vertical').style.display = "none";
 	}
-	showResizers();
-}
-
-function set_report_data_widths (open_close) {
-
-	report_data_xml_width_percent = .20;
-
-	// An allowance to accomodate Report Data table width expanding/contracting when sorting arrow is added to/removed from the column title
-	// HTML5 doesn't seem to currently have a built-in onresize event for divs, so to do this automatically would take some decent JS library like https://github.com/marcj/css-element-queries
-	allowance = 30;
-
-	if ( open_close == "open_xml" ) {
-		if ( report_data_xml_width_last == 0){
-			report_data_xml_width = parseInt(document.getElementById('report_data').offsetWidth * report_data_xml_width_percent);
-			report_data_table_div_width = document.getElementById('report_data').offsetWidth - report_data_xml_width - allowance;
-		} else {
-			report_data_xml_width = report_data_xml_width_last
-			- document.getElementById('resizer_vertical').offsetWidth / 2
-			-2
-			;
-			// Why '-2'? Because when the report_data_xml div is resized and another report is chosen, the handle and separator jump by 2 pixels
-			// If someone can find out why, please fix it (it's probably because of all the other tiny fudges all over the place)
-			report_data_table_div_width = document.getElementById('report_data').offsetWidth - report_data_xml_width - allowance;
-		}
-	} else {
-		report_data_xml_width = 0;
-		report_data_table_div_width = document.getElementById('report_data').offsetWidth;
-	}
 
 	document.getElementById('report_data_xml').style.width = report_data_xml_width + "px";
 	document.getElementById('report_data_table_div').style.width = report_data_table_div_width + "px";
 
-// 	document.getElementById('report_data').style.overflow = "hidden";
-
+	showResizers();
 }
 
+// From https://stackoverflow.com/a/986977
+function getScrollBarWidth() {
+  var inner = document.createElement('p');
+  inner.style.width = "100%";
+  inner.style.height = "200px";
+
+  var outer = document.createElement('div');
+  outer.style.position = "absolute";
+  outer.style.top = "0px";
+  outer.style.left = "0px";
+  outer.style.visibility = "hidden";
+  outer.style.width = "200px";
+  outer.style.height = "150px";
+  outer.style.overflow = "hidden";
+  outer.appendChild (inner);
+
+  document.body.appendChild (outer);
+  var w1 = inner.offsetWidth;
+  outer.style.overflow = 'scroll';
+  var w2 = inner.offsetWidth;
+  if (w1 == w2) w2 = outer.clientWidth;
+
+  document.body.removeChild (outer);
+
+  return (w1 - w2);
+};
+
 function showReport(str) {
 
+	if ( (typeof(document.getElementById('no_reports')) != 'undefined' && document.getElementById('no_reports') != null) || (typeof(str) == 'undefined' && str == null) ) {
+		return;
+	}
+
 	document.getElementById('screen_overlay').style.display = "block";
 	document.getElementById('screen_overlay').style.cursor = "wait";
 
-	if (str == null) {
-		// Hide handles
-		document.getElementById('resizer_horizontal').display = 'none';
-		document.getElementById('resizer_vertical').display = 'none';
+	if (str == "") {
+		// Remove screen overlay
 		document.getElementById('screen_overlay').style.display = "none";
 		document.getElementById('screen_overlay').style.cursor = "default";
-		alert('No report is selected.');
 		return;
 	}
 	setSelected(str);	// setSelected function highlights the report row that is selcted
@@ -244,15 +322,10 @@ function showReport(str) {
 	current_report = str;
 
 	var xhttp;
-	if (str == "") {
-		document.getElementById("report_data").innerHTML = "";
-		return;
-	}
-
 	var GETstring = "report=" + str;
 
-	var HostLookup = document.getElementsByName('selHostLookup');
-	var HostLookup_value = false;
+	var HostLookup = document.getElementsByName('HostLookup');
+
 	for ( var i = 0; i < HostLookup.length; i++) {
 		if(HostLookup[i].checked) {
 			GETstring += "&hostlookup=" + HostLookup[i].value;
@@ -273,8 +346,10 @@ function showReport(str) {
 				document.getElementById('screen_overlay').style.cursor = "default";
 				document.getElementById('screen_overlay').style.display = "none";
 				showResizers();
-				if ( typeof report_data_xml_width !== 'undefined' && report_data_xml_width > 0 ) {
-					showXML("open_xml");
+				// current_report = "";
+
+				if ( xml_data_open == 1 ) {
+					set_report_data_widths();
 				}
 			}
 		};
@@ -283,6 +358,18 @@ function showReport(str) {
 	xhttp.send();
 }
 
+function setSelected(str) {
+
+	const table = document.getElementById("reportlistTbl");
+	const rows = table.getElementsByTagName("tr");
+	for (i = 0; i < rows.length; i++) {
+		var currentRow = table.rows[i];
+		currentRow.classList.remove("selected");
+	}
+	document.getElementById("report"+str).className += " selected";
+}
+
+
 // Functions that allow resizing of the data and raw xml divs
 // Inspired by the code at https://medium.com/the-z/making-a-resizable-div-in-js-is-not-easy-as-you-think-bda19a1bc53d
 function showResizers() {
@@ -298,15 +385,11 @@ function showResizers() {
 		- (document.getElementById('resizer_horizontal').offsetHeight)/2
 		+ "px";
 
-		document.getElementById('resizer_vertical').style.top =
-			parseInt(window.getComputedStyle(document.getElementById('body')).getPropertyValue('margin-top'))
-			+ document.getElementById('optionblock').offsetHeight
-			+ document.getElementById('title').offsetHeight
-			+ document.getElementById('report_list').offsetHeight
-			+ document.getElementById('report_desc_container').offsetHeight
-			+ document.getElementById('report_data_xml').offsetHeight/2
-			- (document.getElementById('resizer_vertical').offsetHeight)/2
-			+ "px";
+			document.getElementById('resizer_vertical').style.top =
+				document.getElementById('report_data_xml').offsetTop
+				+ document.getElementById('report_data_xml').offsetHeight/2
+				- document.getElementById('resizer_vertical').offsetHeight/2
+				+ 'px'
 
 		document.getElementById('resizer_vertical').style.left =
 			+ document.getElementById('report_data_xml').offsetLeft
@@ -318,20 +401,9 @@ function showResizers() {
 	}
 }
 
-function setSelected(str) {
-
-	const table = document.getElementById("reportlistTbl");
-	const rows = table.getElementsByTagName("tr");
-	for (i = 0; i < rows.length; i++) {
-		var currentRow = table.rows[i];
-		currentRow.classList.remove("selected");
-	}
-	document.getElementById("report"+str).className += " selected";
-}
-
 function makeResizableDiv() {
 
-	if (document.getElementById('resizer_horizontal') != 'undefined' && document.getElementById('resizer_horizontal') != null) {
+	if (document.getElementById('resizer_horizontal') != 'undefined' && document.getElementById('resizer_vertical') != null) {
 		document.getElementById('resizer_horizontal').addEventListener(
 			'mousedown',
 				function (e) {
@@ -342,7 +414,7 @@ function makeResizableDiv() {
 					if ( document.getElementById('report_data_table_div') ) {
 						original_height_report_data_table_div = document.getElementById('report_data_table_div').offsetHeight;
 					}
-					original_height_resizer_vertical = 30; // Should be equal to the in css file
+					original_height_resizer_vertical = 30; // Should be equal to the resizer_vertical.height in css file
 					original_x = document.getElementById('resizer_horizontal').getBoundingClientRect().left;
 					original_y = document.getElementById('resizer_horizontal').getBoundingClientRect().top;
 					original_mouse_x = e.pageX;
@@ -355,10 +427,23 @@ function makeResizableDiv() {
 
 	function resize(e) {
 
-		const height =	original_height_report_list
-						- document.getElementById('optionblock').offsetHeight
+		var mouse_max_y =
+		parseInt(window.getComputedStyle(document.getElementById('body')).getPropertyValue('margin-top'))
+		+ document.getElementById('optionblock').offsetHeight
+		+ document.getElementById('title').offsetHeight
+		+ document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].offsetHeight
+		+ document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].getElementsByTagName('tr')[0].offsetHeight
+		;
+
+		var mouse_min_y =
+			window.innerHeight
+			 - document.getElementById('footer').offsetHeight
+			- (document.getElementById('resizer_horizontal').offsetHeight / 2)
+			- document.getElementById('report_desc').offsetHeight
+			;
 						;
-		if ( (original_mouse_y - e.pageY) < height && e.pageY < (window.innerHeight - document.getElementById('footer').offsetHeight - (document.getElementById('resizer_horizontal').offsetHeight / 2)) ) {
+		// if statement prevents report list div from contracting small enough to hide the first row && expanding large enough to hide the Report Data description
+		if ( e.pageY > mouse_max_y  && e.pageY < mouse_min_y ) {
 			// Change all cursors over Report List table to ns-cursor
 			var cursors = document.getElementById("reportlistTbl").getElementsByTagName("tr");
 			for(var i=0;i<cursors.length;i++){
@@ -406,12 +491,14 @@ function makeResizableDiv() {
 			}
 			document.getElementById('body').style.cursor = "default";
 
-			window.removeEventListener('mousemove', resize);
-		}
+		report_list_height_percent = parseInt(document.getElementById('report_list').offsetHeight * 100 / available_height);
+
+		window.removeEventListener('mousemove', resize);
+	}
 
 	if (document.getElementById('resizer_vertical') != 'undefined' && document.getElementById('resizer_vertical') != null) {
 		document.getElementById('resizer_vertical').addEventListener('mousedown', function (e) {
-			e.preventDefault();// ;
+			e.preventDefault();
 			original_width_report_data_xml = document.getElementById('report_data_xml').offsetWidth;
 			original_width_report_data_table_div = document.getElementById('report_data_table_div').offsetWidth;
 			original_x = document.getElementById('resizer_vertical').getBoundingClientRect().left;
@@ -425,7 +512,11 @@ function makeResizableDiv() {
 
 	function resize_vertical(e) {
 
-		if ( e.pageX > document.getElementById('resizer_vertical').offsetWidth && e.pageX < window.innerWidth - document.getElementById('resizer_vertical').offsetWidth ) {
+		var mouse_min_x =
+			document.getElementById('report_data_table').getElementsByTagName('thead')[0].getElementsByTagName('tr')[0].getElementsByTagName('th')[0].offsetWidth // i.e. the width of the first column of the Report Data table
+		var mouse_max_x = window.innerWidth - mouse_min_x;
+
+		if ( e.pageX > mouse_min_x && e.pageX < mouse_max_x ) {
 			document.getElementById('body').style.cursor = "ew-resize";
 			mouse_movement = e.pageX - original_mouse_x;
 			document.getElementById('report_data_xml').style.width =+ original_width_report_data_xml - mouse_movement + 'px';
@@ -437,8 +528,7 @@ function makeResizableDiv() {
 				+ 'px'
 			;
 		}
-
-		report_data_xml_width_last = document.getElementById('report_data_xml').offsetWidth;
+		report_data_xml_width_percent = parseInt( document.getElementById('report_data_xml').offsetWidth / document.getElementById('report_data').offsetWidth * 100);
 	}
 
 		function stopResize_vertical() {
@@ -447,3 +537,121 @@ function makeResizableDiv() {
 			window.removeEventListener('mousemove', resize_vertical);
 		}
 }
+
+// Cookie Functions
+// ----------------------------------------------------------------------------
+function build_cookie() {
+
+	// Don't allow cookie to be set if there are no reports displayed
+	if ( document.getElementById('reportlistTbl') != "undefined" && document.getElementById('reportlistTbl') != null ) {
+		// There are reports showing
+
+		// Build cookie from various sources
+
+		// Change the Period option from the value of the select to (i.e. 'all' or a date) to a boolean, to match the radio button option on the options page
+		if ( document.getElementById('selPeriod').value == "all" ) {
+			period = 0;
+		} else {
+			period = 1;
+		}
+
+		// Host lookup
+		if ( document.getElementsByName('HostLookup')[0].checked ) {
+			hostlookup = 1;
+		} else {
+			hostlookup = 0;
+		}
+
+		// Sort column and sort direction
+		if ( document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].getElementsByTagName('tr')[0].getElementsByClassName('desc_triangle').length != 0 ) {
+			sort_column = document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].getElementsByTagName('tr')[0].getElementsByClassName('desc_triangle')[0].id;
+			sort = 0;
+		} else {
+			sort_column = document.getElementById('reportlistTbl').getElementsByTagName('thead')[0].getElementsByTagName('tr')[0].getElementsByClassName('asc_triangle')[0].id;
+			sort = 1;
+		}
+
+		if ( sort_column == "" ) {
+			sort_column = "maxdate";
+			alert("Unfortuantely at this time, neither the DMARC Result nor the Report Status columns can be saved as initial sort columns. The initial sort column has been set to End Date, " + (sort == 0 ? "descending." : "ascending."));
+		}
+
+		// Create cookie_value object that gets placed into cookie
+
+		// When a new option is added, check the size of the cookie stored. The cookie size should be less than half of the maximum cookie size allowed per domain.
+		// Less than half because sometimes the cookie is stored twice (once as dmarcts-options and once as dmarcts-options-tmp). Most browsers have a cookie limit of 4KB.
+		// Currently, the following options generate a cookie of about 0.5KB
+	cookie_value = {
+			"cssfile" : document.styleSheets[0].href.split('/').pop() ,
+			"report_list_height_percent" : report_list_height_percent ,
+			"report_data_xml_width_percent" : report_data_xml_width_percent ,
+			"xml_data_open" : xml_data_open ,
+			"HostLookup" : hostlookup ,
+			"Period" : period ,
+			"DMARC" : document.getElementById('selDMARC').value ,
+			"ReportStatus" : document.getElementById('selReportStatus').value ,
+			"Domain" : document.getElementById('selDomain').value ,
+			"Organisation" : document.getElementById('selOrganisation').value ,
+			"sort_column" : sort_column ,
+			"sort" : sort ,
+			// "alignment_unknown" : 0 ,
+			"dmarc_results_matching_only" : 0
+		};
+
+ 		cookie_value = JSON.stringify(cookie_value);
+		setCookie(cookie_name, cookie_value, 365)
+	} else {
+		// There are NO reports showing
+		alert("Settings cannot be saved if there are no reports to display.\n\nChange the filters to show some reports.");
+	}
+	setCookie("dmarcts-options-tmp", "", -365)
+	hideMenu();
+}
+
+function get_cookie(name) {
+
+	name = name + "=";
+	var cookie_str = decodeURIComponent(document.cookie);
+  var cookie_array = cookie_str.split(';');
+  for(var i = 0; i <cookie_array.length; i++) {
+    var c = cookie_array[i];
+    while ( c.charAt(0) == " " ) {
+      c = c.substring(1);
+    }
+    if ( c.indexOf(name) == 0 ) {
+      return c.substring(name.length, c.length);
+    }
+  }
+  return "";
+}
+
+function setCookie(name, value, exp_days) {
+
+  var d = new Date();
+  d.setTime(d.getTime() + (exp_days*24*60*60*1000));
+  var expires = "expires="+ d.toUTCString();
+  document.cookie = name + "=" + encodeURI(value) + ";" + expires + ";path=/";
+}
+
+function resetOptions() {
+
+	stored_cookie = get_cookie('dmarcts-options-tmp');
+
+	if ( stored_cookie == "" || stored_cookie == null ){
+		stored_cookie = get_cookie('dmarcts-options');
+		setCookie("dmarcts-options-tmp", stored_cookie, 365)
+		setCookie("dmarcts-options", "", 365)
+	}
+	window.location.href = 'dmarcts-report-viewer-options.php';
+}
+
+function cancelOptions() {
+
+	stored_cookie = get_cookie('dmarcts-options-tmp');
+
+	if ( stored_cookie ){
+		setCookie("dmarcts-options", stored_cookie, 365)
+		setCookie("dmarcts-options-tmp", "", -365)
+	}
+	window.location.href = 'dmarcts-report-viewer.php';
+}
diff --git a/dmarcts-report-viewer.php b/dmarcts-report-viewer.php
index e0903a1..2f7c6da 100644
--- a/dmarcts-report-viewer.php
+++ b/dmarcts-report-viewer.php
@@ -34,28 +34,35 @@
 //### functions ######################################################
 //####################################################################
 
-function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_domain = undef, $default_reporter = undef, $cssfile, $domains = array(), $orgs = array(), $periods = array() ) {
+function html ($domains = array(), $orgs = array(), $periods = array() ) {
 
 	global $dmarc_result;
 
+	global $options;
+	global $cookie_options;
 	$html       = array();
-
 	$html[] = "<!DOCTYPE html>";
 	$html[] = "<html>";
 	$html[] = "  <head>";
 	$html[] = "    <title>DMARC Report Viewer</title>";
-	$html[] = "    <link rel='stylesheet' href='$cssfile'>";
+	$html[] = "    <link rel='stylesheet' href='" . $cookie_options['cssfile'] . "'>";
 	$html[] = "    <script src='dmarcts-report-viewer.js'></script>";
+	$html[] = "    <script>";
+	$html[] = "      var report_list_height_percent = " . $cookie_options["report_list_height_percent"] . ";";
+	$html[] = "      var report_data_xml_width_percent = " . $cookie_options["report_data_xml_width_percent"] . ";";
+	$html[] = "      var xml_data_open = " . $cookie_options['xml_data_open'] . ";";
+	$html[] = "    </script>";
 	$html[] = "    <meta charset=\"UTF-8\" />";
 	$html[] = "    <meta name='google' content='notranslate' />";
 	$html[] = "    <meta http-equiv=\"Content-Language\" content=\"en_US\" />";
 	$html[] = "  </head>";
 
-	$html[] = "  <body id='body' onload=showReportlist('reportlistTbl');set_heights(); onresize=showResizers();>";
+	$html[] = "  <body id='body' onload=showReportlist('reportlistTbl'); onresize=showResizers();>";
 	$html[] = "<div id='screen_overlay' onclick=\"hideMenu();\" style=\"top: 0;left: 0;height: 100%;width: 100%;position: absolute;display: none;z-index: 1;\">
     ";
 	$html[] = "</div>";
 
+
 	//	Optionblock form
 	//	--------------------------------------------------------------------------
 	$html[] = "    <div id='optionblock' class='optionblock'><form action=\"?\" method=\"post\">";
@@ -64,17 +71,19 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 	//	Host lookup option
 	//	--------------------------------------------------------------------------
 	$html[] = "<div class='options'><span class='optionlabel'>Hostname(s):</span><br>";
-		$html[] = "<input type=\"radio\" name=\"selHostLookup\" value=\"1\" onclick=\"showReport(current_report)\"" . ($default_hostlookup ? " checked=\"checked\"" : "" ) . "> on<input type=\"radio\" name=\"selHostLookup\" value=\"0\" onclick=\"showReport(current_report)\"" . ($default_hostlookup ? "" : " checked=\"checked\"" ) . "> off</div>";
+	$html[] = "	<input type=\"radio\" name=\"HostLookup\" value=\"1\" onclick=\"showReport(current_report)\"" . ($cookie_options['HostLookup'] ? " checked=\"checked\"" : "" ) . "> on";
+	$html[] = "	<input type=\"radio\" name=\"HostLookup\" value=\"0\" onclick=\"showReport(current_report)\"" . ($cookie_options['HostLookup'] ? "" : " checked=\"checked\"" ) . "> off";
+	$html[] = "</div>";
 
 
 	// 	DMARC select
 	// 	--------------------------------------------------------------------------
 		$html[] = "<div class='options'><span class='optionlabel'>DMARC Result:</span><br>";
-		$html[] = "<select name=\"selDMARC\" id=\"selDMARC\" onchange=\"showReportlist('reportlistTbl')\">";
-		$html[] = "<option " . ( $default_dmarc_result ? "" : "selected=\"selected\" " ) . "value=\"all\">[all]</option>";
+		$html[] = "<select name=\"DMARC\" id=\"selDMARC\" onchange=\"showReportlist('reportlistTbl')\">";
+		$html[] = "<option " . ( $cookie_options['DMARC'] ? "" : "selected=\"selected\" " ) . "value=\"all\">[all]</option>";
 		foreach($dmarc_result as $key => $value) {
-			$html[] = sprintf("<option style='color: " . $value['color'] . "' %s value=\"%s\">%s</option>",
-					$default_dmarc_result == $key ? "selected=\"selected\"" : "",
+			$html[] = sprintf("<option class='" . $value['color'] . "' %s value=\"%s\">%s</option>",
+					$cookie_options['DMARC'] == $key ? "selected=\"selected\"" : "",
 					$key,
 					$value['text']
 				);
@@ -87,10 +96,10 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 		// 	--------------------------------------------------------------------------
 			$html[] = "<div class='options'><span class='optionlabel'>Report Status:</span><br>";
 			$html[] = "<select name=\"ReportStatus\" id=\"selReportStatus\" onchange=\"showReportlist('reportlistTbl')\">";
-			$html[] = "<option " . ( $default_report_status ? "" : "selected=\"selected\" " ) . "value=\"all\">[all]</option>";
+			$html[] = "<option " . ( $cookie_options['ReportStatus'] ? "" : "selected=\"selected\" " ) . "value=\"all\">[all]</option>";
 			foreach($dmarc_result as $key => $value) {
-				$html[] = sprintf("<option style='color: " . $value['color'] . "' %s value=\"%s\">%s</option>",
-						$default_report_status == $key ? "selected=\"selected\"" : "",
+				$html[] = sprintf("<option class='color: " . $value['color'] . "' %s value=\"%s\">%s</option>",
+						$cookie_options['ReportStatus'] == $key ? "selected=\"selected\"" : "",
 						$key,
 						$value['status_text']
 					);
@@ -103,12 +112,12 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 	// 	--------------------------------------------------------------------------
 	if ( count( $periods ) > 0 ) {
 		$html[] = "<div class='options'><span class='optionlabel'>Month:</span><br>";
-		$html[] = "<select name=\"selPeriod\" id=\"selPeriod\" onchange=\"showReportlist('reportlistTbl')\">";
-		$html[] = "<option value=\"all\">[all]</option>";
+		$html[] = "<select name=\"Period\" id=\"selPeriod\" onchange=\"showReportlist('reportlistTbl')\">";
+		$html[] = "<option value=\"all\"" . ($cookie_options['Period'] ? "" : " selected=\"selected\"") . ">[all]</option>";
 
 		for ($p = 0; $p < sizeof($periods); $p++) {
 			$arg = "";
-			if( $p == 0 ) {
+			if( $p == 0 && $cookie_options['Period'] == 1 ) {
 				$arg =" selected=\"selected\"";
 			}
 			$html[] = "<option $arg value=\"$periods[$p]\">$periods[$p]</option>";
@@ -123,11 +132,11 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 	//	--------------------------------------------------------------------------
 	if ( count( $domains ) >= 1 ) {
 		$html[] = "<div class='options'><span class='optionlabel'>Domain(s):</span><br>";
-		$html[] = "<select name=\"selDomain\" id=\"selDomain\" onchange=\"showReportlist('reportlistTbl')\">";
-		$html[] = "<option " . ( $default_domain ? "" : "selected=\"selected\" " ) . "value=\"all\">[all]</option>";
+		$html[] = "<select name=\"Domain\" id=\"selDomain\" onchange=\"showReportlist('reportlistTbl')\">";
+		$html[] = "<option " . ( $cookie_options['Domain'] ? "" : "selected=\"selected\" " ) . "value=\"all\">[all]</option>";
 
 		foreach( $domains as $d) {
-			$html[] = "<option " . ( $default_domain == $d ? "selected=\"selected\" " : "" ) . "value=\"$d\">$d</option>";
+			$html[] = "<option " . ( $cookie_options['Domain'] == $d ? "selected=\"selected\" " : "" ) . "value=\"$d\">$d</option>";
 		}
 
 		$html[] = "</select>";
@@ -139,11 +148,11 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 	//	--------------------------------------------------------------------------
 	if ( count( $orgs ) > 0 ) {
 		$html[] = "<div class='options'><span class='optionlabel'>Reporter(s):</span><br>";
-		$html[] = "<select name=\"selOrganisation\" id=\"selOrganisation\" onchange=\"showReportlist('reportlistTbl')\">";
-		$html[] = "<option " . ( $default_reporter ? "" : "selected=\"selected\" " ) . "selected=\"selected\" value=\"all\">[all]</option>";
+		$html[] = "<select name=\"Organisation\" id=\"selOrganisation\" onchange=\"showReportlist('reportlistTbl')\">";
+		$html[] = "<option " . ( $cookie_options['Organisation'] ? "" : "selected=\"selected\" " ) . "selected=\"selected\" value=\"all\">[all]</option>";
 
 		foreach( $orgs as $o) {
-			$html[] = "<option " . ( $default_reporter == $o ? "selected=\"selected\" " : "" ) . "value=\"$o\">" . ( strlen( $o ) > 25 ? substr( $o, 0, 22) . "..." : $o ) . "</option>";
+			$html[] = "<option " . ( $cookie_options['Organisation'] == $o ? "selected=\"selected\" " : "" ) . "value=\"$o\">" . ( strlen( $o ) > 25 ? substr( $o, 0, 22) . "..." : $o ) . "</option>";
 		}
 
 		$html[] = "</select>";
@@ -153,20 +162,29 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 	//	Refresh button
 	//	--------------------------------------------------------------------------
 	$html[] = "<div class='options'>";
-	$html[] = "<button type=\"button\" onclick=\"refresh_report_list()\" title=\"Refreshes data with current filter.\">Refresh</button>";
+	$html[] = "&nbsp;<br><button type=\"button\" onclick=\"refresh_report_list()\" title=\"Refreshes data with current filter.\">Refresh</button>";
 	$html[] = "</div>";
 
 	//	Reset button
 	//	--------------------------------------------------------------------------
-	$html[] = "<div class='options' style='border-right: 0px;'>";
-	$html[] = "<button type=\"button\" onclick=\"reset_report_list()\" title=\"Resets the filter to show all records and refreshes the data.\">Reset</button>";
+	$html[] = "<div class='options'>";
+	$html[] = "&nbsp;<br><button type=\"button\" onclick=\"reset_report_list()\" title=\"Resets the filter to show all records and refreshes the data.\">Reset</button>";
 	$html[] = "</div>";
 
+	// Configuration Settings icon
+	//	--------------------------------------------------------------------------
+	$html[] = "<div class='menu_icon' onclick=\"optionMenu(this);\">&#8801;</div>";
+
 	//	End optionblock
 	//	--------------------------------------------------------------------------
 	$html[] = "</form></div>";
 
 
+	// Dropdown menu
+	//	--------------------------------------------------------------------------
+	$html[] = "<div id='menu' class='menu top'><div class='menu_option' onclick=\"build_cookie();\">&nbsp;&nbsp;&nbsp;Save Current Settings as Initial View</div><div class='menu_option' onclick=\"window.location.href = 'dmarcts-report-viewer-options.php';\">&nbsp;&nbsp;&nbsp;Options...</div></div>";
+
+
 	//	Report divs
 	//	--------------------------------------------------------------------------
 	$html[] = "<!-- Start of report list -->";
@@ -197,6 +215,12 @@ function html ($default_hostlookup = 1, $default_dmarc_result = undef, $default_
 include "dmarcts-report-viewer-config.php";
 include "dmarcts-report-viewer-common.php";
 
+// Get all configuration options
+// --------------------------------------------------------------------------
+configure();
+
+setcookie("dmarcts-options-tmp", "", "01 Jan 1970 00:00:00 UTC", "/");
+
 // Make a MySQL Connection using mysqli
 // --------------------------------------------------------------------------
 $mysqli = new mysqli($dbhost, $dbuser, $dbpass, $dbname, $dbport);
@@ -209,6 +233,7 @@ if ($mysqli->connect_errno) {
 	exit;
 }
 
+
 // Get all domains reported
 // --------------------------------------------------------------------------
 $sql = "
@@ -275,11 +300,6 @@ while($row = $query->fetch_assoc()) {
 // Generate Page with report list and report data (if a report is selected).
 // --------------------------------------------------------------------------
 echo html(
-	$default_hostlookup,
-	$default_dmarc_result,
-	$default_domain,
-	$default_reporter,
-	$cssfile,
 	$domains,
 	$orgs,
 	$periods
diff --git a/dusk2dawn.css b/dusk2dawn.css
index 61dad08..8b20409 100644
--- a/dusk2dawn.css
+++ b/dusk2dawn.css
@@ -37,5 +37,5 @@ this program.  If not, see <http://www.gnu.org/licenses/>.
   --green: #85ff6a;
   --yellow: #ffff64;
   --orange: #ffb826;
-  --red: #ff7f50;
+  --red: #ff4444;
 }