Skip to content

Commit 9a3400a

Browse files
josef-stipsjosef-stips
committed
bug fixes , more responsive design
1 parent 9eeee5e commit 9a3400a

File tree

9 files changed

+148
-115
lines changed

9 files changed

+148
-115
lines changed

‎src/script/public/App/UserPopUp.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,9 @@ const TryToCloseUserInfoPopUp = () => {
175175

176176
if (getComputedStyle(clan_overview_pop_up).display == "flex" ||
177177
getComputedStyle(comments_pop_up).display == "flex" ||
178-
getComputedStyle(scoreboard_pop_up).display == "flex") {
178+
getComputedStyle(scoreboard_pop_up).display == "flex" ||
179+
getComputedStyle(SearchPlayerPopUp).display == "flex" ||
180+
getComputedStyle(FriendsListPopUp).display == "flex") {
179181

180182
DarkLayer.style.display = "block";
181183

‎src/script/public/App/features/OnlineSocialUser.js

Lines changed: 31 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -50,24 +50,19 @@ const RequestPlayer = () => {
5050
};
5151

5252
// Player clicks on other player when he searched him or he is in his lobby f.e
53-
const ClickedOnPlayerInfo = (player_name, player_id, player_icon, playerInfoClass, playerInfoColor, quote, onlineGamesWon, XP, currentUsedSkin, last_connection, commonPattern, allData) => {
54-
// console.log(allData);
55-
56-
if (allData) {
57-
player_name = !allData["player_name"] ? "no name" : allData["player_name"];
58-
player_id = allData["player_id"];
59-
player_icon = !allData["player_icon"] ? "X" : allData["player_icon"];
60-
playerInfoClass = !allData["playerInfoClass"] ? "empty" : allData["playerInfoClass"];
61-
playerInfoColor = allData["playerInfoColor"];
62-
quote = allData["quote"];
63-
onlineGamesWon = allData["onlineGamesWon"];
64-
XP = allData["XP"];
65-
currentUsedSkin = allData["currentUsedSkin"];
66-
last_connection = allData["last_connection"];
67-
commonPattern = allData["commonPattern"];
68-
};
69-
70-
let isInClan = allData["isInClan"];
53+
const ClickedOnPlayerInfo = (allData) => {
54+
let player_name = !allData["player_name"] ? "no name" : allData["player_name"];
55+
let player_id = allData["player_id"];
56+
let player_icon = !allData["player_icon"] ? "X" : allData["player_icon"];
57+
let playerInfoClass = !allData["playerInfoClass"] ? "empty" : allData["playerInfoClass"];
58+
let playerInfoColor = allData["playerInfoColor"];
59+
let quote = allData["quote"];
60+
let onlineGamesWon = allData["onlineGamesWon"];
61+
let XP = allData["XP"];
62+
let currentUsedSkin = allData["currentUsedSkin"];
63+
let last_connection = allData["last_connection"];
64+
let commonPattern = allData["commonPattern"];
65+
let clan_data = allData["clan_data"];
7166

7267
console.log(allData);
7368

@@ -98,7 +93,7 @@ const ClickedOnPlayerInfo = (player_name, player_id, player_icon, playerInfoClas
9893
};
9994

10095
DisplayPopUp_PopAnimation(userInfoPopUp, "flex", true);
101-
userInfoPopUp.style.zIndex = "10005";
96+
// userInfoPopUp.style.zIndex = "10005";
10297

10398
UserID_OfCurrentVisitedProfile = player_id;
10499
UserName_OfCurrentVisitedProfile = player_name;
@@ -147,7 +142,7 @@ const ClickedOnPlayerInfo = (player_name, player_id, player_icon, playerInfoClas
147142
userInfo_MostUsedPattern.textContent = !commonPattern ? "-" : commonPattern;
148143

149144
// clan data
150-
userInfoClanDisplay(isInClan);
145+
userInfoClanDisplay(clan_data["clan_id"]);
151146
};
152147

153148
async function userInfoClanDisplay(isInClan) { // isInClan : id int
@@ -175,6 +170,7 @@ async function userInfoClanDisplay(isInClan) { // isInClan : id int
175170
if (clan_data) {
176171
social_scene.clan_handler.item_click(clan_data);
177172
social_scene.clan_handler.clan_pop_up_opened_in_pop_up = true;
173+
clan_overview_pop_up.style.zIndex = "10010";
178174

179175
} else {
180176
AlertText.textContent = "Something went wrong!";
@@ -206,7 +202,8 @@ const DisplayPlayerList = result => { // result: array containing objects
206202
div.id = player_id;
207203

208204
div.addEventListener('click', function anonymous() {
209-
ClickedOnPlayerInfo(player_name, player_id, player_icon, playerInfoClass, playerInfoColor, quote, onlineGamesWon, XP, currentUsedSkin, last_connection, commonPattern);
205+
userInfoPopUp.style.zIndex = "10009";
206+
ClickedOnPlayerInfo(player);
210207
});
211208

212209
let span1 = document.createElement("span"); // name of searched player
@@ -248,6 +245,13 @@ SearchBar_searchIcon.addEventListener('click', () => {
248245
closeSearchPlayer_Btn.addEventListener('click', () => {
249246
SearchPlayerPopUp.style.display = "none";
250247

248+
if (getComputedStyle(userInfoPopUp).display != "none") {
249+
DarkLayer.style.display = "flex";
250+
251+
} else {
252+
DarkLayer.style.display = "none";
253+
};
254+
251255
closePlayerSearch();
252256
});
253257

@@ -269,6 +273,10 @@ SearchBar_placeholderText.addEventListener('mousedrag', e => {
269273

270274
closeFriendsList_Btn.addEventListener("click", () => {
271275
FriendsListPopUp.style.display = "none";
276+
277+
if (getComputedStyle(userInfoPopUp).display == "none") {
278+
DarkLayer.style.display = "none";
279+
};
272280
});
273281

274282
// Generate friends list with data from database
@@ -318,7 +326,8 @@ const GenerateFriendsList = async(FriendsList) => { // looks like this: id = [Fr
318326

319327

320328
MainWrapper.addEventListener("click", () => {
321-
ClickedOnPlayerInfo(player_name, player_id, player_icon, playerInfoClass, playerInfoColor, quote, onlineGamesWon, XP, currentUsedSkin, last_connection, commonPattern);
329+
userInfoPopUp.style.zIndex = "10009";
330+
ClickedOnPlayerInfo(player);
322331
});
323332

324333
MainWrapper.appendChild(NameDiv);
@@ -602,10 +611,8 @@ const InitPos_OfNotificationText = () => {
602611
setTimeout(() => {
603612
let PositionOfUserInfoBtn = headerUserBtn.getBoundingClientRect();
604613

605-
NotiOnUserInfoBtn.style.inset = `${PositionOfUserInfoBtn.top + 25}px ${PositionOfUserInfoBtn.right}px ${PositionOfUserInfoBtn.bottom}px ${PositionOfUserInfoBtn.left}px`;
606614
GetMessageBtn_notificationText_Display.style.right = "0";
607615
GetMessageBtn_notificationText_Display.style.top = "0";
608-
GetMessageBtn_notificationText_Display.style.margin = "0 49px 10px 0";
609616
}, 1000);
610617
};
611618

‎src/script/public/App/scripts/functions.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -264,4 +264,8 @@ const roll_animation = (item, class_item) => {
264264

265265
function easeOutSine(x) {
266266
return Math.sin((x * Math.PI) / 2);
267+
};
268+
269+
function close_all_scenes() {
270+
[...lobbyMainSec.children].forEach(scene => scene.style.display = "none");
267271
};

‎src/script/public/App/social_stuff/clan.js

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -242,8 +242,17 @@ class clan_chat_pop_up_class {
242242
if (newClan.current_clan_all_data["chat"]) {
243243

244244
for (const message of newClan.current_clan_all_data["chat"]) {
245-
let author_role = newClan.current_clan_all_data["members"][message["from"]]["role"];
246-
let author_name = newClan.current_clan_all_data["members"][message["from"]]["name"];
245+
let author_role;
246+
let author_name;
247+
248+
if (newClan.current_clan_all_data["members"][message["from"]]) {
249+
author_role = newClan.current_clan_all_data["members"][message["from"]]["role"];
250+
author_name = newClan.current_clan_all_data["members"][message["from"]]["name"];
251+
252+
} else {
253+
author_role = newClan.current_clan_all_data["previous_members"][message["from"]]["role"];
254+
author_name = newClan.current_clan_all_data["previous_members"][message["from"]]["name"];
255+
};
247256

248257
this.new_message(message["message"], author_name, message["from"], author_role, message["date"]);
249258
};
@@ -279,9 +288,7 @@ class clan_chat_pop_up_class {
279288

280289
try {
281290
await socket.emit("GetDataByID", player_id, player_data => {
282-
ClickedOnPlayerInfo(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined,
283-
undefined, undefined, player_data
284-
);
291+
ClickedOnPlayerInfo(player_data);
285292
});
286293

287294
} catch (error) {

‎src/script/public/App/social_stuff/online_level_overview.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ class onlineLevelOverviewHandler {
7474
OpenOwnUserProfile();
7575

7676
} else {
77-
ClickedOnPlayerInfo(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, this.author);
77+
ClickedOnPlayerInfo(this.author);
7878
};
7979
});
8080
};
@@ -328,7 +328,7 @@ class level_comments_handler {
328328
return;
329329

330330
} else {
331-
ClickedOnPlayerInfo(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, cb);
331+
ClickedOnPlayerInfo(cb);
332332
};
333333
});
334334

@@ -586,7 +586,7 @@ class OnlineLevelPlayerScoreBoardHandler {
586586
OpenOwnUserProfile();
587587

588588
} else {
589-
ClickedOnPlayerInfo(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, player_data);
589+
ClickedOnPlayerInfo(player_data);
590590
};
591591
});
592592

‎src/script/public/App/social_stuff/social_scene.js

Lines changed: 39 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -82,11 +82,13 @@ class social_scene_class {
8282

8383
clan_pop_up_close_btn.addEventListener("click", () => {
8484
clan_overview_pop_up.style.display = "none";
85+
clan_overview_pop_up.style.zIndex = "10005";
8586

8687
console.log(this.clan_handler.clan_pop_up_opened_in_pop_up);
8788

8889
if (this.clan_handler.clan_pop_up_opened_in_pop_up &&
89-
getComputedStyle(userInfoPopUp).display != "none"
90+
getComputedStyle(userInfoPopUp).display != "none" ||
91+
getComputedStyle(FriendsListPopUp).display != "none"
9092
) {
9193
DarkLayer.style.display = "flex";
9294

@@ -110,12 +112,13 @@ class social_scene_class {
110112

111113
OpenedPopUp_WhereAlertPopUpNeeded = false;
112114
AlertText.textContent = "You successfully left the clan.";
113-
DisplayPopUp_PopAnimation(alertPopUp, "flex", true);
114115
clan_overview_pop_up.style.display = "none";
115116
userInfoPopUp.style.display = "none";
116117

117118
if (getComputedStyle(clan_chat_pop_up).display == "flex") {
118-
DarkLayerAnimation(gameModeCards_Div, clan_chat_pop_up);
119+
DarkLayerAnimation(gameModeCards_Div, clan_chat_pop_up).then(() => {
120+
DisplayPopUp_PopAnimation(alertPopUp, "flex", true);
121+
});
119122
sceneMode.default();
120123
};
121124

@@ -136,15 +139,24 @@ class social_scene_class {
136139
newClan.current_clan_data["clan_id"] != newClan.current_selected_clan_id) {
137140

138141
try {
139-
socket.emit("join_clan", localStorage.getItem("PlayerID"), cb => {
142+
socket.emit("join_clan", localStorage.getItem("PlayerID"),
143+
newClan.current_selected_clan_id, async cb => {
140144

141-
if (cb) {
145+
if (cb) {
146+
// update data in local storage
147+
await newClan.update_data(cb);
142148

143-
AlertText.textContent = "You successfully joined the clan!";
144-
DisplayPopUp_PopAnimation(alertPopUp, "flex", true);
145-
clan_overview_pop_up.style.display = "none";
146-
};
147-
});
149+
OpenedPopUp_WhereAlertPopUpNeeded = false;
150+
AlertText.textContent = "You successfully joined the clan!";
151+
clan_overview_pop_up.style.display = "none";
152+
userInfoPopUp.style.display = "none";
153+
154+
close_all_scenes();
155+
sceneMode.full();
156+
DarkLayerAnimation(clan_chat_pop_up, clan_search_pop_up).then(DisplayPopUp_PopAnimation(alertPopUp, "flex", true))
157+
158+
};
159+
});
148160

149161
} catch (error) {
150162
AlertText.textContent = "Something went wrong...";
@@ -266,7 +278,13 @@ class clan_handler {
266278
try {
267279
console.log(data);
268280

269-
this.self_role = data["members"][Number(localStorage.getItem("PlayerID"))]["role"];
281+
if (data["members"][Number(localStorage.getItem("PlayerID"))]) {
282+
283+
this.self_role = data["members"][Number(localStorage.getItem("PlayerID"))]["role"];
284+
285+
} else {
286+
this.self_role = null;
287+
};
270288

271289
// click event on admin name
272290
this.admin_name_click(data);
@@ -360,23 +378,13 @@ class clan_handler {
360378
};
361379

362380
member_click(data) {
381+
userInfoPopUp.style.zIndex = "10011";
382+
363383
if (Number(localStorage.getItem("PlayerID")) == data["player_id"]) {
364384
OpenOwnUserProfile();
365385

366386
} else {
367-
ClickedOnPlayerInfo(
368-
data["player_name"],
369-
data["player_id"],
370-
data["player_icon"],
371-
data["playerInfoClass"],
372-
data["playerInfoColor"],
373-
data["quote"],
374-
data["onlineGamesWon"],
375-
data["XP"],
376-
data["currentUsedSkin"],
377-
data["last_connection"],
378-
data["commonPattern"]
379-
);
387+
ClickedOnPlayerInfo(data);
380388
};
381389
};
382390

@@ -421,25 +429,13 @@ class clan_handler {
421429
clan_admin_name.removeEventListener("click", clan_admin_name.event);
422430

423431
clan_admin_name.addEventListener("click", clan_admin_name.event = () => {
424-
userInfoPopUp.style.zIndex = "10009";
432+
userInfoPopUp.style.zIndex = "10011";
425433

426434
if (Number(localStorage.getItem("PlayerID")) == cb["player_id"]) {
427435
OpenOwnUserProfile();
428436

429437
} else {
430-
ClickedOnPlayerInfo(
431-
cb["player_name"],
432-
cb["player_id"],
433-
cb["player_icon"],
434-
cb["playerInfoClass"],
435-
cb["playerInfoColor"],
436-
cb["quote"],
437-
cb["onlineGamesWon"],
438-
cb["XP"],
439-
cb["currentUsedSkin"],
440-
cb["last_connection"],
441-
cb["commonPattern"]
442-
);
438+
ClickedOnPlayerInfo(cb);
443439
};
444440
});
445441
});
@@ -526,6 +522,9 @@ class clan_handler {
526522
this.role_btns_display(kick_btn, promote_btn, "none", "none");
527523
};
528524
break;
525+
526+
case null:
527+
this.role_btns_display(kick_btn, promote_btn, "none", "none");
529528
};
530529
};
531530

@@ -853,7 +852,7 @@ class player_levels_handler_wrapper extends NewLevel {
853852

854853
DarkLayer.style.display = "block";
855854
if (player_id != localStorage.getItem("PlayerID")) { // User clicks on other players profile
856-
ClickedOnPlayerInfo(player_name, player_id, player_icon, playerInfoClass, playerInfoColor, quote, onlineGamesWon, XP, currentUsedSkin, last_connection);
855+
ClickedOnPlayerInfo(player);
857856

858857
} else { // User clicks on his own profile
859858
OpenOwnUserProfile();
@@ -965,7 +964,7 @@ class recentPlayersHandler {
965964
OpenOwnUserProfile();
966965

967966
} else {
968-
ClickedOnPlayerInfo(undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, player_data);
967+
ClickedOnPlayerInfo(player_data);
969968
};
970969
});
971970

‎src/script/public/Game/CreateGame.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -425,7 +425,7 @@ class NewLevel {
425425
PlayerNameP.addEventListener("click", () => {
426426
DarkLayer.style.display = "block";
427427
if (player_id != localStorage.getItem("PlayerID")) { // User clicks on other players profile
428-
ClickedOnPlayerInfo(player_name, player_id, player_icon, playerInfoClass, playerInfoColor, quote, onlineGamesWon, XP, currentUsedSkin, last_connection);
428+
ClickedOnPlayerInfo(player);
429429

430430
} else { // User clicks on his own profile
431431
OpenOwnUserProfile();

0 commit comments

Comments
 (0)