'use strict';

/* global asyncForEach:false */
/* global angular:false */
/* global $:false */

angular.module('Application').controller('ProfileController', ['$scope', '$location', 'Client', function ($scope, $location, Client) {
    $scope.user = Client.getUserInfo();
    $scope.config = Client.getConfig();

    $scope.activeClients = [];
    $scope.webadminClient = {};
    $scope.apiClient = {};
    $scope.cliClient = {};

    $scope.twoFactorAuthentication = {
        busy: false,
        error: null,
        password: '',
        totpToken: '',
        secret: '',
        qrcode: '',

        reset: function () {
            $scope.twoFactorAuthentication.busy = false;
            $scope.twoFactorAuthentication.error = null;
            $scope.twoFactorAuthentication.password = '';
            $scope.twoFactorAuthentication.totpToken = '';
            $scope.twoFactorAuthentication.secret = '';
            $scope.twoFactorAuthentication.qrcode = '';

            $scope.twoFactorAuthenticationEnableForm.$setUntouched();
            $scope.twoFactorAuthenticationEnableForm.$setPristine();
            $scope.twoFactorAuthenticationDisableForm.$setUntouched();
            $scope.twoFactorAuthenticationDisableForm.$setPristine();
        },

        show: function () {
            $scope.twoFactorAuthentication.reset();

            if ($scope.user.twoFactorAuthenticationEnabled) {
                $('#twoFactorAuthenticationDisableModal').modal('show');
            } else {
                $('#twoFactorAuthenticationEnableModal').modal('show');

                Client.setTwoFactorAuthenticationSecret(function (error, result) {
                    if (error) return console.error(error);

                    $scope.twoFactorAuthentication.secret = result.secret;
                    $scope.twoFactorAuthentication.qrcode = result.qrcode;
                });
            }
        },

        enable: function() {
            $scope.twoFactorAuthentication.busy = true;

            Client.enableTwoFactorAuthentication($scope.twoFactorAuthentication.totpToken, function (error) {
                $scope.twoFactorAuthentication.busy = false;

                if (error) {
                    $scope.twoFactorAuthentication.error = error.message;

                    $scope.twoFactorAuthentication.totpToken = '';
                    $scope.twoFactorAuthenticationEnableForm.totpToken.$setPristine();
                    $('#twoFactorAuthenticationTotpTokenInput').focus();

                    return;
                }

                Client.refreshUserInfo();

                $('#twoFactorAuthenticationEnableModal').modal('hide');
            });
        },

        disable: function () {
            $scope.twoFactorAuthentication.busy = true;

            Client.disableTwoFactorAuthentication($scope.twoFactorAuthentication.password, function (error) {
                $scope.twoFactorAuthentication.busy = false;

                if (error) {
                    $scope.twoFactorAuthentication.error = error.message;

                    $scope.twoFactorAuthentication.password = '';
                    $scope.twoFactorAuthenticationDisableForm.password.$setPristine();
                    $('#twoFactorAuthenticationPasswordInput').focus();

                    return;
                }

                Client.refreshUserInfo();

                $('#twoFactorAuthenticationDisableModal').modal('hide');
            });
        }
    };

    $scope.avatarChange = {
        busy: false,
        error: {},
        avatar: null,
        useGravatar: '',
        useGravatarOrig: '',
        pictureChanged: false,

        getBlobFromImg: function (img, callback) {
            var size = 256;

            var canvas = document.createElement('canvas');
            canvas.width = size;
            canvas.height = size;

            var imageDimensionRatio = img.width / img.height;
            var canvasDimensionRatio = canvas.width / canvas.height;
            var renderableHeight, renderableWidth, xStart, yStart;

            if (imageDimensionRatio > canvasDimensionRatio) {
                renderableHeight = canvas.height;
                renderableWidth = img.width * (renderableHeight / img.height);
                xStart = (canvas.width - renderableWidth) / 2;
                yStart = 0;
            } else if (imageDimensionRatio < canvasDimensionRatio) {
                renderableWidth = canvas.width;
                renderableHeight = img.height * (renderableWidth / img.width);
                xStart = 0;
                yStart = (canvas.height - renderableHeight) / 2;
            } else {
                renderableHeight = canvas.height;
                renderableWidth = canvas.width;
                xStart = 0;
                yStart = 0;
            }

            var ctx = canvas.getContext('2d');
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.drawImage(img, xStart, yStart, renderableWidth, renderableHeight);

            canvas.toBlob(callback);
        },

        doChangeAvatar: function () {
            $scope.avatarChange.error.avatar = null;
            $scope.avatarChange.busy = true;

            function done(error) {
                if (error) return console.error('Unable to change avatar.', error);

                Client.refreshUserInfo(function (error) {
                    if (error) return console.error(error);

                    $('#avatarChangeModal').modal('hide');
                    $scope.avatarChange.avatarChangeReset();
                });
            }

            if ($scope.avatarChange.useGravatar) {
                Client.clearAvatar(done);
            } else {
                var img = document.getElementById('previewAvatar');
                $scope.avatarChange.getBlobFromImg(img, function (blob) {
                    Client.changeAvatar(blob, done);
                });
            }
        },

        setPreviewAvatar: function (avatar) {
            $scope.avatarChange.pictureChanged = true;
            $scope.avatarChange.avatar = avatar;
        },

        avatarChangeReset: function () {
            $scope.avatarChange.error.avatar = null;
            $scope.avatarChange.useGravatar = $scope.user.avatarUrl.indexOf('https://www.gravatar.com') === 0 ? 'true_string' : '';
            $scope.avatarChange.useGravatarOrig = $scope.avatarChange.useGravatar;
            $scope.avatarChange.pictureChanged = false;
            $scope.avatarChange.avatar = $scope.avatarChange.useGravatar ? {} : {
                url: $scope.user.avatarUrl
            };
            $scope.avatarChange.busy = false;
        },

        showChangeAvatar: function () {
            $scope.avatarChange.avatarChangeReset();
            $('#avatarChangeModal').modal('show');
        },

        showCustomAvatarSelector: function () {
            $('#avatarFileInput').click();
        }
    };

    $scope.passwordchange = {
        busy: false,
        error: {},
        password: '',
        newPassword: '',
        newPasswordRepeat: '',

        reset: function () {
            $scope.passwordchange.error.password = null;
            $scope.passwordchange.error.newPassword = null;
            $scope.passwordchange.error.newPasswordRepeat = null;
            $scope.passwordchange.password = '';
            $scope.passwordchange.newPassword = '';
            $scope.passwordchange.newPasswordRepeat = '';

            $scope.passwordChangeForm.$setUntouched();
            $scope.passwordChangeForm.$setPristine();
        },

        show: function () {
            $scope.passwordchange.reset();
            $('#passwordChangeModal').modal('show');
        },

        submit: function () {
            $scope.passwordchange.error.password = null;
            $scope.passwordchange.error.newPassword = null;
            $scope.passwordchange.error.newPasswordRepeat = null;
            $scope.passwordchange.busy = true;

            Client.changePassword($scope.passwordchange.password, $scope.passwordchange.newPassword, function (error) {
                $scope.passwordchange.busy = false;

                if (error) {
                    if (error.statusCode === 412) {
                        $scope.passwordchange.error.password = true;
                        $scope.passwordchange.password = '';
                        $('#inputPasswordChangePassword').focus();
                        $scope.passwordChangeForm.password.$setPristine();
                    } else if (error.statusCode === 400) {
                        $scope.passwordchange.error.newPassword = error.message;
                        $scope.passwordchange.newPassword = '';
                        $scope.passwordchange.newPasswordRepeat = '';
                        $scope.passwordChangeForm.newPassword.$setPristine();
                        $scope.passwordChangeForm.newPasswordRepeat.$setPristine();
                        $('#inputPasswordChangeNewPassword').focus();
                    } else {
                        console.error('Unable to change password.', error);
                    }
                    return;
                }

                $scope.passwordchange.reset();
                $('#passwordChangeModal').modal('hide');
            });
        }
    };

    $scope.emailchange = {
        busy: false,
        error: {},
        email: '',

        reset: function () {
            $scope.emailchange.busy = false;
            $scope.emailchange.error.email = null;
            $scope.emailchange.email = '';

            $scope.emailChangeForm.$setUntouched();
            $scope.emailChangeForm.$setPristine();
        },

        show: function () {
            $scope.emailchange.reset();
            $('#emailChangeModal').modal('show');
        },

        submit: function () {
            $scope.emailchange.error.email = null;
            $scope.emailchange.busy = true;

            var data = {
                email: $scope.emailchange.email
            };

            Client.updateProfile(data, function (error) {
                $scope.emailchange.busy = false;

                if (error) {
                    if (error.statusCode === 409) {
                        $scope.emailchange.error.email = 'Email already taken';
                        $scope.emailChangeForm.email.$setPristine();
                        $('#inputEmailChangeEmail').focus();
                    } else {
                        console.error('Unable to change email.', error);
                    }
                    return;
                }

                // update user info in the background
                Client.refreshUserInfo();

                $scope.emailchange.reset();
                $('#emailChangeModal').modal('hide');
            });
        }
    };

    $scope.fallbackEmailChange = {
        busy: false,
        error: {},
        email: '',

        reset: function () {
            $scope.fallbackEmailChange.busy = false;
            $scope.fallbackEmailChange.error.email = null;
            $scope.fallbackEmailChange.email = '';

            $scope.fallbackEmailChangeForm.$setUntouched();
            $scope.fallbackEmailChangeForm.$setPristine();
        },

        show: function () {
            $scope.fallbackEmailChange.reset();
            $('#fallbackEmailChangeModal').modal('show');
        },

        submit: function () {
            $scope.fallbackEmailChange.error.email = null;
            $scope.fallbackEmailChange.busy = true;

            var data = {
                fallbackEmail: $scope.fallbackEmailChange.email
            };

            Client.updateProfile(data, function (error) {
                $scope.fallbackEmailChange.busy = false;

                if (error) return console.error('Unable to change fallback email.', error);

                // update user info in the background
                Client.refreshUserInfo();

                $scope.fallbackEmailChange.reset();
                $('#fallbackEmailChangeModal').modal('hide');
            });
        }
    };

    $scope.displayNameChange = {
        busy: false,
        error: {},
        displayName: '',

        reset: function () {
            $scope.displayNameChange.busy = false;
            $scope.displayNameChange.error.displayName = null;
            $scope.displayNameChange.displayName = '';

            $scope.displayNameChangeForm.$setUntouched();
            $scope.displayNameChangeForm.$setPristine();
        },

        show: function () {
            $scope.displayNameChange.reset();
            $scope.displayNameChange.displayName = $scope.user.displayName;
            $('#displayNameChangeModal').modal('show');
        },

        submit: function () {
            $scope.displayNameChange.error.displayName = null;
            $scope.displayNameChange.busy = true;

            var user = {
                displayName: $scope.displayNameChange.displayName
            };

            Client.updateProfile(user, function (error) {
                $scope.displayNameChange.busy = false;

                if (error) {
                    if (error.statusCode === 400) {
                        $scope.displayNameChange.error.displayName = 'Invalid display name';
                        $scope.displayNameChangeForm.email.$setPristine();
                        $('#inputDisplayNameChangeDisplayName').focus();
                    } else {
                        console.error('Unable to change email.', error);
                    }
                    return;
                }

                // update user info in the background
                Client.refreshUserInfo();

                $scope.displayNameChange.reset();
                $('#displayNameChangeModal').modal('hide');
            });
        }
    };

    function revokeTokensByClient(clientId, callback) {
        Client.delTokensByClientId(clientId, function (error) {
            if (error) console.error(error);
            callback();
        });
    }

    $scope.revokeTokens = function () {
        // first revoke all non webadmin tokens
        var nonWebClientIds = $scope.activeClients.filter(function (c) { return c.id !== 'cid-webadmin'; }).map(function (c) { return c.id; });
        asyncForEach(nonWebClientIds, revokeTokensByClient, function () {
            // WARNING keep in sync with clients.js in box code
            revokeTokensByClient('cid-webadmin', function () {
                Client.logout(true /* destroy all OAuth sessions for this user */);
            });
        });
    };

    function refreshClientTokens(client, callback) {
        Client.getTokensByClientId(client.id, function (error, result) {
            if (error) console.error(error);

            client.activeTokens = result || [];

            if (callback) callback();
        });
    }

    Client.onReady(function () {
        if (!Client.getUserInfo().admin) return;

        Client.getOAuthClients(function (error, activeClients) {
            if (error) return console.error(error);

            asyncForEach(activeClients, refreshClientTokens, function () {
                $scope.webadminClient = activeClients.filter(function (c) { return c.id === 'cid-webadmin'; })[0];
                $scope.apiClient = activeClients.filter(function (c) { return c.id === 'cid-sdk'; })[0];
                $scope.cliClient = activeClients.filter(function (c) { return c.id === 'cid-cli'; })[0];

                $scope.activeClients = activeClients;
            });
        });
    });

    $('#avatarFileInput').get(0).onchange = function (event) {
        var fr = new FileReader();
        fr.onload = function () {
            $scope.$apply(function () {
                var tmp = {
                    file: event.target.files[0],
                    data: fr.result,
                    url: null
                };

                $scope.avatarChange.avatar = tmp;
                $scope.avatarChange.setPreviewAvatar(tmp);
            });
        };
        fr.readAsDataURL(event.target.files[0]);
    };

    // setup all the dialog focus handling
    ['passwordChangeModal', 'emailChangeModal', 'fallbackEmailChangeModal', 'displayNameChangeModal', 'twoFactorAuthenticationEnableModal', 'twoFactorAuthenticationDisableModal'].forEach(function (id) {
        $('#' + id).on('shown.bs.modal', function () {
            $(this).find("[autofocus]:first").focus();
        });
    });

    $('.modal-backdrop').remove();
}]);
