My html chat is not appearing when its supposed to


#1

so once you create a game the chat is supposed to still be in the bottom corner but as u can see if u go to this link and launch the program https://playcanvas.com/editor/scene/662886 it disappears when u create a game if anyone can shed light on the issue that would be helpful thanks


#3

Check the comments on ur game notes pls :slight_smile: i told u an idea there


#4

@koalastrikermi Ok so this may be what u are talking about?

  var chatwrapper = document.getElementById("chat-wrapper");
  var cmg = document.getElementById("chat-message");
  var chatform = document.getElementById("chat-form");
  var msgs = document.getElementById("messages");
  var chatwrapper2 = document.getElementById("chat-wrapper2");
  var cmg2 = document.getElementById("chat-message2");
  var chatform2 = document.getElementById("chat-form2");
  var msgs2 = document.getElementById("messages2");
  var closec = document.getElementById("close-chat-btn");
  var mainpg = document.getElementById("main-page");
  var lboards = document.getElementById("l-table-b");
  var g_list = document.getElementById("g-table-b");
  var game_create_btn = document.getElementById("create-game-btn");
  var game_join_btn = document.getElementById("join-game-btn");
  var frame = 0;
  var frame2 = 1;

from what i can see u would have to completely make ur own chat instead of socket because it seems to only hold in the login page ill look at it some more though (I forked it from u to edit anything i find and see what can be done_


#5

Ok thanks
Yes but as u can see I made two html files and one just has the chat the other has both chat and other html like login ++
So whats sopposed to happen is for when u make a new game the login html is sopposed to be gone and the chat html is sopposed to appear but it doesn’t


#6

You set the div container that has all the chat and other elements to display: none when the create game button is pressed.

  game_create_btn.addEventListener("click", function (e) {
    e.preventDefault();
    cam2.enabled = true;
    player.enabled = true;
    LoginRegister.key = username;
    //socket.emit ('initialize',username);
    //document.body.style.display = "none";
    chatdiv.style.display = "inline-block";
    chatwrapper.style.display = 'inline';
    div.style.display = "none"; // This line
    sg.emit("new game", {
      type: "free for all",
      creator: username,
      map: "courtyard",
      playernum: 1
    });
  });

#7

Is this what you were expecting to see?

image

If so, you need to change the CSS of chat-wrapper2 to include position: absolute;


#8

Yes and u got this from khanacademy @koalastrikermi I havent seen this yet :slight_smile:I am interested


#9

Yeah so what was happening was I hid all but the chat and that didn’t work because I couldn’t click on anything but the chat so I tried hiding it all and having a different chat html but it wasn’t showing up at all
But then I was thinking it was the fact that I was using the same html so I changed it and forgot to style it but it didn’t get rid of the loading screen and load the messages like it was supposed to


#10

Yes I actually made the original html for the chat on Khan


#11

What I see when I look I see this I don’t even see the chat like that


#12

Have you made the change that I suggested?


#13

Yeah now the whole page stays and new game room appears


#14

Is this what you are expecting to happen? https://playcanv.as/p/RUB7I61C/


#15

yes what did u change


#16

ok it appeared but now it wont update the messages and stays on the loading screen btw i switched the html back to chat-wrapper so that had same css


#17

See previous post
202020


#18

@koalastrikermi When u type in chat ingame and press enter it refreshes the game… take a look


#19

Yeah idk how to fix it cause I added an event listener andrevented the default


#20

Yeah I posted before I saw that thx


#21

so as to not open extra post id like to ask if u can also help make the second chat work as now it is not loading messages and reloading the page on send