note.html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Auride</title> 7 <link rel="stylesheet" href="/assets/css/all.css"> 8 <link rel="shortcut icon" href="/assets/imgs/favicon.png" type="image/png"> 9 <link rel="manifest" href="/manifest.json"> 10 <meta name="robots" content="nofollow, noai, noimageai"> 11 <meta name="og:type" content="website"> 12 <meta name="og:url" content="https://auride.xyz/"> 13 <meta name="og:title" content="Auride"> 14 <meta name="og:site_name" content="auride.xyz"> 15 <meta name="og:description" content="Auride - a safe place for everyone."> 16 <meta name="description" content="Auride - a safe place for everyone."> 17 <meta property="og:image" content="https://auride.xyz/assets/imgs/favicon.png"> 18 <meta name="theme-color" content="#ef97be"> 19 <script src="/assets/js/requiredScripts.js"></script> 20 <script src="/assets/js/scriptLoader.js"></script> 21 <script defer> 22 ScriptLoader.load( 23 { src: "/assets/js/notes/renderNoteDiv.js", async: false }, 24 { src: "/assets/js/notes/notes.js", async: false } 25 ).then(() => { 26 console.log("Scripts for /home have been loaded successfully."); 27 }).catch((error) => { 28 console.error("An error occurred: ", error, " please try refreshing."); 29 }); 30 </script> 31 </head> 32 33 <body> 34 <!-- Bottom Nav (mobile) --> 35 <!--<div class="mobileBottomNav" id="mobileBottomNav"> 36 <div class="nav"> 37 <a href="/home" style="margin-left: 20px;"><i class="fa-solid fa-house fa-xl"></i></a> <a href="/notifications"><i class="fa-solid fa-bell fa-xl"></i></a> <a href="/settings"><i class="fa-solid fa-gear fa-xl"></i></a> <a href="javascript:void();" onclick="createNotePopup()"><i class="fa-solid fa-pen-to-square fa-xl"></i></a> 38 </div> 39 </div>--> 40 41 <!-- Note successfully sent --> 42 <div id="successfullySent" style="display: none;"><p>Note successfully sent!</p></div> 43 44 <div class="aurideAccounts"> 45 <h3>Auride Accounts</h3> 46 <p>Follow accounts associated with Auride.</p> 47 48 <div class="katniny"> 49 <!-- Me :3 --> 50 <div class="katniny"> 51 <img class="recommendAcc-pfp" src="" id="katninyPfp" draggable="false" /> <p id="katninyDisplay"></p> 52 <br /> <a href="/u" id="followBtn-1"><button class="followBtn">Follow</button></a> 53 <p id="katninyUser-pronouns"></p> 54 </div> 55 56 <br /> 57 58 <!-- Auride --> 59 <div class="auride"> 60 <img class="recommendAcc-pfp" src="" id="auridePfp" draggable="false" /> <p id="aurideDisplay"></p> 61 <br /> <a href="/u" id="followBtn-2"><button class="followBtn">Follow</button></a> 62 <p id="aurideUser-pronouns"></p> 63 </div> 64 65 <br /> 66 67 <!-- Katniny Studios --> 68 <div class="katninystudios"> 69 <img class="recommendAcc-pfp" src="" id="katninystudiosPfp" draggable="false" /> <p id="katninystudiosDisplay"></p> 70 <br /> <a href="/u" id="followBtn-3"><button class="followBtn">Follow</button></a> 71 <p id="katninystudiosUser-pronouns"></p> 72 </div> 73 </div> 74 </div> 75 76 <div class="policies"> 77 <a href="/policies/terms">Terms of Service</a>, <a href="/policies/privacy">Privacy Policy</a>, <a href="/policies/child-safety">Child Safety</a>, <a href="/policies/cookies">Cookies</a>, <a href="/policies/copyright">Copyright</a>, <a href="/policies/guidelines">Community Guidelines</a> 78 </div> 79 80 <!-- Note Not Found --> 81 <!-- Only show this if the note was unable to be found. --> 82 <div class="userNotFound" id="noteNotFound" style="transform: translateY(75px)"> 83 <h1>Note not found.</h1> 84 <p>Auride was unable to find the note you were looking for.</p> 85 <p class="usage">Usage: https://auride.xyz/note/noteId</p> 86 87 <a href="/home"><button>Go Home</button></a> 88 </div> 89 90 <!-- Note found --> 91 <div class="melissa" id="melissa" style="display: none;"> 92 <div class="info"> 93 <img class="userImage-profile" id="userImage-profile" draggable="false" style="width: 80px; height: 80px; cursor: pointer;" /> <h1 id="display-profile" class="canBeUnderlined" style="position: absolute; float: left; max-width: auto; transform: translateX(90px); cursor: pointer;"></h1> 94 <h2 id="username-profile" class="canBeUnderlined" style="position: absolute; float: left; max-width: auto; transform: translate(90px, 50px); cursor: pointer;"></h2></a> 95 <h2 id="pronouns-profile" class="canBeUnderlined" style="position: absolute; float: left; max-width: auto; transform: translate(90px, 72px); cursor: pointer;"></h2> 96 97 <br /> 98 99 <span style="margin-left: 15px; margin-right: 15px;" id="noteContent" class="noteContent"></span> 100 <img id="uploadedImg-main" draggable="false" class="uploadedImg" /> 101 <video id="uploadedVideo-main" draggable="false" controls loop autoplay="true" muted="true" class="uploadedImg"></video> 102 <audio id="uploadedAudio-main" draggable="false" controls loop autoplay="true" muted="true" class="uploadedImg" style="height: 50px;"></audio> 103 <iframe id="songEmbed" src="" width="98%" height="100" frameborder="0" allow="encrypted-media"></iframe> 104 105 <div id="quotingNote_note" style="cursor: pointer;"> 106 <br /> 107 <div class="quoteContainer"> 108 <img src="" alt="Quote user pfp" class="quotePfp" id="noteQuotePfp"> 109 <div class="quoteContent"> 110 <div class="quoteHeader"> 111 <span class="quoteDisplay" id="noteQuoteDisplay"></span> 112 <span class="quoteUsername" id="noteQuoteUsername"></span> 113 </div> 114 <span class="quoteText" id="noteQuoteText"></span> 115 </div> 116 </div> 117 </div> 118 119 <div id="buttonRow"> 120 <span id="likeButton" onclick="likeNote()"><i class="fa-solid fa-heart"></i></span> 121 <span id="renoteButton" onclick="renoteNote()"><i class="fa-solid fa-retweet"></i></span> 122 <span id="quoteRenoteButton" onclick="null"><i class="fa-solid fa-quote-left"></i></span> 123 <span id="favoriteButton" onclick="null"><i class="fa-solid fa-bookmark" id="favoriteButton_icon"></i></span> 124 </div> 125 126 <div class="divider"></div> 127 128 <div class="replyToNote" onclick="replyToNote(this)">Reply</div> 129 130 <div class="notes" id="notes" style="max-width: 100%; margin-left: 0px; transform: translateY(15px); margin-bottom: -10px; display: flex; flex-direction: column-reverse;"> 131 <div class="newNotesAdded" id="newNotesAdded"> 132 <!-- Notes go here. This content is user-generated, no default HTML should be here. --> 133 </div> 134 135 <div class="noteFilter"> 136 <!--<button class="active" style="border-right: 1px solid gray;">All Notes</button><button>Following</button>--> 137 </div> 138 </div> 139 </div> 140 </div> 141 142 <div id="notSignedIn-banner"> 143 <p>Join the fun on Auride!</p> 144 <a href="/auth/login"><button>Login</button></a> 145 <a href="/auth/register"><button>Create an account</button></a> 146 </div> 147 148 <!-- Achievement Unlock --> 149 <div id="achievementUnlock" class="achievementUnlock" style="display: none;"> 150 <div id="achievementIcon"><i class="fa-solid fa-pencil"></i></div> <p id="achievementName">Achievement Name</p> 151 </div> 152 153 <dialog id="showAchievementUnlock"> 154 <h2 id="titleAndIcon">title and stuff</h2> 155 <p id="unlockReason">because you did</p> 156 <p id="unlockDate">m/d/y (the objectively correct way)</p> 157 <button onclick="document.getElementById('showAchievementUnlock').close();">Okay!</button> 158 </dialog> 159 160 <!-- Modals --> 161 162 163 <dialog id="signInPrompt"> 164 <img src="/assets/imgs/All_transparent.png" draggable="false" style="width: 450px; height: 100px; margin-left: 17%; margin-right: 15%;" /> 165 <h2>You must be signed in.</h2> 166 <p>To perform this action, you need to be signed into Auride!</p> 167 <br /> 168 <a href="/auth/login"><button>Login</button></a> 169 <div style="margin-top: 5px;"></div> 170 <a href="/auth/register"><button>Register</button></a> 171 </dialog> 172 173 <dialog id="openLink"> 174 <h2>Leaving Auride</h2> 175 <p>This link is taking you to the following website:</p> 176 177 <br /> 178 179 <p style="text-align: center;" id="linkyLink">https://link.com/</p> 180 181 <br /> 182 183 <a href="link" id="externalLink" target="_blank"><button onclick="document.getElementById('openLink').close()">Visit Site</button></a> <a href="javascript:void(1);" onclick="document.getElementById('openLink').close()" style="color: var(--main-color); font-size: 14px;">Go Back</a> 184 </dialog> 185 186 <dialog id="addAltText"> 187 <h2>Add Alt Text</h2> 188 <p>Help those with visual impairments or low vision understand what your note is.</p> 189 190 <textarea id="altText_input" placeholder="A fluffy orange cat sitting on a windowsill, licking its paw and grooming itself"></textarea> 191 192 <br /> 193 194 <button onclick="addAltText_finish()">Finish</button> 195 </dialog> 196 197 <dialog id="verifyEmail"> 198 <h2><i class="fa-solid fa-envelope-circle-check"></i> Please verify your email</h2> 199 <p>We need to ensure your account is using an actual email address. This is for your security and to help us drive away bots.</p> 200 <p style="font-size: 14px; color: var(--text-semi-transparent);">If you're seeing this, you have not verified your email address yet. You will need to be able to verify your email when creating new accounts.</p> 201 202 <br /> 203 204 <button onclick="getVerificationEmail()" style="width: 100%;"><i class="fa-solid fa-check-to-slot"></i> Verify Email</button> 205 </dialog> 206 207 <dialog id="emailSent_emailVer"> 208 <h2><i class="fa-solid fa-envelope-circle-check"></i> Email sent!</h2> 209 <p>Once you verify your email, please click the button below to verify, then we won't bug you again!</p> 210 <p style="font-size: 14px; color: var(--text-semi-transparent);">If you're seeing this, you have not verified your email address yet. You will need to be able to verify your email when creating new accounts.</p> 211 212 <br /> 213 214 <button onclick="window.location.reload()">Check Verification Status</button> 215 </dialog> 216 217 <dialog id="noteDeleted"> 218 <h2>Note Deleted</h2> 219 <p>Note was successfully deleted.</p> 220 221 <br /> 222 223 <button onclick="window.location.reload()">Okay</button> 224 </dialog> 225 226 <dialog id="noteUpdated"> 227 <h2>Note Updated</h2> 228 <p>Note was successfully updated.</p> 229 230 <br /> 231 232 <button onclick="window.location.reload()">Okay</button> 233 </dialog> 234 235 <dialog id="accountWarning"> 236 <h2>Account Warning</h2> 237 <p>Your behavior on Auride has been in violation of our <a href="/policies/terms" style="color: var(--main-color);">Terms of Service</a>, therefore has received a warning. Repeat offenses can result in account suspension or other account related punishments.</p> 238 239 <br /> 240 241 <p style="color: var(--text-semi-transparent);">Reason: <span id="warningReason"></span></p> 242 243 <br /> 244 <p>Please abide by Auride's <a href="/policies/guidelines" style="color: var(--main-color);">Community Guidelines</a> so Auride remains a safe place for everyone.</p> 245 <p>You can continue using Auride after agreeing to our Terms of Service.</p> 246 247 <input type="checkbox" id="warningAgreeToTerms" style="width: 15px;"> I agree 248 <p style="color: var(--error-text); display: none;" id="warningAcknowledge">Please agree to the Terms before continuing.</p> 249 <br /> 250 <button onclick="acknowledgeWarning()">Continue using Auride</button> 251 </dialog> 252 </body> 253 </html>