Privacy enhancement

- Accept or reject all services with one-click
- Viewing the number of services activated / deactivated
- High privacy feature for disabling auto consent

css/tarteaucitron.css

@@ -112,7 +112,7 @@
     left: 0;
     margin: 0 auto;
     max-height: 80%;
-    max-width: 800px;
+    max-width: 860px;
     overflow: auto;
     padding: 0;
     position: fixed;
@@ -161,7 +161,7 @@
 }
 
 #tarteaucitron #tarteaucitronServices .tarteaucitronTitle {
-    background: #f2f2f2;
+    background: #e4e4e4;
     color: #333;
     font-size: 20px;
     padding: 18px 22px;
@@ -169,7 +169,7 @@
 
 #tarteaucitron #tarteaucitronServices .tarteaucitronTitle .tarteaucitronDetails {
     color: #777;
-    font-size: 13px;
+    font-size: 15px;
 }
 
 #tarteaucitron #tarteaucitronServices .tarteaucitronLine:hover {
@@ -186,6 +186,24 @@
     padding: 15px 5px;
 }
 
+#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine {
+    background: #444 !important;
+    border: 0;
+    margin-bottom: 5px;
+}
+
+#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName {
+    margin-top: 2px;
+}
+
+#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName b {
+    color: #fff;
+}
+
+#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronAsk {
+    margin-top: 0px !important;
+}
+
 #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName {
     display: inline-block;
     float: left;
@@ -280,27 +298,47 @@
     cursor: pointer;
     display: none;
     font-size: 11px !important;
-    padding: 3px;
-    padding-right: 5px;
+    padding: 5px;
     position: fixed;
     right: 0;
+    text-align: center;
     z-index: 2147483645;
 }
 
 #tarteaucitronAlertSmall #tarteaucitronDot {
-    background-color: #E63737;
-    border-radius: 10px;
+    background-color: gray;
+    border-radius: 5px;
     display: inline-block;
-    height: 10px;
-    margin: 0px 5px 2px 5px;
-    vertical-align: middle;
-    width: 10px;
+    height: 8px;
+    margin-top: 5px;
+    overflow: hidden;
+    width: 100%;
+}
+
+#tarteaucitronAlertSmall #tarteaucitronDot #tarteaucitronDotGreen,
+#tarteaucitronAlertSmall #tarteaucitronDot #tarteaucitronDotYellow,
+#tarteaucitronAlertSmall #tarteaucitronDot #tarteaucitronDotRed {
+    display: block;
+    float: left;
+    height: 100%;
+    width: 0%;
+}
+
+#tarteaucitronAlertSmall #tarteaucitronDot #tarteaucitronDotGreen {
+    background-color: #1B870B;
+}
+
+#tarteaucitronAlertSmall #tarteaucitronDot #tarteaucitronDotYellow {
+    background-color: #FBDA26;
+}
+
+#tarteaucitronAlertSmall #tarteaucitronDot #tarteaucitronDotRed {
+    background-color: #9C1A1A;
 }
 
 /***
  * Fallback activate link
  */
-
 .tac_activate {
     background: #333;
     display: block;

lang/tarteaucitron.en.js

@@ -1,10 +1,13 @@
 /*global tarteaucitron */
 tarteaucitron.lang = {
     "alertBig": "If you continue to browse this website, you are allowing all third-party services",
+    "alertBigPrivacy": "This site uses cookies and gives you control over what you want to activate",
     "alertSmall": "Manage Cookies",
     "personalize": "Personalize",
     "acceptAll": "OK, accept all",
     "close": "Close",
+    
+    "all": "Preference for all services",
 
     "info": "Transparency about cookies",
     "disclaimer": "By allowing these third party services, you accept theirs cookies and the use of tracking technologies necessary for their proper functioning.",

lang/tarteaucitron.fr.js

@@ -1,11 +1,14 @@
 /*global tarteaucitron */
 tarteaucitron.lang = {
     "alertBig": "En poursuivant votre navigation, vous acceptez l'utilisation de services tiers pouvant installer des cookies",
+    "alertBigPrivacy": "Ce site utilise des cookies et vous donne le contrôle sur ce que vous souhaitez activer",
     "alertSmall": "Gestion des cookies",
     "acceptAll": "OK, tout accepter",
     "personalize": "Personnaliser",
     "close": "Fermer",
 
+    "all": "Préférence pour tous les services",
+
     "info": "Transparence sur les cookies",
     "disclaimer": "En autorisant ces services tiers, vous acceptez le dépôt et la lecture de cookies et l'utilisation de technologies de suivi nécessaires à leur bon fonctionnement.",
     "allow": "Autoriser",

tarteaucitron.js

@@ -6,6 +6,7 @@ var scripts = document.getElementsByTagName('script'),
     cdn = path.split('/').slice(0, -1).join('/') + '/';
 
 var tarteaucitron = {
+    "highPrivacy": false,
     "showAlertSmall": true, // show the small banner on bottom right?
     "autoOpen": false, // auto open the panel with #tarteaucitron hash?
     "grayArea": false, // activate the features of the gray area?
@@ -98,6 +99,21 @@ var tarteaucitron = {
                 html += '      </div>';
                 html += '   </div>';
                 html += '   <div id="tarteaucitronServices">';
+                
+                html += '<div class="tarteaucitronLine tarteaucitronMainLine">';
+                html += '   <div class="tarteaucitronName">';
+                html += '       <b>' + tarteaucitron.lang.all + '</b>';
+                html += '   </div>';
+                html += '   <div class="tarteaucitronAsk">';
+                html += '       <div id="tarteaucitronAllAllowed" class="tarteaucitronAllow" onclick="tarteaucitron.userInterface.acceptAll();">';
+                html += '           ' + tarteaucitron.lang.allow;
+                html += '       </div> ';
+                html += '       <div id="tarteaucitronAllDenied" class="tarteaucitronDeny" onclick="tarteaucitron.userInterface.rejectAll();">';
+                html += '           ' + tarteaucitron.lang.deny;
+                html += '       </div>';
+                html += '   </div>';
+                html += '</div>';
+                html += '<div class="clear"></div>';
 
                 for (index = 0; index < tarteaucitron.job.length; index += 1) {
                     service = s[tarteaucitron.job[index]];
@@ -137,22 +153,38 @@ var tarteaucitron = {
                 html += '      <a href="https://opt-out.ferank.eu/" rel="nofollow" target="_blank">' + tarteaucitron.lang.credit + '</a>';
                 html += '   </div>';
                 html += '</div>';
-                html += '<div id="tarteaucitronAlertBig">';
-                html += '   <span id="tarteaucitronDisclaimerAlert">';
-                html += '       ' + tarteaucitron.lang.alertBig;
-                html += '   </span>';
-                html += '   <span id="tarteaucitronPersonalize" onclick="tarteaucitron.userInterface.acceptAll();">';
-                html += '       ' + tarteaucitron.lang.acceptAll;
-                html += '   </span>';
-                html += '   <span id="tarteaucitronCloseAlert" onclick="tarteaucitron.userInterface.openPanel();">';
-                html += '       ' + tarteaucitron.lang.personalize;
-                html += '   </span>';
-                html += '</div>';
+                
+                if (tarteaucitron.highPrivacy) {
+                    html += '<div id="tarteaucitronAlertBig">';
+                    html += '   <span id="tarteaucitronDisclaimerAlert">';
+                    html += '       ' + tarteaucitron.lang.alertBigPrivacy;
+                    html += '   </span>';
+                    html += '   <span id="tarteaucitronPersonalize" onclick="tarteaucitron.userInterface.openPanel();">';
+                    html += '       ' + tarteaucitron.lang.personalize;
+                    html += '   </span>';
+                    html += '</div>';
+                } else {
+                    html += '<div id="tarteaucitronAlertBig">';
+                    html += '   <span id="tarteaucitronDisclaimerAlert">';
+                    html += '       ' + tarteaucitron.lang.alertBig;
+                    html += '   </span>';
+                    html += '   <span id="tarteaucitronPersonalize" onclick="tarteaucitron.userInterface.acceptAll();">';
+                    html += '       ' + tarteaucitron.lang.acceptAll;
+                    html += '   </span>';
+                    html += '   <span id="tarteaucitronCloseAlert" onclick="tarteaucitron.userInterface.openPanel();">';
+                    html += '       ' + tarteaucitron.lang.personalize;
+                    html += '   </span>';
+                    html += '</div>';
+                }
                 
                 if (tarteaucitron.showAlertSmall === true) {
                     html += '<div id="tarteaucitronAlertSmall" onclick="tarteaucitron.userInterface.openPanel();">';
-                    html += '   <span id="tarteaucitronDot"></span>';
                     html += '   ' + tarteaucitron.lang.alertSmall;
+                    html += '   <div id="tarteaucitronDot">';
+                    html += '       <span id="tarteaucitronDotGreen"></span>';
+                    html += '       <span id="tarteaucitronDotYellow"></span>';
+                    html += '       <span id="tarteaucitronDotRed"></span>';
+                    html += '   </div>';
                     html += '</div>';
                 }
 
@@ -168,7 +200,7 @@ var tarteaucitron = {
                     isAllowed = (cookie.indexOf(service.key + '=true') >= 0) ? true : false;
                     isResponded = (cookie.indexOf(service.key) >= 0) ? true : false;
 
-                    if ((!isResponded && (isAutostart || isNavigating)) || isAllowed) {
+                    if ((!isResponded && (isAutostart || isNavigating) && !tarteaucitron.highPrivacy) || isAllowed) {
                         if (!isAllowed) {
                             tarteaucitron.cookie.create(service.key, true);
                         }
@@ -235,6 +267,22 @@ var tarteaucitron = {
                 tarteaucitron.userInterface.closeAlert();
             }
         },
+        "rejectAll": function () {
+            "use strict";
+            var s = tarteaucitron.services,
+                service,
+                key,
+                index = 0;
+            
+            for (index = 0; index < tarteaucitron.job.length; index += 1) {
+                service = s[tarteaucitron.job[index]];
+                key = service.key;
+
+                tarteaucitron.state[key] = false;
+                tarteaucitron.cookie.create(key, false);
+                tarteaucitron.userInterface.color(key, false);
+            }
+        },
         "respond": function (el, status) {
             "use strict";
             var key = el.id.replace(new RegExp("(Eng[0-9]+|Allow|Deni)ed", "g"), '');
@@ -262,8 +310,12 @@ var tarteaucitron = {
                 greenLight = '#E6FFE2',
                 redDark = '#9C1A1A',
                 redLight = '#FFE2E2',
+                yellowDark = '#FBDA26',
                 c = 'tarteaucitron',
-                allAllowed = true,
+                nbDenied = 0,
+                nbPending = 0,
+                nbAllowed = 0,
+                sum = tarteaucitron.job.length,
                 index;
 
             if (status === true) {
@@ -277,17 +329,29 @@ var tarteaucitron = {
             }
         
             // check if all services are allowed
-            for (index = 0; index < tarteaucitron.job.length; index += 1) {
+            for (index = 0; index < sum; index += 1) {
                 if (tarteaucitron.state[tarteaucitron.job[index]] === false) {
-                    allAllowed = false;
-                    break;
+                    nbDenied += 1;
+                } else if (tarteaucitron.state[tarteaucitron.job[index]] === undefined) {
+                    nbPending += 1;
+                } else if (tarteaucitron.state[tarteaucitron.job[index]] === true) {
+                    nbAllowed += 1;
                 }
             }
         
-            if (allAllowed) {
-                tarteaucitron.userInterface.css(c + 'Dot', 'backgroundColor', greenDark);
+            tarteaucitron.userInterface.css(c + 'DotGreen', 'width', ((100 / sum) * nbAllowed) + '%');
+            tarteaucitron.userInterface.css(c + 'DotYellow', 'width', ((100 / sum) * nbPending) + '%');
+            tarteaucitron.userInterface.css(c + 'DotRed', 'width', ((100 / sum) * nbDenied) + '%');
+            
+            if (nbDenied === 0 && nbPending === 0) {
+                tarteaucitron.userInterface.css(c + 'AllAllowed', 'backgroundColor', greenDark);
+                tarteaucitron.userInterface.css(c + 'AllDenied', 'backgroundColor', gray);
+            } else if (nbAllowed === 0 && nbPending === 0) {
+                tarteaucitron.userInterface.css(c + 'AllAllowed', 'backgroundColor', gray);
+                tarteaucitron.userInterface.css(c + 'AllDenied', 'backgroundColor', redDark);
             } else {
-                tarteaucitron.userInterface.css(c + 'Dot', 'backgroundColor', redDark);
+                tarteaucitron.userInterface.css(c + 'AllAllowed', 'backgroundColor', gray);
+                tarteaucitron.userInterface.css(c + 'AllDenied', 'backgroundColor', gray);
             }
         },
         "openPanel": function () {