Skip to content

Commit d73bddf

Browse files
compactcompact
committed
initial commit
0 parents  commit d73bddf

16 files changed

+977
-0
lines changed

‎.editorconfig

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# http://editorconfig.org
2+
root = true
3+
4+
[*]
5+
indent_style = space
6+
indent_size = 2
7+
end_of_line = lf
8+
charset = utf-8
9+
trim_trailing_whitespace = true
10+
insert_final_newline = true

‎.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/.tmp/
2+
/bower_components/
3+
/node_modules/

‎.jshintrc

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"node": true,
3+
"es5": true,
4+
"esnext": true,
5+
"bitwise": true,
6+
"camelcase": true,
7+
"curly": true,
8+
"eqeqeq": true,
9+
"immed": true,
10+
"indent": 2,
11+
"latedef": true,
12+
"newcap": true,
13+
"noarg": true,
14+
"quotmark": "single",
15+
"regexp": true,
16+
"undef": true,
17+
"unused": true,
18+
"strict": true,
19+
"trailing": true,
20+
"smarttabs": true,
21+
"white": true
22+
}

‎Gruntfile.js

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
module.exports = function (grunt) {
2+
3+
// Load grunt tasks automatically
4+
require('load-grunt-tasks')(grunt);
5+
6+
// Time how long tasks take. Can help when optimizing build times
7+
require('time-grunt')(grunt);
8+
9+
grunt.initConfig({
10+
pkg: grunt.file.readJSON('package.json'),
11+
library: grunt.file.readJSON('bower.json'),
12+
concat: {
13+
options: {
14+
separator: ''
15+
},
16+
library: {
17+
src: [
18+
'src/module.js',
19+
'.tmp/templates.js',
20+
'src/service.js',
21+
'src/directive.js',
22+
],
23+
dest: 'dist/<%= library.name %>.js'
24+
},
25+
css: {
26+
src: [
27+
'src/<%= library.name %>.css',
28+
],
29+
dest: 'dist/<%= library.name %>.css'
30+
}
31+
},
32+
uglify: {
33+
options: {
34+
banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
35+
},
36+
jid: {
37+
files: {
38+
'dist/<%= library.name %>.min.js': ['<%= concat.library.dest %>']
39+
}
40+
}
41+
},
42+
jshint: {
43+
beforeConcat: {
44+
src: ['Gruntfile.js', 'src/**/*.js']
45+
},
46+
afterConcat: {
47+
src: [
48+
'<%= concat.library.dest %>'
49+
]
50+
},
51+
options: {
52+
// options here to override JSHint defaults
53+
globals: {
54+
jQuery: true,
55+
console: true,
56+
module: true,
57+
document: true,
58+
angular: true
59+
},
60+
globalstrict: false
61+
}
62+
},
63+
cssmin: {
64+
minify: {
65+
expand: true,
66+
cwd: 'src',
67+
src: ['*.css'],
68+
dest: 'dist',
69+
ext: '.min.css'
70+
}
71+
},
72+
ngtemplates: {
73+
'angular-bootstrap-lightbox': {
74+
cwd: 'src',
75+
src: '*.html',
76+
dest: '.tmp/templates.js',
77+
options: {
78+
htmlmin: {
79+
collapseBooleanAttributes: true,
80+
collapseWhitespace: true,
81+
removeAttributeQuotes: true,
82+
removeComments: true,
83+
removeEmptyAttributes: false,
84+
removeRedundantAttributes: true
85+
}
86+
}
87+
}
88+
},
89+
});
90+
91+
grunt.registerTask('default', [
92+
'ngtemplates',
93+
'jshint:beforeConcat',
94+
'concat',
95+
'jshint:afterConcat',
96+
'uglify',
97+
'cssmin',
98+
]);
99+
};

‎README.md

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
# angular-bootstrap-lightbox
2+
3+
This lightbox displays images using an AngularUI Bootstrap Modal.
4+
5+
[angular-loading-bar](https://github.com/chieffancypants/angular-loading-bar) is used to show the loading progress of the current image.
6+
7+
## Install
8+
9+
Stylesheet with dependencies:
10+
11+
```html
12+
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
13+
<link rel="stylesheet" href="bower_components/angular-loading-bar/build/loading-bar.css">
14+
<link rel="stylesheet" href="bower_components/angular-bootstrap-lightbox/dist/angular-bootstrap-lightbox.css">
15+
```
16+
17+
Script with dependencies:
18+
19+
```html
20+
<script src="bower_components/angular/angular.js"></script>
21+
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
22+
<script src="bower_components/angular-loading-bar/build/loading-bar.js"></script>
23+
<script src="bower_components/angular-bootstrap-lightbox/dist/angular-bootstrap-lightbox.js"></script>
24+
```
25+
26+
Add the module as a dependency:
27+
28+
```js
29+
angular.module('app', ['angular-bootstrap-lightbox']);
30+
```
31+
32+
## Example
33+
34+
Gallery:
35+
36+
```html
37+
<ul ng-controller="GalleryCtrl">
38+
<li ng-repeat="image in images">
39+
<a ng-click="openLightboxModal($index)">
40+
<img ng-src="{{image.thumbUrl}}" class="img-thumbnail" alt="">
41+
</a>
42+
</li>
43+
</ul>
44+
```
45+
46+
Controller:
47+
48+
```js
49+
angular.module('app').controller('GalleryCtrl', function ($scope, Lightbox) {
50+
$scope.images = [
51+
{
52+
'url': '1.jpg', // required property
53+
'width': 123, // required property
54+
'height': 456, // required property
55+
'thumbUrl': 'thumb1.jpg',
56+
'caption': 'Optional caption'
57+
},
58+
{
59+
'url': '2.gif',
60+
'width': 789,
61+
'height': 1012,
62+
'thumbUrl': 'thumb2.jpg'
63+
},
64+
{
65+
'url': '3.png',
66+
'width': 345,
67+
'height': 678,
68+
'thumbUrl': 'thumb3.png'
69+
}
70+
];
71+
72+
$scope.openLightboxModal = function (index) {
73+
Lightbox.openModal($scope.images, index);
74+
};
75+
});
76+
```

‎bower.json

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"name": "angular-bootstrap-lightbox",
3+
"version": "0.1.0",
4+
"main": [
5+
"dist/angular-bootstrap-lightbox.js",
6+
"dist/angular-bootstrap-lightbox.css"
7+
],
8+
"ignore": [
9+
"src",
10+
".*",
11+
"Gruntfile.js",
12+
"package.json"
13+
],
14+
"dependencies": {
15+
"angular": "~1.2.14",
16+
"angular-bootstrap": "~0.9.0",
17+
"angular-loading-bar": "~0.2.0"
18+
},
19+
"devDependencies": {
20+
"angular-mocks": "~1.2.14",
21+
"angular-scenario": "~1.2.14"
22+
}
23+
}

‎dist/angular-bootstrap-lightbox.css

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
.lightbox-nav {
2+
position: relative;
3+
margin-bottom: 12px; /* the font-size of .btn-xs */
4+
text-align: center;
5+
font-size: 0; /* prevent the otherwise inherited font-size and line-height from adding extra space to the bottom of this div */
6+
}
7+
8+
.lightbox-nav .btn-group {
9+
vertical-align: top;
10+
}
11+
12+
.lightbox-nav .close {
13+
/* absolutely position this in order to center the nav buttons */
14+
position: absolute;
15+
top: 0;
16+
right: 0;
17+
}
18+
19+
.lightbox-image-container {
20+
position: relative;
21+
text-align: center; /* center the image */
22+
}
23+
24+
/* the caption overlays the top left corner of the image */
25+
.lightbox-image-caption {
26+
position: absolute;
27+
top: 0;
28+
left: 0;
29+
margin: 0.5em 0.9em; /* the left and right margins are offset by 0.4em for the span box-shadow */
30+
color: #000;
31+
font-size: 1.5em;
32+
font-weight: bold;
33+
text-align: left;
34+
text-shadow: 0.1em 0.1em 0.2em rgba(255, 255, 255, 0.5);
35+
}
36+
37+
.lightbox-image-caption span {
38+
padding-top: 0.1em;
39+
padding-bottom: 0.1em;
40+
background-color: rgba(255, 255, 255, 0.75);
41+
/* pad the left and right of each line of text */
42+
box-shadow: 0.4em 0 0 rgba(255, 255, 255, 0.75),
43+
-0.4em 0 0 rgba(255, 255, 255, 0.75);
44+
}

0 commit comments

Comments
 (0)