angular-aui/index.html at master · pearj/angular-aui · 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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<!DOCTYPE html>
<html ng-app="angular-aui-examples">
  <head>
    <script src="/bower_components/angular/angular.js"></script>

    <script type="text/javascript" src="dist/angular-aui.js"></script>
    <script type="text/javascript" src="index.js"></script>

    <!-- AUI -->
    <!--dependencies-->
    <script src="/bower_components/requirejs/require.js"></script>
    <!--/ dependencies -->
    <link rel="stylesheet" href="/lib/aui/5.7.0/css/aui.css" media="all">
    <!--[if IE 9]><link rel="stylesheet" href="/lib/aui/5.7.0/css/aui-ie9.css" media="all"><![endif]-->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="/lib/aui/5.7.0/js/aui.js"></script>
    <script src="/lib/aui/5.7.0/js/aui-datepicker.js"></script>
    <link rel="stylesheet" href="/lib/aui/5.7.0/css/aui-experimental.css" media="all">
    <script src="/lib/aui/5.7.0/js/aui-experimental.js"></script>
    <!--/ AUI -->

  </head>
  <body>
    <nav class="aui-navgroup aui-navgroup-horizontal">
      <div class="aui-navgroup-inner">
        <div class="aui-navgroup-primary">
          <ul class="aui-nav">
              <li class="aui-nav-selected"><a href="#">Angular AUI examples</a></li>
          </ul>
        </div><!-- .aui-navgroup-primary -->
        <div class="aui-navgroup-secondary">
          <ul class="aui-nav">
              <!--TODO-->
          </ul>
        </div><!-- .aui-navgroup-secondary -->
      </div><!-- .aui-navgroup-inner -->
    </nav><!-- .aui-navgroup -->
    <div class="aui-page-panel">
      <div class="aui-page-panel-inner">
        <section class="aui-page-panel-content">
          <div ng-controller="DatePickerCtrl" class="aui-group">
            <h2>DatePicker</h2>
            <input type="date" aui-date-picker ng-model="model" />
            <code>
              $scope.model = {{model}};
            </code>
          </div>

          <div ng-controller="InlineDialogCtrl" class="aui-group">
            <h2>InlineDialog</h2>
            <a href="#" aui-inline-dialog options="{persistent: true}">
              Open inline dialog
              <div aui-inline-dialog-content>
                <h2>Hello {{name}}!</h2><button class="aui-button" ng-click="$hide()">Close</button></form>
              </div>
            </a>
            <input type="text" ng-model="name"/>
          </div>

          <div ng-controller="Select2Ctrl" class="aui-group">
            <h2>Select2</h2>
            <select aui-select2 ng-model="selectedCountry">
              <option ng-repeat="country in countries"
                        ng-selected="{{country.id == selectedCountry.id}}"
                        value="{{country}}">{{country.text}}</option>
            </select>
            <input type="button" value="Change" ng-click="selectedCountry = countries[1]"/>
            Country: <input type="text" ng-model="selectedCountry.id" disabled/>
          </div>
        </section>
      </div>
    </div>
  </body>
</html>