Sharing mechanism update: Removed old URL params and added copy to clipboard functionality (Issue #20)

[shubhankar-shandilya-india]

Summary

This PR fixes Issue #20. It updates the sharing functionality in the project by removing the old URL query parameter method and implementing a new clipboard-based sharing feature. Changes are made across main.ts, MandelbrotMap.ts, and index.html.

Changes Made

main.ts

• Removed Sharing Query Parameters: Eliminated code related to appending query parameters to the shareable URL.
• Updated Share Button Functionality:
  • Selected Share Button: Retrieved the "Share" button element by its ID.
  • Text Update Function: Defined a function to update the button’s text.
  • Button OnClick Event: Configured an onclick event to copy the current URL to the clipboard.
  • Revert Text: Implemented a setTimeout to revert the button text to its original state after 5 seconds.

MandelbrotMap.ts

• Removed Code: Deleted lines that were responsible for updating the href attribute of an anchor element with query parameters. This was no longer necessary due to the shift to clipboard-based sharing.

index.html

• Removed Old Share Link: Deleted the previous anchor tag used for sharing URLs with query parameters, as it’s no longer needed.
• Added New Share Button: Introduced a new button element with the ID share-button to facilitate the new URL copying functionality.

Impact

• Streamlined Sharing Experience: The new button-based method simplifies user interaction by copying the current URL directly to the clipboard.

Testing

• Confirmed that the new share button is correctly displayed and functions as expected by copying the page URL to the clipboard.
• It successfully passed the tests from command npm run test

[rosslh]

Nice work Shubhankar! This is almost perfect, just one issue:

The goal of the share functionality is to allow users to share their current location in the Mandelbrot set. For example, I zoomed in and clicked share on Mandelbrot.site and it gave me this link. Notice that when you click that link, it doesn't bring you to the default/starting position, it brings you to a zoomed in region of the Mandelbrot set. It also sets other properties like the color scheme and iterations.

I've left some comments in the code explaining what needs to be updated. This is very close though!

[rosslh]

Works like a charm Shubhankar! Awesome job 👏

I'm going to add you to the contributors section of the readme when I merge this. Just let me know if you don't want to be in that list and I can remove you.

Thanks again for your contribution!!