New Addon version 1.2

+ Badges counts only per url (for this feature we need the new "tabs"
permission)
+ New Interface. Special thanks to @grahamperrin and @Thorin-Oakenpants.
(#21)
+ Files in folder ordered
- Remove siteBlockedAlert.html page. We're show now nothing.
+ Revised texts for Rules-Status
+ Add File for version number

clearurls.js

@@ -14,7 +14,7 @@ var badgedStatus;
 var tabid = 0;
 var globalCounter;
 var globalurlcounter;
-var siteBlockedAlert = browser.extension.getURL('./siteBlockedAlert.html');
+var siteBlockedAlert = browser.extension.getURL('./');
 var dataHash;
 var localDataHash;
 
@@ -98,20 +98,20 @@ function loadOldDataFromStore()
 /**
  * Save the hash status to the local storage.
  * The status can have the following values:
- *  1 "unchanged"
+ *  1 "up to date"
- *  2 "authorized, changed"
+ *  2 "updated"
- *  3 "unauthorized, changed"
+ *  3 "update available"
  *  @param status_code the number for the status
  */
 function storeHashStatus(status_code)
 {
     switch(status_code)
     {
-        case 1: status_code = "unchanged";
+        case 1: status_code = "up to date";
                 break;
-        case 2: status_code = "authorized, changed";
+        case 2: status_code = "updated";
                 break;
-        case 3: status_code = "unauthorized, changed";
+        case 3: status_code = "update available";
                 break;
         default: status_code = "error";
     }
@@ -619,13 +619,6 @@ function getLoggingStatus()
 browser.windows.onRemoved.addListener(saveLog);
 browser.tabs.onCreated.addListener(saveLog);
 
-/**
-* Call by each tab is closed.
-*/
-function handleRemoved(tabId, removeInfo) {
-    delete badges[tabId];
-}
-
 /**
 * Function that calls some function on storage change.
 */
@@ -672,9 +665,20 @@ getLogOnStart();
 browser.storage.onChanged.addListener(reactToStorageChange);
 
 /**
-* Call by each tab is closed.
+* Call by each tab is updated.
+* And if url has changed.
 */
-browser.tabs.onRemoved.addListener(handleRemoved);
+function handleUpdated(tabId, changeInfo, tabInfo) {
+    if(changeInfo.url)
+    {
+        delete badges[tabId];
+    }
+}
+
+/**
+* Call by each tab is updated.
+*/
+browser.tabs.onUpdated.addListener(handleUpdated);
 
 /**
 * Call by each tab change to set the actual tab id

core_js/popup_new.js

@@ -183,7 +183,7 @@ $(document).ready(function(){
     $('#reset_counter_btn').on("click", resetGlobalCounter);
     $('#tabcounter').on('change', changeTabcounter);
     $('#logging').on('change', changeLogging);
-    $('#loggingPage').attr('href', browser.extension.getURL('./log.html'));
+    $('#loggingPage').attr('href', browser.extension.getURL('./html/log.html'));
 
     browser.storage.onChanged.addListener(changeStatistics);
 });

core_js/write_version.js

@@ -0,0 +1,6 @@
+/**
+ * This file writes only the version into every page.
+ * @return version
+ */
+var version = "1.2";
+$('#version').text(version);

css/core.css

@@ -0,0 +1,16 @@
+body {
+    font-size: 13px;
+}
+
+.small-version {
+    font-size: 10px;
+}
+
+.navbar-header {
+    margin-top: 0;
+    margin-bottom: 8px;
+}
+
+.col-sm-1 {
+    margin-top: -10px;
+}

css/switchButtons.css

@@ -64,4 +64,8 @@ input:checked + .slider:before {
 .switch label {
     position: absolute;
     left: 60px;
-}
+}
+
+label {
+    font-weight: normal;
+}

external_js/desktop.ini

@@ -0,0 +1,6 @@
+[LocalizedFileNames]
+sha256.jquery.js=@sha256.jquery.js,0
+jquery.dataTables.min.js=@jquery.dataTables.min.js,0
+dataTables.bootstrap.min.js=@dataTables.bootstrap.min.js,0
+bootstrap.min.js=@bootstrap.min.js,0
+jquery-3.2.1.min.js=@jquery-3.2.1.min.js,0

html/log.html

@@ -7,8 +7,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
     <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="bootstrap.min.css">
+    <link rel="stylesheet" href="../css/bootstrap.min.css">
-    <link rel="stylesheet" href="dataTables.bootstrap.min.css">
+    <link rel="stylesheet" href="../css/dataTables.bootstrap.min.css">
+    <link rel="stylesheet" type="text/css" href="../css/core.css">
     <style>
     td {
         word-wrap: break-word;
@@ -22,8 +23,13 @@
         <div class="container">
             <div class="navbar-header">
                 <span class="navbar-brand">
-                    <span><img src="icon38.png" width="30" height="30" alt=""></span>
+                    <span class="pull-left"><img src="../img/icon38.png"
-                    ClearURLs
+                        width="30" height="30" alt=""></span>
+                    <span style="color: #FF7800;" class="pull-right">
+                        ClearURLs
+                    </span><br />
+                    <span class="label label-warning pull-left small-version"
+                    id="version"></span>
                 </span>
             </div>
         </div>
@@ -32,10 +38,12 @@
     <div class="row">
         <div class="col-md-10 col-md-offset-1">
             <p class="text-center">
-                <button type="button" id="reset_log_btn" class="btn btn-danger" title="Reset the global log">Reset log</button>
+                <button type="button" id="reset_log_btn"
+                class="btn btn-danger" title="Reset the global log">Reset</button>
             </p>
             <div class="table-responsive">
-                <table class="table table-striped table-bordered" width="100%" id="logTable" cellspacing="0">
+                <table class="table table-striped table-bordered"
+                width="100%" id="logTable" cellspacing="0">
                     <thead>
                         <tr>
                             <th data-orderable="false">
@@ -58,22 +66,14 @@
             </div>
         </div>
     </div>
-    <br>
-    <footer>
-        <div class="row">
-            <div class="navbar-inverse navbar-fixed-bottom text-center">
-                <small class="text-muted">Version 1.1.2.5</small>
-            </div>
-        </div>
-    </footer>
-
 
     <!-- Optional JavaScript -->
     <!-- jQuery first, then Popper.js, then Bootstrap JS -->
-    <script src="jquery-3.2.1.min.js"></script>
+    <script src="../external_js/jquery-3.2.1.min.js"></script>
-    <script src="bootstrap.min.js"></script>
+    <script src="../external_js/bootstrap.min.js"></script>
-    <script src="jquery.dataTables.min.js"></script>
+    <script src="../external_js/jquery.dataTables.min.js"></script>
-    <script src="dataTables.bootstrap.min.js"></script>
+    <script src="../external_js/dataTables.bootstrap.min.js"></script>
-    <script src="log.js"></script>
+    <script src="../core_js/log.js"></script>
+    <script src="../core_js/write_version.js"></script>
 </body>
 </html>

html/popup.html

@@ -0,0 +1,134 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>ClearURLs</title>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <!-- Bootstrap CSS -->
+    <link rel="stylesheet" href="../css/bootstrap.min.css">
+    <link rel="stylesheet" type="text/css" href="../css/switchButtons.css">
+    <link rel="stylesheet" type="text/css" href="../css/core.css">
+</head>
+<body>
+    <div class="container-fluid"
+    style="background: url('../img/img-noise-361x370.png');background-size: auto;">
+    <div class="row">
+        <nav class="col-sm-1 navbar navbar-inverse">
+            <div class="container">
+                <div class="navbar-header">
+                    <span class="navbar-brand">
+                        <span class="pull-left"><img src="../img/icon38.png"
+                            width="30" height="30" alt=""></span>
+                            <span style="color: #FF7800;" class="pull-right">
+                                ClearURLs
+                            </span><br />
+                            <span class="label label-warning pull-left small-version"
+                            id="version"></span>
+                        </span>
+                    </div>
+                </div>
+            </nav>
+        </div>
+
+        <div class="row">
+            <div class="col-sm-1">
+                <h5><b>Configs</b></h5>
+                <label class="switch">
+                    <input type="checkbox" id="globalStatus">
+                    <span class="slider round"></span>
+                    <label>Filters</label>
+                </label>
+                <br>
+                <label class="switch">
+                    <input type="checkbox" id="logging">
+                    <span class="slider round"></span>
+                    <label title="The log is saved only locally. We advise against this feature if you do not need it.">
+                    Logging
+                </label>
+            </label>
+            <br>
+            <label class="switch">
+                <input type="checkbox" id="tabcounter">
+                <span class="slider round"></span>
+                <label>Badges</label>
+            </label>
+            <div class="clearfix"></div>
+            <br />
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-sm-1">
+            <h5><b>Statistics</b></h5>
+
+            <div class="progress">
+                <div class="progress-bar progress-bar-danger progress-bar-striped"
+                role="progressbar" style="width: 0%" id="progress_blocked"></div>
+                <div class="progress-bar progress-bar-info progress-bar-striped"
+                role="progressbar" style="width: 100%" id="progress_non_blocked"></div>
+            </div>
+
+            <div>
+                <span class="pull-left">Elements</span>
+                <span class="pull-right text-info"
+                id="statistics_total_elements"></span>
+                <div class="clearfix"></div>
+            </div>
+
+            <div>
+                <span class="pull-left">Blocked</span>
+                <span class="pull-right text-danger"
+                id="statistics_value"></span>
+                <div class="clearfix"></div>
+            </div>
+
+            <div>
+                <span class="pull-left">Percentage</span>
+                <span class="pull-right text-success"
+                id="statistics_value_global_percentage"></span>
+                <div class="clearfix"></div>
+            </div>
+            <br />
+            <div class="text-center">
+                <button type="button" id="reset_counter_btn"
+                class="btn btn-danger btn-xs"
+                title="Reset the global statistics">Reset</button>
+                <div class="clearfix"></div>
+                <br />
+            </div>
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-sm-1">
+            <h5><b>Rules-Status</b></h5>
+            <a href="https://github.com/KevinRoebert/ClearUrls/commits/master/data/data.json"
+            id="hashStatus" class="btn btn-primary btn-xs pull-right"></a>
+            <div class="clearfix"></div>
+            <br />
+        </div>
+    </div>
+    <br />
+    <div class="row">
+        <div class="col-sm-1">
+            <div class="text-center">
+                <a type="button" id="loggingPage" target="_blank"
+                class="btn btn-default btn-sm btn-block"
+                title="Open the log">Log</a>
+            </div>
+        </div>
+    </div>
+    <br />
+</div>
+
+
+<!-- Optional JavaScript -->
+<!-- jQuery first, then Popper.js, then Bootstrap JS -->
+<script src="../external_js/jquery-3.2.1.min.js"></script>
+<script src="../external_js/bootstrap.min.js"></script>
+<script src="../core_js/popup_new.js"></script>
+<script src="../core_js/write_version.js"></script>
+</body>
+</html>

html/siteBlockedAlert.html

@@ -7,7 +7,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
     <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="bootstrap.min.css">
+    <link rel="stylesheet" href="../css/bootstrap.min.css">
 
     <style>
         body {
@@ -45,13 +45,13 @@
 
     <footer class="navbar-fixed-bottom">
         <div class="navbar-inverse text-center">
-            <small class="text-muted">Version 1.1.2.4</small>
+            <small class="text-muted">Version 1.1.2.5</small>
         </div>
     </footer>
 
     <!-- Optional JavaScript -->
     <!-- jQuery first, then Popper.js, then Bootstrap JS -->
-    <script src="jquery-3.2.1.min.js"></script>
+    <script src="../external_js/jquery-3.2.1.min.js"></script>
-    <script src="bootstrap.min.js"></script>
+    <script src="../external_js/bootstrap.min.js"></script>
 </body>
 </html>

manifest.json

@@ -1,35 +1,36 @@
 {
   "manifest_version": 2,
   "name": "ClearURLs",
-  "version": "1.1.2.5",
+  "version": "1.2",
   "author": "Kevin R.",
-  "description": "Remove tracking elements form URLs. ",
+  "description": "Remove tracking elements form URLs.",
   "homepage_url": "https://github.com/KevinRoebert/ClearUrls",
   "icons": {
-    "32": "icon32.png",
+    "32": "img/icon32.png",
-    "48": "icon48.png",
+    "48": "img/icon48.png",
-    "64": "icon64.png",
+    "64": "img/icon64.png",
-    "96": "icon96.png"
+    "96": "img/icon96.png"
   },
   "browser_action": {
     "browser_style": true,
     "default_icon": {
-      "19": "icon19.png",
+      "19": "img/icon19.png",
-      "38": "icon38.png"
+      "38": "img/icon38.png"
     },
     "default_title": "ClearURLs Add-on",
-    "default_popup": "popup_new.html"
+    "default_popup": "html/popup.html"
   },
   "permissions": [
     "*://*/*",
     "webRequest",
     "webRequestBlocking",
-    "storage"
+    "storage",
+    "tabs"
   ],
   "background": {
     "scripts": [
-      "jquery-3.2.1.min.js",
+      "external_js/jquery-3.2.1.min.js",
-      "sha256.jquery.js",
+      "external_js/sha256.jquery.js",
       "clearurls.js"
     ]
   },
@@ -37,9 +38,5 @@
     {
       "matches": ["<all_urls>"]
     }
-  ],
-  "web_accessible_resources": [
-      "siteBlockedAlert.html",
-      "log.html"
   ]
 }

popup_new.html

@@ -1,92 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="bootstrap.min.css">
-    <link rel="stylesheet" type="text/css" href="switchButtons.css">
-</head>
-<body>
-    <div class="container-fluid" style="background: url('img-noise-361x370.png');background-size: auto;">
-        <div class="row">
-            <nav class="col-sm-1 navbar navbar-inverse">
-                <div class="container">
-                    <div class="navbar-header">
-                        <span class="navbar-brand">
-                            <span><img src="icon38.png" width="30" height="30" alt=""></span>
-                            <a href="" id="loggingPage" target="_blank" style="text-decoration: none;">ClearURLs</a>
-                        </span>
-                    </div>
-                </div>
-            </nav>
-        </div>
-
-        <div class="row">
-            <div class="col-sm-1">
-                <h5>Configs</h5>
-                <label class="switch">
-                    <input type="checkbox" id="globalStatus">
-                    <span class="slider round"></span>
-                    <label>Filters</label>
-                </label>
-                <br>
-                <label class="switch">
-                    <input type="checkbox" id="logging">
-                    <span class="slider round"></span>
-                    <label title="The log is saved only locally. We advise against this feature if you do not need it.">Logging</label>
-                </label>
-                <br>
-                <label class="switch">
-                    <input type="checkbox" id="tabcounter">
-                    <span class="slider round"></span>
-                    <label>Toolbar counter</label>
-                </label>
-            </div>
-        </div>
-        <br>
-        <div class="row">
-            <div class="col-sm-1">
-                <h5>Statistics</h5>
-
-                <div class="progress">
-                    <div class="progress-bar progress-bar-danger progress-bar-striped" role="progressbar" style="width: 0%" id="progress_blocked"></div>
-                    <div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" style="width: 100%" id="progress_non_blocked"></div>
-                </div>
-
-                <h6>Total elements</h6>
-                <p class="text-info text-right" id="statistics_total_elements"></p>
-
-                <h6>Total blocked elements</h6>
-                <p class="text-danger text-right" id="statistics_value"></p>
-
-                <h6>Percentage of total traffic</h6>
-                <p class="text-right" id="statistics_value_global_percentage"></p>
-
-                <h6>Rule-&amp;Hash-Status</h6>
-                <p class="text-right"><a href="https://github.com/KevinRoebert/ClearUrls/commits/master/data/data.json" style="color: grey;" id="hashStatus"></a></p>
-
-                <p class="text-center">
-                    <button type="button" id="reset_counter_btn" class="btn btn-danger" title="Reset the global statistics">Reset counter</button>
-                </p>
-            </div>
-        </div>
-        <footer>
-            <div class="row">
-                <div class="col-sm-1 navbar-inverse text-center">
-                    <small class="text-muted">Version 1.1.2.5</small>
-                </div>
-            </div>
-        </footer>
-    </div>
-
-
-    <!-- Optional JavaScript -->
-    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
-    <script src="jquery-3.2.1.min.js"></script>
-    <script src="bootstrap.min.js"></script>
-    <script src="popup_new.js"></script>
-</body>
-</html>