[flashproxy/master] visual indicator that fp is active when opting in - tor-commits

20 Mar 2013

commit b09b0d58460076ecb61cfded3464a71fd648c6f1
Author: Alexandre Allaire alexandre.allaire@mail.mcgill.ca
Date:   Fri Mar 1 21:33:58 2013 -0800
visual indicator that fp is active when opting in
implements part A of #8211. If cookie is unset state that the proxy is
    enabled. Remove dynamic text showing cookie setting.
---
 proxy/options.html |   69 ++++++++++++++++++++++++++-------------------------
 1 files changed, 35 insertions(+), 34 deletions(-)

diff --git a/proxy/options.html b/proxy/options.html
index 9caa9e3..6ab39e1 100644
--- a/proxy/options.html
+++ b/proxy/options.html
@@ -32,6 +32,14 @@ p {
 button {
    margin: 0px 7px 7px;
 }
+#badge-state {
+	font-size: 36px;
+	text-align: center;
+	padding: 10px 0;
+	margin: 0;
+	color: white;
+}
+#badge-state p { display: none; }
 </style>
 </head>
 <body>
@@ -47,6 +55,7 @@ the flash proxy badge.
 <p>
 <a href="http://crypto.stanford.edu/flashproxy/">For more information on this system click here</a>.
 </p>
+<p>Do you want your browser to act as a proxy?</p>
 </div>
 <noscript>
 <p>
@@ -54,11 +63,11 @@ While JavaScript is disabled, your computer will not be a proxy. Enable
 JavaScript to change your options.
 </p>
 </noscript>
-<div id="setting">
-</div>
-<div onclick="update_setting_text()" id="buttons" style="display: none;">
-<button onclick="set_cookie_allowed()">Yes</button>
-<button onclick="set_cookie_disallowed()">No</button>
+<button onclick="set_allowed()">Yes</button>
+<button onclick="set_disallowed()">No</button>
+<div id="badge-state">
+<p id="inactive">Proxy disabled</p>
+<p id="active">Proxy enabled</p>
 </div>
 <div id="cookies_disabled" style="display: none;">
 <p>
@@ -81,6 +90,16 @@ function set_cookie_disallowed() {
     document.cookie = COOKIE_NAME + "=0 ;path=/ ;expires=" + COOKIE_LIFETIME;
 }
+function set_allowed() {
+    set_cookie_allowed();
+    refresh();
+}
+
+function set_disallowed() {
+    set_cookie_disallowed();
+    refresh();
+}
+
 function parse_cookie_string(cookies) {
     var strings;
     var result;
@@ -116,41 +135,23 @@ function read_cookie() {
 }
/* Updates the text telling the user what his current setting is.*/
-function update_setting_text() {
-    var setting = document.getElementById("setting");
-    var prefix = "<p>Your current setting is: ";
+function refresh() {
     var value = read_cookie();
-    if (value === undefined) {
-        setting.innerHTML = prefix + "unspecified. Your browser may or may not " +
-                                     "run as a proxy, depending on how the website " +
-                                     "administrator has configured the badge. (See <a href="https://lists.torproject.org/pipermail/tor-dev/2012-December/004318.html%5C%... mailing list post</a> for more information about opt-in versus opt-out.) Click " +
-                                     "the buttons below to change your setting.";
-    } else if (value === "1") {
-        setting.innerHTML = prefix + "use my browser as a proxy. " +
-                                     "Click no below to change your setting.</p>";
+    if (value === undefined || value === "1") {
+        document.getElementById("active").style.display = "block";
+        document.getElementById("inactive").style.display = "none";
+        document.getElementById("badge-state").style.backgroundColor = "darkgreen";
     } else {
-        setting.innerHTML = prefix + "do not use my browser as a proxy. " +
-                                     "Click yes below to change your setting.</p>";
+        document.getElementById("inactive").style.display = "block";
+        document.getElementById("active").style.display = "none";
+        document.getElementById("badge-state").style.backgroundColor = "red";
     }
-    setting.innerHTML += "<p>Do you want your browser to act as a proxy?</p>";
 }
-window.onload = function () {
-    if (navigator.cookieEnabled) {
-        var buttons = document.getElementById("buttons");
-        buttons.style.display = "block";
-        update_setting_text();
-    } else {
-        document.getElementById("cookies_disabled").style.display = "block";
-        /* Manually set the text here as otherwise it will refer to
-           the buttons, which don't show if cookies are disabled. */
-        document.getElementById("setting").innerHTML = "<p>Your current setting is: " +
-                                                       "unspecified. Your browser may or may not " +
-                                                       "run as a proxy, depending on how the website " +
-                                                       "administrator has configured the badge.</p>";
-    }
-};
+window.onload = function() {
+    refresh();
+}
 </script>
 </body>
 </html>

    