You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP
Socket
Book a DemoInstallSign in
Socket

angularjs-lightbox

Package Overview
Dependencies
Maintainers
1
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

angularjs-lightbox - npm Package Compare versions

Comparing version

to
1.1.0

2

package.json
{
"name": "angularjs-lightbox",
"version": "1.0.0",
"version": "1.1.0",
"description": "A minimal lightbox directive for AngularJS.",

@@ -5,0 +5,0 @@ "repository": {

@@ -1,4 +0,7 @@

Angular Lightbox
----------------
# AngularJS Lightbox
![npm](https://img.shields.io/npm/v/angularjs-lightbox.svg)
![npm](https://img.shields.io/npm/l/angularjs-lightbox.svg)
![npm](https://img.shields.io/npm/dt/angularjs-lightbox.svg)
A minimal lightbox directive for AngularJS. No other dependencies!

@@ -10,9 +13,15 @@

Include the directive (Javascript and CSS) in your angular application:
This project is available as npm package `angularjs-lightbox`:
```
npm install angularjs-lightbox
```
Include the directive sources (Javascript and CSS) in your AngularJS application:
```html
<script src="https://code.angularjs.org/1.7.8/angular.min.js"></script>
<script src="src/angular-lightbox.js"></script>
<link type="text/css" rel="stylesheet" href="src/angular-lightbox.css" />
<script src="angularjs-lightbox/src/angular-lightbox.js"></script>
<link type="text/css" rel="stylesheet" href="angularjs-lightbox/src/angular-lightbox.css">
```

@@ -37,2 +46,3 @@

Example for a list:
```html

@@ -47,2 +57,3 @@ <ul lightbox="myImages">

Example for a single image:
```html

@@ -49,0 +60,0 @@ <span lightbox="imageUrl">

@@ -14,3 +14,3 @@ /**

scope: {
lightbox: '=lightbox'
lightbox: '<*'
},

@@ -49,6 +49,6 @@ link: function(scope, element, attrs) {

'<span class="angular-lightbox-inner">' +
'<a href class="previous" title="Previous">«</a>' +
'<img src="" />' +
'<a href class="next" title="Next">»</a>' +
'<a href class="close" title="Close">×</a>' +
'<a href class="previous" title="Previous">&#8249;</a>' +
'<img src="">' +
'<a href class="next" title="Next">&#8250;</a>' +
'<a href class="close" title="Close">&times;</a>' +
'</span>' +

@@ -61,2 +61,7 @@ '</div>'

// Hide navigation buttons for single image
if (scope.images.length === 1) {
dom.classList.add('single-image');
}
// Find image matching clicked link

@@ -80,3 +85,5 @@ var index = scope.images.indexOf(clickedElement.getAttribute('href'));

scope.showNext();
} else if (e.target.classList.contains('close')) {
} else if (e.target.classList.contains('close')
|| e.target.classList.contains('angular-lightbox-overlay')) {
// Click on close or empty space
scope.closeLightbox();

@@ -99,3 +106,2 @@ }

scope.onKeyDown = function(event) {
console.log('toto')
switch (event.which) {

@@ -102,0 +108,0 @@ case 37: // Left arrow

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet