new (class Home {
    constructor() {
        window.addEventListener('scroll', this.handleScroll)
    }
    handleScroll = (event) => {
        let timeline = document.getElementById('scrolling-timeline')
        if(timeline) {
            let timelineWidth = timeline.clientWidth
            let browserWidth = window.innerWidth

            let y = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
            let multiplier = timelineWidth / browserWidth

            if(browserWidth > 1920) {
            multiplier = multiplier * 1.5
            } else if (browserWidth > 1200) {
            multiplier *= 1.2
            }

            let pixelsPerPercent = timelineWidth / 100
            let leftPercent = parseInt((y / pixelsPerPercent) * multiplier)
            timeline.style.left = (100 - leftPercent) + '%'
        }
    }
})()

new (class ReplayTube {
    constructor() {
        this.mUniqueId = 'replay-player-' + Math.floor(Math.random() * Math.floor(10000));
        this.mVideoId = 'XCUZSS54drI';
        this.mWatchCount = 0;
        this.mPlayer = null;

        document.addEventListener("DOMContentLoaded", () => {
            $(document).on("click", "#keep-replaying-btn", () => {
                this.keepReplaying();
            });
        })
    }
    loadVideo = () => {
        this.mPlayer = new window.YT.Player(this.mUniqueId, {
            height: "390",
            width: '640',
            videoId: this.mVideoId,
            events: {
                'onReady': (event) => {
                    if (!(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))) {
                        event.target.playVideo()
                    }
                },
                'onStateChange': (event) => {
                    if (event.data === window.YT.PlayerState.ENDED) {
                        this.mPlayer.playVideo()
                        this.addCount()
                    } else if (this.mWatchCount === 0 && event.data === window.YT.PlayerState.PLAYING) {
                        this.addCount()
                    }
                }
            }
        })
    }
    keepReplaying() {
        let started = $('#' + this.mUniqueId).length
        if(!started) {
            $('#video-injector').attr('id', this.mUniqueId)
        }
        this.addCount(true)

        let input = document.querySelector('#youtube-url').value
        if(input === '') {
            input = 'https://www.youtube.com/watch?v=XCUZSS54drI';
        }
        let re = new RegExp('youtu(?:.be|be.com)/(?:.*v(?:/|=)|(?:.*/)?)([a-zA-Z0-9-_]+)');
        let test = input.match(re);
        if (test && test.length === 2) {
            if (started) {
                this.mPlayer.loadVideoById(test[1])
            } else {
                this.mVideoId = test[1];
        
                if (!window.YT) {
                    let tag = document.createElement('script')
                    tag.src = "https://www.youtube.com/iframe_api"
                    window.onYouTubeIframeAPIReady = this.loadVideo;
                
                    const firstScriptTag = document.getElementsByTagName('script')[0];
                    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
                } else {
                    this.loadVideo()
                }
            }
        }
    }
    addCount(reset) {
        if(reset === true) {
            this.mWatchCount = 0
        }
        this.mWatchCount += 1
        $('#watch-count').html(this.mWatchCount)
    }
})()

new (class RowsToArray {
    constructor() {
        document.addEventListener("DOMContentLoaded", () => {
            $(document).on("click", "#rows-to-array-btn", () => {
                this.transformRows()
            });
        })
    }
    transformRows = () => {
        let input = document.querySelector('#rows-to-array-input').value
        let result = input.split("\n")
        let quoteType = document.querySelector('input[name="rows-to-array-quotes"]:checked').value
        let quoteString = ""
        if(quoteType === "single") {
            quoteString = "'"
        } else if(quoteType === "double") {
            quoteString = '"'
        }
        result = result.filter(x => x !== '').map(x => quoteString + x + quoteString)
        document.querySelector('#rows-to-array-output').value = result.join(", ")
    }
})()