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

Further work on infobox, styling everything, removing clutter

Browse source
This commit is contained in:
Pieter Vander Vennet 2020-06-27 03:06:51 +02:00
parent 2acd53d150
commit 0b4016b65d
48 changed files with 1283 additions and 454 deletions
Download patch file Download diff file Expand all files Collapse all files

2
UI/Image/ImageCarousel.ts
View file

@ -35,7 +35,7 @@ export class ImageCarousel extends UIElement {
this.slideshow = new SlideShow(
new FixedUiElement("<b>Afbeeldingen</b>"),
uiElements,
new FixedUiElement("<i>Geen afbeeldingen gevonden</i>"));
new FixedUiElement("")).HideOnEmpty(true);
}
InnerRender(): string {

54
UI/Image/WikimediaImage.ts
View file

@ -1,36 +1,52 @@
import {UIEventSource} from "../UIEventSource";
import {UIElement} from "../UIElement";
import {SimpleImageElement} from "./SimpleImageElement";
import {LicenseInfo, Wikimedia} from "../../Logic/Wikimedia";
export class WikimediaImage extends UIElement {
static allLicenseInfos: any = {};
private _imageMeta: UIEventSource<LicenseInfo>;
private _imageLocation : string;
constructor(source: string) {
super(undefined)
this._imageLocation = source;
if (WikimediaImage.allLicenseInfos[source] !== undefined) {
this._imageMeta = WikimediaImage.allLicenseInfos[source];
} else {
this._imageMeta = new UIEventSource<LicenseInfo>(new LicenseInfo());
WikimediaImage.allLicenseInfos[source] = this._imageMeta;
}
constructor(source: UIEventSource<string>) {
super(source)
const meta = new UIEventSource<LicenseInfo>(new LicenseInfo());
this.ListenTo(meta);
this._imageMeta = meta;
this._source.addCallback(() => {
Wikimedia.LicenseData(source.data, (info) => {
meta.setData(info);
})
});
this._source.ping();
this.ListenTo(this._imageMeta);
const self = this;
Wikimedia.LicenseData(source, (info) => {
self._imageMeta.setData(info);
})
}
protected InnerRender(): string {
let url = Wikimedia.ImageNameToUrl(this._source.data);
let url = Wikimedia.ImageNameToUrl(this._imageLocation, 500, 400);
url = url.replace(/'/g, '%27');
return "<div class='imgWithAttr'><img class='attributedImage' src='" + url + "' " +
"alt='" + this._imageMeta.data.description + "' >" +
"<br /><span class='attribution'>" +
"<a href='https://commons.wikimedia.org/wiki/"+this._source.data+"' target='_blank'><b>" + (this._source.data) + "</b></a> <br />" +
(this._imageMeta.data.artist ?? "Unknown artist") + " " + (this._imageMeta.data.licenseShortName ?? "") +
"</span>" +
const wikimediaLink =
"<a href='https://commons.wikimedia.org/wiki/" + this._imageLocation + "' target='_blank'>" +
"<img class='wikimedia-link' src='./assets/wikimedia-commons-white.svg' alt='Wikimedia Commons Logo'/>" +
"</a> ";
const attribution =
"<span class='attribution-author'>" + (this._imageMeta.data.artist ?? "") + "</span>" + " <span class='license'>" + (this._imageMeta.data.licenseShortName ?? "") + "</span>";
const image = "<img src='" + url + "' " + "alt='" + this._imageMeta.data.description + "' >";
return "<div class='imgWithAttr'>" +
image +
"<div class='attribution'>" +
wikimediaLink +
attribution +
"</div>" +
"</div>";
}