service+controller

angular.module('myApp.services', ['ngResource']).
	service('Projects', ['$resource', '$filter',
		function($resource, $filter)
		{
			var data = $resource('https://dl.dropboxusercontent.com/s/9jogzvut6v8xz62/works.json',{}, {getData: {method: 'GET'}});
			this.getAllProjects = function() {
				return data;
			}
			this.getProjectsByID = function(projectID) {
				return $filter('filter')(data, {id: projectID})
			}
		}
	]).
controller('projectCtrl', ['$scope', '$routeParams', '$filter', '$sce', '$location', 'Projects', function($scope, $routeParams, $filter, $sce, $location, Projects) {
  
  var project = Projects.getProjectsByID($routeParams.projectID);
    $scope.project = project[0];
    $scope.allSlides = $scope.project.slides;
    $scope.slides = $scope.allSlides;//.slice(0, 3);
  
   $scope.loadSlide = function(){
    var lastSlideIndex = $scope.slides.length;
    var newSlides = $scope.allSlides.slice(lastSlideIndex, lastSlideIndex+3);
    $scope.slides = $scope.slides.concat(newSlides);
  };

  $scope.nextSlide = function(index){
    if(index < $scope.project.slides.length)
    {
      var nextSlide =  angular.element('.slide-' + (index+1) );
      var pos = nextSlide.position().left;
      angular.element('.project-details').animate({
        'scrollLeft': '+='+pos,
      });
    }
  };

}])