(function () {
    'use strict';
    var app = angular.module('eventTypeAdmin');
    var templatePath = modulesSharedResourcesUrl + 'Modules/EventTypeAdmin/Views/';

    app.directive('eventTypeList', ['eventTypeAdminDataContext', 'eventTypeAdminService', 'common', '$location', '$modal', '$upload', function (eventTypeAdminDataContext, eventTypeAdminService, common, $location, $modal, $upload) {
        return {
            restrict: 'E',
            templateUrl: templatePath + 'eventtypelist.html',
            link: link
        };

        function link($scope, elem, attrs) {
            // Set the log notifiers up
            var getLogFn = common.logger.getLogFn;
            var logSuccess = getLogFn("eventAdmin", "success");
            var logError = getLogFn("eventAdmin", "error");
       
            eventTypeAdminService.setCurrentEvent(null);

            function getEvents() {
                eventTypeAdminDataContext.getAllEvents().then(function (data) {
                    $scope.events = data;
                    $scope.eventsLoaded = true;
                });            
            }

            $scope.updateEvent = function (event) {
                eventTypeAdminDataContext.updateRole(role).then(function (data) {
                    logSuccess("Log type " + event.name + " updated");
                });
            }

            $scope.removeEvent = function (event) {
                eventTypeAdminDataContext.deleteEvent(event).then(function (data) {
                    logSuccess("Log type " + event.name + " Deleted");
                    getEvents();
                });
            }

            $scope.manageEvent = function (event) {
                eventTypeAdminService.setCurrentEvent(event);
                $location.path('/eventtypes/manage');
            }

            getEvents();
        }
    }]);

    app.directive('manageEventType', ['eventTypeAdminDataContext', 'eventTypeAdminService', 'common', '$location', '$modal', '$routeParams', '$upload', function (eventTypeAdminDataContext, eventTypeAdminService, common, $location, $modal, $routeParams, $upload) {
        return {
            restrict: 'E',
            templateUrl: templatePath + 'manageeventtype.html',
            link: link
        };

        function link($scope, elem, attrs) {
            // Set the log notifiers up
            var getLogFn = common.logger.getLogFn;
            var logSuccess = getLogFn("rolesAdmin", "success");
            var logError = getLogFn("rolesAdmin", "error");

            $scope.goBack = function () {
                $location.path('/eventtypes');
            };

            $scope.event = eventTypeAdminService.getCurrentEvent();

            if (!$scope.event) {
                $scope.event = eventTypeAdminService.createBlankEvent();
            } 

            $scope.saveEvent = function () {

                // Set the translucent secondary colour
                $scope.event.color.secondary = hexToRgbA($scope.event.color.secondary, '0.2');

                if ($scope.event.id) {
                    eventTypeAdminDataContext.updateEvent($scope.event).then(function (data) {
                        logSuccess("Log type " + $scope.event.name + " updated");
                        $location.path('/eventtypes');
                    });
                } else {
                    eventTypeAdminDataContext.createEvent($scope.event).then(function (data) {
                        logSuccess("Log type " + $scope.event.name + " created");
                        $location.path('/eventtypes');
                    });
                }
            }

            $scope.idealTextColor = function (bgColor) {
                if (bgColor === 'transparent')
                    return;

                var nThreshold = 105;
                var components = getRGBComponents(bgColor);
                var bgDelta = (components.R * 0.299) + (components.G * 0.587) + (components.B * 0.114);

                return ((255 - bgDelta) < nThreshold) ? "#000000" : "#ffffff";
            }

            // Convert the hex to an translucent rgba
            function hexToRgbA(hex, opacity) {
                var c;
                if (/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) {
                    c = hex.substring(1).split('');
                    if (c.length == 3) {
                        c = [c[0], c[0], c[1], c[1], c[2], c[2]];
                    }
                    c = '0x' + c.join('');
                    return 'rgba(' + [(c >> 16) & 255, (c >> 8) & 255, c & 255].join(',') + ',' + opacity + ')';
                }
                // It's already in rgba format
                return hex;
            }


            $scope.onFileSelect = function (files) {
                $scope.errorMessage = null;
                $scope.backgroundErrorMessage = null;
                $scope.file = files[0]; // we're not interested in multiple file uploads here
                if ($scope.file.type !== 'image/jpeg' && $scope.file.type !== 'image/png' && $scope.file.type !== 'image/gif' || $scope.file.type === 'image/tiff') {
                    $scope.backgroundErrorMessage = "Please upload a valid image file. jpeg, png or gif.";
                    $scope.event.iconUrl = null;
                    return;
                }

                // check if the user has selected an image below our maximum file size of 20MB
                if ($scope.file.size > 20000000) {
                    $scope.event.iconUrl = null;
                    return;
                }

                $scope.fileName = $scope.file.name;
                $scope.file.fileName = $scope.file.name;
                $scope.file.originalImageFileName = $scope.file.name;
                $scope.file.imageFileSize = $scope.file.size;
                $scope.file.imageFileType = $scope.file.type;
                uploadImage($scope.file, $scope.file, UploadSuccess, UploadProgress, UploadError, cloudinaryUploadPath);
            }

            //upload graphic to cloudinary
            function uploadImage(obj, file, success, progress, error, uploadPath) {
                var data = {
                    upload_preset: cloudinaryUploadPreset,
                    tags: 'mybadges,'
                };
                //images are uploaded to Cloudinary   
                $upload.upload({
                    url: cloudinaryApiBaseUrl + cloudinaryName + uploadPath,
                    data: data,
                    file: file
                }).progress(function (e) {
                    var percent = Math.round((e.loaded * 100.0) / e.total);
                    return progress(percent);
                }).success(function (data, status, headers, config) {
                    return success(obj, data);
                }).error(function (data) {
                    return error();
                });

            }

            //called when a logo is uploaded
            function UploadSuccess(files, data) {
                //ensure we always use https
                data.url = data.url.replace(/^http:\/\//i, 'https://');
                //Set the size of the new graphic to 200px
                data.url = data.url.replace(/upload\//i, 'upload/w_30,h_30,c_pad/');
                $scope.event.iconUrl = data.url;

                $scope.errorMessage = null;
                $scope.backgroundErrorMessage = null;
                return;
            }

            // Generate the image upload process percentage
            function UploadProgress(percentComplete) {
                $scope.progress = percentComplete;
                $scope.uploadStatus = "Uploading... " + percentComplete + "%";
            }

            function UploadError() {
                $scope.event.iconUrl = null;
                $scope.errorMessage = "There is a problem uploading this image. Please try again.";
            }


            function getRGBComponents(color) {
				if (color) {
					var r = color.substring(1, 3);
					var g = color.substring(3, 5);
					var b = color.substring(5, 7);

					return {
						R: parseInt(r, 16),
						G: parseInt(g, 16),
						B: parseInt(b, 16)
					};
				} else {
					return {
						R: 255,
						G: 255,
						B: 255
					};
				}
			}
        }
    }]);

})();