baileytownsend.dev / bootleg-stream-dot-place
A stream.place client in a single index.html
fork atom

very bad history management

baileytownsend.dev 3eaa3a6b 341deff0

+32 -7
unified split
+2 -1
README.md
··· 5 5 Public instance at: [https://bootleg.baileytownsend.dev](https://bootleg.baileytownsend.dev) 6 6 7 7 # Features 8 - - You can watch your favorite streamer on the atmosphere. If you know their handle that is.... 8 + - You can watch your favorite streamer on the atmosphere. 9 + - Shows everyone who is currently streaming 9 10 - It even shows the stream. with play/pause, mute, and volume controls. 10 11 - Loads chats in as well from stream.place's websocket. 11 12 - You can login via oauth thanks to [@atcute/oauth-browser-client](https://github.com/mary-ext/atcute/tree/trunk/packages/oauth/browser-client).
+30 -6
index.html
··· 1094 1094 let loggedInDid = null; 1095 1095 let loggedInHandle = null; 1096 1096 let currentStreamerDid = null; 1097 + let handlingPopstate = false; 1097 1098 1098 1099 // ---- DOM refs ---- 1099 1100 const video = document.getElementById("video"); ··· 1617 1618 //This is when the video is successfully loaded 1618 1619 videoLoadedAt = new Date(); 1619 1620 1620 - window.history.pushState( 1621 - {}, 1622 - "", 1623 - `/${streamersHandle}`, 1624 - ); 1621 + if (!handlingPopstate) { 1622 + window.history.pushState( 1623 + {}, 1624 + "", 1625 + `/${streamersHandle}`, 1626 + ); 1627 + } 1625 1628 setStatus("Live", "live"); 1626 1629 startStats(); 1627 1630 } else if ( ··· 1698 1701 }); 1699 1702 } 1700 1703 1701 - function disconnect() { 1704 + function teardownStream() { 1702 1705 stopStats(); 1703 1706 disconnectChat(); 1704 1707 if (pc) { ··· 1712 1715 statusStats.textContent = ""; 1713 1716 connectBtn.style.display = ""; 1714 1717 disconnectBtn.style.display = "none"; 1718 + } 1719 + 1720 + function disconnect() { 1721 + teardownStream(); 1715 1722 log("Disconnected"); 1716 1723 window.history.pushState({}, "", "/"); 1717 1724 showBrowseView(); ··· 1901 1908 window.togglePlayPause = togglePlayPause; 1902 1909 window.toggleMute = toggleMute; 1903 1910 window.setVolume = setVolume; 1911 + 1912 + // ---- History navigation ---- 1913 + window.addEventListener("popstate", () => { 1914 + handlingPopstate = true; 1915 + const profile = getProfileFromUrl(); 1916 + if (profile) { 1917 + if (pc) teardownStream(); 1918 + browseView.classList.remove("visible"); 1919 + mainLayout.style.display = ""; 1920 + usernameInput.value = profile; 1921 + connect(); 1922 + } else { 1923 + if (pc) teardownStream(); 1924 + showBrowseView(); 1925 + } 1926 + handlingPopstate = false; 1927 + }); 1904 1928 1905 1929 // ---- Init ---- 1906 1930 updateAuthUI();