Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Finished Challenges #2

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Finished Challenges #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f7358d4
forgot initial commit
Jsdwyer26 Jan 20, 2016
13548c4
finished challenges
Jsdwyer26 Jan 20, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 48 additions & 0 deletions app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
//I. Create module...give it a name "app"
var app = angular.module('myApp', []);

//II. Controller
app.controller('MovieCtrl', ['$scope', function($scope) {
$scope.welcome = 'Test :)';
$scope.moviesToWatch = [
{
title: "Ex Machina",
genre: "Action",
year: "2015"
},
{
title: "Ocean's 11",
genre: "Action",
year: "2000"
},
{
title: "Burn After Reading",
genre: "Comedy",
year: "2008"
},
{
title: "There Will Be Blood",
genre: "Drama",
year: "2007"
},
{
title: "Magnolia",
genre: "Drama",
year: "2000"
}
];
$scope.createMovie = function() {
var newMovieAdd = $scope.newMovie;
$scope.moviesToWatch.push(newMovieAdd);
$scope.newMovie = {};
$scope.newMovieForm = false;
};

$scope.deleteMovie = function(movie) {
var movieIndex = $scope.movies.indexOf(movie);
$scope.movies.splice(movieIndex, 1);
};

}]);


73 changes: 73 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
<!DOCTYPE html>
<html ng-app= "myApp">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="app.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link href="main.css" rel="stylesheet">
</head>
<body ng-app>

<div class = "col-md-6 col-md-offset-3">
<div ng-controller="MovieCtrl">
<h2 class="text-center">Movies</h2><hr>
<!-- <label for="search_movies">Search Movies</label> -->

<!-- <button class="btn btn-primary" ng-click="newMovieForm=true" ng-hide="newMovieForm">Add a Movie</button> -->

<input type="text" class="form-control" placeholder="Search Movies" ng-model="searchMovies.title">
<h3 class= "text-center">
<ng-pluralize count="moviesToWatch.length"
when="{ '0': 'No movies to watch',
'1': 'One movie to watch',
'other': '{} movies to watch'}">
</ng-pluralize>
</h3>
<table class="table table-bordered">
<thead>
<tr>
<th>Movie Title</th>
<th>Movie Genre</th>
<th>Date</th>
<th>View</th>
<th>Delete <span class="glyphicon glyphicon-trash" aria-hidden="true"></span></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(key, value) in moviesToWatch | orderBy: 'title' | filter:searchMovies | limitTo:3">
<td>{{ value.title }}</td>
<td>{{ value.genre }}</td>
<td>{{ value.year }}</td>
<td></td>
<td><a href="javascript:void(0)" ng-click="deleteMovie(movie)"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a></td>
</tr>
</tbody>
</table>

<button class="btn btn-primary" ng-click="newMovieForm=true" ng-hide="newMovieForm">Add a Movie</button>

<div ng-show= "newMovieForm">
<h4>Add a movie!</h4>
<form ng-submit="createMovie()">
<div class= "form-group">
<input type="text" class="form-control" placeholder="title" ng-model="newMovie.title">
</div>
<div class= "form-group">
<input type="text" class="form-control" placeholder="genre" ng-model="newMovie.genre">
</div>
<div class= "form-group">
<input type="text" class="form-control" placeholder="year" ng-model="newMovie.year">
</div>
<input type="submit" class="btn btn-primary">
</form>

</div>

</div>
</div>


</body>
</html>
Empty file added main.css
View file
Open in desktop
Empty file.