IT工程師數位筆記本

var appModule = angular.module("appModule", []);
appModule.controller("Ctrl", ["$scope", "$timeout", function($scope, $timeout) {
    $scope.naomi = { name: "Naomi", address: "1600 Amphitheatre" };
    $scope.igor = { name: "Igor", address: "123 Somewhere" };
    $scope.vojta = { name: "Vojta", address: "3456 Somewhere Else" };
    $scope.format = "M/d/yy h:mm:ss a";
    $scope.name = "Tobias";
    $scope.hideDialog = function () {
        $scope.dialogIsHidden = true;
        $timeout(function () {
            $scope.dialogIsHidden = false;
        }, 2000);
    };
}]);
appModule.directive('myTabs', function() {
    return {
        restrict: 'E',
        transclude: true,
        scope: {},
        controller: function($scope) {
            var panes = $scope.panes = [];

            $scope.select = function(pane) {
                angular.forEach(panes, function(pane) {
                    pane.selected = false;
                });
                pane.selected = true;
            };

            this.addPane = function(pane) {
                if (panes.length == 0) {
                    $scope.select(pane);
                }
                panes.push(pane);
            };
        },
        templateUrl: 'my-tabs.html'
    };
});
appModule.directive('myPane', function() {
    return {
        require: '^myTabs',
        restrict: 'E',
        transclude: true,
        scope: {
            title: '@'
        },
        link: function(scope, element, attrs, tabsCtrl) {
            tabsCtrl.addPane(scope);
        },
        templateUrl: 'my-pane.html'
    };
});
appModule.directive("myDraggable", ["$document", function($document) {
    return function(scope, elem, attrs) {
        var startX = 0, startY = 0, x = 0, y = 0;
        elem.css({
            position: "relative",
            border: "1px solid red",
            backgroundColor: "lightgrey",
            cursor: "pointer"
        });
        elem.on("mousedown", function(event) {
            // 組織所選對象的默認拖曳操作
            event.preventDefault();
            startX = event.pageX - x;
            startY = event.pageY - y;
            $document.on("mousemove", mousemove);
            $document.on("mouseup", mouseup);
        });
        function mousemove(event) {
            y = event.pageY - startY;
            x = event.pageX - startX;
            elem.css({
                top: y + "px",
                left:  x + "px"
            });
        }
        function mouseup() {
            $document.off("mousemove", mousemove);
            $document.off("mouseup", mouseup);
        }
    }
}]);
appModule.directive("myDialog", function() {
    return {
        restrict: "E",
        transclude: true,
        scope: {
            "close": "&onClose"
        },
        templateUrl: "my-dialog.html",
        link: function (scope, ele, attrs) {
            scope.name = "Jeff";
        }
    };
});
appModule.directive("myCustomer", [function() {
    return {
        restrict: "E",
        scope: {
            customerInfo: "=info"
        },
        transclude: true,
        template: "",
        templateUrl: "tpls.html",
        link: function(scope, element, attrs) {

        }
    };
}]);
appModule.directive("myCurrentTime", ["$timeout", "dateFilter", function($timeout, dateFilter) {
    return {
        link: function (scope, element, attrs) {
            var format, timeoutId;
            function updateTime() {
                //使用內置dateFilter服務
                element.text(dateFilter(new Date(), format));
                //使用內置$filter服務
                //element.text($filter("date")(new Date(), format));
            }
            scope.$watch(attrs.myCurrentTime, function(value) {
                format = value;
                updateTime();
            });
            function scheduleUpdate() {
                timeoutId = $timeout(function() {
                    updateTime();
                    scheduleUpdate();
                }, 1000);
            }
            element.on("$destroy", function() {
                $timeout.cancel(timeoutId);
            });
            scheduleUpdate();
        }
    }
}]);