From 79dcadfee16da6f43a779c39291d29e31e86ce4c Mon Sep 17 00:00:00 2001
From: Francois Marier <francois@mozilla.com>
Date: Mon, 14 Apr 2014 19:09:18 +1200
Subject: [PATCH 1/2] Add a block/unblock button to the infobar

This adds an easier way of blocking individual sites. No need to
switch to the list view and perform the action there, it can all
be done within the graph view now.
---
 data/image/lightbeam_icon_blockbtn.png | Bin 0 -> 499 bytes
 data/index.html                        |  12 +++++++++
 data/infobar.js                        |  33 +++++++++++++++++++++++++
 3 files changed, 45 insertions(+)
 create mode 100644 data/image/lightbeam_icon_blockbtn.png

diff --git a/data/image/lightbeam_icon_blockbtn.png b/data/image/lightbeam_icon_blockbtn.png
new file mode 100644
index 0000000000000000000000000000000000000000..b85cf0383580e677c4a12a075dca62d8f4e25256
GIT binary patch
literal 499
zcmeAS@N?(olHy`uVBq!ia0vp^Mj*_=3?wxlRx|@Cj{u(#S0MfF-Meq!zWx09^Ut3@
z|NsAg{rdIAOIPrtt5>hyxN+n5?b~<n-hKS|@rxHP<k%B81I-dF3GxdD(m=qfVBipt
z(9pmC{(Id(exOB+o}Mm_Ar-flPJ7$etRUdJRwU4IO6aZc^_O$aE_BBi->s<gye!<7
zD6xXiU~cih=Hj_4^)B!wYe=+D;}HAbp31tgeZ#b0!Uum8beXpY`#2_8%{al<lzL3&
z@%d|lJxf=9l`q{q$Eub=e<}AB?FPBFgQt>(9C%Zm?oGJ6{oW^?<j=o1$Zcx8;Fi`P
zcvC5marZ10A?C|lDwnV%|9rOguZHtI{*x82_SicMP8Z@`D=_n<efP0;8?(^q`=pXy
zsPXPTwRC-yS%Ag6)f{e0+B^59WxcSx8X2Z!T5?D0%nfa0V*!b2{yaMJo@#89de*A2
zZ4+X3<`MA;oVKWOlTLTMNx+|{f~!@XA9g%Ez#yTp?pN#HggxfIWlN4FU!JmRp49Jk
zZz4k^_vb&>kXev)@mPM0*!1-(RUgm(*`#vg_jHSTtvj_7KBS-jd;IGE`33uL>`YcF
S{QJ)Y6waQmelF{r5}E+C^zSnO

literal 0
HcmV?d00001

diff --git a/data/index.html b/data/index.html
index 6fba134..2f9e4e4 100644
--- a/data/index.html
+++ b/data/index.html
@@ -86,6 +86,18 @@
                                 <img src="" />
                                 This site is currently
                                 <b><span></span></b>.
+                                <br/>
+                            </div>
+                            <div class="pref-action">
+                                <br/>
+                                <div class="btn">
+                                    <a class="unblock hidden">
+                                        <img src="image/lightbeam_icon_blockbtn.png" />Unblock Site
+                                    </a>
+                                    <a class="block">
+                                        <img src="image/lightbeam_icon_blockbtn.png" />Block Site
+                                    </a>
+                                </div>
                             </div>
                         <div class="map-section">
                             <header class="blue-text large-header">Server Location</header>
diff --git a/data/infobar.js b/data/infobar.js
index 75c1ca6..6f91473 100644
--- a/data/infobar.js
+++ b/data/infobar.js
@@ -96,6 +96,26 @@ function updateMap(countryCode){
     setZoom(newViewBox, mapcanvas);
 }
 
+document.querySelector(".pref-action .block").addEventListener('click', function(evt) {
+    var site = this.dataset.siteName;
+    confirmBlockSitesDialog(function(confirmed) {
+        if (confirmed) {
+            userSettings[site] = 'block';
+            global.self.port.emit('updateBlocklist', site, true);
+            showSitePref(site);
+        }
+    });
+    evt.preventDefault();
+});
+
+document.querySelector(".pref-action .unblock").addEventListener('click', function(evt) {
+    var site = this.dataset.siteName;
+    userSettings[site] = '';
+    global.self.port.emit('updateBlocklist', site, false);
+    showSitePref(site);
+    evt.preventDefault();
+});
+
 // updates info on the info panel
 function updateInfo(nodeName){
 
@@ -132,6 +152,8 @@ function showFirstAndLastAccess(site){
 
 function showSitePref(nodeName){
     var prefTag = document.querySelector(".pref-tag");
+    var blockButton = document.querySelector(".pref-action .block");
+    var unblockButton = document.querySelector(".pref-action .unblock");
     var sitePref = userSettings[nodeName];
     if ( sitePref ){
         prefTag.querySelector("img").src = "icons/lightbeam_icon_"+sitePref+".png";
@@ -139,9 +161,20 @@ function showSitePref(nodeName){
         prefTag.querySelector("span").classList.add(sitePref + "-text");
         prefTag.querySelector("span").textContent = (sitePref=="hide") ? "hidden" : sitePref + "ed";
         prefTag.classList.remove("hidden");
+        if (sitePref == "block") {
+            unblockButton.classList.remove("hidden");
+            blockButton.classList.add("hidden");
+        } else {
+            unblockButton.classList.add("hidden");
+            blockButton.classList.remove("hidden");
+        }
     }else{
         prefTag.classList.add("hidden");
+        unblockButton.classList.add("hidden");
+        blockButton.classList.remove("hidden");
     }
+    unblockButton.dataset.siteName = nodeName;
+    blockButton.dataset.siteName = nodeName;
 }
 
 function showConnectionsList(nodeName,nodeList){

From 3cad01fca1fbb8d88c90a2c8c800ce8ffc641f8d Mon Sep 17 00:00:00 2001
From: Francois Marier <francois@mozilla.com>
Date: Tue, 15 Apr 2014 15:43:59 +1200
Subject: [PATCH 2/2] Use color buttons to match the list tab

Replaced the monochrome button icon (styled after the left sidebar
buttons) with a the color one that's used in the list view.

Also added a green version of the icon since it looked weird to
have a red "forbidden" symbol next to "Unblock Site".
---
 data/icons/lightbeam_icon_unblock.png  | Bin 0 -> 437 bytes
 data/image/lightbeam_icon_blockbtn.png | Bin 499 -> 0 bytes
 data/index.html                        |   4 ++--
 3 files changed, 2 insertions(+), 2 deletions(-)
 create mode 100644 data/icons/lightbeam_icon_unblock.png
 delete mode 100644 data/image/lightbeam_icon_blockbtn.png

diff --git a/data/icons/lightbeam_icon_unblock.png b/data/icons/lightbeam_icon_unblock.png
new file mode 100644
index 0000000000000000000000000000000000000000..8dae32cdab8dbff25cd43a27f119379b0fe4ccc5
GIT binary patch
literal 437
zcmeAS@N?(olHy`uVBq!ia0vp^Mj*_=3?wxlRx|@C*8raoS0F9(KovjIdSq<z#L?qf
zK-i1eqBj+NA12TJxN!C7wO4;$d;I&!|NsAI{;vkvz+DpL7tEkw;1H0|(7*rwdp_n9
zVhjw7BAzaeAr-ggPP-}8tia>S$|Byi<KX}Lthsz9B`%kCK0nERPQcmYg%(HZnTo_7
zp}X=Y5;w74R*-bOT(zmh`Niad$-megd%jH!4B0*-w|VELiQ9N)8PEB?epRsfw7)&_
z=V~iUs=U`IinUx7vXyN5cPG73#ouzlp1`v05s8aq?jN>Fn)+DmR)|E8ap1O7D`stc
zIp4P?=fUaRCB7}wgmRqXPE9zkY<BXwu}ER-HX#k8iK|tNp4<|g>lJUk{7vS<S3bY2
zET8&tpAGNSi9GrBX~of{R;Rn3i}q_fBpi6p?8(+Aq#?0Dr|}W{I*Edbjb)4`stdj{
z@``0VKCpqoEhzbeWnF|(Mn%VCf7XAFO?K5Ej*EV1sb<cYR@EWaeY_YLYz&^RelF{r
G5}E+~QoDr!

literal 0
HcmV?d00001

diff --git a/data/image/lightbeam_icon_blockbtn.png b/data/image/lightbeam_icon_blockbtn.png
deleted file mode 100644
index b85cf0383580e677c4a12a075dca62d8f4e25256..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 499
zcmeAS@N?(olHy`uVBq!ia0vp^Mj*_=3?wxlRx|@Cj{u(#S0MfF-Meq!zWx09^Ut3@
z|NsAg{rdIAOIPrtt5>hyxN+n5?b~<n-hKS|@rxHP<k%B81I-dF3GxdD(m=qfVBipt
z(9pmC{(Id(exOB+o}Mm_Ar-flPJ7$etRUdJRwU4IO6aZc^_O$aE_BBi->s<gye!<7
zD6xXiU~cih=Hj_4^)B!wYe=+D;}HAbp31tgeZ#b0!Uum8beXpY`#2_8%{al<lzL3&
z@%d|lJxf=9l`q{q$Eub=e<}AB?FPBFgQt>(9C%Zm?oGJ6{oW^?<j=o1$Zcx8;Fi`P
zcvC5marZ10A?C|lDwnV%|9rOguZHtI{*x82_SicMP8Z@`D=_n<efP0;8?(^q`=pXy
zsPXPTwRC-yS%Ag6)f{e0+B^59WxcSx8X2Z!T5?D0%nfa0V*!b2{yaMJo@#89de*A2
zZ4+X3<`MA;oVKWOlTLTMNx+|{f~!@XA9g%Ez#yTp?pN#HggxfIWlN4FU!JmRp49Jk
zZz4k^_vb&>kXev)@mPM0*!1-(RUgm(*`#vg_jHSTtvj_7KBS-jd;IGE`33uL>`YcF
S{QJ)Y6waQmelF{r5}E+C^zSnO

diff --git a/data/index.html b/data/index.html
index 2f9e4e4..35e2336 100644
--- a/data/index.html
+++ b/data/index.html
@@ -92,10 +92,10 @@
                                 <br/>
                                 <div class="btn">
                                     <a class="unblock hidden">
-                                        <img src="image/lightbeam_icon_blockbtn.png" />Unblock Site
+                                        <img src="icons/lightbeam_icon_unblock.png" />Unblock Site
                                     </a>
                                     <a class="block">
-                                        <img src="image/lightbeam_icon_blockbtn.png" />Block Site
+                                        <img src="icons/lightbeam_icon_block.png" />Block Site
                                     </a>
                                 </div>
                             </div>