midgard/mapcomplete
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix build

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

129
AllTranslationAssets.ts Normal file
View file

File diff suppressed because one or more lines are too long

17
UI/Image/SlideShow.ts
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);

5
UI/Img.ts
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))}`;
} }

10
UI/Input/AndOrTagInput.ts
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) {

6
UI/Input/MultiInput.ts
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();

4
UI/Input/OpeningHours/OpeningHoursRange.ts
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;

46
createLayouts.ts
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)
} }

2
css/slideshow.css
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;