MovieQuotesAuthFirebaseWeb/index.html at master · WebDevCourseMaterial/MovieQuotesAuthFirebaseWeb · 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
75
76
<!DOCTYPE html>
<html lang="en" ng-app="moviequotes">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>MovieQuotes</title>

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
 <link rel="stylesheet" href="/css/moviequotes.css">

 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
 <!-- DONE: Add links to Firebase -->
 <!-- Firebase -->
<script src="https://cdn.firebase.com/js/client/2.2.2/firebase.js"></script>
<!-- AngularFire -->
<script src="https://cdn.firebase.com/libs/angularfire/1.0.0/angularfire.min.js"></script>
 <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.js"></script>
 <script src="/js/app.js"></script>
 <script src="/js/modal-controllers.js"></script>
</head>
<body ng-controller="MoviequotesCtrl as moviequotes">
  <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" ng-click="moviequotes.navbarCollapsed = !moviequotes.navbarCollapsed">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">MovieQuotes</a>
      </div>
      <div collapse="moviequotes.navbarCollapsed" class="navbar-collapse">
        <ul class="nav navbar-nav navbar-left">
          <li ng-show="moviequotes.signedIn" ><a ng-click="moviequotes.showAddQuoteDialog()" href="#">Add Quote</a></li>
          <li ng-show="!moviequotes.signedIn" ><a ng-click="moviequotes.showSignInDialog()" href="#">Sign In</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
          <li ng-show="moviequotes.signedIn"><a ng-model="moviequotes.isEditing" ng-click="moviequotes.navbarCollapsed = true" btn-checkbox href="#">{{moviequotes.isEditing ? "Done" : "Edit"}}</a></li>
          <li ng-show="moviequotes.signedIn" ><a ng-click="moviequotes.signOut()" href="#">Sign Out</a></li>
        </ul>
      </div>
    </div>
  </div>

  <div class="container">
    <div class="table-wrapper">
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Quote</th>
            <th>Movie</th>
            <th ng-show="moviequotes.isEditing">Edits</th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="moviequote in moviequotes.items">
            <td>{{moviequote.quote}}</td>
            <td>{{moviequote.movie}}</td>
            <td ng-show="moviequotes.isEditing" class="edit-actions">
              <button ng-show="moviequote.uid == moviequotes.uid" ng-click="moviequotes.showUpdateQuoteDialog(moviequote)" type="button" class="btn btn-xs btn-success">
                <span class="glyphicon glyphicon-pencil"></span>
              </button>
              <button ng-show="moviequote.uid == moviequotes.uid" ng-click="moviequotes.showDeleteQuoteDialog(moviequote)" type="button" class="btn btn-xs btn-danger">
                <span class="glyphicon glyphicon-trash"></span>
              </button>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>

</body>
</html>