/*global loadRules,saveRules,loadCloseSetting,saveCloseSetting*/
angular.module('options', []).controller('options', options);

function options($scope, $timeout) {
    $scope.matchCopy = {
        exact: 'exactly',
        base: 'up to the ?',
        hash: 'up to the #'
    };

    function reloadRules() {
        if($scope.rule) {
            postSaved();
        }
        $scope.rule = {match: 'hash'};
        loadRules((rules) => {
            $scope.rules = rules;
            $scope.$apply();
        });
    }

    function postSaved() {
        $scope.settingsSaved = true;
        $timeout(() => {
            $scope.settingsSaved = false;
        }, 3000);
        $scope.$apply();
    }

    $scope.saveRule = () => {
        if($scope.rule.url) {
            delete $scope.editingRule;
            $scope.ruleSaved = false;
            $scope.rules[$scope.rule.url] = $scope.rule.match;
            saveRules($scope.rules, reloadRules);
        }
    };

    $scope.deleteRule = (url) => {
        delete $scope.rules[url];
        saveRules($scope.rules, reloadRules);
    };

    $scope.editRule = (url, match) => {
        $scope.editingRule = url;
        $scope.rule = {
            url: url,
            match: match
        };
    };

    $scope.editing = (url) => url === $scope.editingRule;

    loadCloseSetting((close) => {
        $scope.close = close;
        $scope.$apply();
        watchClose();
    });

    function watchClose() {
        var ignoreFirst = true;
        $scope.$watch('close', (close) => {
            if(ignoreFirst) {
                ignoreFirst = false;
            } else {
                saveCloseSetting(close, postSaved);
            }
        });
    }

    reloadRules();
}

/*global loadRules,saveRules,loadCloseSetting,saveCloseSetting*/
angular.module('options', [])
    .controller('options', options)
    .directive('dropdown', dropdown);

function options($scope, $timeout) {
    /* Rules table */
    $scope.matchCopy = {
        exact: 'exactly',
        base: 'up to the ?',
        hash: 'up to the #'
    };

    function reloadRules(dontDisplaySaved) {
        if(!dontDisplaySaved) {
            displaySaved();
        }
        $scope.rule = {match: 'hash'};
        loadRules((rules) => {
            $scope.rules = rules;
            $scope.$apply();
        });
    }

    $scope.addRule = () => {
        if($scope.newRule.url) {
            $scope.rules[$scope.newRule.url] = $scope.newRule.match;
            saveRules($scope.rules, reloadRules);
        }
    };

    $scope.deleteRule = (url) => {
        delete $scope.rules[url];
        saveRules($scope.rules, reloadRules);
    };

    $scope.select = (url) => $scope.selected = url;
    reloadRules(true);

    /* Other settings */
    loadCloseSetting((close) => {
        $scope.close = close;
        $scope.$apply();
        watchClose();
    });

    function watchClose() {
        var ignoreFirst = true;
        $scope.$watch('close', (close) => {
            if(ignoreFirst) {
                ignoreFirst = false;
            } else {
                saveCloseSetting(close, displaySaved);
            }
        });
    }

    /* Settings saved notiication */
    function displaySaved() {
        $scope.settingsSaved = true;
        $timeout(() => {
            $scope.settingsSaved = false;
        }, 3000);
        $scope.$apply();
    }
}

function dropdown() {
    return {
        scope: { options: '=', value: '=' },
        template: '<div class="dropdown">' +
            '<button ng-click="toggle()">{{options[value]}}</button>' +
            '<div class="dropdown-menu">' +
            '<div ng-class="dropdownMenu"' +
            'ng-repeat="(val, name) in options" ng-click="click(val)">' +
            '{{name}}</div></div></div>',
        controller: function($scope) {
            $scope.dropdownMenu = {open: false};
            $scope.toggle = () => {
                $scope.dropdownMenu.open = !$scope.dropdownMenu.open;
            };
            $scope.click = (val) => {
                $scope.value = val;
                $scope.dropdownMenu.open = false;
            };
        }
    };
}

add dropdown directive, cleaning up controller a bit