lespoupeesrusses/promethee

<script type="text/ng-template" id="promethee/components/slider/edit/move">
  <%= render 'promethee/edit/move_header', type: 'slider' %>
      <div class="header">Slider</div>
      <div ng-controller="SliderMoveController">
        <div ng-show="components.length" class="row carousel">
          <div class="col-1 col-xs-1" ng-click="selectedIndex = (selectedIndex == 0) ? (components.length - 1) : (selectedIndex - 1)"><span><</span></div>
          <div class="col-8 col-xs-8" ng-repeat="component in components" ng-show="$index == selectedIndex">
            <ng-include src="'promethee/move/component'"></ng-include>
          </div>
          <div class="col-1 col-xs-1" ng-click="selectedIndex = (selectedIndex == components.length - 1) ? 0 : (selectedIndex + 1)"><span>></span></div>
        </div>
        <div class="dots">
          <span ng-repeat="component in components" ng-click="setIndex($index)" ng-class="($index == selectedIndex) ? 'active' : ''">&bull;</span>
        </div>
      </div>
    </div>
  </div>
</script>

<script>
  promethee.controller('SliderMoveController', ['$scope', function($scope) {
    $scope.parent = $scope.component;
    $scope.components = $scope.component.children;
    $scope.selectedIndex = 0

    $scope.setIndex = function(index) {
      $scope.selectedIndex = index
    }
  }]);
</script>