Added display style options

CHANGELOG.md

@@ -1,5 +1,27 @@
 # Change Log
 
+## 3.0.1 - 2017-01-07
+
+### Added
+- Display styles in settings to customize MailHops bar background color, font color and font size
+
+### Removed
+- Display show options, data is now always shown for:
+  - Unsubscribe link
+  - Mailer
+  - DKIM
+  - SPF
+  - DNSBL
+
+## 3.0.0 - 2016-12-26
+
+### Added
+- MailHops Bar for matching styles across supported mail clients
+
+### Removed
+- Thunderbird specific styles and MailHops bar from the header
+- Postbox specific styles and MailHops sidebar display
+
 ## 2.0.0 - 2016-10-10
 
 ### Added

chrome/content/mailhops.js

@@ -9,12 +9,15 @@ var mailHops =
   msgURI:	null,
   isLoaded: false,
   options: {
-      'version':'MailHops Plugin 3.0.0',
+      'version':'MailHops Plugin 3.0.1',
       'lan':'en',
       'unit':'mi',
       'api_http':'https://',
       'api_host':'api.mailhops.com',
       'debug':false,
+      'bar_color': '#5E7A9B',
+      'font_color': '#FFF',
+      'font_size': '14px',
       'country_tag':false,
       'travel_time_junk':false,
       'country_filter':[]
@@ -59,20 +62,12 @@ mailHops.loadPref = function()
   mailHops.options.unit = mailHops.getCharPref('mail.mailHops.unit','mi');
   mailHops.options.fkey = mailHops.getCharPref('mail.mailHops.fkey','');//forecast.io api_key
 
-  //Display Boxes
+  //Display
-  mailHops.options.show_details = mailHops.getCharPref('mail.mailHops.show_details','true')=='true'?true:false;
+  mailHops.options.bar_color = mailHops.getCharPref('mail.mailHops.bar_color','#5E7A9B');
-  mailHops.options.show_meta = mailHops.getCharPref('mail.mailHops.show_meta','true')=='true'?true:false;
-  mailHops.options.show_auth = mailHops.getCharPref('mail.mailHops.show_auth','true')=='true'?true:false;
 
-  //Details options
+  mailHops.options.font_color = mailHops.getCharPref('mail.mailHops.font_color','#FFF');
-  mailHops.options.show_host = mailHops.getCharPref('mail.mailHops.show_host','true')=='true'?true:false;
-  mailHops.options.show_secure = mailHops.getCharPref('mail.mailHops.show_secure','true')=='true'?true:false;
 
-  //Auth options
+  mailHops.options.font_size = mailHops.getCharPref('mail.mailHops.font_size','14px');
-  mailHops.options.show_dkim = mailHops.getCharPref('mail.mailHops.show_dkim','true')=='true'?true:false;
-  mailHops.options.show_spf = mailHops.getCharPref('mail.mailHops.show_spf','true')=='true'?true:false;
-  mailHops.options.show_mailer = mailHops.getCharPref('mail.mailHops.show_mailer','true')=='true'?true:false;
-  mailHops.options.show_dnsbl = mailHops.getCharPref('mail.mailHops.show_dnsbl','true')=='true'?true:false;
 
   mailHops.options.debug = mailHops.getCharPref('mail.mailHops.debug','false')=='true'?true:false;
 
@@ -168,11 +163,11 @@ mailHops.getRoute = function(){
   var headXReceived = mailHops.headers.extractHeader ( "X-Received" , false );
   var headXOrigIP = mailHops.headers.extractHeader ( "X-Originating-IP" , false );
   // auth box
-  var headXMailer = (mailHops.options.show_auth && mailHops.options.show_mailer) ? mailHops.headers.extractHeader ( "X-Mailer" , false ) : null;
+  var headXMailer = mailHops.headers.extractHeader ( "X-Mailer" , false );
-  var headUserAgent = (mailHops.options.show_auth && mailHops.options.show_mailer) ? mailHops.headers.extractHeader ( "User-Agent" , false ) : null;
+  var headUserAgent = mailHops.headers.extractHeader ( "User-Agent" , false );
-  var headXMimeOLE = (mailHops.options.show_auth && mailHops.options.show_mailer) ? mailHops.headers.extractHeader ( "X-MimeOLE" , false ) : null;
+  var headXMimeOLE = mailHops.headers.extractHeader ( "X-MimeOLE" , false );
-  var headReceivedSPF = (mailHops.options.show_auth && mailHops.options.show_spf) ? mailHops.headers.extractHeader ( "Received-SPF" , false ) : null;
+  var headReceivedSPF = mailHops.headers.extractHeader ( "Received-SPF" , false );
-  var headAuth = mailHops.options.show_auth ? mailHops.headers.extractHeader ( "Authentication-Results" , false ) : null;
+  var headAuth = mailHops.headers.extractHeader ( "Authentication-Results" , false );
   var headListUnsubscribe = mailHops.headers.extractHeader ( "List-Unsubscribe" , false ) ;
 
   var all_ips = new Array();
@@ -183,9 +178,7 @@ mailHops.getRoute = function(){
 
   mailHopsDisplay.lists( headListUnsubscribe );
 
-  if(mailHops.options.show_auth){
+  mailHopsDisplay.auth( headXMailer, headUserAgent, headXMimeOLE, headAuth, headReceivedSPF );
-      mailHopsDisplay.auth( headXMailer, headUserAgent, headXMimeOLE, headAuth, headReceivedSPF );
-  }
 
   //loop through the received headers and parse for IP addresses
   if (!!headReceived){

chrome/content/msgNotificationBar.js

@@ -20,6 +20,7 @@ var mailHopsDisplay =
     this.resultBox = document.getElementById("mailhopsResult");
     this.resultText = document.getElementById("mailhopsResultText");
     this.mailhopsResultWeather = document.getElementById("mailhopsResultWeather");
+    this.mailhopsUnsubscribe = document.getElementById("mailhopsUnsubscribe");
     this.resultDetails = document.getElementById("mailhopsDataPaneDetails");
     //auth
     this.mailhopsDataPaneSPF = document.getElementById("mailhopsDataPaneSPF");
@@ -27,7 +28,6 @@ var mailHopsDisplay =
     this.mailhopsDataPaneMailer = document.getElementById("mailhopsDataPaneMailer");
     this.mailhopsDataPaneDNSBL = document.getElementById("mailhopsDataPaneDNSBL");
 
-    this.mailhopsUnsubscribe = document.getElementById("mailhopsUnsubscribe");
 
     //event listner for route click to launch map
     this.mailhopsDataPaneDNSBL.addEventListener("click", function () {
@@ -42,6 +42,24 @@ var mailHopsDisplay =
       else if(this.hasAttribute('data-route'))
         mailHopsUtils.launchMap( String(this.getAttribute('data-route')), options );
       });
+
+      if(!!options.bar_color)
+        document.getElementById("mailhopsNoficationBox").style.background = options.bar_color;
+      else
+        document.getElementById("mailhopsNoficationBox").style.background = '';
+
+      if(!!options.font_size)
+        document.getElementById("mailhopsNoficationBox").style.fontSize = options.font_size;
+
+      if(!!options.font_color){
+        this.resultText.style.color = options.font_color;
+        this.mailhopsResultWeather.style.color = options.font_color;
+        this.mailhopsUnsubscribe.style.color = options.font_color;
+        this.mailhopsDataPaneSPF.style.color = options.font_color;
+        this.mailhopsDataPaneDKIM.style.color = options.font_color;
+        this.mailhopsDataPaneMailer.style.color = options.font_color;
+        this.mailhopsDataPaneDNSBL.style.color = options.font_color;
+      }
   },
 
   lists: function( header_unsubscribe ){

chrome/content/preferences.js

@@ -9,7 +9,8 @@ var mailHopPreferences = {
   valid_api_key: false,
   fkey: '', //forecast.io api key
   country_filter: [],
-
+  previewBar: null,
+  
   loadPreferences: function(){
 
     this.api_host = document.getElementById("mailhop.api_host");
@@ -20,6 +21,8 @@ var mailHopPreferences = {
 
     this.fkey = document.getElementById("mailhop.fkey");
 
+    this.previewBar = document.getElementById("display_preview");
+
     document.getElementById("mailhop.lang").value = pref.getCharPref("mail.mailHops.lang",'en');
 
   	document.getElementById("mailhop.map_provider").value = pref.getCharPref("mail.mailHops.map_provider",'OpenStreetMap.Mapnik');
@@ -29,48 +32,15 @@ var mailHopPreferences = {
   	else
   	    document.getElementById("mailhop.unit").selectedIndex = 1;
 
-  	//Display Box Options
+  	//Display Box styles
-  	if(pref.getCharPref("mail.mailHops.show_meta",'true')=='true')
+  	document.getElementById("mailhop.bar_color").value = pref.getCharPref("mail.mailHops.bar_color",'#5E7A9B');
-  		document.getElementById("mailhop.show_meta").checked = true;
+    document.getElementById("mailhop.font_color").value = pref.getCharPref("mail.mailHops.font_color",'#FFF');
-  	else
+    document.getElementById("mailhop.font_size").value = pref.getCharPref("mail.mailHops.font_size",'14px');
-  		document.getElementById("mailhop.show_meta").checked = false;
 
-  	if(pref.getCharPref("mail.mailHops.show_auth",'true')=='true')
+    //Update styles
-  		document.getElementById("mailhop.show_auth").checked = true;
+    this.previewBar.style.background = document.getElementById("mailhop.bar_color").value;
-  	else
+    this.previewBar.style.color = document.getElementById("mailhop.font_color").value;
-  		document.getElementById("mailhop.show_auth").checked = false;
+    this.previewBar.style.fontSize = document.getElementById("mailhop.font_size").value;
-
-  	//Details Options
-  	if(pref.getCharPref("mail.mailHops.show_host",'true')=='true')
-  		document.getElementById("mailhop.show_host").checked = true;
-  	else
-  		document.getElementById("mailhop.show_host").checked = false;
-
-  	if(pref.getCharPref("mail.mailHops.show_secure",'true')=='true')
-  		document.getElementById("mailhop.show_secure").checked = true;
-  	else
-  		document.getElementById("mailhop.show_secure").checked = false;
-
-  	//Auth Options
-  	if(pref.getCharPref("mail.mailHops.show_spf",'true')=='true')
-  		document.getElementById("mailhop.show_spf").checked = true;
-  	else
-  		document.getElementById("mailhop.show_spf").checked = false;
-
-  	if(pref.getCharPref("mail.mailHops.show_dkim",'true')=='true')
-  		document.getElementById("mailhop.show_dkim").checked = true;
-  	else
-  		document.getElementById("mailhop.show_dkim").checked = false;
-
-  	if(pref.getCharPref("mail.mailHops.show_mailer",'true')=='true')
-  		document.getElementById("mailhop.show_mailer").checked = true;
-  	else
-  		document.getElementById("mailhop.show_mailer").checked = false;
-
-  	if(pref.getCharPref("mail.mailHops.show_dnsbl",'true')=='true')
-  		document.getElementById("mailhop.show_dnsbl").checked = true;
-  	else
-  		document.getElementById("mailhop.show_dnsbl").checked = false;
 
   	if(pref.getCharPref("mail.mailHops.debug",'true')=='true')
   		document.getElementById("mailhop.debug").checked = true;
@@ -118,19 +88,24 @@ var mailHopPreferences = {
       mailHopsUtils.launchExternalURL('https://darksky.net');
     });
     this.saveAPIKey();
+
+    document.getElementById("mailhop.bar_color").addEventListener("input", function () {
+      this.previewBar.style.background = this.value;
+    });
+    document.getElementById("mailhop.font_color").addEventListener("input", function () {
+      this.previewBar.style.color = this.value;
+    });
+    document.getElementById("mailhop.font_size").addEventListener("input", function () {
+      this.previewBar.style.fontSize = this.value;
+    });
   },
   savePreferences: function() {
     pref.setCharPref("mail.mailHops.lang", document.getElementById("mailhop.lang").selectedItem.value);
     pref.setCharPref("mail.mailHops.map_provider", document.getElementById("mailhop.map_provider").selectedItem.value);
     pref.setCharPref("mail.mailHops.unit", document.getElementById("mailhop.unit").selectedItem.value);
-    pref.setCharPref("mail.mailHops.show_meta", String(document.getElementById("mailhop.show_meta").checked));
+    pref.setCharPref("mail.mailHops.bar_color", String(document.getElementById("mailhop.bar_color").value));
-    pref.setCharPref("mail.mailHops.show_host", String(document.getElementById("mailhop.show_host").checked));
+    pref.setCharPref("mail.mailHops.font_color", String(document.getElementById("mailhop.font_color").value));
-    pref.setCharPref("mail.mailHops.show_secure", String(document.getElementById("mailhop.show_secure").checked));
+    pref.setCharPref("mail.mailHops.font_size", String(document.getElementById("mailhop.font_size").value));
-    pref.setCharPref("mail.mailHops.show_spf", String(document.getElementById("mailhop.show_spf").checked));
-    pref.setCharPref("mail.mailHops.show_dkim", String(document.getElementById("mailhop.show_dkim").checked));
-    pref.setCharPref("mail.mailHops.show_mailer", String(document.getElementById("mailhop.show_mailer").checked));
-    pref.setCharPref("mail.mailHops.show_dnsbl", String(document.getElementById("mailhop.show_dnsbl").checked));
-    pref.setCharPref("mail.mailHops.show_auth", String(document.getElementById("mailhop.show_auth").checked));
     pref.setCharPref("mail.mailHops.debug", String(document.getElementById("mailhop.debug").checked));
 
     //API vars
@@ -256,5 +231,14 @@ var mailHopPreferences = {
    this.api_http.value=="https://";
    this.api_http.selectedIndex = 0;
  	 this.api_host.value='api.mailhops.com';
- }
+ },
+
+ ResetDisplay: function(){
+   document.getElementById("mailhop.bar_color").value = '#5E7A9B';
+   document.getElementById("mailhop.font_color").value = '#FFF';
+   document.getElementById("mailhop.font_size").value = '14px';
+   this.previewBar.style.background = document.getElementById("mailhop.bar_color").value;
+   this.previewBar.style.color = document.getElementById("mailhop.font_color").value;
+   this.previewBar.style.fontSize = document.getElementById("mailhop.font_size").value;
+  }
 };

chrome/content/preferences.xul

@@ -480,22 +480,37 @@
 	    </tabpanel>
 	    <tabpanel>
 	    	<groupbox flex="1">
-				<caption label="Display Boxes"/>
+					<caption label="Display Styles"/>
-				<checkbox id="mailhop.show_auth" label="Show Auth" checked="true"/>
+
-				<checkbox id="mailhop.show_meta" label="Show Meta" checked="true"/>
+					<description id="display_preview" style="font-size: 14px; color: #FFF; background: #5E7A9B;">
-			</groupbox>
+						<image src="chrome://mailhops/content/images/mailhops32.png" width="32" height="32"/>
-			<groupbox flex="1">
+						MailHops Bar
-				<caption label="Details menu items"/>
+					</description>
-				<label class="mailhopsHostPref"><checkbox id="mailhop.show_host" label="Show Host" checked="true"/></label>
+					<div height="20"></div>
-				<label class="mailhopsSecurePref"><checkbox id="mailhop.show_secure" label="Show Secure Transmission" checked="true"/></label>
+					<grid>
-			</groupbox>
+					  <columns>
-			<groupbox flex="1">
+							<column/>
-				<caption label="Authentication menu items"/>
+					  </columns>
-				<checkbox id="mailhop.show_mailer" label="Show Mailer" checked="true"/>
+					  <rows>
-				<checkbox id="mailhop.show_spf" label="Show SPF" checked="true"/>
+					    <row>
-				<checkbox id="mailhop.show_dkim" label="Show DKIM" checked="true"/>
+								<label value="Bar Color"></label>
-				<checkbox id="mailhop.show_dnsbl" label="Show DNS Blacklist" checked="true"/>
+								<textbox id="mailhop.bar_color" value="#5E7A9B" placeholder="Enter a hex color code"/>
-			</groupbox>
+							</row>
+							<row>
+								<label value="Font Color"></label>
+								<textbox id="mailhop.font_color" value="#FFF" placeholder="Enter a hex color code"/>
+							</row>
+							<row>
+								<label value="Font Size"></label>
+								<textbox id="mailhop.font_size" value="14px" placeholder="Enter a size in pixels"/>
+							</row>
+							<row>
+								<span></span>
+								<button onclick="mailHopPreferences.ResetDisplay();">Reset Display</button>
+							</row>
+						</rows>
+					</grid>
+				</groupbox>
 	    </tabpanel>
 
 	    <tabpanel>

chrome/skin/classic/msgNotificationBar.css

@@ -37,7 +37,6 @@
   line-height: 24px;
   font-weight: normal;
   background: #5E7A9B;
-  border-bottom: 1px solid #355069;
 }
 
 #mailhopsNoficationBox #mailhopsDataPanePrefsLink {
@@ -47,11 +46,24 @@
   right: 0;
 }
 
-#mailhopsNoficationBox #mailhopsLogo, #mailhopsNoficationBox #mailhopsResultWeather, #mailhopsNoficationBox #mailhopsResultText{
+#mailhopsNoficationBox #mailhopsLogo,
-  cursor: pointer;
+#mailhopsNoficationBox #mailhopsResultText,
+#mailhopsNoficationBox #mailhopsResultWeather,
+#mailhopsNoficationBox #mailhopsUnsubscribe,
+#mailhopsNoficationBox #mailhopsDataPaneDNSBL,
+#mailhopsNoficationBox #mailhopsDataPaneDKIM,
+#mailhopsNoficationBox #mailhopsDataPaneSPF,
+#mailhopsNoficationBox #mailhopsDataPaneMailer {
   color: #fff;
 }
 
+#mailhopsNoficationBox #mailhopsLogo,
+#mailhopsNoficationBox #mailhopsResultText,
+#mailhopsNoficationBox #mailhopsResultWeather,
+#mailhopsNoficationBox #mailhopsUnsubscribe {
+  cursor: pointer;
+}
+
 #mailhopsNoficationBox .unsubscribe {
   color: #CCC;
 }

install.rdf

@@ -5,7 +5,7 @@
 	<Description about="urn:mozilla:install-manifest">
 		<em:type>2</em:type>
 		<em:id>thunderbird@mailhops.com</em:id>
-		<em:version>3.0.0</em:version>
+		<em:version>3.0.1</em:version>
 
 		<em:name>MailHops</em:name>
 		<em:description>MailHops maps the route an email took to get to you. Displaying the senders location, weather, user-agent and authentication used.</em:description>