tmpchat / cmd / frontend / templates / tmpchat-index.gohtml

@ 57cd687b81d1640c584c2673280ec456a5463380 | history


<!DOCTYPE html>
<html lang="en">
<!-- How's my driving? 1-800-TMP-CHAT@nmyk.io -->
<head>
    <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
    <link href="https://cdn.nmyk.io/assets/style.css" rel="stylesheet">
    <link href="https://cdn.nmyk.io/assets/favicon.ico" rel="icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=500">
    <meta name="description"
          content="tmpchat is a WebRTC-based group text messaging application designed and built by Nick Mykins (nmyk.io)"/>
    <title>tmpchat</title>
    <script>
        const getChannelURL = channelName => "/" + channelName;
        const uuidv4 = () => {
            return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
                (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
            );
        };
        const hexToBase64URL = hex => {
            return btoa(hex.match(/\w{2}/g).map(function (a) {
                return String.fromCharCode(parseInt(a, 16));
            }).join("")).replace(/[=+\/]/g, c => {
                return {"+": "-", "/": "_", "=": ""}[c]
            });
        };
        const newChannelURL = () => getChannelURL(hexToBase64URL(uuidv4().replace(/-/g, "")));
        const setDestChannel = () => document.getElementById('channel').action =
            getChannelURL(escape(document.getElementById("channelnameinput").value));
        let aboutIsVisible = false;
        const about = () => {
            if (!aboutIsVisible) {
                document.getElementById("about").innerHTML =
                    "every channel is public.<br>" +
                    "every string is a channel name.<br>" +
                    "create a channel with a random name<br>" +
                    "or go to one you already know of.<br>" +
                    "send text directly to others.<br>" +
                    "the server sees nothing<br>" +
                    "& nothing is saved.<br>" +
                    "by nick mykins<br>" +
                    '<a href="mailto:1-800-TMP-CHAT@nmyk.io"><b>contact</b></a><br>';
                aboutIsVisible = true;
            } else {
                document.getElementById("about").innerText = "ℹ️";
                aboutIsVisible = false;
            }
        }
    </script>
</head>

<body>
<div class="vspace50px"></div>
<div class="container" style="text-align: center;">
    <b>tmpchat</b><br>
    simple peer-to-peer text chat
</div>
<br>
<div class="container" style="text-align: center;">
    <input type="button" value="create" onclick="window.location = newChannelURL();">
    <br><br>
    or
    <br><br>
    <form id="channel" method="get" autocomplete="off">
        <input id="channelnameinput" type="text" onchange="setDestChannel()">
        <input type="submit" value="go">
    </form>
</div>
<div class="vspace50px"></div>
<div id="about" class="container" style="min-width:0; text-align: center; cursor: pointer;" onclick="about()">
    ℹ️
</div>
</body>

</html>