midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

More refactoring, still very broken

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-06-11 22:51:45 +02:00
parent d5d90afc74
commit 62f471df1e
23 changed files with 428 additions and 356 deletions
Download patch file Download diff file Expand all files Collapse all files

60
UI/Image/SlideShow.ts
View file

@ -1,46 +1,22 @@
import {UIEventSource} from "../../Logic/UIEventSource";
import {UIElement} from "../UIElement";
import Combine from "../Base/Combine";
// @ts-ignore
import $ from "jquery"
import BaseUIElement from "../BaseUIElement";
export class SlideShow extends UIElement {
export class SlideShow extends BaseUIElement {
private readonly _embeddedElements: UIEventSource<UIElement[]>
private readonly _element: HTMLElement;
constructor(
embeddedElements: UIEventSource<UIElement[]>) {
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) {
embeddedElements: UIEventSource<BaseUIElement[]>) {
super()
const el = document.createElement("div")
this._element = el;
el.classList.add("slick-carousel")
require("slick-carousel")
if(this._embeddedElements.data.length == 0){
return;
}
// @ts-ignore
$('.slick-carousel').not('.slick-initialized').slick({
el.slick({
autoplay: true,
arrows: true,
dots: true,
@ -48,8 +24,18 @@ export class SlideShow extends UIElement {
variableWidth: true,
centerMode: true,
centerPadding: "60px",
adaptive: true
adaptive: true
});
embeddedElements.addCallbackAndRun(elements => {
for (const element of elements ?? []) {
element.SetClass("slick-carousel-content")
}
});
}
protected InnerConstructElement(): HTMLElement {
return this._element;
}
}