angular-cropify/index.html at master · homerjam/angular-cropify · 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
<html ng-app="ExampleApp">

<head>

    <title>angular-cropify</title>

    <link rel="stylesheet" type="text/css" href="angular-cropify.css">
    <link rel="stylesheet" type="text/css" href="example/styles.css">

</head>

<body ng-controller="ExampleCtrl as ctrl">

    <div class="spacer"></div>

    <div class="wrapper">

        <hj-cropify coords="ctrl.coords" aspect-ratio="ctrl.aspectRatio">

            <div class="padding"></div>

            <img ng-src="example/test.jpg">

        </hj-cropify>

        <ul class="controls">
            <li><button ng-click="ctrl.coords = {}">Reset</button></li>
            <li><button ng-click="ctrl.setCrop()">Set Crop</button></li>
            <li>Aspect Ratio: <input type="number" ng-model="ctrl.aspectRatio" min="0"></li>
        </ul>

        <pre>{{ctrl.coords}}</pre>

    </div>

    <script type="text/javascript" src="bower_components/angular/angular.min.js"></script>
    <script type="text/javascript" src="angular-cropify.js"></script>
    <script type="text/javascript" src="example/app.js"></script>

</body>

</html>