diff --git a/README.md b/README.md index f409b439..5d5bd911 100644 --- a/README.md +++ b/README.md @@ -70,9 +70,10 @@ To set up and run the project on your local environment, navigate to the `client Many thanks to the following contributors who have helped shape this project: -| Avatar | Name | GitHub Profile | -| ----------------------------------------------------------------------------------------------------------- | ------------------- | ----------------------------------------- | -| Ross Hill | **Ross Hill** | [rosslh](https://github.com/rosslh) | -| Joseph Weissman | **Joseph Weissman** | [jweissman](https://github.com/jweissman) | +| Avatar | Name | GitHub Profile | +| ------------------------------------------------------------------------------------------------------------------ | ------------------------ | --------------------------------------------------------------------------- | +| Ross Hill | **Ross Hill** | [rosslh](https://github.com/rosslh) | +| Joseph Weissman | **Joseph Weissman** | [jweissman](https://github.com/jweissman) | +| Shubhankar Shandilya | **Shubhankar Shandilya** | [shubhankar-shandilya-india](https://github.com/shubhankar-shandilya-india) | Want to contribute? Check out the list of [open issues](https://github.com/rosslh/Mandelbrot.site/issues)! diff --git a/client/html/index.html b/client/html/index.html index 9eee1ccc..99a4912b 100644 --- a/client/html/index.html +++ b/client/html/index.html @@ -219,15 +219,9 @@

Hide/Show UI
- +
{ + shareButton.innerText = text; + }; + + shareButton.onclick = () => { + const url = `${window.location.host}?re=${config.re}&im=${config.im}&z=${config.zoom}&i=${config.iterations}&e=${config.exponent}&c=${config.colorScheme}&r=${config.reverseColors}`; + + navigator.clipboard.writeText(url).then(() => { + updateShareButtonText("Link copied!"); + setTimeout(() => updateShareButtonText("Share this view"), 3000); + }); + }; +} + function handleFullScreen() { const toggleFullScreen = () => { if (document.fullscreenElement) { @@ -328,6 +347,9 @@ function handleDom(map: MandelbrotMap) { }); handleHideShowUiButton(); + + handleShareButton(); + handleShortcutHints(); const toggleFullScreen = handleFullScreen(); @@ -344,7 +366,6 @@ const setConfigFromUrl = (map: MandelbrotMap) => { const exponent = queryParams.get("e"); const colorScheme = queryParams.get("c"); const reverseColors = queryParams.get("r"); - const sharing = queryParams.get("sharing"); if (re && im && zoom) { config.re = Number(re); @@ -371,16 +392,7 @@ const setConfigFromUrl = (map: MandelbrotMap) => { (document.getElementById("reverseColors") as HTMLInputElement).checked = config.reverseColors; } - - if (sharing) { - window.history.replaceState( - {}, - document.title, - window.location.href.replace("&sharing=true", "") - ); - } else { - window.history.replaceState({}, document.title, window.location.pathname); - } + window.history.replaceState({}, document.title, window.location.pathname); if ( config.re !== configDefaults.re &&