Implemented Visitor View -- kinda betaish still

2025-06-17 03:45:25 +02:00 · 2017-06-09 04:22:33 +00:00
parent 601612e436
commit 30092fde01
12 changed files with 245 additions and 60 deletions
--- a/webapp/titanembeds/static/css/embedstyle.css
+++ b/webapp/titanembeds/static/css/embedstyle.css
@ -233,6 +233,14 @@ a {
 #nameplate {
  cursor: pointer;
 }
+
+#visitor_mode_message {
+  margin-right: auto;
+  margin-left: auto;
+  display: block;
+  width: 305px;
+}
+
@font-face {
    font-family: Whitney;
    font-style: light;
@ -261,53 +269,79 @@ a {
    src: url("../fonts/whitney_bold.woff") format("woff")
 }
 * {
-font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;
+    font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;
 }
 #footercontainer {
-border-radius:20px;
-border: 1px solid rgb(99,99,99);
-margin-left:-0px!important;
-padding-left:-4px!important;
+    border-radius: 20px;
+    border: 1px solid rgb(99, 99, 99);
+    margin-left: -0px!important;
+    padding-left: -4px!important;
 }
 #nameplate {
-background:transparent!important;
-margin-left:10px
+    background: transparent!important;
+    margin-left: 10px
 }
 #chatcontent > p > span.chatusername,
 #curuser_discrim,
 #curuser_name {
-display:block
+    display: block
 }
 #curuser_discrim {
-font-size:50%;
+    font-size: 50%;
 }
 #curuser_discrim,
 #curuser_name {
-margin-top:-2px
+    margin-top: -2px
 }
 #currentuserimage {
-margin-top:4px;
-margin-right:4px
+    margin-top: 4px;
+    margin-right: 4px
+}
+#chatcontent > p {
+    display: table;
+}
+#chatcontent > p > span {
+    display: table-row
+}
+#chatcontent > p > span.chatusername {
+    display: table-header-group
+}
+#chatcontent > p > span.chatmessage {
+    display: table-footer-group;
+    display: inline-block!important;
+    color: rgb(195, 196, 197)
+}
+::-webkit-input-placeholder {
+    color: rgb(99, 99, 99)
+}
+:-moz-placeholder {
+    color: rgb(99, 99, 99)
+}
+::-moz-placeholder {
+    color: rgb(99, 99, 99)
+}
+:-ms-input-placeholder {
+    color: rgb(99, 99, 99)
+}
+::-ms-input-placeholder {
+    color: rgb(99, 99, 99)
 }
-#chatcontent > p { display: table; }
-#chatcontent > p > span { display: table-row }
-#chatcontent > p > span.chatusername { display: table-header-group }
-#chatcontent > p > span.chatmessage { display: table-footer-group;display:inline-block!important;color:rgb(195,196,197) }
-::-webkit-input-placeholder { color:rgb(99,99,99) }
-:-moz-placeholder { color:rgb(99,99,99) }
-::-moz-placeholder { color:rgb(99,99,99) }
-:-ms-input-placeholder { color:rgb(99,99,99) }
-::-ms-input-placeholder { color:rgb(99,99,99) }
 body > div.navbar-fixed > nav > div {
-background:#263238
-    background: -webkit-linear-gradient(#263238, #37474f, #455a64); /* For Safari 5.1 to 6.0 */
-    background: -o-linear-gradient(#263238, #37474f, #455a64); /* For Opera 11.1 to 12.0 */
-    background: -moz-linear-gradient(#263238, #37474f, #455a64); /* For Firefox 3.6 to 15 */
-    background: linear-gradient(#263238, #37474f, #455a64); /* Standard syntax */
+    background: #263238 background: -webkit-linear-gradient(#263238, #37474f, #455a64);
+    /* For Safari 5.1 to 6.0 */
+    
+    background: -o-linear-gradient(#263238, #37474f, #455a64);
+    /* For Opera 11.1 to 12.0 */
+    
+    background: -moz-linear-gradient(#263238, #37474f, #455a64);
+    /* For Firefox 3.6 to 15 */
+    
+    background: linear-gradient(#263238, #37474f, #455a64);
+    /* Standard syntax */
 }
 div.divider {
-margin-left:10px;
-margin-right:10px;
+    margin-left: 10px;
+    margin-right: 10px;
 }
 #discord-members > li > a.subheader,
 #members-nav > li:nth-child(1) > a,
@ -316,21 +350,21 @@ margin-right:10px;
 #members-nav > li:nth-child(4) > a,
 #guest-members-count,
 #members-nav > li:nth-child(6) > a {
-text-transform: uppercase;
+    text-transform: uppercase;
+}
+#members-btn > i {
+    visibility: hidden
 }
-#members-btn > i { visibility:hidden }
 #members-btn {
-visibility:visible;
-background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+CiAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxwYXRoIGQ9Ik0xIDFoMjR2MjRIMVYxeiIvPgogICAgPHBhdGggZmlsbD0iI0ZGRiIgZD0iTTE2Ljc3MjA3NTQgMTQuNjc5MTc3OGMtLjIyNDkwOTctLjIyNTY4ODYtLjQ3NDE1NzMtLjQzNTE2ODEtLjc0MjA3NTQtLjYyOTE3NzguMzUtLjAzLjY4LS4wNS45Ny0uMDUgMi4zMyAwIDcgMS4xNyA3IDMuNVYyMGgtNHYtMWMwLTEuODgxNjkxNC0xLjQwNzcwNTYtMy4zMjMwMTQzLTMuMjI3OTI0Ni00LjMyMDgyMjJ6bS0xLjQzODU3MzUtOC4xNzU4NTM0QzE1LjgwOTgwODIgNi4xODUyNTE3MyAxNi4zODI3ODQ1IDYgMTcgNmMxLjY2IDAgMi45OSAxLjM0IDIuOTkgM3MtMS4zMyAzLTIuOTkgM2MtLjYxNzE5MTQgMC0xLjE5MDE0NzEtLjE4NTIzNzMtMS42NjY0NDIzLS41MDMyODcyQzE1Ljc1NzQ4MzIgMTAuNzYyMTQwOTUgMTYgOS45MDk1NTYgMTYgOS4wMDAwNjY5M2MwLS45MDk1Mjg5Ni0uMjQyNTM4MS0xLjc2MjE0ODgtLjY2NjQ5ODEtMi40OTY3NDI1M3pNMTAgMTNjMi4yMSAwIDQtMS43OSA0LTRzLTEuNzktNC00LTQtNCAxLjc5LTQgNCAxLjc5IDQgNCA0em0wIDJjLTIuNjcgMC04IDEuMzQtOCA0djJoMTZ2LTJjMC0yLjY2LTUuMzMtNC04LTR6Ii8+CiAgPC9nPgo8L3N2Zz4=);
-background-repeat:no-repeat;
-margin-top:18px
+    visibility: visible;
+    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+CiAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxwYXRoIGQ9Ik0xIDFoMjR2MjRIMVYxeiIvPgogICAgPHBhdGggZmlsbD0iI0ZGRiIgZD0iTTE2Ljc3MjA3NTQgMTQuNjc5MTc3OGMtLjIyNDkwOTctLjIyNTY4ODYtLjQ3NDE1NzMtLjQzNTE2ODEtLjc0MjA3NTQtLjYyOTE3NzguMzUtLjAzLjY4LS4wNS45Ny0uMDUgMi4zMyAwIDcgMS4xNyA3IDMuNVYyMGgtNHYtMWMwLTEuODgxNjkxNC0xLjQwNzcwNTYtMy4zMjMwMTQzLTMuMjI3OTI0Ni00LjMyMDgyMjJ6bS0xLjQzODU3MzUtOC4xNzU4NTM0QzE1LjgwOTgwODIgNi4xODUyNTE3MyAxNi4zODI3ODQ1IDYgMTcgNmMxLjY2IDAgMi45OSAxLjM0IDIuOTkgM3MtMS4zMyAzLTIuOTkgM2MtLjYxNzE5MTQgMC0xLjE5MDE0NzEtLjE4NTIzNzMtMS42NjY0NDIzLS41MDMyODcyQzE1Ljc1NzQ4MzIgMTAuNzYyMTQwOTUgMTYgOS45MDk1NTYgMTYgOS4wMDAwNjY5M2MwLS45MDk1Mjg5Ni0uMjQyNTM4MS0xLjc2MjE0ODgtLjY2NjQ5ODEtMi40OTY3NDI1M3pNMTAgMTNjMi4yMSAwIDQtMS43OSA0LTRzLTEuNzktNC00LTQtNCAxLjc5LTQgNCAxLjc5IDQgNCA0em0wIDJjLTIuNjcgMC04IDEuMzQtOCA0djJoMTZ2LTJjMC0yLjY2LTUuMzMtNC04LTR6Ii8+CiAgPC9nPgo8L3N2Zz4=);
+    background-repeat: no-repeat;
+    margin-top: 18px
 }
 .circle:hover {
-border-radius:20px;
-background: linear-gradient(to right, #f9f9f9 90%, #fff);
+    border-radius: 20px;
+    background: linear-gradient(to right, #f9f9f9 90%, #fff);
 }
 #channels-list > li:hover {
-webkit-filter: brightness(150%);
-}
-#loginmodal {
-}
+    -webkit-filter: brightness(150%);
+}
--- a/webapp/titanembeds/static/js/administrate_guild.js
+++ b/webapp/titanembeds/static/js/administrate_guild.js
@ -7,6 +7,15 @@ $('#unauth_users').change(function() {
    });
 });

+$('#visitor_view').change(function() {
+    var pathname = window.location.pathname;
+    var checked = $(this).is(':checked')
+    var payload = {"visitor_view": checked}
+    $.post(pathname, payload, function(data) {
+      Materialize.toast('Updated visitor mode setting!', 2000)
+    });
+});
+
 $('#chat_links').change(function() {
    var pathname = window.location.pathname;
    var checked = $(this).is(':checked')
--- a/webapp/titanembeds/static/js/embed.js
+++ b/webapp/titanembeds/static/js/embed.js
@ -5,6 +5,7 @@
 /* global bot_client_id */
 /* global moment */
 /* global localStorage */
+/* global visitors_enabled */

 (function () {
    const theme_options = ["DiscordDark", "BetterTitan"]; // All the avaliable theming names
@ -21,6 +22,7 @@
    var fetch_error_count = 0; // Number of errors fetch has encountered
    var priority_query_guild = false; // So you have selected a channel? Let's populate it.
    var current_username_discrim; // Current username/discrim pair, eg EndenDraogn#4151
+    var visitor_mode = false; // Keep track of if using the visitor mode or authenticate mode

    function element_in_view(element, fullyInView) {
        var pageTop = $(window).scrollTop();
@ -36,9 +38,13 @@
    }

    function query_guild() {
+        var url = "/api/query_guild";
+        if (visitor_mode) {
+            url = url += "_visitor";
+        }
        var funct = $.ajax({
            dataType: "json",
-            url: "/api/query_guild",
+            url: url,
            data: {"guild_id": guild_id}
        });
        return funct.promise();
@ -65,10 +71,14 @@
    }

    function fetch(channel_id, after=null) {
+        var url = "/api/fetch";
+        if (visitor_mode) {
+            url += "_visitor";
+        }
        var funct = $.ajax({
            method: "GET",
            dataType: "json",
-            url: "/api/fetch",
+            url: url,
            data: {"guild_id": guild_id,"channel_id": channel_id, "after": after}
        });
        return funct.promise();
@ -118,6 +128,10 @@
            $("#userembedmodal").modal("open");
        });
        
+        $("#visitor_login_btn").click(function () {
+            $("#loginmodal").modal("open");
+        });
+        
        $( "#theme-selector" ).change(function() {
            var theme = $("#theme-selector option:selected").val();
            changeTheme(theme);
@ -171,6 +185,20 @@
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, " "));
    }
+    
+    function setVisitorMode(enabled) {
+        if (!visitors_enabled) {
+            return;
+        }
+        visitor_mode = enabled;
+        if (visitor_mode) {
+            $("#visitor_mode_message").show();
+            $("#messagebox").hide();
+        } else {
+            $("#visitor_mode_message").hide();
+            $("#messagebox").show();
+        }
+    }

    function primeEmbed() {
        $("#focusmodal").modal("close");
@ -181,8 +209,10 @@
            $("#modal_invite_btn").attr("href", data.instant_invite);
        });
        
+        var login_modal_dismissible = visitors_enabled;
+        
        $("#loginmodal").modal({
-            dismissible: false, // Modal can be dismissed by clicking outside of the modal
+            dismissible: login_modal_dismissible, // Modal can be dismissed by clicking outside of the modal
            opacity: .5, // Opacity of modal background
            inDuration: 300, // Transition in duration
            outDuration: 200, // Transition out duration
@ -196,6 +226,16 @@
        var guild = query_guild();
        guild.fail(function() {
            unlock_login_fields();
+            if (visitors_enabled) {
+                setVisitorMode(true);
+                var guild2 = query_guild();
+                guild2.done(function(data) {
+                    initialize_embed(data);
+                });
+                guild2.fail(function() {
+                    setVisitorMode(false);
+                });
+            }
        });

        guild.done(function(data) {
@ -375,12 +415,14 @@
        setTimeout(function() {
            var usr = create_authenticated_user();
            usr.done(function(data) {
+                setVisitorMode(false);
                initialize_embed();
                return;
            });
            usr.fail(function(data) {
                if (data.status == 403) {
                    Materialize.toast('Authentication error! You have been banned.', 10000);
+                    setVisitorMode(true);
                } else if (index < 10) {
                    _wait_for_discord_login(index + 1);
                }
@ -524,9 +566,13 @@
        }
        fet.done(function(data) {
            var status = data.status;
-            update_embed_userchip(status.authenticated, status.avatar, status.username, status.user_id, status.discriminator);
+            if (visitor_mode) {
+                update_embed_userchip(false, null, "Titan", "0001", null);
+            } else {
+                update_embed_userchip(status.authenticated, status.avatar, status.username, status.user_id, status.discriminator);
+            }
            last_message_id = fill_discord_messages(data.messages, jumpscroll);
-            if (status.manage_embed) {
+            if (!visitor_mode && status.manage_embed) {
                $("#administrate_link").show();
            } else {
                $("#administrate_link").hide();
@ -554,6 +600,10 @@
                $('#loginmodal').modal('open');
                Materialize.toast('Session expired! You have been logged out.', 10000);
            }
+            setVisitorMode(true);
+            if (visitor_mode) {
+                fetchtimeout = setTimeout(run_fetch_routine, 5000);
+            }
        });
        fet.catch(function(data) {
          if (500 <= data.status && data.status < 600) {
@ -600,6 +650,7 @@
                lock_login_fields();
                var usr = create_unauthenticated_user($(this).val());
                usr.done(function(data) {
+                    setVisitorMode(false);
                    initialize_embed();
                });
                usr.fail(function(data) {
@ -611,6 +662,7 @@
                        Materialize.toast('Illegal username provided! Only alphanumeric, spaces, dashes, and underscores allowed in usernames.', 10000);
                    }
                    unlock_login_fields();
+                    setVisitorMode(true);
                });
            }
        }