import '../vendor/jquery.scrollTo-min';

const LiveScoresController = async function ($scope, $http, livescores) {
    var socket;
    var subscribedMatch;

    $scope.datepickerOptions = {
        minDate: new Date('2012-01-01'),
        maxDate: new Date((new Date().getFullYear() + 1) + '-12-31'),
        date: new Date(new Date().setHours(0, 0, 0, 0)),
        onChange: onDateChange,
    };

    $scope.settings = {
        timezone: await determineTimezone(),
    };

    socket = livescores.connect();

    socket.on('connect', function () {
        $('.ls-match-group-list').litelay({ spinner: true });

        subscribeDay($scope.datepickerOptions.date, $scope.settings.timezone);
    });

    async function determineTimezone() {
        let timezone = DataStore.tz;

        if (!timezone && Intl && Intl.DateTimeFormat && Intl.DateTimeFormat().resolvedOptions) {
            timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
        }

        if (!timezone) {
            timezone = (await import('../vendor/jstz.min.js')).determine().name();
        }

        return timezone;
    }

    function onDateChange(date) {
        $('.ls-match-group-list').litelay({spinner: true});

        subscribeDay(date, $scope.settings.timezone);
    }

    $scope.changeTimezone = function () {
        subscribeDay($scope.datepickerOptions.date, $scope.settings.timezone);

        $http.post('/profile/settings/set-timezone', {tz: $scope.settings.timezone});
    };

    $scope.onClickSettings = function () {
        $scope.showLsSettings = !$scope.showLsSettings;

        if ($scope.showLsSettings) {
            $('.ls-settings-dropdown').litelay({ spinner: true });
        }
    };

    $scope.timezonesLoaded = function () {
        $('.ls-settings-dropdown').litelay({off: true});
    };

    $scope.joinMatch = function (matchId) {
        if (subscribedMatch) {
            subscribedMatch._subscribed = false;
        }

        subscribedMatch = $scope.matchesById[matchId];

        livescores.subMatch(matchId, function (match) {
            subscribedMatch.lineup = match.lineup;
            subscribedMatch._subscribed = true;
        });
    };

    function onDayReport(dayReport) {
        console.time('index');

        $scope.competitions = _(dayReport.stages).filter(function (stage) {
            return stage.type == 'competition';
        });

        $scope.stagesByParent = _(dayReport.stages).groupBy('parent');
        $scope.stagesById = _(dayReport.stages).indexBy('id');
        $scope.matchesById = dayReport.matchesById;
        $scope.matchesByStage = _(dayReport.matchesById).groupBy('stageId');

        console.timeEnd('index');

        // TODO: Offset is showed as a weird number 22, cant we do something about it?
        if ($(window).scrollTop() > $('.livescores').offset().top - 22) {
            $('body').scrollTo($('.livescores').offset().top - 22, 100);
        }

        $('.ls-match-group-list').litelay({off: true});
    }

    function subscribeDay(date, timezone) {
        livescores.subDay(date, timezone, onDayReport);
    }
};

LiveScoresController.$inject = ['$scope', '$http', 'livescores'];
export default LiveScoresController;