Security News
The Unpaid Backbone of Open Source: Solo Maintainers Face Increasing Security Demands
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
ngx-cdk-lightbox
Advanced tools
Custom implementation of CDK to display image gallery in lightbox.
npm
npm install ngx-cdk-lightbox --save
yarn
yarn add ngx-cdk-lightbox
import { LightboxModule, LightboxService } from 'ngx-cdk-lightbox';
@NgModule({
imports: [
...
LightboxModule,
],
providers: [
...
LightboxService,
],
})
export class SomeModule { }
this.lightboxService.open(GalleryImageInterface[], GalleryConfigInterface);
interface GalleryImageInterface
{
source: string;
description?: string;
copyright?: string;
}
interface GalleryConfigInterface
{
enableZoom?: boolean;
zoomSize?: number|'originalSize';
enableImageClick?: boolean;
loopGallery?: boolean;
enableImageCounter?: boolean;
imageCounterText?: string;
enableCloseIcon?: boolean;
closeIcon?: string;
enableArrows?: boolean;
arrowRight?: string;
arrowLeft?: string;
enableImagePreloading?: boolean;
startingIndex?: number;
enableAnimations?: boolean;
}
key | value |
---|---|
source | path to image |
description | optional - description of image |
copyright | optional - copyright info |
key | type | default | value |
---|---|---|---|
enableZoom | boolean | false | display zoom on mouse hover over image |
zoomSize | number, 'originalSize' | 'originalSize' | zoom size, number for zoom multiplication, originalSize for original image size |
enableImageClick | boolean | true | enable click on image to navigate to next or previous photo |
loopGallery | boolean | true | loop gallery after last photo or before first photo |
enableImageCounter | boolean | true | display current image counter |
imageCounterText | string | 'IMAGE_INDEX photo of IMAGE_COUNT' | format for image counter |
enableCloseIcon | boolean | true | display close icon |
closeIcon | string | https://material.io/tools/icons/?icon=close&style=baseline | HTML string containing close icon |
enableArrows | boolean | true | display next/prev icons |
arrowRight | string | https://material.io/tools/icons/?icon=keyboard_arrow_right&style=baseline | HTML string containing right arrow |
arrowLeft | string | https://material.io/tools/icons/?icon=keyboard_arrow_left&style=baseline | HTML string containing left arrow |
enableImagePreloading | boolean | enable/disable image preloading | |
startingIndex | number | 0 | index of starting image |
enableAnimations | boolean | true | enable/disable animations |
@Component({
...
})
export class SomeComponent
{
constructor(private lightboxService: LightboxService)
{
}
public openLightbox():void
{
this.lightboxService.open([
{source: 'assets/images/image1.jpg', copyright: 'unknown'},
{source: 'assets/images/image5.jpg', copyright: 'unknown'},
], {
enableAnimations: false,
});
return;
}
}
You are currently using code that is totally for free and that is fine. But if you want to put a soup on a developer's table anyway, feel free to do so :).
FAQs
Custom implementation of CDK to display image gallery in lightbox.
The npm package ngx-cdk-lightbox receives a total of 106 weekly downloads. As such, ngx-cdk-lightbox popularity was classified as not popular.
We found that ngx-cdk-lightbox demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
Security News
License exceptions modify the terms of open source licenses, impacting how software can be used, modified, and distributed. Developers should be aware of the legal implications of these exceptions.
Security News
A developer is accusing Tencent of violating the GPL by modifying a Python utility and changing its license to BSD, highlighting the importance of copyleft compliance.