That is ridiculous amount of javascript within an html attribute. Do all major editors/IDE have proper Alpine plugins in order to highlight autocomplete js code within those html attributes?
document.addEventListener('alpine:init', () => { Alpine.data('video', () => ({ 'show_video': false, ...
That way there's code highlighting and syntax checking for JS.
I definitely go this route for Alpine about half the time.
PyCharm doesn't seem to have one (I hope I'm wrong). That being said, it is possible to put the code into a proper <script> block. I personally only a trivial amount of code in html attributes such as checking a boolean value with `x-show`.