A few months ago I tried vibe coding an ant colony simulator, but in the end it didn’t work out. I did mention that I had had successes in vibe coding, and lately I had one of those again.

For my previous post I needed to embed several YouTube videos. That, however, is very cumbersome when you’re blogging with your phone, as the mobile version of YouTube does not have the option to easily just copy the embed code, unlike the desktop version, so it was about to turn into an exercise in frustration.

But lo and behold, ChatGPT to the rescue. I gave it this prompt:

Hello! I need a Javascript application to convert a plain YouTube link into an embedded video link. Normally you could right-click a video and choose to copy the embed code, but that’s not available on mobile. For example, if I have this link in my clipboard: https://youtu.be/hTHpEF_jcu4?si=PNKTn873G7bk_gWj

Then the page should copy this code into the clipboard instead:

<iframe width="640" height="360" src="https://www.youtube.com/embed/hTHpEF_jcu4" title="Ant Simulator, a fresh new version" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

Note that the YouTube link may or may not have the share id parameter. Also, as implied this thing should be optimized for mobile user experience, and I should be able to host it as a single gist on GitHub.

And just like that it spat me out a perfectly functional app to do just that! I did another iteration where I asked it to clear the input field after each entry, and it added that too. Great success. 💪

You can find the final source code here and a working, running version of the script here. Maybe you’ll find it useful as well.