<style> div.brdCmb, h1.pTtl { display: none; } .ui img { max-height: 128px; max-width: 128px; object-fit: cover; } .parent-div { display: flex; padding: 0; margin: 0; list-style: none; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin: 0 auto; border: 1px solid rgba(255,255,255,0.2); } .parent-div .profile { min-width: 300px; height: max-content; flex: 1 0 180px; display: flex; text-align: center; overflow: hidden; align-items: center; justify-content: center; flex-direction: column; margin: 10px; } .parent-div .profile span { min-width: 300px; } .parent-div .informations { display: flex; min-width: 300px; flex: 1 0 400px; gap: 5px; padding: 10px; align-items: center; justify-content: center; flex-wrap: wrap; } .parent-div .informations .rankimg { display: flex; flex: 1 0 150px; align-items: center; justify-content: space-around; flex-direction: column; } .parent-div .informations .details { flex: 1 0 250px; display: flex; align-items: center; justify-content: center; flex-direction: column; margin-bottom: 20px; } .parent-div .informations .rankimg img { width: 100px !important; height: 100px !important; object-fit: cover; } .bold { font-weight: 600; } </style> <div id="loader" class="ui active centered text inline loader"> Please wait while loading... </div> <div id="parent_div" class="parent-div" style="display: none;"> <div class="profile"> <img id="profile_image" style="object-fit: cover; width: 100px !important; height: 100px !important;" /> <span>Username: <span class="bold" id="username"></span></span> <span>Birthday: <span class="bold" id="birthday"></span></span> <span>Gender: <span class="bold" id="gender"></span></span> <span>Country: <span class="bold" id="country"></span></span> </div> <div class="informations"> <div class="rankimg"> <img id="rank_image" /> <h2 id="rankname"></h2> <p style="color: yellow;" id="rank"></p> <p id="account_birthday"></p> </div> <div class="details"> <br /> <button onclick="edit();" class="ui button white inverted"> Edit Profile </button> <br /> <button onclick="signout();" class="ui button white inverted"> Logout </button> </div> </div> <div class="activities"></div> </div> <br/> <div id="activities_loader" class="ui active centered text inline loader"> Fetching Activities... </div> <div id='activity_logs' style='display: none;' class='ui container'> <h2>Activity Logs</h2> </div> <script type="module"> window.signout = async () => { await supabase.auth.signOut(); window.location.href = "https://storehaccounts.blogspot.com/"; } window.edit = async () => { window.location.href = "https://storehaccounts.blogspot.com/p/edit-profile.html"; } window.addEventListener('load', async () => { await initFunctions(['FirebaseModule', 'supabase', 'moment']); let session = await supabase.auth.getSession(); if (!session.data || session.error) { window.location.href = "https://storehaccounts.blogspot.com/"; return; } let email = session.data.session.user.email; let data = await supabase.from('users').select().eq('email', email); data = data.data[0]; let rank = await supabase.from('ranks').select('rank_name, rank_image').eq('id', data.rank_id); function get(id) { return document.getElementById(id); } let country_info = await fetch('https://restcountries.com/v3.1/alpha/' + data.country); country_info = await country_info.json(); get("profile_image").src = data.prof_img; get("rank_image").src = rank.data[0].rank_image; get("username").innerText = data.username; get("rank").innerText = "Rank#" + data.rank_id; get("rankname").innerText = rank.data[0].rank_name; get("birthday").innerHTML = "🎂 " + moment(new Date(data.birthday)).fromNow() + ""; get("gender").innerHTML = (data.gender == "M" ? "🧑 BOY GAMER" : "👩🦰 GIRL GAMER"); get("country").innerHTML = "<img style='height: 32px; width: 32px;' src='" + country_info[0].flags.png + "'/> " + country_info[0].name.official; get("account_birthday").innerText = "Account started (" + moment(new Date(data.created_at)).fromNow() + ")"; get('parent_div').style.display = 'flex'; get('loader').remove(); /*if(data.gender == "M") get('parent_div').style.background = "rgba(21, 10, 180, 0.2)"; else get('parent_div').style.background = "rgb(255,192,203, 0.5)";*/ (async () => { // load user activity logs... function query(id) { return document.getElementById(id); } const fb_db = 'https://ptc-database-default-rtdb.firebaseio.com/logs'; const id = btoa(email); const activity_logs = query('activity_logs'); const activities_data = await FirebaseModule.fetchJSON(fb_db + '/' + id + '.json'); if (!activities_data) { query('activities_loader').remove(); return; } let obj_keys = Object.keys(activities_data); obj_keys = obj_keys.reverse(); obj_keys.forEach((key) => { let data = activities_data[key]; let div = document.createElement('div'); if (data.type == "Settings") { div.innerHTML = '<div class="ui small container"> <div class="ui small brown message"> <span class="ui small blue label">' + data.username + '</span> has updated ('+ (data.gender == "M" ? "his" : "her") +') profile with Birthday (' + moment(new Date(data.birthday)).fromNow() + ') Gender (' + data.gender + ') and Country (' + data.country + '). <div class="ui right aligned container"> <span class="ui mini red label">' + moment(new Date(data.date)).fromNow() + '</span> </div> </div> </div>'; } else if (data.type == "Profile Photo") { div.innerHTML = '<div class="ui small container"> <div class="ui small brown message"> <a href="' + data.img + '" target="_blank" ><img src="' + data.img + '" /></a> <span class="ui small blue label">' + data.username + '</span> updated profile picture. <div class="ui right aligned container"> <span class="ui mini red label">' + moment(new Date(data.date)).fromNow() + '</span> </div> </div> </div>'; } activity_logs.appendChild(div); }); query('activities_loader').remove(); query('activity_logs').style.display = 'block'; })(); }, false); </script>