Fix build

This commit is contained in:
Pieter Vander Vennet 2020-11-06 03:17:27 +01:00
parent 3f8b6e88d3
commit dc1dde6c3d
8 changed files with 191 additions and 32 deletions

129
AllTranslationAssets.ts Normal file

File diff suppressed because one or more lines are too long

View file

@ -1,7 +1,7 @@
import {UIEventSource} from "../../Logic/UIEventSource"; import {UIEventSource} from "../../Logic/UIEventSource";
import {UIElement} from "../UIElement"; import {UIElement} from "../UIElement";
import {FixedUiElement} from "../Base/FixedUiElement";
import Combine from "../Base/Combine"; import Combine from "../Base/Combine";
import Svg from "../../Svg";
export class SlideShow extends UIElement { export class SlideShow extends UIElement {
@ -25,18 +25,17 @@ export class SlideShow extends UIElement {
this.dumbMode = false; this.dumbMode = false;
const self = this; const self = this;
this._prev = new FixedUiElement("<div class='prev-button'>" + this._prev = new Combine([
"<div class='vspan'></div>" + "<div class='vspan'></div>",
"<img src='assets/arrow-left-smooth.svg' alt='Prev'/>" + Svg.arrow_left_smooth_img]).SetStyle("prev-button")
"</div>")
.onClick(() => { .onClick(() => {
const current = self._currentSlide.data; const current = self._currentSlide.data;
self.MoveTo(current - 1); self.MoveTo(current - 1);
}); });
this._next = new FixedUiElement("<div class='next-button'>" + this._next = new Combine([
"<div class='vspan'></div>" + "<div class='vspan'></div>",
"<img src='assets/arrow-right-smooth.svg' alt='Next'/>" + Svg.arrow_right_smooth_img])
"</div>") .SetClass("next-button")
.onClick(() => { .onClick(() => {
const current = self._currentSlide.data; const current = self._currentSlide.data;
self.MoveTo(current + 1); self.MoveTo(current + 1);

View file

@ -1,6 +1,11 @@
export class Img { export class Img {
public static runningFromConsole = false;
static AsData(source:string){ static AsData(source:string){
if(this.runningFromConsole){
return source;
}
return `data:image/svg+xml;base64,${(btoa(source))}`; return `data:image/svg+xml;base64,${(btoa(source))}`;
} }

View file

@ -6,6 +6,8 @@ import {SubtleButton} from "../Base/SubtleButton";
import CheckBox from "./CheckBox"; import CheckBox from "./CheckBox";
import {AndOrTagConfigJson} from "../../Customizations/JSON/TagConfigJson"; import {AndOrTagConfigJson} from "../../Customizations/JSON/TagConfigJson";
import {MultiTagInput} from "./MultiTagInput"; import {MultiTagInput} from "./MultiTagInput";
import Svg from "../../Svg";
import {Img} from "../Img";
class AndOrConfig implements AndOrTagConfigJson { class AndOrConfig implements AndOrTagConfigJson {
public and: (string | AndOrTagConfigJson)[] = undefined; public and: (string | AndOrTagConfigJson)[] = undefined;
@ -30,13 +32,13 @@ export default class AndOrTagInput extends InputElement<AndOrTagConfigJson> {
super(); super();
const self = this; const self = this;
this._isAndButton = new CheckBox( this._isAndButton = new CheckBox(
new SubtleButton("./assets/ampersand.svg", null).SetClass("small-button"), new SubtleButton(Img.AsData(Svg.ampersand), null).SetClass("small-button"),
new SubtleButton("./assets/or.svg", null).SetClass("small-button"), new SubtleButton(Img.AsData(Svg.or), null).SetClass("small-button"),
this._isAnd); this._isAnd);
this._addBlock = this._addBlock =
new SubtleButton("./assets/addSmall.svg", "Add an and/or-expression") new SubtleButton(Img.AsData(Svg.addSmall), "Add an and/or-expression")
.SetClass("small-button") .SetClass("small-button")
.onClick(() => {self.createNewBlock()}); .onClick(() => {self.createNewBlock()});
@ -63,7 +65,7 @@ export default class AndOrTagInput extends InputElement<AndOrTagConfigJson> {
private createDeleteButton(elementId: string): UIElement { private createDeleteButton(elementId: string): UIElement {
const self = this; const self = this;
return new SubtleButton("./assets/delete.svg", null).SetClass("small-button") return new SubtleButton(Img.AsData(Svg.delete_icon), null).SetClass("small-button")
.onClick(() => { .onClick(() => {
for (let i = 0; i < self._subAndOrs.length; i++) { for (let i = 0; i < self._subAndOrs.length; i++) {
if (self._subAndOrs[i].id === elementId) { if (self._subAndOrs[i].id === elementId) {

View file

@ -80,7 +80,8 @@ export class MultiInput<T> extends InputElement<T[]> {
self._value.ping(); self._value.ping();
}); });
const moveDownBtn = new FixedUiElement("<img src='./assets/down.svg' style='max-width: 1.5em; margin-left: 5px;'>") const moveDownBtn =
Svg.down_ui().SetStyle('max-width: 1.5em; margin-left: 5px;display:block;')
.onClick(() => { .onClick(() => {
const v = self._value.data[i]; const v = self._value.data[i];
self._value.data[i] = self._value.data[i + 1]; self._value.data[i] = self._value.data[i + 1];
@ -98,7 +99,8 @@ export class MultiInput<T> extends InputElement<T[]> {
} }
const deleteBtn = new FixedUiElement("<img src='./assets/delete.svg' style='max-width: 1.5em;width:1.5em; margin-left: 5px;'>") const deleteBtn =
Svg.delete_icon_ui().SetStyle('max-width: 1.5em;width:1.5em; margin-left: 5px;')
.onClick(() => { .onClick(() => {
self._value.data.splice(i, 1); self._value.data.splice(i, 1);
self._value.ping(); self._value.ping();

View file

@ -5,6 +5,7 @@ import Combine from "../../Base/Combine";
import {Utils} from "../../../Utils"; import {Utils} from "../../../Utils";
import {FixedUiElement} from "../../Base/FixedUiElement"; import {FixedUiElement} from "../../Base/FixedUiElement";
import {VariableUiElement} from "../../Base/VariableUIElement"; import {VariableUiElement} from "../../Base/VariableUIElement";
import Svg from "../../../Svg";
/** /**
* A single opening hours range, shown on top of the OH-picker table * A single opening hours range, shown on top of the OH-picker table
@ -28,7 +29,8 @@ export default class OpeningHoursRange extends UIElement {
self.InnerUpdate(el); self.InnerUpdate(el);
}) })
this._deleteRange = new FixedUiElement("<img src='./assets/delete.svg'>") this._deleteRange =
Svg.delete_icon_ui()
.SetClass("oh-delete-range") .SetClass("oh-delete-range")
.onClick(() => { .onClick(() => {
oh.data.weekday = undefined; oh.data.weekday = undefined;

View file

@ -1,7 +1,9 @@
import {Img} from "./UI/Img"
Img.runningFromConsole = true;
import {UIElement} from "./UI/UIElement"; import {UIElement} from "./UI/UIElement";
// We HAVE to mark this while importing // We HAVE to mark this while importing
UIElement.runningFromConsole = true; UIElement.runningFromConsole = true;
import {AllKnownLayouts} from "./Customizations/AllKnownLayouts"; import {AllKnownLayouts} from "./Customizations/AllKnownLayouts";
import {Layout} from "./Customizations/Layout"; import {Layout} from "./Customizations/Layout";
import {readFileSync, writeFile, writeFileSync} from "fs"; import {readFileSync, writeFile, writeFileSync} from "fs";
@ -82,7 +84,7 @@ function generateWikiEntry(layout: Layout){
if(layout.maintainer !== "" && layout.maintainer !== "MapComplete"){ if(layout.maintainer !== "" && layout.maintainer !== "MapComplete"){
auth=`Yes, by ${layout.maintainer};` auth=`Yes, by ${layout.maintainer};`
} }
return `{{service_item return `{{service_item
|name= [https://pietervdvn.github.io/MapComplete/${layout.id}.html ${layout.id}] |name= [https://pietervdvn.github.io/MapComplete/${layout.id}.html ${layout.id}]
|region= Worldwide |region= Worldwide
|lang= ${languages} |lang= ${languages}
@ -95,15 +97,14 @@ function generateWikiEntry(layout: Layout){
const alreadyWritten = [] const alreadyWritten = []
function createIcon(iconPath: string, size: number) { function createIcon(iconPath: string, size: number, layout: Layout) {
let name = iconPath.split(".").slice(0, -1).join("."); let name = iconPath.split(".").slice(0, -1).join(".");
if(name.startsWith("./")){ if (name.startsWith("./")) {
name = name.substr(2) name = name.substr(2)
} }
const newname = `${name}${size}.png` const newname = `${name}${size}.png`
.replace(/\//g,"_") .replace(/\//g, "_")
.replace("assets_","assets/generated/"); .replace("assets_", "assets/generated/");
if (alreadyWritten.indexOf(newname) >= 0) { if (alreadyWritten.indexOf(newname) >= 0) {
return newname; return newname;
@ -143,11 +144,21 @@ function createManifest(layout: Layout, relativePath: string) {
const icons = []; const icons = [];
let icon = layout.icon; let icon = layout.icon;
if (icon.endsWith(".svg")) { if (icon.endsWith(".svg") || icon.startsWith("<svg") || icon.startsWith("<?xml")) {
// This is an svg. Lets create the needed pngs! // This is an svg. Lets create the needed pngs!
let path = layout.icon;
if (layout.icon.startsWith("<")) {
// THis is already the svg
path = "./assets/generated/" + layout.id + "_logo.svg"
writeFileSync(path, layout.icon)
}
const sizes = [72, 96, 120, 128, 144, 152, 180, 192, 384, 512]; const sizes = [72, 96, 120, 128, 144, 152, 180, 192, 384, 512];
for (const size of sizes) { for (const size of sizes) {
const name = createIcon(icon, size); const name = createIcon(path, size, layout);
icons.push({ icons.push({
src: name, src: name,
sizes: size + "x" + size, sizes: size + "x" + size,
@ -155,12 +166,12 @@ function createManifest(layout: Layout, relativePath: string) {
}) })
} }
icons.push({ icons.push({
src: icon, src: path,
sizes: "513x513", sizes: "513x513",
type: "image/svg" type: "image/svg"
}) })
} else { } else {
console.log(icon)
throw "Icon is not an svg for " + layout.id throw "Icon is not an svg for " + layout.id
} }
const ogTitle = Translations.W(layout.title).InnerRender(); const ogTitle = Translations.W(layout.title).InnerRender();
@ -198,6 +209,13 @@ function createLandingPage(layout: Layout) {
<meta property="og:title" content="${ogTitle}"> <meta property="og:title" content="${ogTitle}">
<meta property="og:description" content="${ogDescr}">` <meta property="og:description" content="${ogDescr}">`
let icon = layout.icon;
if (icon.startsWith("<?xml") || icon.startsWith("<svg")) {
// This already is an svg
icon = `./assets/generated/${layout.id}_icon.svg`
writeFileSync(icon, layout.icon);
}
let output = template let output = template
.replace(`./manifest.manifest`, `./${enc(layout.id)}.webmanifest`) .replace(`./manifest.manifest`, `./${enc(layout.id)}.webmanifest`)
.replace("<!-- $$$OG-META -->", og) .replace("<!-- $$$OG-META -->", og)
@ -205,12 +223,12 @@ function createLandingPage(layout: Layout) {
.replace("Loading MapComplete, hang on...", `Loading MapComplete theme <i>${ogTitle}</i>...`) .replace("Loading MapComplete, hang on...", `Loading MapComplete theme <i>${ogTitle}</i>...`)
.replace("<!-- $$$CUSTOM-CSS -->", customCss) .replace("<!-- $$$CUSTOM-CSS -->", customCss)
.replace(`<link rel="icon" href="assets/add.svg" sizes="any" type="image/svg+xml">`, .replace(`<link rel="icon" href="assets/add.svg" sizes="any" type="image/svg+xml">`,
`<link rel="icon" href="${layout.icon}" sizes="any" type="image/svg+xml">`); `<link rel="icon" href="${icon}" sizes="any" type="image/svg+xml">`);
try { try {
output = output output = output
.replace(/<!-- DECORATION 0 START -->.*<!-- DECORATION 0 END -->/s, `<img src='${layout.icon}' width="100%" height="100%">`) .replace(/<!-- DECORATION 0 START -->.*<!-- DECORATION 0 END -->/s, `<img src='${icon}' width="100%" height="100%">`)
.replace(/<!-- DECORATION 1 START -->.*<!-- DECORATION 1 END -->/s, `<img src='${layout.icon}' width="100%" height="100%">`); .replace(/<!-- DECORATION 1 START -->.*<!-- DECORATION 1 END -->/s, `<img src='${icon}' width="100%" height="100%">`);
} catch (e) { } catch (e) {
console.warn("Error while applying logo: ", e) console.warn("Error while applying logo: ", e)
} }

View file

@ -12,6 +12,7 @@
} }
.prev-button { .prev-button {
display: block;
background-color: black; background-color: black;
opacity: 0.3; opacity: 0.3;
width: 4.0em; width: 4.0em;
@ -31,6 +32,7 @@
.next-button { .next-button {
display: block;
background-color: black; background-color: black;
opacity: 0.3; opacity: 0.3;
width: 4.0em; width: 4.0em;