simplify onboarding section lyout

2022-10-08 17:21:55 -04:00
parent 19b6c841a1
commit 62313871da
6 changed files with 880 additions and 906 deletions
--- a/home.html
+++ b/home.html
@ -40,35 +40,17 @@

            <div class="hideIfI2PConsoleOff" id="onboarding">
                <h3 id="onboardingTitle">New to I2P? Learn more here.</h3>
-                <button class="showhider" id="onboardingButtonZero"></button>
-                <h4 id="onboardingZero"><button class="showhider" id="onboardingButtonZero">Protect your Privacy</button>
-                </h4>
-                <button class="showhider" id="onboardingButtonZero"></button>
+                <button class="showhider" id="onboardingButtonZero">Protect your Privacy</button>
                <p class="onboardingContent" id="onboardingContentZero">I2P Browser allows you to surf the internet using the private and secure I2P network. When using it, you are protected against tracking, surveillance, and censorship as a first-class participant in the I2P network. I2P Browser isolates cookies and deletes your browser history after your session. These modifications ensure your privacy and security are protected in the browser.</p>
-                <button class="showhider" id="onboardingButtonOne"></button>
-                <h4 id="onboardingOne"><button class="showhider" id="onboardingButtonOne">Configure your Experience</button>
-                </h4>
-                <button class="showhider" id="onboardingButtonOne"></button>
+                <button class="showhider" id="onboardingButtonOne">Configure your Experience</button>
                <p class="onboardingContent" id="onboardingContentOne">We also provide you with additional settings for bumping up your browser security. Our Security Settings allow you to block elements that could be used to attack your computer. Click below to see what the different options do. Note: By default, NoScript and HTTPS Everywhere are not included on the toolbar, but you can customize your toolbar to add them. With all the security and privacy features provided by I2P, your experience while browsing the internet may be a little different. Things may be a bit slower, and depending on your security level, some elements may not work or load. You may also be asked to prove you are a human and not a robot.</p>
-                <button class="showhider" id="onboardingButtonTwo"></button>
-                <h4 id="onboardingTwo"><button class="showhider" id="onboardingButtonTwo">Share Files</button>
-                </h4>
-                <button class="showhider" id="onboardingButtonTwo"></button>
+                <button class="showhider" id="onboardingButtonTwo">Share Files</button>
                <p class="onboardingContent" id="onboardingContentTwo">I2P is capable of using peer-to-peer applications like BitTorrent, protecting your identity when you share files. Our anonymous bittorrent client is available in the browser.</p>
-                <button class="showhider" id="onboardingButtonThree"></button>
-                <h4 id="onboardingThree"><button class="showhider" id="onboardingButtonThree">Hidden e-mail</button>
-                </h4>
-                <button class="showhider" id="onboardingButtonThree"></button>
+                <button class="showhider" id="onboardingButtonThree">Hidden e-mail</button>
                <p class="onboardingContent" id="onboardingContentThree">There is also an anonymous e-mail service available inside of I2P, which is accessible from our browser via the menu directly below.</p>
-                <button class="showhider" id="onboardingButtonFour"></button>
-                <h4 id="onboardingFour"><button class="showhider" id="onboardingButtonFour">Browsing the Web</button>
-                </h4>
-                <button class="showhider" id="onboardingButtonFour"></button>
+                <button class="showhider" id="onboardingButtonFour">Browsing the Web</button>
                <p class="onboardingContent" id="onboardingContentFour">This extension works automatically when you are browsing I2P sites. If you want to use I2P as a proxy to non-I2P sites, use the I2P In Private Browsing button in the toolbar and click New I2P Browser Tab to switch to I2P Browsing in a new tab.</p>
-                <button class="showhider" id="onboardingButtonFive"></button>
-                <h4 id="onboardingFive"><button class="showhider" id="onboardingButtonFive">Experience Tips</button>
-                </h4>
-                <button class="showhider" id="onboardingButtonFive"></button>
+                <button class="showhider" id="onboardingButtonFive">Experience Tips</button>
                <p class="onboardingContent" id="onboardingContentFive">With all the security and privacy features provided by I2P, your experience while browsing the internet may be a little different. Things may be a bit slower, and depending on your security level, some elements may not work or load. You may also be asked to prove you are a human and not a robot.</p>
            </div>
            <!--<p class="hideIfI2POn">&aboutI2p.warn_not_running; <a href="about:i2p">&aboutI2p.refresh_text;</a> &aboutI2p.reccommend_not_running;</p>-->
@ -82,14 +64,6 @@
                <p id="applicationExplain">These applications use I2P to provide them with security and privacy.</p>

                <ul>
-                    <!--<li class="application">
-                        <a class="applicationName" href="http://cuss2sgthm5wfipnnztrjdvtaczb22hnmr2ohnaqqqz3jf6ubf3a.b32.i2p" id="window-link-toopie" target="_blank">Search:</a> <span class="applicationDesc" id="search">Legwork is an in-I2P search engine.</span>
-                        <div class="topnav">
-                            <form action="http://cuss2sgthm5wfipnnztrjdvtaczb22hnmr2ohnaqqqz3jf6ubf3a.b32.i2p/yacysearch.html?" method="get">
-                                <input id="search-query" name="query" placeholder="Search on legwork.i2p(Opens a new tab)" type="search"> <input id="search-submit" text="Submit" type="submit">
-                            </form>
-                        </div>
-                    </li>-->

                    <li class="application window-visit-toopie">
                        <a class="applicationName window-visit-toopie" href="#" id="window-visit-toopie">Toopie</a> <span class="applicationDesc window-visit-toopie" id="toopie">For information about your I2P router status, go here:</span>
--- a/host.js
+++ b/host.js
@ -1,201 +1,207 @@
 function proxyHost(requestDetails) {
-  switch (requestDetails.tabId) {
-    case -1:
-      break;
-    case undefined:
-      break;
-    case null:
-      break;
-    default:
-      return false;
-  }
-  console.warn('(host) requestDetails', requestDetails.tabId);
-  let hostname = '';
-  if (requestDetails.url.indexOf('://') > -1) {
-    hostname = requestDetails.url.split('/')[2];
-  } else {
-    hostname = requestDetails.url.split('/')[0];
-  }
-  if (hostname == 'proxy.i2p') {
-    return true;
-  }
-  if (
-    hostname == 'c6lilt4cr5x7jifxridpkesf2zgfwqfchtp6laihr4pdqomq25iq.b32.i2p'
-  ) {
-    return true;
-  }
-  return false;
+    switch (requestDetails.tabId) {
+        case -1:
+            break;
+        case undefined:
+            break;
+        case null:
+            break;
+        default:
+            return false;
+    }
+    console.warn('(host) requestDetails', requestDetails.tabId);
+    let hostname = '';
+    if (requestDetails.url.indexOf('://') > -1) {
+        hostname = requestDetails.url.split('/')[2];
+    } else {
+        hostname = requestDetails.url.split('/')[0];
+    }
+    console.warn("(host)", hostname);
+    if (hostname == 'proxy.i2p') {
+        console.warn("(host) is proxy.i2p", hostname);
+        return true;
+    }
+    if (
+        hostname == 'c6lilt4cr5x7jifxridpkesf2zgfwqfchtp6laihr4pdqomq25iq.b32.i2p'
+    ) {
+        return true;
+    }
+    return false;
 }

 function localHost(url) {
-  let hostname = '';
-  if (url.indexOf('://') > -1) {
-    hostname = url.split('/')[2];
-  } else {
-    hostname = url.split('/')[0];
-  }
-  hostname = hostname.split(':')[0];
-  console.log('(urlcheck) hostname localhost', hostname);
-  console.log('(urlcheck) url localhost', url);
-  if (hostname === '127.0.0.1') {
-    if (url.indexOf(':8084') != -1) return 'blog';
-    if (url.indexOf(':7669') != -1) return 'irc';
-    if (url.indexOf(':7695') != -1) return 'tor';
-  } else if (hostname === 'localhost') {
-    if (url.indexOf(':8084') != -1) return 'blog';
-    if (url.indexOf(':7669') != -1) return 'irc';
-    if (url.indexOf(':7695') != -1) return 'tor';
-  }
+    let hostname = '';
+    if (url.indexOf('://') > -1) {
+        hostname = url.split('/')[2];
+    } else {
+        hostname = url.split('/')[0];
+    }
+    hostname = hostname.split(':')[0];
+    console.log('(urlcheck) hostname localhost', hostname);
+    console.log('(urlcheck) url localhost', url);
+    if (hostname === '127.0.0.1') {
+        if (url.indexOf(':8084') != -1) return 'blog';
+        if (url.indexOf(':7669') != -1) return 'irc';
+        if (url.indexOf(':7695') != -1) return 'tor';
+    } else if (hostname === 'localhost') {
+        if (url.indexOf(':8084') != -1) return 'blog';
+        if (url.indexOf(':7669') != -1) return 'irc';
+        if (url.indexOf(':7695') != -1) return 'tor';
+    }

-  return false;
+    return false;
 }

 function extensionHost(url) {
-  var prefix = browser.runtime
-    .getURL('')
-    .replace('moz-extension://', '')
-    .replace('/', '');
-  if (url.originUrl !== undefined) {
-    var originUrl = url.originUrl
-      .replace('moz-extension://', '')
-      .replace('/', '');
-    //    console.log("(urlcheck) Extension application path", originUrl);
-    //    console.log("(urlcheck) Extension application path", prefix);
-    var res = originUrl.startsWith(prefix);
-    //    console.log("(urlcheck) Extension application path", res);
-    if (res) return res;
-  }
-  if (url.documentUrl !== undefined) {
-    //    console.log("(urlcheck) Extension application path", originUrl);
-    //    console.log("(urlcheck) Extension application path", prefix);
-    var res = originUrl.startsWith(prefix);
-    //    console.log("(urlcheck) Extension application path", res);
-    if (res) return res;
-  }
-  console.log('(urlcheck) Extension application path', url);
+    var prefix = browser.runtime
+        .getURL('')
+        .replace('moz-extension://', '')
+        .replace('/', '');
+    if (url.originUrl !== undefined) {
+        var originUrl = url.originUrl
+            .replace('moz-extension://', '')
+            .replace('/', '');
+        //    console.log("(urlcheck) Extension application path", originUrl);
+        //    console.log("(urlcheck) Extension application path", prefix);
+        var res = originUrl.startsWith(prefix);
+        //    console.log("(urlcheck) Extension application path", res);
+        if (res) return res;
+    }
+    if (url.documentUrl !== undefined) {
+        //    console.log("(urlcheck) Extension application path", originUrl);
+        //    console.log("(urlcheck) Extension application path", prefix);
+        var res = originUrl.startsWith(prefix);
+        //    console.log("(urlcheck) Extension application path", res);
+        if (res) return res;
+    }
+    console.log('(urlcheck) Extension application path', url);
 }

 function i2pHostName(url) {
-  let hostname = '';
-  console.log('(hosts)', url);
-  let u = new URL(url);
-  if (u.host.endsWith('.i2p')) {
-    hostname = u.host;
-  } else if (url.includes('=')) {
-    if (url.includes('.i2p')) {
-      lsit = url.split('=');
-      for (let item in lsit) {
-        var items = lsit[item].split(`\ % `); //"\%")
-        for (let p in items) {
-          if (items[p].includes('.i2p')) {
-            hostname = items[p].replace('3D', 1);
-          }
-          break;
+    let hostname = '';
+    console.log('(hosts)', url);
+    let u = new URL(url);
+    if (u.host.endsWith('.i2p')) {
+        hostname = u.host;
+    } else if (url.includes('=')) {
+        if (url.includes('.i2p')) {
+            lsit = url.split('=');
+            for (let item in lsit) {
+                var items = lsit[item].split(`\ % `); //"\%")
+                for (let p in items) {
+                    if (items[p].includes('.i2p')) {
+                        hostname = items[p].replace('3D', 1);
+                    }
+                    break;
+                }
+                if (hostname != '') {
+                    break;
+                }
+            }
        }
-        if (hostname != '') {
-          break;
-        }
-      }
+    } else if (url.indexOf('://') > -1) {
+        hostname = url.split('/')[2];
+    } else {
+        hostname = url.split('/')[0];
    }
-  } else if (url.indexOf('://') > -1) {
-    hostname = url.split('/')[2];
-  } else {
-    hostname = url.split('/')[0];
-  }
-  console.log('(hosts) scrub', hostname);
-  return hostname;
+    console.log('(hosts) scrub', hostname);
+    return hostname;
 }

 function i2pHost(url) {
-  if (proxyHost(url)) {
-    return false;
-  }
-  let hostname = i2pHostName(url.url);
-  let postname = hostname.split(':')[0];
-  return postname.endsWith('.i2p');
+    if (proxyHost(url)) {
+        console.warn("(host) proxy.i2p", url.url)
+        return false;
+    }
+    let hostname = i2pHostName(url.url);
+    let postname = hostname.split(':')[0];
+    if (postname.endsWith("proxy.i2p")){
+      return false;
+    }
+    return postname.endsWith('.i2p');
 }

 function routerHost(url) {
-  //  console.log("(urlcheck) HOST URL CHECK");
-  let hostname = '';
-  let path = '';
+    //  console.log("(urlcheck) HOST URL CHECK");
+    let hostname = '';
+    let path = '';

-  function pathcheck(str) {
-    if (str != undefined) {
-      let final = str.split('/')[0];
-      if (final === 'i2ptunnelmgr' || final === 'i2ptunnel') {
-        console.log('(urlcheck) Tunnel application path', final);
-        return 'i2ptunnelmgr';
-      } else if (
-        final === 'i2psnark' ||
-        final === 'torrents' ||
-        final.startsWith('transmission') ||
-        final.startsWith('tracker') ||
-        url.includes(':7662')
-      ) {
-        console.log('(urlcheck) Torrent application path', final);
-        return 'i2psnark';
-      } else if (final === 'webmail' || final === 'susimail') {
-        if (!url.includes('.css')) {
-          console.log('(urlcheck) Mail application path', final);
-          return 'webmail';
+    function pathcheck(str) {
+        if (str != undefined) {
+            let final = str.split('/')[0];
+            if (final === 'i2ptunnelmgr' || final === 'i2ptunnel') {
+                console.log('(urlcheck) Tunnel application path', final);
+                return 'i2ptunnelmgr';
+            } else if (
+                final === 'i2psnark' ||
+                final === 'torrents' ||
+                final.startsWith('transmission') ||
+                final.startsWith('tracker') ||
+                url.includes(':7662')
+            ) {
+                console.log('(urlcheck) Torrent application path', final);
+                return 'i2psnark';
+            } else if (final === 'webmail' || final === 'susimail') {
+                if (!url.includes('.css')) {
+                    console.log('(urlcheck) Mail application path', final);
+                    return 'webmail';
+                }
+            } else if (final.startsWith('MuWire')) {
+                if (!url.includes('.png')) {
+                    console.log('(urlcheck) MuWire application path', final);
+                    return 'muwire';
+                }
+            } else if (final.startsWith('i2pbote')) {
+                if (!url.includes('.png')) {
+                    console.log('(urlcheck) I2PBote application path', final);
+                    return 'i2pbote';
+                }
+            } else if (
+                final === 'home' ||
+                final === 'console' ||
+                final === 'dns' ||
+                final === 'susidns' ||
+                final.startsWith('susidns') ||
+                final === 'sitemap' ||
+                final.startsWith('config')
+            ) {
+                console.log('(urlcheck) Console application path', final);
+                return 'routerconsole';
+            }
        }
-      } else if (final.startsWith('MuWire')) {
-        if (!url.includes('.png')) {
-          console.log('(urlcheck) MuWire application path', final);
-          return 'muwire';
-        }
-      } else if (final.startsWith('i2pbote')) {
-        if (!url.includes('.png')) {
-          console.log('(urlcheck) I2PBote application path', final);
-          return 'i2pbote';
-        }
-      } else if (
-        final === 'home' ||
-        final === 'console' ||
-        final === 'dns' ||
-        final === 'susidns' ||
-        final.startsWith('susidns') ||
-        final === 'sitemap' ||
-        final.startsWith('config')
-      ) {
-        console.log('(urlcheck) Console application path', final);
-        return 'routerconsole';
-      }
+        return true;
    }
-    return true;
-  }
-  if (url.indexOf('://') > -1) {
-    hostname = url.split('/')[2];
-    let prefix = url.substr(0, url.indexOf('://') + 3);
-    path = url.replace(prefix + hostname + '/', '');
-  } else if (identifyProtocolHandler(url)) {
-    let newurl = identifyProtocolHandler(url);
-    return routerHost(newurl);
-  } else {
-    hostname = url.split('/')[0];
-    path = url.replace(hostname + '/', '');
-  }
-  if (hostname === control_host + ':' + control_port) {
-    return pathcheck(path);
-  }
-  if (hostname === 'localhost' + ':' + control_port) {
-    return pathcheck(path);
-  }
-  if (hostname === '127.0.0.1' + ':' + control_port) {
-    return pathcheck(path);
-  }
-  if (hostname === 'localhost' + ':' + 7070) {
-    return pathcheck(path);
-  }
-  if (hostname === '127.0.0.1' + ':' + 7070) {
-    return pathcheck(path);
-  }
-  if (hostname === 'localhost' + ':' + 7667) {
-    return pathcheck(path);
-  }
-  if (hostname === '127.0.0.1' + ':' + 7667) {
-    return pathcheck(path);
-  }
-  return false;
-}
+    if (url.indexOf('://') > -1) {
+        hostname = url.split('/')[2];
+        let prefix = url.substr(0, url.indexOf('://') + 3);
+        path = url.replace(prefix + hostname + '/', '');
+    } else if (identifyProtocolHandler(url)) {
+        let newurl = identifyProtocolHandler(url);
+        return routerHost(newurl);
+    } else {
+        hostname = url.split('/')[0];
+        path = url.replace(hostname + '/', '');
+    }
+    if (hostname === control_host + ':' + control_port) {
+        return pathcheck(path);
+    }
+    if (hostname === 'localhost' + ':' + control_port) {
+        return pathcheck(path);
+    }
+    if (hostname === '127.0.0.1' + ':' + control_port) {
+        return pathcheck(path);
+    }
+    if (hostname === 'localhost' + ':' + 7070) {
+        return pathcheck(path);
+    }
+    if (hostname === '127.0.0.1' + ':' + 7070) {
+        return pathcheck(path);
+    }
+    if (hostname === 'localhost' + ':' + 7667) {
+        return pathcheck(path);
+    }
+    if (hostname === '127.0.0.1' + ':' + 7667) {
+        return pathcheck(path);
+    }
+    return false;
+}
--- a/scrub.js
+++ b/scrub.js
--- a/sectorrent.html
+++ b/sectorrent.html
@ -9,7 +9,7 @@
    </title>
 </head>
 <body>
-    <div id="browserpanel">
+    <div id="browserpanel content">
        <div class="panel">
            <div class="section-header panel-section panel-section-header" id="headline">
                <div class="text-section-header" id="text-section-header">
--- a/security.html
+++ b/security.html
@ -9,7 +9,7 @@
    </title>
 </head>
 <body>
-    <div id="browserpanel">
+    <div id="browserpanel content">
        <div class="panel">
            <div class="section-header panel-section panel-section-header" id="headline">
                <div class="text-section-header" id="text-section-header">
--- a/torrent.html
+++ b/torrent.html
@ -10,7 +10,7 @@
    </title>
 </head>
 <body>
-    <div id="browserpanel">
+    <div id="browserpanel content">
        <div class="panel">
            <div class="section-header panel-section panel-section-header" id="headline">
                <div class="text-section-header" id="text-section-header">