diff --git a/play.html b/play.html index 20e93ef..8698f59 100644 --- a/play.html +++ b/play.html @@ -268,6 +268,27 @@ width: 0%; } + /* Share buttons */ + .share-buttons { + margin-top: calc(var(--spacing-unit) * 2); + display: flex; + gap: calc(var(--spacing-unit) * 1.5); + flex-wrap: wrap; + } + + .share-buttons button { + flex: 1; + min-width: 120px; + background: var(--gb-darkest); + color: var(--gb-light); + border-color: var(--gb-medium); + } + + .share-buttons button:hover:not(:disabled) { + background: var(--gb-medium); + color: var(--gb-lightest); + } + /* CTA link (inside card) */ .cta-link-inline { margin-top: calc(var(--spacing-unit) * 2); @@ -372,6 +393,12 @@ + +
+ + +
+

Check: not on silent, volume up, Focus mode off. Then tap:

diff --git a/src/play.ts b/src/play.ts index 62c1104..202f780 100644 --- a/src/play.ts +++ b/src/play.ts @@ -142,6 +142,8 @@ async function main(): Promise { const timeRow = qs('playTimeRow') as HTMLElement; const iosAudioBanner = qs('iosAudioBanner') as HTMLElement; const enableAudioBtn = qs('enableAudioBtn') as HTMLButtonElement; + const copyLinkBtn = qs('copyLinkBtn') as HTMLButtonElement; + const shareToXBtn = qs('shareToXBtn') as HTMLButtonElement; // Detect iOS/Safari for audio unlock banner const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent) || @@ -168,6 +170,41 @@ async function main(): Promise { } }); + // Copy link handler + copyLinkBtn.addEventListener('click', async () => { + const shareUrl = window.location.href; + try { + if (navigator.clipboard?.writeText) { + await navigator.clipboard.writeText(shareUrl); + } else { + const ta = document.createElement('textarea'); + ta.value = shareUrl; + ta.style.position = 'fixed'; + ta.style.left = '-9999px'; + document.body.appendChild(ta); + ta.focus(); + ta.select(); + document.execCommand('copy'); + document.body.removeChild(ta); + } + const orig = copyLinkBtn.textContent; + copyLinkBtn.textContent = 'Copied!'; + setTimeout(() => { copyLinkBtn.textContent = orig; }, 1500); + } catch { + // ignore + } + }); + + // Share to X handler + shareToXBtn.addEventListener('click', () => { + const shareUrl = window.location.href; + const { title: rawTitle } = buildMidiUrlFromParams(); + const niceTitle = pickShareTitle(rawTitle).title; + const tweetText = `I made a Game Boy version of ${niceTitle}\n\nUsing @b1rdmania's Wario Synthesis Midi Engine\n\nCheck it out here`; + const twitterUrl = `https://twitter.com/intent/tweet?text=${encodeURIComponent(tweetText)}&url=${encodeURIComponent(shareUrl)}`; + window.open(twitterUrl, '_blank'); + }); + const { midiUrl: u, title } = buildMidiUrlFromParams(); const picked = pickShareTitle(title);