From 89b3f4a450d51ed711f3016e3df1722236e66b8e Mon Sep 17 00:00:00 2001
From: Jeremy Zhang <jkzhang@uw.edu>
Date: Thu, 14 Dec 2017 05:22:06 +0000
Subject: [PATCH] Add support for older browser with bad support for CSS
 Variables and ES6

---
 webapp/titanembeds/static/css/embedstyle.css  | 16 ++++++++
 webapp/titanembeds/static/js/embed.js         | 39 ++++++++++++++++---
 .../static/themes/DiscordDark/css/style.css   | 21 +++++++---
 3 files changed, 64 insertions(+), 12 deletions(-)

diff --git a/webapp/titanembeds/static/css/embedstyle.css b/webapp/titanembeds/static/css/embedstyle.css
index 81885a2..3da43da 100644
--- a/webapp/titanembeds/static/css/embedstyle.css
+++ b/webapp/titanembeds/static/css/embedstyle.css
@@ -27,6 +27,7 @@
 }
 
 html {
+  background-color: #455A64;
   background-color: var(--main);
   color: white;
   font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;
@@ -43,11 +44,14 @@ footer {
   left: 0;
   right: 0;
   height: 50px;
+  background-color: #37474F;
   background-color: var(--chatbox);
 }
 
 nav {
+  background-color: #263238;
   background-color: var(--header);
+  background: linear-gradient(#263238, rgba(38,50,56,0));
   background: linear-gradient(var(--header), rgba(38,50,56,0));
   box-shadow: none;
 }
@@ -92,10 +96,12 @@ nav .brand-logo {
 }
 
 #members-nav {
+  background-color: #607D8B;
   background-color: var(--rightsidebar);
 }
 
 #members-nav li>a {
+  color: #ECEFF1;
   color: var(--noroleusers);
 }
 
@@ -113,10 +119,12 @@ nav .brand-logo {
 }
 
 #guild-nav {
+  background-color: #607D8B;
   background-color: var(--leftsidebar);
 }
 
 .side-nav div.divider {
+  background-color: #90A4AE;
   background-color: var(--sidebardivider);
   margin-left: 10px;
   margin-right: 10px;
@@ -214,22 +222,27 @@ nav .brand-logo {
 /*}*/
 
 ::-webkit-input-placeholder {
+  color: #636363;
   color: var(--placeholder);
 }
 
 :-moz-placeholder {
+  color: #636363;
   color: var(--placeholder);
 }
 
 ::-moz-placeholder {
+  color: #636363;
   color: var(--placeholder);
 }
 
 :-ms-input-placeholder {
+  color: #636363;
   color: var(--placeholder);
 }
 
 ::-ms-input-placeholder {
+  color: #636363;
   color: var(--placeholder);
 }
 
@@ -345,6 +358,7 @@ textarea.materialize-textarea:focus:not([readonly]) {
 
 #curuser_discrim {
   font-size: 50%;
+  color: #FFFFFF;
   color: var(--discrim);
 }
 
@@ -367,6 +381,7 @@ textarea.materialize-textarea:focus:not([readonly]) {
 }
 
 .modal {
+  background-color: #546E7A;
   background-color: var(--modal);
 }
 
@@ -498,6 +513,7 @@ a {
 /*}*/
 .chatmessage {
   display: block;
+  color: #C3C4C5;
   color: var(--chatmessage);
   margin-top: 5px;
 }
diff --git a/webapp/titanembeds/static/js/embed.js b/webapp/titanembeds/static/js/embed.js
index 2ea44e2..730be2d 100644
--- a/webapp/titanembeds/static/js/embed.js
+++ b/webapp/titanembeds/static/js/embed.js
@@ -103,7 +103,10 @@
         return funct.promise();
     }
 
-    function fetch(channel_id, after=null) {
+    function fetch(channel_id, after) {
+        if (after === undefined) {
+            after = null;
+        }
         var url = "/api/fetch";
         if (visitor_mode) {
             url += "_visitor";
@@ -303,7 +306,16 @@
         }
     }
     
-    function changeTheme(theme=null, keep_custom_css=true, modifyLocalStore=true) {
+    function changeTheme(theme, keep_custom_css, modifyLocalStore) {
+        if (theme === undefined) {
+            theme = null;
+        }
+        if (keep_custom_css === undefined) {
+            keep_custom_css = true;
+        }
+        if (modifyLocalStore === undefined) {
+            modifyLocalStore = true;
+        }
         if (theme == "") {
           $("#css-theme").attr("href", "");
           $("#user-defined-css").text(user_def_css);
@@ -965,7 +977,10 @@
         }
     }
     
-    function generate_avatar_url(user_id, avatar_hash, message_contents=null) {
+    function generate_avatar_url(user_id, avatar_hash, message_contents) {
+        if (message_contents === undefined) {
+            message_contents = null;
+        }
         if (user_id == bot_client_id && (message_contents.includes("**") && ( (message_contents.includes("<")&&message_contents.includes(">")) || (message_contents.includes("[") && message_contents.includes("]")) ))) {
             return global_guest_icon;
         } else {
@@ -1001,7 +1016,10 @@
         return emb;
     }
 
-    function fill_discord_messages(messages, jumpscroll, replace=null) {
+    function fill_discord_messages(messages, jumpscroll, replace) {
+        if (replace === undefined) {
+            replace = null;
+        }
         if (messages.length == 0) {
             return last_message_id;
         }
@@ -1194,7 +1212,10 @@
         }
     }
 
-    function update_embed_userchip(authenticated, avatar, username, nickname, userid, discrim=null) {
+    function update_embed_userchip(authenticated, avatar, username, nickname, userid, discrim) {
+        if (discrim === undefined) {
+            discrim = null;
+        }
         if (authenticated) {
             $("#currentuserimage").show();
             $("#currentuserimage").attr("src", avatar);
@@ -1215,7 +1236,13 @@
         }
     }
     
-    function update_change_username_modal(authenticated=false, username=null) {
+    function update_change_username_modal(authenticated, username) {
+        if (authenticated === undefined) {
+            authenticated = null;
+        }
+        if (username === undefined) {
+            username = null;
+        }
         if (!$("#change_username_field") || $("#change_username_field").is(":focus")) {
             return;
         }
diff --git a/webapp/titanembeds/static/themes/DiscordDark/css/style.css b/webapp/titanembeds/static/themes/DiscordDark/css/style.css
index 62a1bec..fb989cc 100644
--- a/webapp/titanembeds/static/themes/DiscordDark/css/style.css
+++ b/webapp/titanembeds/static/themes/DiscordDark/css/style.css
@@ -43,6 +43,7 @@ font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;
   --dark-highlight-channelheader: #36393e;
 }
 #footer {
+background-color: #3C3C3C;
 background-color: var(--chatbox);
 }
 #footercontainer {
@@ -50,6 +51,7 @@ border-radius:20px;
 border: 1px solid rgb(99,99,99);
 margin-left:-0px!important;
 padding-left:-4px!important;
+background-color: #3C3C3C;
 background-color: var(--chatbox);
 }
 #nameplate {
@@ -63,6 +65,7 @@ display:block
 }
 #curuser_discrim {
 font-size:50%;
+color: #7D8386;
 color:var(--discrim);
 }
 #curuser_discrim,
@@ -77,20 +80,23 @@ margin-right:4px
 #chatcontent > p > span { display: table-row }
 /*#chatcontent > p > span:nth-child(1):before { content:"Today at " }*/
 /*#chatcontent > p > span.chatusername { display: table-header-group }*/
-#chatcontent > p > span.chatmessage { display: table-footer-group;display:inline-block!important;color:var(--chatmessage) }
+#chatcontent > p > span.chatmessage { display: table-footer-group;display:inline-block!important;color:#C3C4C5;color:var(--chatmessage); }
 #chatcontent {
+background: #36393E;
 background:var(--main)
 }
-::-webkit-input-placeholder { color:var(--placeholder) }
-:-moz-placeholder { color:var(--placeholder) }
-::-moz-placeholder { color:var(--placeholder) }
-:-ms-input-placeholder { color:var(--placeholder) }
-::-ms-input-placeholder { color:var(--placeholder) }
+::-webkit-input-placeholder { color: #636363; color:var(--placeholder); }
+:-moz-placeholder { color: #636363; color:var(--placeholder);  }
+::-moz-placeholder { color: #636363; color:var(--placeholder);  }
+:-ms-input-placeholder { color: #636363; color:var(--placeholder);  }
+::-ms-input-placeholder { color: #636363; color:var(--placeholder);  }
 body > div.navbar-fixed > nav > div,
 #members-nav {
+background: #1E2124;
 background:var(--rightsidebar)
 }
 #guild-nav {
+background: #2E3136;
 background: var(--leftsidebar)
 }
 div.divider {
@@ -111,6 +117,7 @@ color:rgb(130,131,134)
 }
 body > main,
 body {
+background: #36393E;
 background:var(--main)
 }
 #members-btn > i { visibility:hidden }
@@ -130,9 +137,11 @@ background: linear-gradient(to right, #f9f9f9 90%, #fff);
 #discord-members > li > a,
 #embed-discord-members > li > a,
 #embed-unauth-users > li > a {
+color: #ABADAF;
 color:var(--noroleusers);
 }
 .modal {
+    background: #36393E;
     background: var(--modal);
 }