import {UIEventSource} from "../../Logic/UIEventSource"; import {UIElement} from "../UIElement"; import Combine from "../Base/Combine"; // @ts-ignore import $ from "jquery" export class SlideShow extends UIElement { private readonly _embeddedElements: UIEventSource constructor( embeddedElements: UIEventSource) { super(embeddedElements); this._embeddedElements = embeddedElements; this._embeddedElements.addCallbackAndRun(elements => { for (const element of elements ?? []) { element.SetClass("slick-carousel-content") } }) } InnerRender(): string { return new Combine( this._embeddedElements.data, ).SetClass("block slick-carousel") .Render(); } Update() { super.Update(); for (const uiElement of this._embeddedElements.data) { uiElement.Update(); } } protected InnerUpdate(htmlElement: HTMLElement) { super.InnerUpdate(htmlElement); require("slick-carousel") if(this._embeddedElements.data.length == 0){ return; } $('.slick-carousel').not('.slick-initialized').slick({ autoplay: true, arrows: true, dots: true, lazyLoad: 'progressive', variableWidth: true, centerMode: true, centerPadding: "60px", adaptive: true }); } }