angular-bootstrap-lightbox v0.12.0

This is a lightbox made with AngularUI Bootstrap Modal. It can be used in any Angular app. View the project and instructions on GitHub.

The first item is a WebM that gets embedded directly. The second and fourth items are YouTube videos that get embedded using the ng-videosharing-embed library. See the readme for details.

index.html

<ul class="gallery gallery5" ng-controller="GalleryCtrl">
  <li ng-repeat="image in images">
    <a ng-click="Lightbox.openModal(images, $index)">
      <img ng-src="{{'\{\{image.thumbUrl\}\}'}}" class="img-thumbnail">
    </a>
  </li>
</ul>

demo5.js

angular.module('demo5', ['bootstrapLightbox']);

angular.module('demo5').controller('GalleryCtrl', function ($scope, Lightbox) {
  $scope.images = [
    {
      'type': 'video',
      'url': 'https://www.youtube.com/watch?v=N7TkK2joi4I',
      'thumbUrl': 'https://i.ytimg.com/vi/N7TkK2joi4I/1.jpg'
    },
    {
      'url': 'https://upload.wikimedia.org/wikipedia/commons/0/07/Kamp_Alexisdorf_3.jpg',
      'thumbUrl': 'https://upload.wikimedia.org/wikipedia/commons/thumb/0/07/Kamp_Alexisdorf_3.jpg/120px-Kamp_Alexisdorf_3.jpg'
    },
    {
      'type': 'video',
      'url': 'https://www.youtube.com/watch?v=khrAhOrSZQc',
      'thumbUrl': 'https://i.ytimg.com/vi/khrAhOrSZQc/1.jpg'
    }
  ];

  $scope.Lightbox = Lightbox;
});