vk-ng-image-slider
Version:
Angular Image slider with lightbox. An Angular responsive image slider with lightbox popup. Also support youtube url, image base64 string and mp4 video urls and base64 string.
215 lines (208 loc) • 10.4 kB
TypeScript
import * as i0 from '@angular/core';
import { OnChanges, OnInit, DoCheck, AfterViewInit, OnDestroy, EventEmitter, ChangeDetectorRef, ElementRef, SimpleChanges } from '@angular/core';
import * as i1 from '@angular/common';
import { SafeResourceUrl, DomSanitizer } from '@angular/platform-browser';
declare class NgImageSliderService {
constructor();
isBase64(str: any): boolean;
base64FileExtension(str: any): any;
orderArray(arr?: any[], orderType?: string): any[];
/**
* Verify if image exist
* @input url: string: Image url
* @returns boolean: true/false
*/
isImageExist(url: any): Promise<unknown>;
static ɵfac: i0.ɵɵFactoryDeclaration<NgImageSliderService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<NgImageSliderService>;
}
declare class NgImageSliderComponent implements OnChanges, OnInit, DoCheck, AfterViewInit, OnDestroy {
private cdRef;
private platformId;
imageSliderService: NgImageSliderService;
private elRef;
sliderMainDivWidth: number;
imageParentDivWidth: number;
imageObj: Array<object>;
ligthboxImageObj: Array<object>;
totalImages: number;
leftPos: number;
effectStyle: string;
speed: number;
sliderPrevDisable: boolean;
sliderNextDisable: boolean;
slideImageCount: number;
sliderImageWidth: number;
sliderImageReceivedWidth: number | string;
sliderImageHeight: number;
sliderImageReceivedHeight: number | string;
sliderImageSizeWithPadding: number;
autoSlideCount: number;
stopSlideOnHover: boolean;
autoSlideInterval: any;
showArrowButton: boolean;
textDirection: string;
imageMargin: number;
sliderOrderType: string;
fallbackMainImage: string;
fallbackThumbImage: string;
private swipeCoord?;
private swipeTime?;
ligthboxShow: boolean;
activeImageIndex: number;
visiableImageIndex: number;
sliderMain: any;
imageDiv: any;
set imageSize(data: any);
infinite: boolean;
imagePopup: boolean;
set direction(dir: string);
set animationSpeed(data: number);
images: Array<object>;
set fallbackImage(images: object);
set slideImage(count: any);
set autoSlide(count: any);
set showArrow(flag: any);
set orderType(data: string);
videoAutoPlay: boolean;
paginationShow: boolean;
arrowKeyMove: boolean;
manageImageRatio: boolean;
showVideoControls: boolean;
set defaultActiveImage(activeIndex: number);
lazyLoading: boolean;
imageClick: EventEmitter<number>;
arrowClick: EventEmitter<object>;
lightboxArrowClick: EventEmitter<object>;
lightboxClose: EventEmitter<object>;
onResize(event: any): void;
handleKeyboardEvent(event: KeyboardEvent): void;
constructor(cdRef: ChangeDetectorRef, platformId: Object, imageSliderService: NgImageSliderService, elRef: ElementRef);
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
ngOnChanges(changes: SimpleChanges): void;
ngDoCheck(): void;
setSliderImages(imgObj: any): void;
setSliderWidth(): void;
imageOnClick(index: any): void;
imageAutoSlide(): void;
imageMouseEnterHandler(): void;
prev(): void;
next(): void;
prevImg(): void;
nextImg(): void;
infinitePrevImg(): void;
infiniteNextImg(): void;
getVisiableIndex(): void;
/**
* Disable slider left/right arrow when image moving
*/
sliderArrowDisableTeam(msg: any): void;
nextPrevSliderButtonDisable(msg?: any): void;
showLightbox(): void;
close(): void;
lightboxArrowClickHandler(event: any): void;
/**
* Swipe event handler
* Reference from https://stackoverflow.com/a/44511007/2067646
*/
swipe(e: TouchEvent, when: string): void;
static ɵfac: i0.ɵɵFactoryDeclaration<NgImageSliderComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<NgImageSliderComponent, "ng-image-slider", never, { "imageSize": { "alias": "imageSize"; "required": false; }; "infinite": { "alias": "infinite"; "required": false; }; "imagePopup": { "alias": "imagePopup"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "animationSpeed": { "alias": "animationSpeed"; "required": false; }; "images": { "alias": "images"; "required": false; }; "fallbackImage": { "alias": "fallbackImage"; "required": false; }; "slideImage": { "alias": "slideImage"; "required": false; }; "autoSlide": { "alias": "autoSlide"; "required": false; }; "showArrow": { "alias": "showArrow"; "required": false; }; "orderType": { "alias": "orderType"; "required": false; }; "videoAutoPlay": { "alias": "videoAutoPlay"; "required": false; }; "paginationShow": { "alias": "paginationShow"; "required": false; }; "arrowKeyMove": { "alias": "arrowKeyMove"; "required": false; }; "manageImageRatio": { "alias": "manageImageRatio"; "required": false; }; "showVideoControls": { "alias": "showVideoControls"; "required": false; }; "defaultActiveImage": { "alias": "defaultActiveImage"; "required": false; }; "lazyLoading": { "alias": "lazyLoading"; "required": false; }; }, { "imageClick": "imageClick"; "arrowClick": "arrowClick"; "lightboxArrowClick": "lightboxArrowClick"; "lightboxClose": "lightboxClose"; }, never, never, true, never>;
}
declare class SliderCustomImageComponent implements OnChanges {
imageSliderService: NgImageSliderService;
private sanitizer;
YOUTUBE: string;
IMAGE: string;
VIDEO: string;
fileUrl: SafeResourceUrl;
fileExtension: string;
type: string;
imageLoading: boolean;
showVideo: boolean;
videoAutoPlay: boolean;
showVideoControls: number;
currentImageIndex: number;
imageIndex: number;
speed: number;
imageUrl: any;
isVideo: boolean;
alt: String;
title: String;
direction: string;
ratio: boolean;
lazy: boolean;
fallbackImage: string;
constructor(imageSliderService: NgImageSliderService, sanitizer: DomSanitizer, document: any);
ngOnChanges(changes: SimpleChanges): void;
setUrl(): void;
videoClickHandler(event: any): void;
errorHandler(event: any): Promise<void>;
static ɵfac: i0.ɵɵFactoryDeclaration<SliderCustomImageComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<SliderCustomImageComponent, "custom-img", never, { "showVideo": { "alias": "showVideo"; "required": false; }; "videoAutoPlay": { "alias": "videoAutoPlay"; "required": false; }; "showVideoControls": { "alias": "showVideoControls"; "required": false; }; "currentImageIndex": { "alias": "currentImageIndex"; "required": false; }; "imageIndex": { "alias": "imageIndex"; "required": false; }; "speed": { "alias": "speed"; "required": false; }; "imageUrl": { "alias": "imageUrl"; "required": false; }; "isVideo": { "alias": "isVideo"; "required": false; }; "alt": { "alias": "alt"; "required": false; }; "title": { "alias": "title"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "ratio": { "alias": "ratio"; "required": false; }; "lazy": { "alias": "lazy"; "required": false; }; "fallbackImage": { "alias": "fallbackImage"; "required": false; }; }, {}, never, never, true, never>;
}
declare class SliderLightboxComponent implements OnInit, AfterViewInit, OnDestroy {
private cdRef;
private sanitizer;
private elRef;
private document;
totalImages: number;
nextImageIndex: number;
popupWidth: number;
marginLeft: number;
imageFullscreenView: boolean;
lightboxPrevDisable: boolean;
lightboxNextDisable: boolean;
showLoading: boolean;
effectStyle: string;
speed: number;
title: string;
currentImageIndex: number;
private swipeLightboxImgCoord?;
private swipeLightboxImgTime?;
lightboxDiv: any;
lightboxImageDiv: any;
images: Array<object>;
set imageIndex(index: number);
set show(visiableFlag: boolean);
videoAutoPlay: boolean;
direction: string;
paginationShow: boolean;
set animationSpeed(data: number);
infinite: boolean;
arrowKeyMove: boolean;
showVideoControls: boolean;
fallbackImage: string;
close: EventEmitter<any>;
prevImage: EventEmitter<any>;
nextImage: EventEmitter<any>;
onResize(event: any): void;
handleKeyboardEvent(event: KeyboardEvent): void;
constructor(cdRef: ChangeDetectorRef, sanitizer: DomSanitizer, elRef: ElementRef, document: any);
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
setPopupSliderWidth(): void;
closeLightbox(): void;
prevImageLightbox(): void;
nextImageLightbox(): void;
nextPrevDisable(): void;
applyButtonDisableCondition(): void;
getImageData(): void;
resetState(): void;
/**
* Swipe event handler
* Reference from https://stackoverflow.com/a/44511007/2067646
*/
swipeLightboxImg(e: TouchEvent, when: string): void;
static ɵfac: i0.ɵɵFactoryDeclaration<SliderLightboxComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<SliderLightboxComponent, "slider-lightbox", never, { "images": { "alias": "images"; "required": false; }; "imageIndex": { "alias": "imageIndex"; "required": false; }; "show": { "alias": "show"; "required": false; }; "videoAutoPlay": { "alias": "videoAutoPlay"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "paginationShow": { "alias": "paginationShow"; "required": false; }; "animationSpeed": { "alias": "animationSpeed"; "required": false; }; "infinite": { "alias": "infinite"; "required": false; }; "arrowKeyMove": { "alias": "arrowKeyMove"; "required": false; }; "showVideoControls": { "alias": "showVideoControls"; "required": false; }; "fallbackImage": { "alias": "fallbackImage"; "required": false; }; }, { "close": "close"; "prevImage": "prevImage"; "nextImage": "nextImage"; }, never, never, true, never>;
}
declare class NgImageSliderModule {
static ɵfac: i0.ɵɵFactoryDeclaration<NgImageSliderModule, never>;
static ɵmod: i0.ɵɵNgModuleDeclaration<NgImageSliderModule, never, [typeof i1.CommonModule, typeof NgImageSliderComponent, typeof SliderCustomImageComponent, typeof SliderLightboxComponent], [typeof NgImageSliderComponent]>;
static ɵinj: i0.ɵɵInjectorDeclaration<NgImageSliderModule>;
}
export { NgImageSliderComponent, NgImageSliderModule, NgImageSliderService };