mirror of
https://github.com/AndrioCelos/TableturfBattleApp.git
synced 2026-07-18 16:21:24 -05:00
Add a share button to the lobby page
This commit is contained in:
parent
632e53e7b3
commit
39accc6957
|
|
@ -8,7 +8,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="noJSSection">This application requires JavaScript.</div>
|
||||
<div id="loadingSection">Loading game data...</div>
|
||||
<div id="preGameSection" hidden>
|
||||
<p><img title="Tableturf Battle" alt="Tableturf Battle logo" id="logo" src="assets/logo.png"></p>
|
||||
<h1>Tableturf Battle</h1>
|
||||
|
|
@ -21,7 +20,7 @@
|
|||
</footer>
|
||||
</div>
|
||||
<div id="lobbySection" hidden>
|
||||
<p>Waiting for players to join.</p>
|
||||
<p>Other players can join using a link to this page. <button type="button" id="shareLinkButton">Share link</button></p>
|
||||
<ul id="playerList"></ul>
|
||||
</div>
|
||||
<div id="deckSection" hidden>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,25 @@
|
|||
let cardButtons: CardButton[] = [ ];
|
||||
let shareLinkButton = document.getElementById('shareLinkButton') as HTMLButtonElement;
|
||||
let submitDeckButton = document.getElementById('submitDeckButton') as HTMLButtonElement;
|
||||
let lobbyShareData: ShareData | null;
|
||||
|
||||
function initLobbyPage(url: string) {
|
||||
lobbyShareData = { url: url, title: 'Tableturf Battle' };
|
||||
if (navigator.canShare && navigator.canShare(lobbyShareData)) {
|
||||
shareLinkButton.innerText = 'Share link';
|
||||
} else {
|
||||
lobbyShareData = null;
|
||||
shareLinkButton.innerText = 'Copy link';
|
||||
}
|
||||
}
|
||||
|
||||
shareLinkButton.addEventListener('click', () => {
|
||||
if (lobbyShareData != null) {
|
||||
navigator.share(lobbyShareData);
|
||||
} else {
|
||||
navigator.clipboard.writeText(window.location.toString()).then(() => shareLinkButton.innerText = 'Copied');
|
||||
}
|
||||
});
|
||||
|
||||
function clearReady() {
|
||||
if (currentGame == null) return;
|
||||
|
|
|
|||
|
|
@ -60,6 +60,7 @@ function tryJoinGame(name: string, idOrUrl: string) {
|
|||
function getGameInfo(gameID: string, myPlayerIndex: number | null) {
|
||||
board.playerIndex = myPlayerIndex;
|
||||
window.location.hash = `#${gameID}`;
|
||||
initLobbyPage(window.location.toString());
|
||||
|
||||
const webSocket = new WebSocket(`${config.apiBaseUrl.replace(/(http)(s)?\:\/\//, 'ws$2://')}/websocket?gameID=${gameID}&clientToken=${clientToken}`);
|
||||
webSocket.addEventListener('open', e => {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ function delay(ms: number) { return new Promise(resolve => setTimeout(() => reso
|
|||
|
||||
// Sections
|
||||
const sections = new Map<string, HTMLDivElement>();
|
||||
for (var id of [ 'noJS', 'loading', 'preGame', 'lobby', 'deck', 'game' ]) {
|
||||
for (var id of [ 'noJS', 'preGame', 'lobby', 'deck', 'game' ]) {
|
||||
let el = document.getElementById(`${id}Section`) as HTMLDivElement;
|
||||
if (!el) throw new EvalError(`Element not found: ${id}Section`);
|
||||
sections.set(id, el);
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user