/*
 * Copyright (C) 2016-2020 phantombot.github.io/PhantomBot
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 *
 * @author ScaniaTV
 */

/*
 * Main player functions and listeners.
 *
 * Every global functions should be added under the "player" object.
 * The iframe API from YouTube can be accessed from "player.API".
 * Basic information about the current song can be access with "player.temp.song", "player.temp.title", and "player.temp.requester".
 * For more functions under the "player" object, take a look at the socket.js script.
 * You can also generate modals with jQuery, see util/helpers.js for more information.
 */
$(function() {
    var cluster = null,
        timer = null;

    /*
     * @function Loads the player page.
     *
     * @param {boolean} hasPlaylistData - If a playlist is loaded.
     */
    const openPlayer = hasPlaylistData => {
        $('.loader').fadeOut(6e2, () => {
            $(this).remove();
        });
        // Show the page.
        $('#main').fadeIn(5e2);

        if (!hasPlaylistData && player.hasAPIKey() && !player.secondConnection) {
            toastr.error('Failed to load a playlist with songs.');

            // Create a fake progress slider.
            player.progressSlider = $('#progress-slider').slider({
                'value': 0,
                'min': 0,
                'step': 0.1,
                'tooltip': 'hide',
                'selection': 'none'
            });

            // Error the to user.
            helpers.getErrorModal('Playlist Error', 'Failed to load a playlist with songs, please load a playlist.', () => {
                player.dbQuery('get_playlists', 'yt_playlists_registry', (results) => {
                    // Get the keys.
                    results = Object.keys(results);
                    const playlists = [];

                    for (let i = 0; i < results.length; i++) {
                        if (results[i].indexOf('ytPlaylist_') !== -1) {
                            playlists.push(results[i].substr(results[i].indexOf('_') + 1, results[i].length));
                        }
                    }

                    helpers.getPlaylistModal('Load Playlist', 'Playlist Name', 'Load', 'Playlist', playlists, () => {
                        let playlist = $('#playlist-load').find(':selected').text();

                        if (playlist === 'Select a playlist') {
                            toastr.error('Please select a valid playlist.');
                        } else {
                            if (playlist.length > 0) {
                                player.loadPlaylist(playlist);
                                toastr.success('Loading playlist: ' + playlist);

                                if (player.firstLoad === true) {
                                    player.ready();
                                }
                            }
                        }
                    }).modal('toggle');
                });
            }).modal('toggle');
        }
    };

    /*
     * Global function that is called once the socket is connected and that the YouTube iframe is loaded.
     */
    window.onYouTubeIframeAPIReady = () => {
        // Set a timer in case no songs load to send a error.
        timer = setTimeout(openPlayer, 5e3, false);

        // Set a var for the slider.
        player.canSlide = true;
        // Set a var for the first load.
        player.firstLoad = true;

        // Check if the player is disabled right away.
        player.dbQuery('get_module_status', 'modules', (data) => {
            if (data['./systems/youtubePlayer.js'] == 'false') {
                helpers.getErrorModal('Module Disabled', 'The YouTube player module is disabled, please go and enable it.', () => {
                    window.location.reload();
                }).modal('toggle');

                openPlayer(true);
                clearTimeout(timer);
            }
        });

        // Add a listener to load the main playlist.
        player.addListener('playlist', (e) => {
            let table = [],
                playlist = e.playlist;

            // Set the playlist name.
            $('#playlist-name').html('(' + e.playlistname + ')');

            // Table header.
            table.push(($('<tr>').append($('<th/>', {
                'style': 'width: 5%;',
                'html': '#'
            })).append($('<th/>', {
                'style': 'width: 70%;',
                'html': 'Song'
            })).append($('<th/>', {
                'style': 'width: 15%;',
                'html': 'Duration'
            })).append($('<th/>', {
                'style': 'width: 10%; text-align: right; padding-right: 16px;',
                'html': 'Actions'
            }))).html());

            for (let i = 0; i < playlist.length; i++) {
                let row = $('<tr/>');

                // Add position.
                row.append($('<td/>', {
                    'text': i,
                    'style': 'width: 5%;'
                }));

                // Add song name.
                row.append($('<td/>', {
                    'text': playlist[i].title,
                    'style': 'width: 70%;'
                }));

                // Add duration.
                row.append($('<td/>', {
                    'text': playlist[i].duration,
                    'style': 'width: 15%;'
                }));

                // Add buttons.
                row.append($('<td/>', {
                    'html': $('<div/>', {
                        'class': 'btn-group btn-group-justified header-button'
                    }).append($('<button/>', {
                        'type': 'button',
                        'class': 'btn btn-secondary btn-sm',
                        'data-toggle': 'tooltip',
                        'title': 'Play song',
                        'data-song': playlist[i].song,
                        'data-song-play': 'on',
                        'html': $('<i/>', {
                            'class': 'fas fa-play'
                        })
                    })).append($('<button/>', {
                        'type': 'button',
                        'class': 'btn btn-secondary btn-sm',
                        'data-toggle': 'tooltip',
                        'title': 'Delete song',
                        'data-song': playlist[i].song,
                        'data-song-remove': 'on',
                        'html': $('<i/>', {
                            'class': 'fas fa-trash'
                        })
                    })),
                    'style': 'width: 10%;'
                }));

                // Append the row.
                table.push(row[0].outerHTML);
            }

            // Render the data.
            if (cluster !== null) {
                cluster.update(table);
            } else {
                cluster = new Clusterize({
                    rows: table,
                    scrollId: 'playlist-table-id',
                    contentId: 'playlist-content',
                    callbacks: {
                        clusterChanged: () => {
                            // Remove old events and register new ones.
                            $('[data-song-play="on"]').off().on('click', (e) => {
                                // Play the song.
                                player.updateSong($(e.currentTarget).data('song'));
                                // Hide the tooltip.
                                $(e.currentTarget).tooltip('hide');
                            });

                            // Remove old events and register new ones.
                            $('[data-song-remove="on"]').off().on('click', (e) => {
                                // Delete the song.
                                player.removeSongFromPlaylist($(e.currentTarget).data('song'));
                                // Hide the tooltip.
                                $(e.currentTarget).tooltip('hide');
                                // Remove the row.
                                $(e.currentTarget.closest('tr')).remove();
                            });
                        }
                    }
                });
            }
        });

        // Add a listener for the songrequest queue.
        player.addListener('songlist', (e) => {
            let table = $('#queue-table-content'),
                songlist = e.songlist;

            // Remove the current data from the table.
            table.find('tr:gt(0)').remove();

            for (let i = 0; i < songlist.length; i++) {
                let row = $('<tr/>');

                // Add position.
                row.append($('<td/>', {
                    'text': i
                }));

                // Add song name.
                row.append($('<td/>', {
                    'text': songlist[i].title
                }));

                // Add duration.
                row.append($('<td/>', {
                    'text': songlist[i].duration
                }));

                // Add requester.
                row.append($('<td/>', {
                    'text': songlist[i].requester
                }));

                // Add buttons.
                row.append($('<td/>', {
                    'html': $('<div/>', {
                        'class': 'btn-group btn-group-justified header-button'
                    }).append($('<button/>', {
                        'type': 'button',
                        'class': 'btn btn-secondary btn-sm',
                        'data-toggle': 'tooltip',
                        'data-song': songlist[i].song,
                        'title': 'Play song',
                        'html': $('<i/>', {
                            'class': 'fas fa-play'
                        }),
                        'click': (e) => {
                            // Jump to the song.
                            player.updateSong($(e.currentTarget).data('song'));
                            // The song once jumped to it.
                            player.removeSongFromRequest($(e.currentTarget).data('song'));
                            // Hide the tooltip, or could stay opened.
                            $(e.currentTarget).tooltip('hide');
                        }
                    })).append($('<button/>', {
                        'type': 'button',
                        'class': 'btn btn-secondary btn-sm',
                        'data-toggle': 'tooltip',
                        'title': 'Delete song',
                        'data-song': songlist[i].song,
                        'html': $('<i/>', {
                            'class': 'fas fa-trash'
                        }),
                        'click': (e) => {
                            // Delete song.
                            player.removeSongFromRequest($(e.currentTarget).data('song'));
                            // Hide the tooltip, or could stay opened.
                            $(e.currentTarget).tooltip('hide');
                        }
                    }))
                }));

                // Append the row.
                table.append(row);
            }
        });

        // Add a listener for the volume.
        player.addListener('setvolume', (e) => {
            player.API.setVolume(e.setvolume);

            // Update the value under the slider.
            $('#volume-slider-value').html(e.setvolume + '%');

            // Update the icon.
            $('#mute-button-icon').attr('class', (e.setvolume === 0 ? 'fas fa-volume-off' : (e.setvolume > 50 ? 'fas fa-volume-up' : 'fas fa-volume-down')));

            // Always destroy the old slider.
            if (player.volumeSlider !== undefined) {
                player.volumeSlider.slider('destroy');
            }

            // Add the volume slider event.
            player.volumeSlider = $('#volume-slider').slider({
                'value': e.setvolume,
                'min': 0,
                'max': 100,
                'step': 1,
                'tooltip': 'hide'
            }).on('slide', (e) => {
                // Make sure the player wasn't muted.
                if (player.API.isMuted()) {
                    player.API.unMute();
                }
                // Update the player volume
                player.API.setVolume(e.value);
                // Update the value under the slider.
                $('#volume-slider-value').html(e.value + '%');
                // Update the icon.
                $('#mute-button-icon').attr('class', (e.value === 0 ? 'fas fa-volume-off' : (e.value > 50 ? 'fas fa-volume-up' : 'fas fa-volume-down')));
            }).on('slideStop', (e) => {
                // Update the player volume
                player.API.setVolume(e.value);
                // Send the volume update event to the bot once done updating.
                player.updateVolume(e.value);
                // Update the value under the slider.
                $('#volume-slider-value').html(e.value + '%');
                // Update the icon.
                $('#mute-button-icon').attr('class', (e.value === 0 ? 'fas fa-volume-off' : (e.value > 50 ? 'fas fa-volume-up' : 'fas fa-volume-down')));
            });
        });

        // Add a listener for the play event.
        player.addListener('play', (e) => {
            // If this is the first load, start the player paused.
            if (player.firstLoad === true) {
                // Queue the first video
                player.API.cueVideoById(e.play, 0, 'medium');
                // Mark as not first load.
                player.firstLoad = false;
                // Clear timer
                clearTimeout(timer);
                // Remove loader.
                openPlayer(true);
                // Alert the user.
                toastr.info('Song queued: ' + (e.title.length > 30 ? e.title.substring(0, 30) + '...' : e.title));
            } else {
                player.API.loadVideoById(e.play, 0, 'medium');
                toastr.success('Now playing: ' +  (e.title.length > 30 ? e.title.substring(0, 30) + '...' : e.title));
            }

            // Update the value under the slider.
            $('#progress-slider-value').html(e.duration);

            // Always destroy the old slider.
            if (player.progressSlider !== undefined) {
                player.progressSlider.slider('destroy');
            }

            // Add progress slider event.
            player.progressSlider = $('#progress-slider').slider({
                'value': 0,
                'min': 0,
                'step': 0.1,
                'tooltip': 'hide',
                'selection': 'none'
            }).on('slide', (e) => {
                player.API.seekTo(e.value, true);
            }).on('slideStart', () => {
                player.canSlide = false;
            }).on('slideStop', () => {
                player.canSlide = true;
            });

            // Update title information.
            $('#video-title').html(e.title);
            $('#video-url').html('<a href="https://youtu.be/' + e.play + '" target="_blank">https://youtu.be/' + e.play + '</a>');
            $('#user-requester').html(e.requester);

            // Request the songlist to remove played songs.
            player.requestRequestList('songlist');

            // Save this info for other use.
            player.temp = {
                song: e.play,
                title: e.title,
                user: e.requester
            };
        });

        // Pause listener.
        player.addListener('pause', () => {
            if (player.API.getPlayerState() === 2) {
                player.API.playVideo();
            } else {
                player.API.pauseVideo();
            }
        });

        // Load the player.
        player.API = new YT.Player('player-frame', {
            events: {
                'onReady': () => {
                    // Request the playlist.
                    player.requestPlaylist('playlist');

                    // Request the songlist.
                    player.requestRequestList('songlist');

                    // Send the ready event.
                    player.ready();

                    // Interval that updates the progess slider.
                    setInterval(() => {
                        if (player.progressSlider !== undefined && player.API.getPlayerState() === 1 && player.canSlide) {
                            player.progressSlider.slider('setAttribute', 'max', player.API.getDuration());
                            player.progressSlider.slider('setValue', player.API.getCurrentTime());
                        }
                    }, 5e2);
                },
                'onStateChange': (e) => {
                    // Make sure the button shows pause.
                    if (e.data === 1) {
                        $('#play-pause-button').attr('class', 'fas fa-pause');
                    } else if (e.data === 2) {
                        $('#play-pause-button').attr('class', 'fas fa-play');
                    }

                    player.updateState(e.data);
                },
                'onError': (e) => {
                    player.sendError(e.data);
                }
            },
            playerVars: {
                iv_load_policy: 3,
                controls: 0,
                showinfo: 0,
                showsearch: 0,
                autoplay: 1,
                rel: 0
            }
        });
    };
});

// Buttons and events.
$(function() {
    // Delete current song from playlist button.
    $('#del-cur-playlist-button').on('click', () => {
        player.deleteFromPlaylist();
        toastr.success('Deleted from playlist: ' + (player.temp.title.length > 30 ? player.temp.title.substring(0, 30) + '...' : player.temp.title));
    });

    // Fav button to steal a song.
    $('#fav-button').on('click', () => {
        player.addSongToPlaylist();
        toastr.success('Added to playlist: ' + (player.temp.title.length > 30 ? player.temp.title.substring(0, 30) + '...' : player.temp.title));
    });

    // Skip song button.
    $('#skip-button').on('click', () => {
        // Mark the state as paused.
        player.updateState(2);
        // Skip the song.
        player.skipSong();
    });

    // Mute button.
    $('#mute-button').on('click', () => {
        if (player.API.isMuted()) {
            player.API.unMute();
            $('#mute-button-icon').attr('class', (player.API.getVolume() === 0 ? 'fas fa-volume-off' : (player.API.getVolume() > 50 ? 'fas fa-volume-up' : 'fas fa-volume-down')));
        } else {
            player.API.mute();
            $('#mute-button-icon').attr('class', 'fas fa-volume-off');
        }
    });

    // Pause button.
    $('#pause-button').on('click', () => {
        if (player.API.getPlayerState() === 2 || player.API.getPlayerState() === 5) {
            player.API.playVideo();
            $('#play-pause-button').attr('class', 'fas fa-pause');
        } else {
            player.API.pauseVideo();
            $('#play-pause-button').attr('class', 'fas fa-play');
        }
    });

    // Add song to queue button.
    $('#queue-add-song-button').on('click', () => {
        helpers.getSongModal('Add Song to Queue', 'Song Name or YouTube Url', 'Add', 'https://youtu.be/dQw4w9WgXcQ', () => {
            let song = $('#song-url').val();

            if (song.length > 0) {
                player.requestSong(song);
            }
        }).modal('toggle');
    });

    // Add song to playlist button.
    $('#playlist-add-song-button').on('click', () => {
        helpers.getSongModal('Add Song to Playlist', 'Song Name or YouTube Url', 'Add', 'https://youtu.be/dQw4w9WgXcQ', () => {
            let song = $('#song-url').val();

            if (song.length > 0) {
                player.addSongToPlaylist(song);
            }
        }).modal('toggle');
    });

    // Load playlist button.
    $('#load-playlist-button').on('click', () => {
        player.dbQuery('get_playlists', 'yt_playlists_registry', (results) => {
            // Get the keys.
            results = Object.keys(results);
            const playlists = [];

            for (let i = 0; i < results.length; i++) {
                if (results[i].indexOf('ytPlaylist_') !== -1) {
                    playlists.push(results[i].substr(results[i].indexOf('_') + 1, results[i].length));
                }
            }

            helpers.getPlaylistModal('Load Playlist', 'Playlist Name', 'Load', 'Playlist', playlists, () => {
                let playlist = $('#playlist-load').find(':selected').text();

                if (playlist === 'Select a playlist') {
                    toastr.error('Please select a valid playlist.');
                } else {
                    if (playlist.length > 0) {
                        player.loadPlaylist(playlist);
                        toastr.success('Loading playlist: ' + playlist);
                    }
                }
            }).modal('toggle');
        });
    });

    // Settings button.
    $('#settings-button').on('click', () => {
        helpers.getSettingsModal(() => {
            // Save the new size.
            localStorage.setItem('phantombot_ytplayer_size', $('#player-size-btn').text().toLowerCase());
            // Set the new size.
            helpers.setPlayerSize();

            // Update DJ name.
            let djName = $('#dj-name').val();
            if (djName.length > 0) {
                player.dbUpdate('dj_name_up', 'ytSettings', 'playlistDJname', String(djName));
            }

            // Update user max songs.
            let maxSongs = $('#max-song-user').val();
            if (parseInt(maxSongs) > 0) {
                player.dbUpdate('max_song_up', 'ytSettings', 'songRequestsMaxParallel', String(maxSongs));
            }

            // Update max song length.
            let maxSongLen = $('#max-song-length').val();
            if (parseInt(maxSongLen) > 0) {
                player.dbUpdate('max_song_len_up', 'ytSettings', 'songRequestsMaxSecondsforVideo', String(maxSongLen));
            }

            //Update the votecount.
            let voteCount = $('#vote-count').val();
            if (parseInt(voteCount) > 0) {
                player.dbUpdate('vote_count', 'ytSettings', 'voteCount', String(voteCount));
            }
        });
    });

    // Playlist shuffle button.
    $('#playlist-shuffle-button').on('click', () => {
        player.shufflePlaylist();
    });

    // Enable global tooltips.
    $('body').tooltip({
        selector: '[data-toggle="tooltip"]',
        container: 'body',
        trigger: 'hover',
        delay: {
            show: 350,
            hide: 50
        }
    });
});

// Load other player settings.
$(function() {
    // Toastr options.
    toastr.options.progressBar = true;
    toastr.options.preventDuplicates = true;

    // Set the player size.
    helpers.setPlayerSize();
    if (helpers.urlIsIP()) {
        toaster.warning('You may be accessing the YouTube player by using an IP Address in the URL.<br/><br/>'
            + 'YouTube\'s embed API really hates this and may refuse to work.<br/><br/>You should switch to using a '
            + 'Hostname, Domain, or Sub-Domain to avoid issues.', 'Potential Conflict Detected',
            {
                timeOut: 60000,
                extendedTimeOut: 120000,
                closeButton: true
            });
    }
});