work on onboarding and pep8 compliance. re-worded about

static-data/www/onboarding/donate-modal.css

@@ -0,0 +1,13 @@
+.donateHeader{
+    font-size: 2em;
+}
+
+.donateFinished{
+    display: block;
+    margin-top: 1em;
+}
+
+.donateBody p{
+    padding-top: 1em;
+    text-align: justify;
+}

static-data/www/onboarding/donate-modal.html

@@ -0,0 +1,17 @@
+<b class='donateHeader'>Donate</b>
+
+<br><br>
+
+<p>Onionr is a volunteer-driven project, and infrastructure is paid for out of pocket.
+</p>
+<p>
+    Please donate the price of a cup of coffee to sustain development.
+</p>
+
+<br>
+
+Paypal/Card: <a href="https://ko-fi.com/beardogkf" target="_blank" rel="noopener">Ko-fi</a>
+<br>
+Bitcoin: <a href="bitcoin:1onion55FXzm6h8KQw3zFw2igpHcV7LPq">1onion55FXzm6h8KQw3zFw2igpHcV7LPq</a>
+
+<button class="button donateFinished is-success">Done</button>

static-data/www/onboarding/donate.js

@@ -0,0 +1,45 @@
+/*
+    Onionr - Private P2P Communication
+
+    Handles onboarding donations for Onionr
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>
+*/
+
+
+let donateFinishedButtons = document.getElementsByClassName('donateFinished')
+configInfo = {}
+
+let openDonateModal = function(newConfigInfo){
+    fetch('donate-modal.html')
+        .then((resp) => resp.text())
+        .then(function(resp) {
+            document.getElementsByClassName('donateModal')[0].classList.add('is-active')
+
+            // Load the donate modal html and display it
+            let donateBody = document.getElementsByClassName('donateBody')[0]
+
+            donateBody.innerHTML = resp
+
+            let donateFinishedButton = document.getElementsByClassName('donateFinished')[0]
+
+            for (i = 0; i < donateFinishedButtons.length; i++){
+                donateFinishedButtons[i].onclick = function(){
+                    document.getElementsByClassName('donateModal')[0].classList.remove('is-active')
+                    sendConfig(configInfo)
+                }
+            }
+            
+    })
+}

static-data/www/onboarding/index.html

@@ -12,11 +12,13 @@
     <link rel="stylesheet" href="/private/main.css">
     <link rel="stylesheet" href="/shared/fontawesome-free-5.10.2/css/all.min.css">
     <link rel="stylesheet" href="/gettheme">
+    <link rel="stylesheet" href="donate-modal.css">
     <link rel="stylesheet" href="onboarding.css">
     <script defer src='/shared/navbar.js'></script>
     <script defer src='/shared/loadabout.js'></script>
     <script defer src='/shared/misc.js'></script>
     <script defer src='/private/js/console.js'></script>
+    <script defer src='donate.js'></script>
     <script defer src='onboarding.js'></script>
     <script>alert("Content security policy appears to not be working. Your browser security is weak!")</script>
 </head>
@@ -65,8 +67,20 @@
 
     <br>
 
+    <div class="modal donateModal">
+        <div class="modal-background"></div>
+        <div class="modal-card">
+          <header class="modal-card-head">
+            <button class="closeAboutModal delete" aria-label="close"></button>
+          </header>
+          <section class="modal-card-body donateBody">
+            Loading... <i class="fas fa-spinner fa-spin"></i>
+          </section>
+        </div>
+    </div>
+
     <div class="onboarding">
-        <noscript><h1>Unforuntately, this requires JavaScript. Don't worry, all scripts are open source and locally loaded.</h1></noscript>
+        <noscript><h1>Unfortunately, this requires JavaScript. Don't worry, all scripts are open source and locally loaded.</h1></noscript>
         <p>Welcome. There are just a few questions for you to answer before you get started.</p>
         <br>
         <form method='post' id="onboardingForm">
@@ -94,11 +108,13 @@
                 <div>
                     I want to...
                 </div>
-                <i class="icon fas fa-user"></i> <input type="checkbox" name="useDeterministic"> <label for="useDeterministic">Use a seed to re(generate) an ID</label>
+                <i class="icon fas fa-user"></i> <input type="checkbox" name="useDeterministic"> <label for="useDeterministic">Use a seed to re(generate) a user ID</label>
                 <br>
                 <i class="icon fas fa-envelope"></i> <input type="checkbox" name="useMail" checked> <label for="useMail">Use OnionrMail</label>
                 <br>
                 <i class="icon fas fa-comments"></i> <input type="checkbox" name="useCircles" checked> <label for="useMail">Use Circles (message board system)</label>
+                <br>
+                <i class="icon fas fa-palette"></i> <input type="checkbox" name="useDarkTheme" checked> <label for="useDark">Use Dark Theme</label>
 
                 <br>
             </div>

static-data/www/onboarding/onboarding.js

@@ -16,11 +16,12 @@
     You should have received a copy of the GNU General Public License
     along with this program.  If not, see <https://www.gnu.org/licenses/>
 */
+
 fetch('/getnewkeys', {
     headers: {
         "token": webpass
     }})
-    .then((resp) => resp.text()) // Transform the data into text
+    .then((resp) => resp.text())
     .then(function(resp) {
         keys = resp.split('')
 })
@@ -29,6 +30,19 @@ function getCheckValue(elName){
     return document.getElementsByName(elName)[0].checked
 }
 
+function sendConfig(configInfo){
+    fetch('/setonboarding', {
+        method: 'POST',
+        headers: {
+          "token": webpass,
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({configInfo})
+        }).then(function(data) {
+        })
+}
+
+
 document.getElementById('onboardingForm').onsubmit = function(e){
     submitInfo = {}
     submitInfo.massSurveil = getCheckValue('state')
@@ -39,6 +53,14 @@ document.getElementById('onboardingForm').onsubmit = function(e){
     submitInfo.donate = getCheckValue('donate')
     submitInfo.deterministic = getCheckValue('useDeterministic')
     submitInfo.mail = getCheckValue('useMail')
+    submitInfo.circles = getCheckValue('useCircles')
+
+    if (submitInfo.donate){
+        openDonateModal(submitInfo)
+        return false
+    }
+
+    sendConfig(submitInfo)
 
     e.preventDefault()
 }

static-data/www/shared/about.html

@@ -13,7 +13,7 @@
 
 <b>Contributors:</b>
 <ul>
-    <li><a href="https://invisamage.com/">Travis Kipp</a> web UI and CSS</li>
+    <li><a href="https://invisamage.com/">Travis Kipp</a> CSS help</li>
     <li><a href="https://k7dxs.net/">Duncan Simpson</a> packaging help</li>
     <li><a href="https://www.siue.edu/~njohnag/">Nicholas Johnson</a> bug fixes</li>
 </ul>