'use strict';

/**
 * @ngdoc overview
 * @name monarchLivingApp
 * @description
 * # monarchLivingApp
 *
 * Main module of the application.
 */
angular
  .module('monarchLiving', [
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ngRoute',
    'ngSanitize',
    'ngTouch'
  ])
  .config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl',
        controllerAs: 'main'
      })
      .when('/about', {
        templateUrl: 'views/about.html',
        controller: 'AboutCtrl',
        controllerAs: 'about'
      })
      .otherwise({
        redirectTo: '/'
      });
  });

var monarchLiving = angular.module('monarchLiving', []);

monarchLiving.directive('items', function(){
    return {
        
        restrict: 'EA',
        replace: true,
        scope: true,
        templateUrl: 'templates/items.html',
        link: function(scope, element, attrs){
            console.log('test');
            scope.showMe = false;
            scope.toggle = function toggle(){
                scope.showMe = !scope.showMe;
            };
        }
        
        
    }
        
    
    
});

monarchLiving.controller('ngrCtrl', function($scope){
    $scope.collection = ['img/2.jpg', 'img/5.jpg', 'img/9.jpg','img/12.jpg', 'img/13.jpg', 'img/20.jpg', 'img/27.jpg', 'img/8.jpg', 'img/14.jpg', 'img/17.jpg', 'img/19.jpg', 'img/24.jpg'];
       
});

// Instantiate the Bootstrap carousel
$('.multi-item-carousel').carousel({
  interval: 4000
});

// for every slide in carousel, copy the next slide's item in the slide.
// Do the same for the next, next item.
$('.multi-item-carousel .item').each(function(){
  var next = $(this).next();
  if (!next.length) {
    next = $(this).siblings(':first');
  }
  next.children(':first-child').clone().appendTo($(this));
  
  for (var i=0;i<4;i++) {
    next=next.next();
    if (!next.length) {
      next = $(this).siblings(':first');
    }

    next.children(':first-child').clone().appendTo($(this));
  }
});