{"id":18020759,"url":"https://github.com/themyth92/ng-bootstrap-lightbox","last_synced_at":"2025-10-08T10:53:53.717Z","repository":{"id":32680089,"uuid":"36268857","full_name":"themyth92/ng-bootstrap-lightbox","owner":"themyth92","description":"An angular lightbox using AngularUI modal","archived":false,"fork":false,"pushed_at":"2017-06-07T07:05:36.000Z","size":991,"stargazers_count":17,"open_issues_count":0,"forks_count":3,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-09-16T12:40:18.737Z","etag":null,"topics":["angular-bootstrap-ligthbox","angularjs","lightbox2"],"latest_commit_sha":null,"homepage":"http://themyth92.com/project/ng-bootstrap-lightbox/index.html","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/themyth92.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-05-26T03:12:23.000Z","updated_at":"2021-10-04T08:21:12.000Z","dependencies_parsed_at":"2022-07-20T00:02:33.298Z","dependency_job_id":null,"html_url":"https://github.com/themyth92/ng-bootstrap-lightbox","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/themyth92/ng-bootstrap-lightbox","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themyth92%2Fng-bootstrap-lightbox","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themyth92%2Fng-bootstrap-lightbox/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themyth92%2Fng-bootstrap-lightbox/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themyth92%2Fng-bootstrap-lightbox/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/themyth92","download_url":"https://codeload.github.com/themyth92/ng-bootstrap-lightbox/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themyth92%2Fng-bootstrap-lightbox/sbom","scorecard":{"id":879337,"data":{"date":"2025-08-11","repo":{"name":"github.com/themyth92/ng-bootstrap-lightbox","commit":"b44c086723ccf066834b3edb654273c4661a4ad1"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":3,"checks":[{"name":"Code-Review","score":0,"reason":"Found 0/26 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Vulnerabilities","score":10,"reason":"0 existing vulnerabilities detected","details":null,"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}}]},"last_synced_at":"2025-08-24T07:27:26.549Z","repository_id":32680089,"created_at":"2025-08-24T07:27:26.549Z","updated_at":"2025-08-24T07:27:26.549Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278931659,"owners_count":26070788,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-08T02:00:06.501Z","response_time":56,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular-bootstrap-ligthbox","angularjs","lightbox2"],"created_at":"2024-10-30T06:07:32.169Z","updated_at":"2025-10-08T10:53:53.689Z","avatar_url":"https://github.com/themyth92.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ng-bootstrap-lightbox\n\n## Introduction\n\nThis angular module follows [Lightbox2](http://lokeshdhakar.com/projects/lightbox2/) implementation but make use of [AngularUI Bootstrap Modal](http://angular-ui.github.io/bootstrap/#/modal) and CSS3 animation to work with AngularJS without the need of jQuery.\n\n## Demo\n\n#### [Demo](https://themyth92.com/project/ng-bootstrap-lightbox/index.html)\n\n## Setup\n\n0. Dependancy :\n\n - [AngularJS (\u003e= 1.4)](https://angularjs.org/)\n - [AngularUI Bootstrap Modal (\u003e= 0.14.3)](http://angular-ui.github.io/bootstrap/#/modal)\n\n1. Installation :\n - [Download and extract](https://github.com/themyth92/ng-bootstrap-lightbox/archive/master.zip)\n - `bower install ng-bootstrap-lightbox`\n\n2. Include stylesheet in your app\n\n ```html   \n \u003clink rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" type=\"text/css\"/\u003e\n\u003clink rel=\"stylesheet\" href=\"dist/css/lightbox.min.css\" type=\"text/css\"\u003e\n ```\n \n3. Include scripts in your app : \n \n ```html\n \u003cscript src=\"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js\"\u003e \u003c/script\u003e\n \u003cscript src=\"dist/js/bootstrap-modal.min.js\"\u003e\u003c/script\u003e\n \u003cscript src=\"dist/js/lightbox.min.js\"\u003e\u003c/script\u003e\n ```\n \n4. Inject `ngBootstrapLightbox` as module dependancy to your current `app`\n\n ```js\nangular.module('app', ['ngBootstrapLightbox']);\n ```\n\n## Basic example : \n\n### Markup :\n\n```html\n\u003cdiv ng-controller=\"Ctrl as Ctrl\"\u003e\n  \u003cdiv ng-repeat=\"image in Ctrl.album\"\u003e\n   \u003cimg ng-src=\"{{image.thumb}}\" ng-click = \"Ctrl.open($index)\"/\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n```\n\n### Controller : \n\n```js\nangular\n   .module('app')\n   \n   //inject lightbox service to your controller\n   .controller('Ctrl', function(lightbox){\n    \n    //list available lightbox default options\n    this.options = {\n      fadeDuration: 0.7,\n      resizeDuration: 0.5,\n      fitImageInViewPort: true,\n      positionFromTop: 20,  \n      showImageNumberLabel: false,\n      alwaysShowNavOnTouchDevices: false,\n      wrapAround: false\n    };\n    \n    this.album = [{\n      src: '1.png',\n      thumb: '1-thumb.png',\n      caption: 'Optional caption 1'\n    }, {\n      src: '2.png',\n      thumb: '2-thumb.png',\n      caption: 'Optional caption 2'\n    }, {\n      src: '3.png', \n      thumb: '3-thumb.png',\n      caption: 'Optional caption 3'\n    }]; \n    \n    this.open = function($index){\n      lightbox.open(this.album, $index, this.options);\n    }\n   }); \n```\n\n## Configuration\n\n### Album array\n\nEach `object` of `album` array inside controller may contains 3 properties :\n\nProperties | Requirement | Description\n----------|-------------|------------\nsrc | Required | The source image to your thumbnail that you want to with use lightbox when user click on `thumbnail` image\ncaption | Optional | Your caption corresponding with your image \nthumb | Optional | Source of your thumbnail. You can use whatever properties your like, just to make sure that your `controller` understand that `properties`.\n\n### Lightbox options\n\nProperties | Default | Description\n-----------|---------|------------\nfadeDuration | **0.7** seconds | *duration* starting when the **src** image is **loaded** to **fully appear** onto screen.\nresizeDuration | **0.5** seconds | *duration* starting when Lightbox container  **change** its dimension from a *default/previous image* to the *current image* when the *current image* is **loaded**.\nfitImageInViewPort | **true** | Determine whether lightbox will use the natural image *width/height*  or change the image *width/height* to fit the view of current window. Change this option to **true** to prevent problem when image too big compare to browser windows.\npositionFromTop | **20** px | The position of lightbox from the top of window browser\nshowImageNumberLabel | **false** | Determine whether to show the image number to user. The default text shown is `Image IMAGE_NUMBER of ALBUM_LENGTH`\nalwaysShowNavOnTouchDevices | **false** | Determine whether to show `left/right` arrow to user on Touch devices.\nwrapAround | **false** | Determine whether to move to the start of the album when user reaches the end of album and vice versa. Set it to **true** to enable this feature.\n\n### Touch support\n\nAdded `ngTouch` support.\n\n1. Include `ngTouch` scripts :\n\n ```html\n \u003cscript src = 'https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-touch.js'\u003e\u003c/script\u003e\n ```\n \n2. Inject `ngTouch` as your module dependancy\n ```js\n angular.module('app', ['ngBootstrapLightbox', 'ngTouch']);\n ```\n\nYou can now swipe left or right of your image on your mobile devices. \n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthemyth92%2Fng-bootstrap-lightbox","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthemyth92%2Fng-bootstrap-lightbox","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthemyth92%2Fng-bootstrap-lightbox/lists"}