Commit 55c3288c authored by Pesah Arthur's avatar Pesah Arthur
Browse files

Add commentaries to the code

parent 5d9d406b
'use strict';
// Load the main module (the application) and its dependancies
angular.module('movieSearch', [
'ngCookies',
'ngResource',
'ngRoute',
])
]) // no ';' here!
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/all.html',
controller: 'searchCtrl'
.when('/', { // The root of the website (http://127.0.0.1:9000/#/)
templateUrl: 'views/all.html', // it loads this template...
controller: 'searchCtrl' // ... with this controller
})
.when('/detail/:idMovie', {
.when('/detail/:idMovie', { // :idMovie is a variable (ex: 'tt1234567')
templateUrl: 'views/detail.html',
controller: 'detailCtrl'
})
.otherwise({
redirectTo: '/'
redirectTo: '/' // if the url doesn't make sense, redirect to the root
});
});
angular.module('movieSearch')
.controller('searchCtrl', function searchCtrl($scope, searchFactory) {
// load the list of the movies from the resource in searchFactory
$scope.items = searchFactory.allMoviesResource.get(successFn, errorFn);
function successFn() {
$scope.items = $scope.items["Search"]
$scope.items = $scope.items["Search"] // first key of the dictionary loaded contains an array
console.log($scope.items)
}
function errorFn() {
......@@ -13,6 +14,7 @@ angular.module('movieSearch')
})
.controller('detailCtrl', function searchCtrl($scope, $routeParams, searchFactory) {
// rootParams : $rootParams.idMovie contains the value of idMovie passed in the url (ex : 'tt1234567')
$scope.movie = searchFactory.detailMovieResource.get({idMovie: $routeParams.idMovie});
function successFn() {
......
......@@ -3,7 +3,7 @@ angular.module('movieSearch')
.filter('searchFor', function(){
return function(arr, searchString){
if(!searchString){
if(!searchString){ // if nothing is typed in the search bar
return arr;
}
......
......@@ -2,10 +2,14 @@ angular.module('movieSearch')
.factory('searchFactory', function($resource) {
// url for all movies with 'la' inside
var allMoviesResource = $resource('http://www.omdbapi.com/?s=la&y=&plot=short&r=json&page=1');
// i=:idMovie (look at the url) means that we can pass idMovie as a parameter to the resource
var detailMovieResource = $resource('http://www.omdbapi.com/?i=:idMovie&plot=short&r=json',
{idMovie:'@idMovie'}
);
// a factory always return a dictionary of the variables and functions we want to access outside of the factory
return {
allMoviesResource: allMoviesResource,
detailMovieResource: detailMovieResource
......
<div class="bar">
<!-- ng-model means that searchString becomes an element of the $scope -->
<input type="text" ng-model="searchString" placeholder="Enter your search terms" />
</div>
<ul>
<li ng-repeat="i in items | searchFor:searchString">
<li ng-repeat="i in items | searchFor:searchString"> <!-- Loop and filter (look at filter.js) -->
<a href="#/detail/{{i.imdbID}}"><img ng-src="{{i.Poster}}" /></a>
<p>{{i.Title}}</p>
</li>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment