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

    // A directive for users to view their items and edit their showcases
    app.directive('myStuff', function () {
        return {
            restrict: 'E',
            controller: 'myStuffController',
            templateUrl: templatePath + 'mystuff.html'
        }
    });

    // A directive for users to view their items
    app.directive('myItems', ['$rootScope', function ($rootScope) {
        return {
            restrict: 'E',
            scope: {
                showcaseSummary: '=',
                currentShowcase: '=',
                myStuffFns: '='
            },
            controller: 'myItemsController',
            templateUrl: templatePath + 'myitems.html',
            link: link
        };

        function link(scope) {

            scope.goToRootFolder = function () {
                $rootScope.$broadcast('UpdateItems');
            },

                scope.goToTransferRootFolder = function () {
                    $rootScope.$broadcast('UpdateTransferItems');
                }
        }

    }]);

    // A directive for users to control how their items are viewed
    app.directive('myItemsToolbar', ['terminology', '$rootScope', function (terminology, $rootScope) {
        return {
            restrict: 'E',
            scope: {
                options: '=',
                selectedShowcase: '=',
                showcaseSummary: '=',
                myItemsFns: '=',
                myStuffFns: '=',
                selectedFolder: '=',
                availableFolders: '=',
                isTransferEnabled: '='
            },
            templateUrl: templatePath + 'myitems-toolbar.html',
            link: link
        };

        function link(scope) {
           
            scope.stuffPlural = terminology.stuffPlural;
            scope.stuffPlural = scope.stuffPlural.toLowerCase();
            scope.sidebarToggleButtonActiveTitle = 'Open the sidebar to filter your items by tags, type and ' + terminology.frameworkPlural;
            scope.sidebarToggleButtonInactiveTitle = 'Close the sidebar and view all items';

            // Toggle the display
            scope.toggleDisplay = function (display) {
                scope.myItemsFns.toggleDisplay(display);
            };

            // Toggle the sidebar
            scope.toggleSidebar = function () {
                scope.myItemsFns.toggleSidebar();
            };

            // Create a new showcase for items
            scope.createShowcase = scope.myStuffFns.createShowcase;

            // Set the current showcase that is being edited
            scope.setCurrentShowcase = scope.myStuffFns.setCurrentShowcase;

            scope.selectedFolder = scope.selectedFolder;

            scope.availableFolders = scope.availableFolders;

            // Set focus to the showcase editor when the user changes the current showcase
            scope.jumpToShowcaseEditor = function () {
                $('#showcase-editor .panel-title button:first').focus();
            }

            // Toggle the focus of the jump button
            scope.setJumpButtonFocus = function (value) {
                scope.jumpButtonFocused = value;
            }

            scope.goToRootFolder = function () {
                $rootScope.$broadcast('UpdateItems');
            }

            scope.goToTransferRootFolder = function () {
                $rootScope.$broadcast('UpdateTransferItems');
            }

            scope.canManageItems = function () {
                if ($rootScope.currentRole) {
                    return $rootScope.currentRole.functions.find(item => item === "stuff_items_manage");
                }
                return false;
            }

            scope.canManageShowcases = function () {
                if ($rootScope.currentRole) {
                    return $rootScope.currentRole.functions.find(item => item === "myshowcases_manage");
                }
                return false;
            }
            
            scope.toolBarPadding = {};
           // scope.toolBarPadding = function(){
                if(!scope.canManageItems() || !scope.canManageShowcases()){
                    scope.toolBarPadding = {
                        "padding-bottom": "45px"
                    }
                }
                return {};
            //}

            
        }
    }]);

    // A directive for users to control how their items are filtered
    app.directive('myItemsSidebar', ['terminology', 'itemService', function (terminology, itemService) {
        return {
            restrict: 'E',
            scope: {
                data: '=',
                filters: '=',
                setFilter: '=',
                categorizedItems: '='
            },
            templateUrl: templatePath + 'myitems-sidebar.html',
            link: link
        };

        function link(scope) {

            scope.frameworkPlural = terminology.frameworkPlural;

            // Get the icon for a given time
            scope.getIconForItemType = function (type) {
                return itemService.getItemIcon({
                    displayType: type
                });
            };

            // Filter the items by a tag
            scope.selectTag = function (tag) {
                scope.setFilter('selectedTag', tag);
            };

            // Filter the items by a type
            scope.selectType = function (type) {
                scope.setFilter('selectedType', type);
            };

            // Hide the tags tab if there are no items with tags
            scope.noTags = function () {
                return scope.categorizedItems.tags && (
                    Object.keys(scope.categorizedItems.tags).length == 1 && scope.categorizedItems.tags["No Tags"] == 0
                );
            }

            // Hide the type tab if there are no items with tags
            scope.noTypes = function () {
                return scope.categorizedItems.type && Object.keys(scope.categorizedItems.type.length == 0);
            }
        }
    }]);

    // A directive for users to filter their items by competency
    app.directive('myItemsCompetencyFilter', function () {
        return {
            restrict: 'E',
            scope: {
                filters: '=',
                setFilter: '=',
                filteredIds: '='
            },
            controller: 'competencyTreeController',
            templateUrl: templatePath + 'myitems-competency-filter.html',
            link: function (scope, _e, _a, ctrl) {

                // Set the framework
                scope.setFramework = function (id) {
                    ctrl.setFrameworkAndGetCompetencies(id);
                }

                // Filter the items by a competency
                scope.selectCompetency = function (competency) {
                    var currentFilter = scope.filters.selectedCompetency;

                    scope.setFilter('selectedCompetency',
                        currentFilter && currentFilter.id == competency.id
                            ? null
                            : competency
                    );
                }

                scope.filterCompetencies = function (simpleEvidence) {
                    return simpleEvidence.filter(function (evidence) {
                        return scope.filteredIds.indexOf(evidence.sourceId) > -1;
                    });
                };
            }
        }
    });

    // A directive to show which filters are currently active
    app.directive('myItemsBrowse', function () {
        return {
            restrict: 'E',
            scope: {
                filters: '=',
                clearFilter: '=',
                toggleSidebar: '=',
                clearAllFilters: '='
            },
            templateUrl: templatePath + 'myitems-browse.html',
            link: function (scope) {

                scope.filterSet = function () {
                    return scope.browseList.some(function (item) {
                        return scope.filters[item.filter];
                    });
                }

                scope.browseList = [
                    {
                        icon: 'fa fa-tag',
                        filter: 'selectedTag',
                        type: 'Tag'
                    },
                    {
                        icon: 'fa fa-sitemap',
                        filter: 'selectedCompetency',
                        type: 'Competency'
                    },
                    {
                        icon: 'fa fa-th-large',
                        filter: 'selectedType',
                        type: 'Type'
                    },
                    {
                        icon: 'fa fa-search',
                        filter: 'query',
                        type: 'Search query'
                    }
                ];

                scope.$watch("filters", function () {
                    var filtersToMessage = scope.browseList.filter(function (item) {
                        return scope.filters[item.filter];
                    }).map(function (item) {
                        return "the " + item.type + " " + (scope.filters[item.filter].name || scope.filters[item.filter]);
                    });

                    if (filtersToMessage.length > 0) {

                        if (filtersToMessage.length > 1) {
                            var lastMessage = filtersToMessage.splice(filtersToMessage.length - 1, 1);
                        }

                        scope.statusMessage = "You are browsing items with: " + filtersToMessage.join(", ") + (lastMessage ? " and " + lastMessage : "");

                    } else {
                        scope.statusMessage = "";
                    }
                }, true);
            }
        };
    });

    // A directive for the items in the grid that can be dragged to a showcase
    app.directive('myItemsGallery', ['terminology', '$rootScope', function (terminology, $rootScope) {
        return {
            restrict: 'E',
            scope: {
                items: '=',
                options: '=',
                filters: '=',
                order: '=',
                canDrag: '=',
                myStuffFns: '=',
                currentShowcase: '=',
                loadItemsOnScroll: '=',
                itemsDisplayedInList: '=',
                itemsDragOptions: '=dragOptions',
                myItemsFns: '=',
                transferItems: '=',
                isTransferEnabled: '=',
                currentFolder: '=',
                showItemsForTransfer: '='
            },
            templateUrl: templatePath + 'myitems-gallery.html',
            link: function (scope) {

                scope.stuffPlural = terminology.stuffPlural;

                scope.goToRootFolder = function () {
                    $rootScope.$broadcast('UpdateItems');
                },

                    // Toggle the size of the items
                    scope.toggleItemSize = function () {
                        scope.myItemsFns.toggleItemSize();
                    };

                // Filter the items by a search query
                scope.search = function (query) {
                    scope.myItemsFns.search(query);
                }

                scope.filterEnabled = function (filters) {
                    if (filters.query) {
                        return true;
                    }
                    if (filters.selectedTag) {
                        return true;
                    }
                    if (filters.selectedType) {
                        return true;
                    }
                    if (filters.selectedCompetency) {
                        return true;
                    }
                    return false;
                }

                // Create a new folder
                scope.createFolder = scope.myStuffFns.createFolder;

                scope.canManageItems = function () {
                    if ($rootScope.currentRole) {
                        return $rootScope.currentRole.functions.find(item => item === "stuff_items_manage");
                    }
                    return false;
                }
            }
        };
    }]);

    // A directive for the items in the grid that can be dragged to a showcase
    app.directive('myItemsList', ['terminology', '$rootScope', '$filter', function (terminology, $rootScope, $filter) {
        return {
            restrict: 'E',
            scope: {
                data: '=',
                items: '=',
                options: '=',
                filters: '=',
                setFilter: '=',
                categorizedItems: '=',
                order: '=',
                canDrag: '=',
                myStuffFns: '=',
                currentShowcase: '=',
                loadItemsOnScroll: '=',
                itemsDisplayedInList: '=',
                itemsDragOptions: '=dragOptions',
                myItemsFns: '=',
                transferItems: '=',
                isTransferEnabled: '=',
                currentFolder: '=',
                showItemsForTransfer: '='
            },
            templateUrl: templatePath + 'myitems-list.html',
            link: function (scope) {
                scope.stuffPlural = terminology.stuffPlural;
                // Table headers for my stuff
                scope.tableHeaders = [
                    {
                        name: "Name",
                        minWidth: "200px",
                        colSpan: 2
                    },
                    {
                        name: "Date added",
                        width: "140px",
                        class: 'hidden-xs hidden-sm'
                    },
                    {
                        name: "Type",
                        width: "180px",
                        class: 'hidden-xs hidden-sm'
                    },
                    {
                        name: "Size",
                        width: "100px",
                        class: 'hidden-xs hidden-sm'
                    },
                    {
                        name: "",
                        width: "25px"
                    }
                ];

                // Order options for tasks 
                scope.orderOptions = [
                    {
                        name: 'Name',
                        value: {
                            predicate: 'title',
                            reverse: false
                        },
                    },
                    {
                        name: 'Date added',
                        value: {
                            predicate: 'addedDate',
                            reverse: true
                        },
                    },
                    {
                        name: 'Type',
                        value: {
                            predicate: 'itemType',
                            reverse: false
                        },
                    },
                    {
                        name: 'Size',
                        value: {
                            predicate: 'fileSize',
                            reverse: false
                        },
                    },
                    {
                        name: '',
                        disableSort: true,
                        value: {
                            predicate: '',
                            reverse: false
                        },
                    },
                ];

                // Currently selected order option
                scope.currentOrder = scope.orderOptions[1];

                scope.goToRootFolder = function () {
                    $rootScope.$broadcast('UpdateItems');
                },

                    // Toggle the size of the items
                    scope.toggleItemSize = function () {
                        scope.myItemsFns.toggleItemSize();
                    };

                // Filter the items by a search query
                scope.search = function (query) {
                    scope.myItemsFns.search(query);
                }

                scope.filterEnabled = function (filters) {
                    if (filters.query) {
                        return true;
                    }
                    if (filters.selectedTag) {
                        return true;
                    }
                    if (filters.selectedType) {
                        return true;
                    }
                    if (filters.selectedCompetency) {
                        return true;
                    }
                    return false;
                }

                // Create a new folder
                scope.createFolder = scope.myStuffFns.createFolder;

                // Get the date for the item
                scope.date = function (item) { return moment($filter("UTCDate")(item.addedDate)).fromNow() };

                // Filter the items by a tag
                scope.selectTag = function (tag) {
                    scope.setFilter('selectedTag', tag);
                };

                // Filter the items by a type
                scope.selectType = function (type) {
                    scope.setFilter('selectedType', type);
                };

                // Hide the tags tab if there are no items with tags
                scope.noTags = function () {
                    return scope.categorizedItems.tags && (
                        Object.keys(scope.categorizedItems.tags).length == 1 && scope.categorizedItems.tags["No Tags"] == 0
                    );
                }

                scope.canManageItems = function () {
                    if ($rootScope.currentRole) {
                        return $rootScope.currentRole.functions.find(item => item === "stuff_items_manage");
                    }
                    return false;
                }

                // Hide the type tab if there are no items with tags
                scope.noTypes = function () {
                    return scope.categorizedItems.type && Object.keys(scope.categorizedItems.type.length == 0);
                }
            }
        };
    }]);

    // A directive for users to control how their items are viewed
    app.directive('myTransferItems', ['terminology', '$rootScope', 'layoutService', function (terminology, $rootScope, layoutService) {
        return {
            restrict: 'E',
            scope: {
                data: '=',
                options: '=',
                transferfns: '=',
            },
            templateUrl: templatePath + 'mytransferitems.html',
            controller: 'myTransferItemsController',
            link: link
        };

        function link(scope) {

            function isTouchDevice() {
                return (('ontouchstart' in window) ||
                    (navigator.maxTouchPoints > 0) ||
                    (navigator.msMaxTouchPoints > 0));
            }

            scope.isMobile = layoutService.isMobile();
            scope.isTouchDevice = isTouchDevice();
 
            // Table headers for my stuff
            scope.tableHeaders = [
                {
                    name: "Name",
                    minWidth: "200px",
                    colSpan: 2
                },
                {
                    name: "Date added",
                    width: "140px",
                    class: 'hidden-xs hidden-sm'
                },
                {
                    name: "Type",
                    width: "180px",
                    class: 'hidden-xs hidden-sm'
                },
                {
                    name: "Size",
                    width: "100px",
                    class: 'hidden-xs hidden-sm'
                },
                {
                    name: "",
                    width: "25px"
                }
            ];

            // Order options for tasks 
            scope.orderOptions = [
                {
                    name: 'Name',
                    value: {
                        predicate: 'title',
                        reverse: false
                    },
                },
                {
                    name: 'Date added',
                    value: {
                        predicate: 'addedDate',
                        reverse: false
                    },
                },
                {
                    name: 'Type',
                    value: {
                        predicate: 'itemType',
                        reverse: false
                    },
                },
                {
                    name: 'Size',
                    value: {
                        predicate: 'fileSize',
                        reverse: false
                    },
                },
                {
                    name: '',
                    disableSort: true,
                    value: {
                        predicate: '',
                        reverse: false
                    },
                },
            ];

            // Currently selected order option
            scope.currentOrder = scope.orderOptions[1];

            // Filter the items by a search query
            scope.search = function (query) {
                scope.transferfns.search(query);
            }

            scope.goToRootFolder = function () {
                $rootScope.$broadcast('UpdateItems');
            }

            scope.setItemTypeFilter = function (itemType) {
                scope.transferfns.setFilter('selectedType', itemType.value);
            }

            scope.goToTransferRootFolder = function () {
                $rootScope.$broadcast('UpdateTransferItems');
            }
        }
    }]);

})();