angular-punch-card/example.html at master · grsmv/angular-punch-card · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="dist/punch-card.js"></script>
    <link href="dist/punch-card.css" rel="stylesheet"/>

    <style>
        body {
            font-family: Helvetica, Arial, sans-serif;
        }
    </style>

    <script>
        var app = angular.module("app", ["punchCard", "ngRoute"]);
        app.config(function ($routeProvider) {
            $routeProvider.when("/", {
                controller: "IndexController",
                template: '<div punch-card data="punchCardData" singular="statement" plural="statemets"></div>'
            });
        });

        app.controller("IndexController", function ($scope) {
            $scope.punchCardData = [
                [12, 17, 10, 20, 0, 12, 12, 12, 12, 20, 12, 10],
                [1,  2,  3,  4,  5, 6,  7,  8,  9,  10, 11, 12],
                [10, 30, 0,  0,  0, 0,  0,  0,  0,  0,  0,  20, 0, 0, 0, 24],
                [],
                [3, 10],
                [],
                [0, 0, 0, 0, 0, 0, 0, 9, 0, 0, 0, 0, 0, 10, 12, 14, 20, 10, 3]
            ];
        })
    </script>
</head>
<body>
    <div ng-app="app">
        <ng-view></ng-view>
    </div>
</body>
</html>