Source: site.view [edit]
Function name: register
Arguments:
Description: If args passed in as OPTIONALARGS, try to register with them
Page type: html
Render function:  
Module: sportstreak

Page source:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sports Streak</title>
    <script type="text/javascript">

        var gData = null;

        // Function to get the value of a specific cookie by name
        // If none found, returns ""
        function getCookie(name) {
            let cookieArray = document.cookie.split(';');
            for(let i = 0; i < cookieArray.length; i++) {
                let cookie = cookieArray[i];
                while (cookie.charAt(0) == ' ') {
                    cookie = cookie.substring(1);
                }
                if (cookie.indexOf(name + '=') == 0) {
                    return cookie.substring(name.length + 1, cookie.length);
                }
            }
            return "";
        }

        // Function to set a cookie
        function setCookie(name, value, expiryDays) {
            let date = new Date();
            date.setTime(date.getTime() + (expiryDays*24*60*60*1000));
            let expires = "expires=" + date.toUTCString();
            document.cookie = name + "=" + value + ";" + expires + ";path=/";
        }


        // Return just the date, in format 12/31/2023
        function formatDate(date) {
           let year = date.getFullYear();
           let month = date.getMonth() + 1; // getMonth() is zero-indexed
           let day = date.getDate();
           return `${month.toString().padStart(2, '0')}/${day.toString().padStart(2, '0')}/${year}`;
        }

        var round = 0;
        var total = 0;
        var today;
        var yesterday;
        var todayCookie;
        var yesterdayCookie;



        // Loads the cookies from today and yesterday.  If yesterday exists, starts total count from then.
        // If today already exists, don't allow playing game, just display a message.
        function onLoad() {
           round = 0;
           total = 0;

           today = formatDate(new Date());   // as formatted string  eg 11/31/2023
           yesterday = formatDate(new Date(new Date().getTime() - 86400000));

           yesterdayCookie = getCookie("ss" + yesterday);
           if (yesterdayCookie != "")
              yesterdayCookie = JSON.parse( atob( yesterdayCookie ) );
           else {
              yesterdayCookie = {}
           }

           if ("total" in yesterdayCookie) {
              total = yesterdayCookie.total
           }

           todayCookie = getCookie("ss" + today);
           if (todayCookie != "")
              todayCookie = JSON.parse( atob( todayCookie ) );
           else {
              todayCookie = {}
           }

           // If we already played today, update screen but don't allow play
           if ("total" in todayCookie) {
              round = todayCookie.round;
              total = todayCookie.total;

              document.getElementById("today").innerText = "Today: " + round;
              document.getElementById("total").innerText = "Total: " + total;      

           } 

           // If variables passed in, try to register and return message.  Otherwise, return empty string.
           var message = "<webl>
             if Size(ToList(EXTRAARGS) ? []) > 0 then
                var username = Str_Trim(EXTRAARGS.username) ? "";
                var pw = Str_Trim(EXTRAARGS.pw) ? "";
                var pw2 = Str_Trim(EXTRAARGS.pw2) ? "";
                var fullname = Str_Trim(EXTRAARGS.fullname) ? "";
                var email = Str_Trim(EXTRAARGS.email) ? "";
                var phone = "-";
                var err = WubCall("siteutil.siteRegister", ["sportstreak", fullname, phone, email, username, pw, pw2,"sportstreak.errcmd","sportstreak.errcmd"]);
                if err == "" then
                   "SUCCESS"
                else
                   err
                end;
             else
                ""
             end;
           </webl>";
           if (message.startsWith("ERR")) {
               document.getElementById("username").value = "<webl>Str_Trim(EXTRAARGS.username) ? ""</webl>";
               document.getElementById("fullname").value = "<webl>Str_Trim(EXTRAARGS.fullname) ? ""</webl>";
               document.getElementById("email").value = "<webl>Str_Trim(EXTRAARGS.email) ? ""</webl>";
               switch (message) {
                  case "ERR_NO_PASSWORD":                  message = "Error: You must enter a password."; break;
                  case "ERR_INVALID_PASSWORD":             message = "Error: Password too short."; break;
                  case "ERR_INVALID_EMAIL_FORMAT":         message = "Error: Email not in correct format."; break;
                  case "ERR_PASSWORD_MISMATCH":            message = "Error: Password and confirmation don't match."; break;
                  case "ERR_MISSING_INFO":                 message = "Error: All fields are required."; break;
                  case "ERR_USERNAME_ALREADY_REGISTERED":  message = "Error: Username already registered."; break;
                  case "ERR_EMAIL_ALREADY_REGISTERED":     message = "Error: Email already registered."; break;
                  default:                                 message = "Error during registration: " + message; break;
               }
           } else if (message == "SUCCESS") {
              window.location.href = 'https://sports-streak.com/site/login';
           }
           document.getElementById("message").innerText = message;
           
        }



    </script>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        header, footer {
            background-color: #f4f4f4;
            text-align: center;
            padding: 5px 0;
        }
        main {
            padding: 10px;
            text-align: center;
        }
        .login {
           display: flex;
           justify-content: flex-end;
        }
        .question p {
            font-size: 1.2em;
        }
        .options {
            display: flex;
            justify-content: space-around;
            margin: 10px 0;
        }
        .option {
            text-align: center;
        }
        .streak {
            text-align: center;
            font-size: 1.5em;
            margin: 12px 0;
        }
        .result {
            font-size: 2em;
            margin: 20px 0;
        }
        .option img {
            width: 100px;
            height: auto;
        }
        .feedback {
            margin-top: 20px;
        }
        .pButton {
            padding: 10px;
            margin: 10px;
            background-color: #007bff;
            color: white;
            border: none;
            cursor: pointer;
        }
        button {
            padding: 10px;
            margin: 10px;
            background-color: #007bff;
            color: white;
            border: none;
            cursor: pointer;
            font-size: 1.2em;
        }
        #stat {
            font-weight: bold;
        }
        button:hover {
            background-color: #0056b3;
        }
        footer p {
            font-size: 0.8em;
        }
    </style>
</head>


<body onload="onLoad()">
    <header>
        <section class="options">
           <div class="option"></div>
           <div class="option">
              <a class="login" href="https://sports-streak.com/site/login">Login</a>
           </div>
        </section>
            <div id="title">
                <img width=250 src="https://sports-streak.com/images/ss-logo.png">
            </div>
        <section class="options">
            <div class="option">
               <p id="today" class="streak">Today: </p>
            </div>
            <div class="option">
               <p id="total" class="streak">Total: </p>
            </div>
        </section>
    </header>
    <main>
        <section class="question">
            <p id="message"></p>
        </section>
        <section class="question">
            <p id="question">Register New User</p>
        </section>
        <section class="options">
            <div class="option">
               <table>
               <form action="/site/register" method="post">
                <tr><td>Username:</td><td> <input id="username" name="username" value="" size="15" title="Username"/></td></tr>
                <tr><td>Password: </td><td>  <input type="password" name="pw" value="" size="15" title="Password"/></td></tr>
                <tr><td>Retype PW: </td><td>  <input type="password" name="pw2" value="" size="15" title="Password 2"/></td></tr>
                <tr><td>Full name:</td><td> <input id="fullname" name="fullname" value="" size="15" title="Fullname"/></td></tr>
                <tr><td>Email: </td><td><input id="email" name="email" value="" size="15" title="Email"/></td></tr>
                <tr><td>&nbsp;</td><td><input type="submit" value="Register"></td></tr>
               </form>
               </table>
            </div>
        </section>
    </main>
    <footer>
        <p>Game Instructions: Choose the correct answer to the question.
               Keep your streak going as long as you can.  Come back tomorrow
               to keep adding to your total streak (skipping a day resets it to 0).</p>
        <p>Copyright (c) 2024 by 52 Productions, Inc.  All rights reserved.</p>
    </footer>
</body>
</html>