-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathuser.html
195 lines (178 loc) · 7.95 KB
/
user.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
<!DOCTYPE html>
<html style="scroll-behavior: smooth;">
<head>
<link rel="icon" type="image/png" href="favicon.png">
<title>StarfallMC - User Search</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&family=Quicksand:wght@400;600;700&family=Rubik:wght@300;400;600&display=swap" rel="stylesheet">
<script>
// Function to position the loading icon in the center
function positionLoadingIcon() {
var loadingElement = document.getElementById('Loading');
var windowHeight = window.innerHeight;
var loadingElementHeight = loadingElement.offsetHeight;
var desiredPosition = windowHeight / 2 - loadingElementHeight / 2;
loadingElement.style.top = desiredPosition + 'px';
}
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Check if the current page is user.html
if (window.location.pathname === "/user") {
// Get the gamertag from the current URL
const urlParams = new URLSearchParams(window.location.search);
const gamertag = urlParams.get("name");
// Assuming you have an HTML element with the class "gallery-grid" containing the screenshot divs
const galleryGrid = document.querySelector(".gallery-grid");
// Fetch the JSON data from the player_info.json file
fetch("/player_info.json")
.then(response => response.json())
.then(data => {
// Get the playerScreenshots from the fetched data
const playerScreenshots = data.screenshots;
// Filter the player screenshots based on the Xbox gamertag
const filteredScreenshots = playerScreenshots.filter(
(screenshot) => screenshot.playerName === gamertag
);
// Clear the existing content of the gallery grid
galleryGrid.innerHTML = '';
if (filteredScreenshots.length === 0) {
// No screenshots available for the gamertag
const noScreenshotsMessage = document.createElement("p");
noScreenshotsMessage.textContent = "No screenshots available for this gamertag.";
galleryGrid.appendChild(noScreenshotsMessage);
} else {
// Loop through the filtered screenshots and create the corresponding divs
filteredScreenshots.forEach((screenshot) => {
const screenshotDiv = document.createElement("div");
screenshotDiv.classList.add("SS");
screenshotDiv.setAttribute("style", `border-radius: 12px; background-image: url('${screenshot.imageUrl}'); width: 47%; height: 300px; background-position: center center;`);
const creditParagraph = document.createElement("p");
creditParagraph.classList.add("credit");
creditParagraph.textContent = screenshot.playerName;
screenshotDiv.appendChild(creditParagraph);
galleryGrid.appendChild(screenshotDiv);
});
}
})
.catch(error => {
console.error('Error:', error);
});
}
});
</script>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Get the necessary elements
var profilePicture = document.getElementById('search-main-profile-picture');
var profileUser = document.getElementById('search-main-profile-user');
var gamerscore = document.getElementById('searchgamerscore');
var gamesPlayed = document.getElementById('search-games-played');
// Get the gamertag from the current URL
var urlParams = new URLSearchParams(window.location.search);
var gamertag = urlParams.get('name');
// Set the gamertag in the profile user element
profileUser.textContent = gamertag;
// Construct the URL to fetch user data
var apiUrl = 'https://gamertag-info-search.tres3mincraft.repl.co/?username=' + encodeURIComponent(gamertag);
// Fetch user data from the API
fetch(apiUrl)
.then(response => response.json())
.then(data => {
// Set the data in the respective elements
gamerscore.textContent = data.gamerscore;
gamesPlayed.textContent = data.gamesPlayed;
profilePicture.src = data.profilePictureUrl;
})
.catch(error => {
console.error('Error:', error);
// Handle any errors that occurred during the fetch
});
});
</script>
<script src="login.js"></script>
</head>
<body style="height: 1050px;">
<script>
function rotateElement() {
var rotateElement = document.getElementById("profile-picture");
var popupanim = document.getElementById("popupContainer")
var currentTop = getComputedStyle(rotateElement).getPropertyValue("top");
if (currentTop === "200px") {
rotateElement.style.top = "10px";
rotateElement.style.transform = "";
popupanim.style.top = "-200px";
popupanim.style.opacity = 0;
} else {
rotateElement.style.top = "200px";
popupanim.style.top = "62px";
popupanim.style.opacity = 1;
rotateElement.style.transform = "rotate(360deg)";
}
}
</script>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Select the element you want to check for cursor clicks
const element = document.getElementById('popupContainer');
// Add an event listener to the document to check for clicks
document.addEventListener('click', function(event) {
// Check if the click target is outside the element
if (!element.contains(event.target)) {
// Get the bounding rectangle of the element
const rect = element.getBoundingClientRect();
// Check if the top level of the element is at 62px
if (rect.top === 62) {
// Call the rotateElement() function
rotateElement();
}
}
});
});
</script>
<div id="Loading" style="display: none; top: 0px;"><div id="loading-icon"></div></div>
<div class="navbar" id="nav">
<img onclick="window.location.replace('/');" class="Logo" width="38px" src="favicon.png" style="vertical-align: middle;" alt="⭐" />
<ul>
<li><a href="./#Home">Home</a></li>
<li><a href="./#About">About</a></li>
<li><a href="./#Features">Features</a></li>
<li><a href="./#Status">Status</a></li>
<li><a href="./#Gallery">Gallery</a></li>
<li><a href="./#Contact">Contact</a></li>
</ul>
<img onclick="rotateElement()" id="profile-picture" class="profile" width="40px" src="defaultprof.png" style="vertical-align: middle; top: 10px; rotate: 0deg;" alt="👤" />
</div>
<div id="popupContainer" style="top: -200px; opacity: 0;">
<button onclick="window.location.replace('/profile.html')" id="MyProfile">My Profile</button>
<button onclick="window.location.replace('https://login-widget.xsolla.com/latest/?projectId=8acf4777-fcd8-493f-9c77-f7e6563a4685&locale=en_US')" id="login-button">Login</button>
<button onclick="handleLogout()" id="logout-button" style="display: none;">Logout</button>
<p class="Gamertag" id="popup-username">Not signed in</p>
</div>
<div class="hero">
<div class="container">
<img id="search-main-profile-picture" width="48px" src="defaultprof.png" style="vertical-align: middle; border-radius: 24px; margin-top: 7px; margin-right: 12px; float: left;" alt="👤" />
<h1 style="margin: 0;" id="search-main-profile-user">N/A</h1>
<div style="flex: auto; display: inline-flex;">
<p><strong>Gamerscore:</strong></p><p style="margin-left: 5px;" id="searchgamerscore">N/A</p>
<p style="margin-left: 12px;"><strong>|</strong></p>
<p style="margin-left: 12px;"><strong>Games Played:</strong></p><p style="margin-left: 5px;" id="search-games-played">N/A</p>
</div>
</div>
</div>
<div class="section gallery-section">
<div class="container" id="About">
<h2>My Screenshots</h2><h4>Screenshots this user sent in the Discord Server.</h4>
<div class="gallery-grid">
</div>
</div>
</div>
<div class="footer">
<div class="container">
<p>© 2023 StarfallMC. All rights reserved.</p>
</div>
</div>
</body>
</html>