forked from MapComplete/MapComplete
Removed js files
This commit is contained in:
Pieter Vander Vennet
parent
7b80e945bb
commit
b20be9e132
86 changed files with 0 additions and 5800 deletions
129
UI/AddButton.js
129
UI/AddButton.js
|
|
@ -1,129 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.AddButton = void 0;
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var AddButton = /** @class */ (function (_super) {
|
||||
__extends(AddButton, _super);
|
||||
function AddButton(basemap, changes, options) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this.curentAddSelection = new UIEventSource_1.UIEventSource("");
|
||||
_this.SELECTING_POI = "selecting_POI";
|
||||
_this.PLACING_POI = "placing_POI";
|
||||
/*State is one of:
|
||||
* "": the default stated
|
||||
* "select_POI": show a 'select which POI to add' query (skipped if only one option exists)
|
||||
* "placing_point": shown while adding a point
|
||||
* ""
|
||||
*/
|
||||
_this.state = new UIEventSource_1.UIEventSource("");
|
||||
_this.zoomlevel = basemap.Location;
|
||||
_this.ListenTo(_this.zoomlevel);
|
||||
_this._options = options;
|
||||
_this.ListenTo(_this.curentAddSelection);
|
||||
_this.ListenTo(_this.state);
|
||||
_this.state.setData(_this.SELECTING_POI);
|
||||
_this.changes = changes;
|
||||
var self = _this;
|
||||
basemap.map.on("click", function (e) {
|
||||
var location = e.latlng;
|
||||
console.log("Clicked at ", location);
|
||||
self.HandleClick(location.lat, location.lng);
|
||||
});
|
||||
basemap.map.on("mousemove", function () {
|
||||
if (self.state.data === self.PLACING_POI) {
|
||||
var icon = "crosshair";
|
||||
for (var _i = 0, _a = self._options; _i < _a.length; _i++) {
|
||||
var option = _a[_i];
|
||||
if (option.name === self.curentAddSelection.data && option.icon !== undefined) {
|
||||
icon = 'url("' + option.icon + '") 32 32 ,crosshair';
|
||||
console.log("Cursor icon: ", icon);
|
||||
}
|
||||
}
|
||||
document.getElementById('leafletDiv').style.cursor = icon;
|
||||
}
|
||||
else {
|
||||
// @ts-ignore
|
||||
document.getElementById('leafletDiv').style.cursor = '';
|
||||
}
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
AddButton.prototype.HandleClick = function (lat, lon) {
|
||||
this.state.setData(this.SELECTING_POI);
|
||||
console.log("Handling click", lat, lon, this.curentAddSelection.data);
|
||||
for (var _i = 0, _a = this._options; _i < _a.length; _i++) {
|
||||
var option = _a[_i];
|
||||
if (this.curentAddSelection.data === option.name) {
|
||||
console.log("PLACING a ", option);
|
||||
var feature = this.changes.createElement(option.tags, lat, lon);
|
||||
option.layerToAddTo.AddNewElement(feature);
|
||||
return;
|
||||
}
|
||||
}
|
||||
};
|
||||
AddButton.prototype.InnerRender = function () {
|
||||
if (this.zoomlevel.data.zoom < 19) {
|
||||
return "Zoom in om een punt toe te voegen";
|
||||
}
|
||||
if (this.state.data === this.SELECTING_POI) {
|
||||
var html = "<form>";
|
||||
for (var _i = 0, _a = this._options; _i < _a.length; _i++) {
|
||||
var option = _a[_i];
|
||||
// <button type='button'> looks SO retarded
|
||||
// the default type of button is 'submit', which performs a POST and page reload
|
||||
html += "<button type='button' class='addPOIoption' value='" + option.name + "'>Voeg een " + option.name + " toe</button><br/>";
|
||||
}
|
||||
html += "</form>";
|
||||
return html;
|
||||
}
|
||||
if (this.state.data === this.PLACING_POI) {
|
||||
return "<div id='clickOnMapInstruction'>Klik op de kaart om een nieuw punt toe te voegen<div>" +
|
||||
"<div id='cancelInstruction'>Klik hier om toevoegen te annuleren</div>";
|
||||
}
|
||||
if (this.curentAddSelection.data === "") {
|
||||
return "<span onclick>Voeg een punt toe...</span>";
|
||||
}
|
||||
return "Annuleer";
|
||||
};
|
||||
AddButton.prototype.InnerUpdate = function (htmlElement) {
|
||||
var self = this;
|
||||
htmlElement.onclick = function (event) {
|
||||
// @ts-ignore
|
||||
if (event.consumed) {
|
||||
return;
|
||||
}
|
||||
if (self.state.data === self.PLACING_POI) {
|
||||
self.state.setData(self.SELECTING_POI);
|
||||
}
|
||||
};
|
||||
var buttons = htmlElement.getElementsByClassName('addPOIoption');
|
||||
var _loop_1 = function (button) {
|
||||
button.onclick = function (event) {
|
||||
self.curentAddSelection.setData(button.value);
|
||||
self.state.setData(self.PLACING_POI);
|
||||
event.consumed = true;
|
||||
};
|
||||
};
|
||||
// @ts-ignore
|
||||
for (var _i = 0, buttons_1 = buttons; _i < buttons_1.length; _i++) {
|
||||
var button = buttons_1[_i];
|
||||
_loop_1(button);
|
||||
}
|
||||
};
|
||||
return AddButton;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.AddButton = AddButton;
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.Button = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var Button = /** @class */ (function (_super) {
|
||||
__extends(Button, _super);
|
||||
function Button(text, onclick, clss) {
|
||||
if (clss === void 0) { clss = ""; }
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._text = text;
|
||||
_this._onclick = onclick;
|
||||
if (clss !== "") {
|
||||
_this._clss = "class='" + clss + "'";
|
||||
}
|
||||
else {
|
||||
_this._clss = "";
|
||||
}
|
||||
return _this;
|
||||
}
|
||||
Button.prototype.InnerRender = function () {
|
||||
return "<form>" +
|
||||
"<button id='button-" + this.id + "' type='button' " + this._clss + ">" + this._text.Render() + "</button>" +
|
||||
"</form>";
|
||||
};
|
||||
Button.prototype.InnerUpdate = function (htmlElement) {
|
||||
_super.prototype.InnerUpdate.call(this, htmlElement);
|
||||
var self = this;
|
||||
console.log("Update for ", htmlElement);
|
||||
document.getElementById("button-" + this.id).onclick = function () {
|
||||
console.log("Clicked");
|
||||
self._onclick();
|
||||
};
|
||||
};
|
||||
return Button;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.Button = Button;
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.CollapseButton = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var CollapseButton = /** @class */ (function (_super) {
|
||||
__extends(CollapseButton, _super);
|
||||
function CollapseButton(idToCollapse) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this.isCollapsed = new UIEventSource_1.UIEventSource(false);
|
||||
_this.ListenTo(_this.isCollapsed);
|
||||
_this.isCollapsed.addCallback(function (collapse) {
|
||||
var el = document.getElementById(idToCollapse);
|
||||
if (el === undefined || el === null) {
|
||||
console.log("Element not found");
|
||||
return;
|
||||
}
|
||||
if (collapse) {
|
||||
el.style.height = "3.5em";
|
||||
el.style.width = "15em";
|
||||
}
|
||||
else {
|
||||
el.style.height = "auto";
|
||||
el.style.width = "auto";
|
||||
}
|
||||
});
|
||||
var self = _this;
|
||||
_this.onClick(function () {
|
||||
self.isCollapsed.setData(!self.isCollapsed.data);
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
CollapseButton.prototype.InnerRender = function () {
|
||||
var up = './assets/arrow-up.svg';
|
||||
var down = './assets/arrow-down.svg';
|
||||
var arrow = up;
|
||||
if (this.isCollapsed.data) {
|
||||
arrow = down;
|
||||
}
|
||||
return "<img class='collapse-button' src='" + arrow + "' alt='collapse'>";
|
||||
};
|
||||
return CollapseButton;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.CollapseButton = CollapseButton;
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.FixedUiElement = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var FixedUiElement = /** @class */ (function (_super) {
|
||||
__extends(FixedUiElement, _super);
|
||||
function FixedUiElement(html) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._html = html !== null && html !== void 0 ? html : "";
|
||||
return _this;
|
||||
}
|
||||
FixedUiElement.prototype.InnerRender = function () {
|
||||
return this._html;
|
||||
};
|
||||
return FixedUiElement;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.FixedUiElement = FixedUiElement;
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.VariableUiElement = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var VariableUiElement = /** @class */ (function (_super) {
|
||||
__extends(VariableUiElement, _super);
|
||||
function VariableUiElement(html, innerUpdate) {
|
||||
if (innerUpdate === void 0) { innerUpdate = undefined; }
|
||||
var _this = _super.call(this, html) || this;
|
||||
_this._html = html;
|
||||
_this._innerUpdate = innerUpdate;
|
||||
return _this;
|
||||
}
|
||||
VariableUiElement.prototype.InnerRender = function () {
|
||||
return this._html.data;
|
||||
};
|
||||
VariableUiElement.prototype.InnerUpdate = function (htmlElement) {
|
||||
_super.prototype.InnerUpdate.call(this, htmlElement);
|
||||
if (this._innerUpdate !== undefined) {
|
||||
this._innerUpdate(htmlElement);
|
||||
}
|
||||
};
|
||||
return VariableUiElement;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.VariableUiElement = VariableUiElement;
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.VerticalCombine = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var VerticalCombine = /** @class */ (function (_super) {
|
||||
__extends(VerticalCombine, _super);
|
||||
function VerticalCombine(elements, className) {
|
||||
if (className === void 0) { className = undefined; }
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._elements = elements;
|
||||
_this._className = className;
|
||||
return _this;
|
||||
}
|
||||
VerticalCombine.prototype.InnerRender = function () {
|
||||
var html = "";
|
||||
for (var _i = 0, _a = this._elements; _i < _a.length; _i++) {
|
||||
var element = _a[_i];
|
||||
if (!element.IsEmpty()) {
|
||||
html += "<div>" + element.Render() + "</div>";
|
||||
}
|
||||
}
|
||||
if (html === "") {
|
||||
return "";
|
||||
}
|
||||
if (this._className === undefined) {
|
||||
return html;
|
||||
}
|
||||
return "<div class='" + this._className + "'>" + html + "</div>";
|
||||
};
|
||||
return VerticalCombine;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.VerticalCombine = VerticalCombine;
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.CenterMessageBox = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var CenterMessageBox = /** @class */ (function (_super) {
|
||||
__extends(CenterMessageBox, _super);
|
||||
function CenterMessageBox(startZoom, centermessage, osmConnection, location, queryRunning) {
|
||||
var _this = _super.call(this, centermessage) || this;
|
||||
_this._zoomInMore = new UIEventSource_1.UIEventSource(true);
|
||||
_this._centermessage = centermessage;
|
||||
_this._location = location;
|
||||
_this._osmConnection = osmConnection;
|
||||
_this._queryRunning = queryRunning;
|
||||
_this.ListenTo(queryRunning);
|
||||
var self = _this;
|
||||
location.addCallback(function () {
|
||||
self._zoomInMore.setData(location.data.zoom < startZoom);
|
||||
});
|
||||
_this.ListenTo(_this._zoomInMore);
|
||||
return _this;
|
||||
}
|
||||
CenterMessageBox.prototype.InnerRender = function () {
|
||||
if (this._centermessage.data != "") {
|
||||
return this._centermessage.data;
|
||||
}
|
||||
if (this._queryRunning.data) {
|
||||
return "Data wordt geladen...";
|
||||
}
|
||||
else if (this._zoomInMore.data) {
|
||||
return "Zoom in om de data te zien en te bewerken";
|
||||
}
|
||||
return "Klaar!";
|
||||
};
|
||||
CenterMessageBox.prototype.ShouldShowSomething = function () {
|
||||
if (this._queryRunning.data) {
|
||||
return true;
|
||||
}
|
||||
return this._zoomInMore.data;
|
||||
};
|
||||
CenterMessageBox.prototype.InnerUpdate = function (htmlElement) {
|
||||
var pstyle = htmlElement.parentElement.style;
|
||||
if (this._centermessage.data != "") {
|
||||
pstyle.opacity = "1";
|
||||
pstyle.pointerEvents = "all";
|
||||
this._osmConnection.registerActivateOsmAUthenticationClass();
|
||||
return;
|
||||
}
|
||||
pstyle.pointerEvents = "none";
|
||||
if (this.ShouldShowSomething()) {
|
||||
pstyle.opacity = "0.5";
|
||||
}
|
||||
else {
|
||||
pstyle.opacity = "0";
|
||||
}
|
||||
};
|
||||
return CenterMessageBox;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.CenterMessageBox = CenterMessageBox;
|
||||
|
|
@ -1,67 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.ConfirmDialog = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var FixedUiElement_1 = require("./Base/FixedUiElement");
|
||||
var VariableUIElement_1 = require("./Base/VariableUIElement");
|
||||
var ConfirmDialog = /** @class */ (function (_super) {
|
||||
__extends(ConfirmDialog, _super);
|
||||
function ConfirmDialog(show, question, optionA, optionB, executeA, executeB, classA, classB) {
|
||||
if (classA === void 0) { classA = ""; }
|
||||
if (classB === void 0) { classB = ""; }
|
||||
var _this = _super.call(this, show) || this;
|
||||
_this._showOptions = new UIEventSource_1.UIEventSource(false);
|
||||
_this.ListenTo(_this._showOptions);
|
||||
var self = _this;
|
||||
show.addCallback(function () {
|
||||
self._showOptions.setData(false);
|
||||
});
|
||||
_this._question = new FixedUiElement_1.FixedUiElement("<span class='ui-question'>" + question + "</span>")
|
||||
.onClick(function () {
|
||||
self._showOptions.setData(!self._showOptions.data);
|
||||
});
|
||||
_this._optionA = new VariableUIElement_1.VariableUiElement(_this._showOptions.map(function (show) { return show ? "<div class='" + classA + "'>" + optionA + "</div>" : ""; }))
|
||||
.onClick(function () {
|
||||
self._showOptions.setData(false);
|
||||
executeA();
|
||||
});
|
||||
_this._optionB = new VariableUIElement_1.VariableUiElement(_this._showOptions.map(function (show) {
|
||||
return show ? "<div class='" + classB + "'>" + optionB + "</div>" : "";
|
||||
}))
|
||||
.onClick(function () {
|
||||
self._showOptions.setData(false);
|
||||
executeB();
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
ConfirmDialog.prototype.InnerRender = function () {
|
||||
if (!this._source.data) {
|
||||
return "";
|
||||
}
|
||||
return this._question.Render() +
|
||||
this._optionA.Render() +
|
||||
this._optionB.Render();
|
||||
};
|
||||
ConfirmDialog.prototype.Update = function () {
|
||||
_super.prototype.Update.call(this);
|
||||
this._question.Update();
|
||||
this._optionA.Update();
|
||||
this._optionB.Update();
|
||||
};
|
||||
return ConfirmDialog;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.ConfirmDialog = ConfirmDialog;
|
||||
|
|
@ -1,89 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.FeatureInfoBox = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var VerticalCombine_1 = require("./Base/VerticalCombine");
|
||||
var TagRendering_1 = require("../Customizations/TagRendering");
|
||||
var OsmLink_1 = require("../Customizations/Questions/OsmLink");
|
||||
var WikipediaLink_1 = require("../Customizations/Questions/WikipediaLink");
|
||||
var TagsFilter_1 = require("../Logic/TagsFilter");
|
||||
var FeatureInfoBox = /** @class */ (function (_super) {
|
||||
__extends(FeatureInfoBox, _super);
|
||||
function FeatureInfoBox(tagsES, title, elementsToShow, changes, userDetails) {
|
||||
var _this = _super.call(this, tagsES) || this;
|
||||
_this._tagsES = tagsES;
|
||||
_this._changes = changes;
|
||||
_this._userDetails = userDetails;
|
||||
_this.ListenTo(userDetails);
|
||||
var deps = { tags: _this._tagsES, changes: _this._changes };
|
||||
_this._infoboxes = [];
|
||||
elementsToShow = elementsToShow !== null && elementsToShow !== void 0 ? elementsToShow : [];
|
||||
for (var _i = 0, elementsToShow_1 = elementsToShow; _i < elementsToShow_1.length; _i++) {
|
||||
var tagRenderingOption = elementsToShow_1[_i];
|
||||
_this._infoboxes.push(tagRenderingOption.construct(deps));
|
||||
}
|
||||
title = title !== null && title !== void 0 ? title : new TagRendering_1.TagRenderingOptions({
|
||||
mappings: [{ k: new TagsFilter_1.And([]), txt: "" }]
|
||||
});
|
||||
_this._title = new TagRendering_1.TagRenderingOptions(title.options).construct(deps);
|
||||
_this._osmLink = new OsmLink_1.OsmLink().construct(deps);
|
||||
_this._wikipedialink = new WikipediaLink_1.WikipediaLink().construct(deps);
|
||||
return _this;
|
||||
}
|
||||
FeatureInfoBox.prototype.InnerRender = function () {
|
||||
var info = [];
|
||||
var questions = [];
|
||||
for (var _i = 0, _a = this._infoboxes; _i < _a.length; _i++) {
|
||||
var infobox = _a[_i];
|
||||
if (infobox.IsKnown()) {
|
||||
info.push(infobox);
|
||||
}
|
||||
else if (infobox.IsQuestioning()) {
|
||||
questions.push(infobox);
|
||||
}
|
||||
}
|
||||
var questionsHtml = "";
|
||||
if (this._userDetails.data.loggedIn && questions.length > 0) {
|
||||
// We select the most important question and render that one
|
||||
var mostImportantQuestion = void 0;
|
||||
var score = -1000;
|
||||
for (var _b = 0, questions_1 = questions; _b < questions_1.length; _b++) {
|
||||
var question = questions_1[_b];
|
||||
if (mostImportantQuestion === undefined || question.Priority() > score) {
|
||||
mostImportantQuestion = question;
|
||||
score = question.Priority();
|
||||
}
|
||||
}
|
||||
questionsHtml = mostImportantQuestion.Render();
|
||||
}
|
||||
return "<div class='featureinfobox'>" +
|
||||
"<div class='featureinfoboxtitle'>" +
|
||||
"<span>" +
|
||||
this._title.Render() +
|
||||
"</span>" +
|
||||
this._wikipedialink.Render() +
|
||||
this._osmLink.Render() +
|
||||
"</div>" +
|
||||
"<div class='infoboxcontents'>" +
|
||||
new VerticalCombine_1.VerticalCombine(info, "infobox-information ").Render() +
|
||||
questionsHtml +
|
||||
"</div>" +
|
||||
"" +
|
||||
"</div>";
|
||||
};
|
||||
return FeatureInfoBox;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.FeatureInfoBox = FeatureInfoBox;
|
||||
|
|
@ -1,112 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.ImageCarousel = exports.ImageCarouselConstructor = void 0;
|
||||
var ImageSearcher_1 = require("../../Logic/ImageSearcher");
|
||||
var SlideShow_1 = require("../SlideShow");
|
||||
var FixedUiElement_1 = require("../Base/FixedUiElement");
|
||||
var VariableUIElement_1 = require("../Base/VariableUIElement");
|
||||
var ConfirmDialog_1 = require("../ConfirmDialog");
|
||||
var UIElementConstructor_1 = require("../../Customizations/UIElementConstructor");
|
||||
var ImageCarouselConstructor = /** @class */ (function () {
|
||||
function ImageCarouselConstructor() {
|
||||
}
|
||||
ImageCarouselConstructor.prototype.IsKnown = function (properties) {
|
||||
return true;
|
||||
};
|
||||
ImageCarouselConstructor.prototype.IsQuestioning = function (properties) {
|
||||
return false;
|
||||
};
|
||||
ImageCarouselConstructor.prototype.Priority = function () {
|
||||
return 0;
|
||||
};
|
||||
ImageCarouselConstructor.prototype.construct = function (tags, changes) {
|
||||
return new ImageCarousel(tags, changes);
|
||||
};
|
||||
return ImageCarouselConstructor;
|
||||
}());
|
||||
exports.ImageCarouselConstructor = ImageCarouselConstructor;
|
||||
var ImageCarousel = /** @class */ (function (_super) {
|
||||
__extends(ImageCarousel, _super);
|
||||
function ImageCarousel(tags, changes) {
|
||||
var _this = _super.call(this, tags) || this;
|
||||
_this._userDetails = changes.login.userDetails;
|
||||
var self = _this;
|
||||
_this.searcher = new ImageSearcher_1.ImageSearcher(tags, changes);
|
||||
_this._uiElements = _this.searcher.map(function (imageURLS) {
|
||||
var uiElements = [];
|
||||
for (var _i = 0, imageURLS_1 = imageURLS; _i < imageURLS_1.length; _i++) {
|
||||
var url = imageURLS_1[_i];
|
||||
var image = ImageSearcher_1.ImageSearcher.CreateImageElement(url);
|
||||
uiElements.push(image);
|
||||
}
|
||||
return uiElements;
|
||||
});
|
||||
_this.slideshow = new SlideShow_1.SlideShow(_this._uiElements, new FixedUiElement_1.FixedUiElement("")).HideOnEmpty(true);
|
||||
var showDeleteButton = _this.slideshow._currentSlide.map(function (i) {
|
||||
if (!self._userDetails.data.loggedIn) {
|
||||
return false;
|
||||
}
|
||||
return self.searcher.IsDeletable(self.searcher.data[i]);
|
||||
}, [_this.searcher, _this._userDetails]);
|
||||
_this.slideshow._currentSlide.addCallback(function () {
|
||||
showDeleteButton.ping(); // This pings the showDeleteButton, which indicates that it has to hide it's subbuttons
|
||||
});
|
||||
var deleteCurrent = function () {
|
||||
self.searcher.Delete(self.searcher.data[self.slideshow._currentSlide.data]);
|
||||
};
|
||||
_this._deleteButton = new ConfirmDialog_1.ConfirmDialog(showDeleteButton, "<img src='assets/delete.svg' alt='Afbeelding verwijderen' class='delete-image'>", "<span>Afbeelding verwijderen</span>", "<span>Terug</span>", deleteCurrent, function () { }, 'delete-image-confirm', 'delete-image-cancel');
|
||||
var mapping = _this.slideshow._currentSlide.map(function (i) {
|
||||
if (_this.searcher._deletedImages.data.indexOf(_this.searcher.data[i]) >= 0) {
|
||||
return "<div class='image-is-removed'>Deze afbeelding is verwijderd</div>";
|
||||
}
|
||||
return "";
|
||||
});
|
||||
_this._isDeleted = new VariableUIElement_1.VariableUiElement(mapping);
|
||||
_this.searcher._deletedImages.addCallback(function () {
|
||||
_this.slideshow._currentSlide.ping();
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
ImageCarousel.prototype.InnerRender = function () {
|
||||
return "<span class='image-carousel-container'>" +
|
||||
"<div class='image-delete-container'>" +
|
||||
this._deleteButton.Render() +
|
||||
this._isDeleted.Render() +
|
||||
"</div>" +
|
||||
this.slideshow.Render() +
|
||||
"</span>";
|
||||
};
|
||||
ImageCarousel.prototype.IsKnown = function () {
|
||||
return true;
|
||||
};
|
||||
ImageCarousel.prototype.IsQuestioning = function () {
|
||||
return false;
|
||||
};
|
||||
ImageCarousel.prototype.Priority = function () {
|
||||
return 0;
|
||||
};
|
||||
ImageCarousel.prototype.InnerUpdate = function (htmlElement) {
|
||||
_super.prototype.InnerUpdate.call(this, htmlElement);
|
||||
this._deleteButton.Update();
|
||||
this._isDeleted.Update();
|
||||
};
|
||||
ImageCarousel.prototype.Activate = function () {
|
||||
_super.prototype.Activate.call(this);
|
||||
this.searcher.Activate();
|
||||
};
|
||||
return ImageCarousel;
|
||||
}(UIElementConstructor_1.TagDependantUIElement));
|
||||
exports.ImageCarousel = ImageCarousel;
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.ImageCarouselWithUploadConstructor = void 0;
|
||||
var UIElementConstructor_1 = require("../../Customizations/UIElementConstructor");
|
||||
var ImageCarousel_1 = require("./ImageCarousel");
|
||||
var OsmImageUploadHandler_1 = require("../../Logic/OsmImageUploadHandler");
|
||||
var ImageCarouselWithUploadConstructor = /** @class */ (function () {
|
||||
function ImageCarouselWithUploadConstructor() {
|
||||
}
|
||||
ImageCarouselWithUploadConstructor.prototype.IsKnown = function (properties) {
|
||||
return true;
|
||||
};
|
||||
ImageCarouselWithUploadConstructor.prototype.IsQuestioning = function (properties) {
|
||||
return false;
|
||||
};
|
||||
ImageCarouselWithUploadConstructor.prototype.Priority = function () {
|
||||
return 0;
|
||||
};
|
||||
ImageCarouselWithUploadConstructor.prototype.construct = function (dependencies) {
|
||||
return new ImageCarouselWithUpload(dependencies);
|
||||
};
|
||||
return ImageCarouselWithUploadConstructor;
|
||||
}());
|
||||
exports.ImageCarouselWithUploadConstructor = ImageCarouselWithUploadConstructor;
|
||||
var ImageCarouselWithUpload = /** @class */ (function (_super) {
|
||||
__extends(ImageCarouselWithUpload, _super);
|
||||
function ImageCarouselWithUpload(dependencies) {
|
||||
var _this = _super.call(this, dependencies.tags) || this;
|
||||
var tags = dependencies.tags;
|
||||
var changes = dependencies.changes;
|
||||
_this._imageElement = new ImageCarousel_1.ImageCarousel(tags, changes);
|
||||
var userDetails = changes.login.userDetails;
|
||||
var license = changes.login.GetPreference("mapcomplete-pictures-license");
|
||||
_this._pictureUploader = new OsmImageUploadHandler_1.OsmImageUploadHandler(tags, userDetails, license, changes, _this._imageElement.slideshow).getUI();
|
||||
return _this;
|
||||
}
|
||||
ImageCarouselWithUpload.prototype.InnerRender = function () {
|
||||
return this._imageElement.Render() +
|
||||
this._pictureUploader.Render();
|
||||
};
|
||||
ImageCarouselWithUpload.prototype.Activate = function () {
|
||||
_super.prototype.Activate.call(this);
|
||||
this._imageElement.Activate();
|
||||
this._pictureUploader.Activate();
|
||||
};
|
||||
ImageCarouselWithUpload.prototype.Update = function () {
|
||||
_super.prototype.Update.call(this);
|
||||
this._imageElement.Update();
|
||||
this._pictureUploader.Update();
|
||||
};
|
||||
ImageCarouselWithUpload.prototype.IsKnown = function () {
|
||||
return true;
|
||||
};
|
||||
ImageCarouselWithUpload.prototype.IsQuestioning = function () {
|
||||
return false;
|
||||
};
|
||||
ImageCarouselWithUpload.prototype.Priority = function () {
|
||||
return 0;
|
||||
};
|
||||
return ImageCarouselWithUpload;
|
||||
}(UIElementConstructor_1.TagDependantUIElement));
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.ImgurImage = void 0;
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var Imgur_1 = require("../../Logic/Imgur");
|
||||
var ImgurImage = /** @class */ (function (_super) {
|
||||
__extends(ImgurImage, _super);
|
||||
function ImgurImage(source) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._imageLocation = source;
|
||||
if (ImgurImage.allLicenseInfos[source] !== undefined) {
|
||||
_this._imageMeta = ImgurImage.allLicenseInfos[source];
|
||||
}
|
||||
else {
|
||||
_this._imageMeta = new UIEventSource_1.UIEventSource(null);
|
||||
ImgurImage.allLicenseInfos[source] = _this._imageMeta;
|
||||
var self_1 = _this;
|
||||
Imgur_1.Imgur.getDescriptionOfImage(source, function (license) {
|
||||
self_1._imageMeta.setData(license);
|
||||
});
|
||||
}
|
||||
_this.ListenTo(_this._imageMeta);
|
||||
return _this;
|
||||
}
|
||||
ImgurImage.prototype.InnerRender = function () {
|
||||
var _a, _b;
|
||||
var image = "<img src='" + this._imageLocation + "' " + "alt='' >";
|
||||
if (this._imageMeta.data === null) {
|
||||
return image;
|
||||
}
|
||||
var attribution = "<span class='attribution-author'><b>" + ((_a = this._imageMeta.data.artist) !== null && _a !== void 0 ? _a : "") + "</b></span>" + " <span class='license'>" + ((_b = this._imageMeta.data.licenseShortName) !== null && _b !== void 0 ? _b : "") + "</span>";
|
||||
return "<div class='imgWithAttr'>" +
|
||||
image +
|
||||
"<div class='attribution'>" +
|
||||
attribution +
|
||||
"</div>" +
|
||||
"</div>";
|
||||
};
|
||||
/***
|
||||
* Dictionary from url to alreayd known license info
|
||||
*/
|
||||
ImgurImage.allLicenseInfos = {};
|
||||
return ImgurImage;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.ImgurImage = ImgurImage;
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.SimpleImageElement = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var SimpleImageElement = /** @class */ (function (_super) {
|
||||
__extends(SimpleImageElement, _super);
|
||||
function SimpleImageElement(source) {
|
||||
return _super.call(this, source) || this;
|
||||
}
|
||||
SimpleImageElement.prototype.InnerRender = function () {
|
||||
return "<img src='" + this._source.data + "' alt='img'>";
|
||||
};
|
||||
return SimpleImageElement;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.SimpleImageElement = SimpleImageElement;
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.WikimediaImage = void 0;
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var Wikimedia_1 = require("../../Logic/Wikimedia");
|
||||
var WikimediaImage = /** @class */ (function (_super) {
|
||||
__extends(WikimediaImage, _super);
|
||||
function WikimediaImage(source) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._imageLocation = source;
|
||||
if (WikimediaImage.allLicenseInfos[source] !== undefined) {
|
||||
_this._imageMeta = WikimediaImage.allLicenseInfos[source];
|
||||
}
|
||||
else {
|
||||
_this._imageMeta = new UIEventSource_1.UIEventSource(new Wikimedia_1.LicenseInfo());
|
||||
WikimediaImage.allLicenseInfos[source] = _this._imageMeta;
|
||||
var self_1 = _this;
|
||||
Wikimedia_1.Wikimedia.LicenseData(source, function (info) {
|
||||
self_1._imageMeta.setData(info);
|
||||
});
|
||||
}
|
||||
_this.ListenTo(_this._imageMeta);
|
||||
return _this;
|
||||
}
|
||||
WikimediaImage.prototype.InnerRender = function () {
|
||||
var _a, _b;
|
||||
var url = Wikimedia_1.Wikimedia.ImageNameToUrl(this._imageLocation, 500, 400);
|
||||
url = url.replace(/'/g, '%27');
|
||||
var 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> ";
|
||||
var attribution = "<span class='attribution-author'>" + ((_a = this._imageMeta.data.artist) !== null && _a !== void 0 ? _a : "") + "</span>" + " <span class='license'>" + ((_b = this._imageMeta.data.licenseShortName) !== null && _b !== void 0 ? _b : "") + "</span>";
|
||||
var image = "<img src='" + url + "' " + "alt='" + this._imageMeta.data.description + "' >";
|
||||
return "<div class='imgWithAttr'>" +
|
||||
image +
|
||||
"<div class='attribution'>" +
|
||||
wikimediaLink +
|
||||
attribution +
|
||||
"</div>" +
|
||||
"</div>";
|
||||
};
|
||||
WikimediaImage.allLicenseInfos = {};
|
||||
return WikimediaImage;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.WikimediaImage = WikimediaImage;
|
||||
|
|
@ -1,107 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.ImageUploadFlow = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var jquery_1 = require("jquery");
|
||||
var Imgur_1 = require("../Logic/Imgur");
|
||||
var DropDown_1 = require("./Input/DropDown");
|
||||
var VariableUIElement_1 = require("./Base/VariableUIElement");
|
||||
var ImageUploadFlow = /** @class */ (function (_super) {
|
||||
__extends(ImageUploadFlow, _super);
|
||||
function ImageUploadFlow(userInfo, preferedLicense, uploadOptions) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._isUploading = new UIEventSource_1.UIEventSource(0);
|
||||
_this._userdetails = userInfo;
|
||||
_this.ListenTo(userInfo);
|
||||
_this._uploadOptions = uploadOptions;
|
||||
_this.ListenTo(_this._isUploading);
|
||||
var licensePicker = new DropDown_1.DropDown("Jouw foto wordt gepubliceerd ", [
|
||||
{ value: "CC0", shown: "in het publiek domein" },
|
||||
{ value: "CC-BY-SA 4.0", shown: "onder een CC-BY-SA-licentie" },
|
||||
{ value: "CC-BY 4.0", shown: "onder een CC-BY-licentie" }
|
||||
], preferedLicense);
|
||||
_this._licensePicker = licensePicker;
|
||||
_this._selectedLicence = licensePicker.selectedElement;
|
||||
var licenseExplanations = {
|
||||
"CC-BY-SA 4.0": "<b>Creative Commonse met naamsvermelding en gelijk delen</b><br/>" +
|
||||
"Je foto mag door iedereen gratis gebruikt worden, als ze je naam vermelden én ze afgeleide werken met deze licentie en attributie delen.",
|
||||
"CC-BY 4.0": "<b>Creative Commonse met naamsvermelding</b> <br/>" +
|
||||
"Je foto mag door iedereen gratis gebruikt worden, als ze je naam vermelden",
|
||||
"CC0": "<b>Geen copyright</b><br/> Je foto mag door iedereen voor alles gebruikt worden"
|
||||
};
|
||||
_this._licenseExplanation = new VariableUIElement_1.VariableUiElement(_this._selectedLicence.map(function (license) {
|
||||
return licenseExplanations[license];
|
||||
}));
|
||||
return _this;
|
||||
}
|
||||
ImageUploadFlow.prototype.InnerRender = function () {
|
||||
if (!this._userdetails.data.loggedIn) {
|
||||
return "<div class='activate-osm-authentication'>Gelieve je aan te melden om een foto toe te voegen of vragen te beantwoorden</div>";
|
||||
}
|
||||
if (this._isUploading.data == 1) {
|
||||
return "<b>Bezig met een foto te uploaden...</b>";
|
||||
}
|
||||
if (this._isUploading.data > 0) {
|
||||
return "<b>Bezig met uploaden, nog " + this._isUploading.data + " foto's te gaan...</b>";
|
||||
}
|
||||
return "" +
|
||||
"<div class='imageflow'>" +
|
||||
"<label for='fileselector-" + this.id + "'>" +
|
||||
"<div class='imageflow-file-input-wrapper'>" +
|
||||
"<img src='./assets/camera-plus.svg' alt='upload image'/> " +
|
||||
"<span class='imageflow-add-picture'>Voeg foto toe</span>" +
|
||||
"<div class='break'></div>" +
|
||||
"</div>" +
|
||||
this._licensePicker.Render() +
|
||||
"</label>" +
|
||||
"<input id='fileselector-" + this.id + "' " +
|
||||
"type='file' " +
|
||||
"class='imageflow-file-input' " +
|
||||
"accept='image/*' name='picField' size='24' multiple='multiple' alt=''" +
|
||||
"/>" +
|
||||
"</div>";
|
||||
};
|
||||
ImageUploadFlow.prototype.InnerUpdate = function (htmlElement) {
|
||||
_super.prototype.InnerUpdate.call(this, htmlElement);
|
||||
var user = this._userdetails.data;
|
||||
htmlElement.onclick = function () {
|
||||
if (!user.loggedIn) {
|
||||
user.osmConnection.AttemptLogin();
|
||||
}
|
||||
};
|
||||
this._licensePicker.Update();
|
||||
var selector = document.getElementById('fileselector-' + this.id);
|
||||
var self = this;
|
||||
if (selector != null) {
|
||||
selector.onchange = function () {
|
||||
var files = jquery_1.default(this).get(0).files;
|
||||
self._isUploading.setData(files.length);
|
||||
var opts = self._uploadOptions(self._selectedLicence.data);
|
||||
Imgur_1.Imgur.uploadMultiple(opts.title, opts.description, files, function (url) {
|
||||
console.log("File saved at", url);
|
||||
self._isUploading.setData(self._isUploading.data - 1);
|
||||
opts.handleURL(url);
|
||||
}, function () {
|
||||
console.log("All uploads completed");
|
||||
opts.allDone();
|
||||
});
|
||||
};
|
||||
}
|
||||
};
|
||||
return ImageUploadFlow;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.ImageUploadFlow = ImageUploadFlow;
|
||||
16
UI/Img.js
16
UI/Img.js
|
|
@ -1,16 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.Img = void 0;
|
||||
var Img = /** @class */ (function () {
|
||||
function Img() {
|
||||
}
|
||||
Img.osmAbstractLogo = "<svg class='osm-logo' xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" width=\"24px\" version=\"1.1\" viewBox=\"0 0 66 64\">" +
|
||||
" <g transform=\"translate(-0.849, -61)\">\n" +
|
||||
" <path d=\"M0.849,61 L6.414,75.609 L0.849,90.217 L6.414,104.826 L0.849,119.435 L4.266,120.739 L22.831,102.183 L26.162,102.696 L30.205,98.652 C27.819,95.888 26.033,92.59 25.057,88.948 L26.953,87.391 C26.627,85.879 26.449,84.313 26.449,82.704 C26.449,74.67 30.734,67.611 37.136,63.696 L30.066,61 L15.457,66.565 L0.849,61 z\"></path>" +
|
||||
" <path d=\"M48.71,64.617 C48.406,64.617 48.105,64.629 47.805,64.643 C47.52,64.657 47.234,64.677 46.953,64.704 C46.726,64.726 46.499,64.753 46.275,64.783 C46.039,64.814 45.811,64.847 45.579,64.887 C45.506,64.9 45.434,64.917 45.362,64.93 C45.216,64.958 45.072,64.987 44.927,65.017 C44.812,65.042 44.694,65.06 44.579,65.087 C44.442,65.119 44.307,65.156 44.17,65.191 C43.943,65.25 43.716,65.315 43.492,65.383 C43.323,65.433 43.155,65.484 42.988,65.539 C42.819,65.595 42.65,65.652 42.483,65.713 C42.475,65.716 42.466,65.719 42.457,65.722 C35.819,68.158 31.022,74.369 30.649,81.774 C30.633,82.083 30.622,82.391 30.622,82.704 C30.622,83.014 30.631,83.321 30.649,83.626 C30.649,83.629 30.648,83.632 30.649,83.635 C30.662,83.862 30.681,84.088 30.701,84.313 C31.466,93.037 38.377,99.948 47.101,100.713 C47.326,100.733 47.552,100.754 47.779,100.765 C47.782,100.765 47.785,100.765 47.788,100.765 C48.093,100.783 48.399,100.791 48.709,100.791 C53.639,100.791 58.096,98.833 61.353,95.652 C61.532,95.477 61.712,95.304 61.883,95.122 C61.913,95.09 61.941,95.058 61.97,95.026 C61.98,95.015 61.987,95.002 61.996,94.991 C62.132,94.845 62.266,94.698 62.396,94.548 C62.449,94.487 62.501,94.426 62.553,94.365 C62.594,94.316 62.634,94.267 62.675,94.217 C62.821,94.04 62.961,93.861 63.101,93.678 C63.279,93.444 63.456,93.199 63.622,92.956 C63.956,92.471 64.267,91.97 64.553,91.452 C64.661,91.257 64.757,91.06 64.857,90.861 C64.89,90.796 64.93,90.735 64.962,90.67 C64.98,90.633 64.996,90.594 65.014,90.556 C65.125,90.324 65.234,90.09 65.336,89.852 C65.349,89.82 65.365,89.789 65.379,89.756 C65.48,89.517 65.575,89.271 65.666,89.026 C65.678,88.994 65.689,88.962 65.701,88.93 C65.792,88.679 65.881,88.43 65.962,88.174 C65.97,88.148 65.98,88.122 65.988,88.096 C66.069,87.832 66.144,87.564 66.214,87.296 C66.219,87.275 66.226,87.255 66.231,87.235 C66.301,86.962 66.365,86.686 66.423,86.409 C66.426,86.391 66.428,86.374 66.431,86.356 C66.445,86.291 66.453,86.223 66.466,86.156 C66.511,85.925 66.552,85.695 66.588,85.461 C66.632,85.169 66.671,84.878 66.701,84.583 C66.701,84.574 66.701,84.565 66.701,84.556 C66.731,84.258 66.755,83.955 66.77,83.652 C66.77,83.646 66.77,83.641 66.77,83.635 C66.786,83.326 66.797,83.017 66.797,82.704 C66.797,72.69 58.723,64.617 48.71,64.617 z\"></path>" +
|
||||
" <path d=\"M62.936,99.809 C59.074,103.028 54.115,104.965 48.71,104.965 C47.101,104.965 45.535,104.787 44.023,104.461 L42.466,106.357 C39.007,105.43 35.855,103.781 33.179,101.574 L28.996,105.765 L29.51,108.861 L13.953,124.426 L15.457,125 L30.066,119.435 L44.675,125 L59.283,119.435 L64.849,104.826 L62.936,99.809 z\"></path>" +
|
||||
" </g>" +
|
||||
"</svg>";
|
||||
return Img;
|
||||
}());
|
||||
exports.Img = Img;
|
||||
|
|
@ -1,69 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.DropDown = void 0;
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var DropDown = /** @class */ (function (_super) {
|
||||
__extends(DropDown, _super);
|
||||
function DropDown(label, values, selectedElement) {
|
||||
if (selectedElement === void 0) { selectedElement = undefined; }
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._label = label;
|
||||
_this._values = values;
|
||||
_this.selectedElement = selectedElement !== null && selectedElement !== void 0 ? selectedElement : new UIEventSource_1.UIEventSource(values[0].value);
|
||||
if (selectedElement.data === undefined) {
|
||||
_this.selectedElement.setData(values[0].value);
|
||||
}
|
||||
var self = _this;
|
||||
_this.selectedElement.addCallback(function () {
|
||||
self.InnerUpdate();
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
DropDown.prototype.InnerRender = function () {
|
||||
var options = "";
|
||||
for (var _i = 0, _a = this._values; _i < _a.length; _i++) {
|
||||
var value = _a[_i];
|
||||
options += "<option value='" + value.value + "'>" + value.shown + "</option>";
|
||||
}
|
||||
return "<form>" +
|
||||
"<label for='dropdown-" + this.id + "'>" + this._label + "</label>" +
|
||||
"<select name='dropdown-" + this.id + "' id='dropdown-" + this.id + "'>" +
|
||||
options +
|
||||
"</select>" +
|
||||
"</form>";
|
||||
};
|
||||
DropDown.prototype.InnerUpdate = function () {
|
||||
var self = this;
|
||||
var e = document.getElementById("dropdown-" + this.id);
|
||||
if (e === null) {
|
||||
return;
|
||||
}
|
||||
// @ts-ignore
|
||||
if (this.selectedElement.data !== e.value) {
|
||||
// @ts-ignore
|
||||
e.value = this.selectedElement.data;
|
||||
}
|
||||
e.onchange = function () {
|
||||
// @ts-ignore
|
||||
var selectedValue = e.options[e.selectedIndex].value;
|
||||
console.log("Putting data", selectedValue);
|
||||
self.selectedElement.setData(selectedValue);
|
||||
};
|
||||
};
|
||||
return DropDown;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.DropDown = DropDown;
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.FixedInputElement = void 0;
|
||||
var InputElement_1 = require("./InputElement");
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var FixedUiElement_1 = require("../Base/FixedUiElement");
|
||||
var FixedInputElement = /** @class */ (function (_super) {
|
||||
__extends(FixedInputElement, _super);
|
||||
function FixedInputElement(rendering, value) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this.value = new UIEventSource_1.UIEventSource(value);
|
||||
_this.rendering = typeof (rendering) === 'string' ? new FixedUiElement_1.FixedUiElement(rendering) : rendering;
|
||||
return _this;
|
||||
}
|
||||
FixedInputElement.prototype.GetValue = function () {
|
||||
return this.value;
|
||||
};
|
||||
FixedInputElement.prototype.InnerRender = function () {
|
||||
return this.rendering.Render();
|
||||
};
|
||||
FixedInputElement.prototype.IsValid = function (t) {
|
||||
return t === this.value.data;
|
||||
};
|
||||
return FixedInputElement;
|
||||
}(InputElement_1.InputElement));
|
||||
exports.FixedInputElement = FixedInputElement;
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.InputElement = void 0;
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var InputElement = /** @class */ (function (_super) {
|
||||
__extends(InputElement, _super);
|
||||
function InputElement() {
|
||||
return _super !== null && _super.apply(this, arguments) || this;
|
||||
}
|
||||
return InputElement;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.InputElement = InputElement;
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.InputElementWrapper = void 0;
|
||||
var InputElement_1 = require("./InputElement");
|
||||
var UIElement_1 = require("../UIElement");
|
||||
var InputElementWrapper = /** @class */ (function (_super) {
|
||||
__extends(InputElementWrapper, _super);
|
||||
function InputElementWrapper(pre, input, post) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this.post = UIElement_1.UIElement.Fix(post);
|
||||
_this.input = input;
|
||||
_this.pre = UIElement_1.UIElement.Fix(pre);
|
||||
return _this;
|
||||
}
|
||||
InputElementWrapper.prototype.GetValue = function () {
|
||||
return this.input.GetValue();
|
||||
};
|
||||
InputElementWrapper.prototype.InnerRender = function () {
|
||||
return this.pre.Render() + this.input.Render() + this.post.Render();
|
||||
};
|
||||
InputElementWrapper.prototype.IsValid = function (t) {
|
||||
return this.input.IsValid(t);
|
||||
};
|
||||
return InputElementWrapper;
|
||||
}(InputElement_1.InputElement));
|
||||
exports.InputElementWrapper = InputElementWrapper;
|
||||
|
|
@ -1,122 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.RadioButton = void 0;
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var InputElement_1 = require("./InputElement");
|
||||
var RadioButton = /** @class */ (function (_super) {
|
||||
__extends(RadioButton, _super);
|
||||
function RadioButton(elements, selectFirstAsDefault) {
|
||||
if (selectFirstAsDefault === void 0) { selectFirstAsDefault = true; }
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._selectedElementIndex = new UIEventSource_1.UIEventSource(null);
|
||||
_this._elements = elements;
|
||||
_this._selectFirstAsDefault = selectFirstAsDefault;
|
||||
var self = _this;
|
||||
_this.value =
|
||||
UIEventSource_1.UIEventSource.flatten(_this._selectedElementIndex.map(function (selectedIndex) {
|
||||
if (selectedIndex !== undefined && selectedIndex !== null) {
|
||||
return elements[selectedIndex].GetValue();
|
||||
}
|
||||
}), elements.map(function (e) { return e.GetValue(); }));
|
||||
_this.value.addCallback(function (t) {
|
||||
self.SetCorrectValue(t);
|
||||
});
|
||||
var _loop_1 = function (i) {
|
||||
// If an element is clicked, the radio button corresponding with it should be selected as well
|
||||
elements[i].onClick(function () {
|
||||
self._selectedElementIndex.setData(i);
|
||||
});
|
||||
};
|
||||
for (var i = 0; i < elements.length; i++) {
|
||||
_loop_1(i);
|
||||
}
|
||||
return _this;
|
||||
}
|
||||
RadioButton.prototype.IsValid = function (t) {
|
||||
for (var _i = 0, _a = this._elements; _i < _a.length; _i++) {
|
||||
var inputElement = _a[_i];
|
||||
if (inputElement.IsValid(t)) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
};
|
||||
RadioButton.prototype.GetValue = function () {
|
||||
return this.value;
|
||||
};
|
||||
RadioButton.prototype.IdFor = function (i) {
|
||||
return 'radio-' + this.id + '-' + i;
|
||||
};
|
||||
RadioButton.prototype.InnerRender = function () {
|
||||
var body = "";
|
||||
var i = 0;
|
||||
for (var _i = 0, _a = this._elements; _i < _a.length; _i++) {
|
||||
var el = _a[_i];
|
||||
var htmlElement = '<input type="radio" id="' + this.IdFor(i) + '" name="radiogroup-' + this.id + '">' +
|
||||
'<label for="' + this.IdFor(i) + '">' + el.Render() + '</label>' +
|
||||
'<br>';
|
||||
body += htmlElement;
|
||||
i++;
|
||||
}
|
||||
return "<form id='" + this.id + "-form'>" + body + "</form>";
|
||||
};
|
||||
RadioButton.prototype.SetCorrectValue = function (t) {
|
||||
if (t === undefined) {
|
||||
return;
|
||||
}
|
||||
// We check that what is selected matches the previous rendering
|
||||
for (var i = 0; i < this._elements.length; i++) {
|
||||
var e = this._elements[i];
|
||||
if (e.IsValid(t)) {
|
||||
this._selectedElementIndex.setData(i);
|
||||
e.GetValue().setData(t);
|
||||
// @ts-ignore
|
||||
document.getElementById(this.IdFor(i)).checked = true;
|
||||
return;
|
||||
}
|
||||
}
|
||||
};
|
||||
RadioButton.prototype.InnerUpdate = function (htmlElement) {
|
||||
var self = this;
|
||||
function checkButtons() {
|
||||
for (var i = 0; i < self._elements.length; i++) {
|
||||
var el_1 = document.getElementById(self.IdFor(i));
|
||||
// @ts-ignore
|
||||
if (el_1.checked) {
|
||||
self._selectedElementIndex.setData(i);
|
||||
}
|
||||
}
|
||||
}
|
||||
var el = document.getElementById(this.id);
|
||||
el.addEventListener("change", function () {
|
||||
checkButtons();
|
||||
});
|
||||
if (this._selectFirstAsDefault) {
|
||||
this.SetCorrectValue(this.value.data);
|
||||
if (this._selectedElementIndex.data === null || this._selectedElementIndex.data === undefined) {
|
||||
var el_2 = document.getElementById(this.IdFor(0));
|
||||
if (el_2) {
|
||||
// @ts-ignore
|
||||
el_2.checked = true;
|
||||
checkButtons();
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
;
|
||||
return RadioButton;
|
||||
}(InputElement_1.InputElement));
|
||||
exports.RadioButton = RadioButton;
|
||||
|
|
@ -1,94 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.TextField = void 0;
|
||||
var UIEventSource_1 = require("../UIEventSource");
|
||||
var InputElement_1 = require("./InputElement");
|
||||
var FixedUiElement_1 = require("../Base/FixedUiElement");
|
||||
var TextField = /** @class */ (function (_super) {
|
||||
__extends(TextField, _super);
|
||||
function TextField(options) {
|
||||
var _a, _b, _c, _d;
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
/**
|
||||
* Pings and has the value data
|
||||
*/
|
||||
_this.enterPressed = new UIEventSource_1.UIEventSource(undefined);
|
||||
_this.value = new UIEventSource_1.UIEventSource("");
|
||||
_this.mappedValue = (_a = options === null || options === void 0 ? void 0 : options.value) !== null && _a !== void 0 ? _a : new UIEventSource_1.UIEventSource(undefined);
|
||||
// @ts-ignore
|
||||
_this._fromString = (_b = options.fromString) !== null && _b !== void 0 ? _b : (function (str) { return (str); });
|
||||
_this.value.addCallback(function (str) { return _this.mappedValue.setData(options.fromString(str)); });
|
||||
_this.mappedValue.addCallback(function (t) { return _this.value.setData(options.toString(t)); });
|
||||
_this._placeholder =
|
||||
typeof (options.placeholder) === "string" ? new FixedUiElement_1.FixedUiElement(options.placeholder) :
|
||||
((_c = options.placeholder) !== null && _c !== void 0 ? _c : new FixedUiElement_1.FixedUiElement(""));
|
||||
_this._toString = (_d = options.toString) !== null && _d !== void 0 ? _d : (function (t) { return ("" + t); });
|
||||
var self = _this;
|
||||
_this.mappedValue.addCallback(function (t) {
|
||||
if (t === undefined && t === null) {
|
||||
return;
|
||||
}
|
||||
var field = document.getElementById('text-' + _this.id);
|
||||
if (field === undefined || field === null) {
|
||||
return;
|
||||
}
|
||||
// @ts-ignore
|
||||
field.value = options.toString(t);
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
TextField.prototype.GetValue = function () {
|
||||
return this.mappedValue;
|
||||
};
|
||||
TextField.prototype.InnerRender = function () {
|
||||
return "<form onSubmit='return false' class='form-text-field'>" +
|
||||
"<input type='text' placeholder='" + this._placeholder.InnerRender() + "' id='text-" + this.id + "'>" +
|
||||
"</form>";
|
||||
};
|
||||
TextField.prototype.InnerUpdate = function (htmlElement) {
|
||||
var field = document.getElementById('text-' + this.id);
|
||||
if (field === null) {
|
||||
return;
|
||||
}
|
||||
var self = this;
|
||||
field.oninput = function () {
|
||||
// @ts-ignore
|
||||
self.value.setData(field.value);
|
||||
};
|
||||
field.addEventListener("keyup", function (event) {
|
||||
if (event.key === "Enter") {
|
||||
// @ts-ignore
|
||||
self.enterPressed.setData(field.value);
|
||||
}
|
||||
});
|
||||
};
|
||||
TextField.prototype.IsValid = function (t) {
|
||||
if (t === undefined || t === null) {
|
||||
return false;
|
||||
}
|
||||
var result = this._toString(t);
|
||||
return result !== undefined && result !== null;
|
||||
};
|
||||
TextField.prototype.Clear = function () {
|
||||
var field = document.getElementById('text-' + this.id);
|
||||
if (field !== undefined) {
|
||||
// @ts-ignore
|
||||
field.value = "";
|
||||
}
|
||||
};
|
||||
return TextField;
|
||||
}(InputElement_1.InputElement));
|
||||
exports.TextField = TextField;
|
||||
|
|
@ -1,56 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.MessageBoxHandler = void 0;
|
||||
/**
|
||||
* Keeps 'messagebox' and 'messageboxmobile' in sync, shows a 'close' button on the latter one
|
||||
*/
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var VariableUIElement_1 = require("./Base/VariableUIElement");
|
||||
var MessageBoxHandler = /** @class */ (function () {
|
||||
function MessageBoxHandler(uielement, onClear) {
|
||||
this._uielement = uielement;
|
||||
this.listenTo(uielement);
|
||||
this.update();
|
||||
window.onhashchange = function () {
|
||||
if (location.hash === "") {
|
||||
// No more element: back to the map!
|
||||
uielement.setData(undefined);
|
||||
onClear();
|
||||
}
|
||||
};
|
||||
new VariableUIElement_1.VariableUiElement(new UIEventSource_1.UIEventSource("<h2>Naar de kaart</h2>"), function () {
|
||||
document.getElementById("to-the-map").onclick = function () {
|
||||
uielement.setData(undefined);
|
||||
onClear();
|
||||
};
|
||||
}).AttachTo("to-the-map");
|
||||
}
|
||||
MessageBoxHandler.prototype.listenTo = function (uiEventSource) {
|
||||
var self = this;
|
||||
uiEventSource.addCallback(function () {
|
||||
self.update();
|
||||
});
|
||||
};
|
||||
MessageBoxHandler.prototype.update = function () {
|
||||
var _a, _b, _c;
|
||||
var wrapper = document.getElementById("messagesboxmobilewrapper");
|
||||
var gen = this._uielement.data;
|
||||
console.log("Generator: ", gen);
|
||||
if (gen === undefined) {
|
||||
wrapper.classList.add("hidden");
|
||||
if (location.hash !== "") {
|
||||
location.hash = "";
|
||||
}
|
||||
return;
|
||||
}
|
||||
location.hash = "#element";
|
||||
wrapper.classList.remove("hidden");
|
||||
/* gen()
|
||||
?.HideOnEmpty(true)
|
||||
?.AttachTo("messagesbox")
|
||||
?.Activate();*/
|
||||
(_c = (_b = (_a = gen()) === null || _a === void 0 ? void 0 : _a.HideOnEmpty(true)) === null || _b === void 0 ? void 0 : _b.AttachTo("messagesboxmobile")) === null || _c === void 0 ? void 0 : _c.Activate();
|
||||
};
|
||||
return MessageBoxHandler;
|
||||
}());
|
||||
exports.MessageBoxHandler = MessageBoxHandler;
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.PendingChanges = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var PendingChanges = /** @class */ (function (_super) {
|
||||
__extends(PendingChanges, _super);
|
||||
function PendingChanges(changes, countdown) {
|
||||
var _this = _super.call(this, changes.pendingChangesES) || this;
|
||||
_this.ListenTo(changes.isSaving);
|
||||
_this.ListenTo(countdown);
|
||||
_this._pendingChangesCount = changes.pendingChangesES;
|
||||
_this._countdown = countdown;
|
||||
_this._isSaving = changes.isSaving;
|
||||
_this.onClick(function () {
|
||||
changes.uploadAll();
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
PendingChanges.prototype.InnerRender = function () {
|
||||
if (this._isSaving.data) {
|
||||
return "<span class='alert'>Saving</span>";
|
||||
}
|
||||
if (this._pendingChangesCount.data == 0) {
|
||||
return "";
|
||||
}
|
||||
var restingSeconds = this._countdown.data / 1000;
|
||||
var dots = "";
|
||||
while (restingSeconds > 0) {
|
||||
dots += ".";
|
||||
restingSeconds = restingSeconds - 1;
|
||||
}
|
||||
return "Saving " + this._pendingChangesCount.data;
|
||||
};
|
||||
return PendingChanges;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.PendingChanges = PendingChanges;
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.QuestionPicker = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var QuestionPicker = /** @class */ (function (_super) {
|
||||
__extends(QuestionPicker, _super);
|
||||
function QuestionPicker(questions, tags) {
|
||||
var _this = _super.call(this, tags) || this;
|
||||
_this._questions = questions;
|
||||
_this.tags = tags.data;
|
||||
_this.source = tags;
|
||||
return _this;
|
||||
}
|
||||
QuestionPicker.prototype.InnerRender = function () {
|
||||
var t = this.tags;
|
||||
var highestPriority = Number.MIN_VALUE;
|
||||
var highestQ;
|
||||
for (var _i = 0, _a = this._questions; _i < _a.length; _i++) {
|
||||
var q = _a[_i];
|
||||
if (!q.Applicable(t)) {
|
||||
continue;
|
||||
}
|
||||
var priority = q.question.severity;
|
||||
if (priority > highestPriority) {
|
||||
highestPriority = priority;
|
||||
highestQ = q;
|
||||
}
|
||||
}
|
||||
if (highestQ === undefined) {
|
||||
return "Er zijn geen vragen meer!";
|
||||
}
|
||||
return "<div class='question'>" +
|
||||
highestQ.CreateHtml(this.source).Render() +
|
||||
"</div>";
|
||||
};
|
||||
return QuestionPicker;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.QuestionPicker = QuestionPicker;
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.SaveButton = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var SaveButton = /** @class */ (function (_super) {
|
||||
__extends(SaveButton, _super);
|
||||
function SaveButton(value) {
|
||||
var _this = _super.call(this, value) || this;
|
||||
if (value === undefined) {
|
||||
throw "No event source for savebutton, something is wrong";
|
||||
}
|
||||
_this._value = value;
|
||||
return _this;
|
||||
}
|
||||
SaveButton.prototype.InnerRender = function () {
|
||||
if (this._value.data === undefined ||
|
||||
this._value.data === null
|
||||
|| this._value.data === "") {
|
||||
return "<span class='save-non-active'>Opslaan</span>";
|
||||
}
|
||||
return "<span class='save'>Opslaan</span>";
|
||||
};
|
||||
return SaveButton;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.SaveButton = SaveButton;
|
||||
|
|
@ -1,83 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.SearchAndGo = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var TextField_1 = require("./Input/TextField");
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var FixedUiElement_1 = require("./Base/FixedUiElement");
|
||||
var Geocoding_1 = require("../Logic/Geocoding");
|
||||
var SearchAndGo = /** @class */ (function (_super) {
|
||||
__extends(SearchAndGo, _super);
|
||||
function SearchAndGo(map) {
|
||||
var _this = _super.call(this, undefined) || this;
|
||||
_this._placeholder = new UIEventSource_1.UIEventSource("Zoek naar een locatie...");
|
||||
_this._searchField = new TextField_1.TextField({
|
||||
placeholder: _this._placeholder
|
||||
});
|
||||
_this._foundEntries = new UIEventSource_1.UIEventSource([]);
|
||||
_this._goButton = new FixedUiElement_1.FixedUiElement("<img class='search-go' src='./assets/search.svg' alt='GO'>");
|
||||
_this._map = map;
|
||||
_this.ListenTo(_this._foundEntries);
|
||||
var self = _this;
|
||||
_this._searchField.enterPressed.addCallback(function () {
|
||||
self.RunSearch();
|
||||
});
|
||||
_this._goButton.onClick(function () {
|
||||
self.RunSearch();
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
// Triggered by 'enter' or onclick
|
||||
SearchAndGo.prototype.RunSearch = function () {
|
||||
var _this = this;
|
||||
var searchString = this._searchField.GetValue().data;
|
||||
this._searchField.Clear();
|
||||
this._placeholder.setData("Bezig met zoeken...");
|
||||
var self = this;
|
||||
Geocoding_1.Geocoding.Search(searchString, this._map, function (result) {
|
||||
if (result.length == 0) {
|
||||
_this._placeholder.setData("Niets gevonden");
|
||||
return;
|
||||
}
|
||||
var bb = result[0].boundingbox;
|
||||
var bounds = [
|
||||
[bb[0], bb[2]],
|
||||
[bb[1], bb[3]]
|
||||
];
|
||||
self._map.map.fitBounds(bounds);
|
||||
_this._placeholder.setData("Zoek naar een locatie...");
|
||||
}, function () {
|
||||
_this._placeholder.setData("Niets gevonden: er ging iets mis");
|
||||
});
|
||||
};
|
||||
SearchAndGo.prototype.InnerRender = function () {
|
||||
// "<img class='search' src='./assets/search.svg' alt='Search'> " +
|
||||
return this._searchField.Render() +
|
||||
this._goButton.Render();
|
||||
};
|
||||
SearchAndGo.prototype.Update = function () {
|
||||
_super.prototype.Update.call(this);
|
||||
this._searchField.Update();
|
||||
this._goButton.Update();
|
||||
};
|
||||
SearchAndGo.prototype.Activate = function () {
|
||||
_super.prototype.Activate.call(this);
|
||||
this._searchField.Activate();
|
||||
this._goButton.Activate();
|
||||
};
|
||||
return SearchAndGo;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.SearchAndGo = SearchAndGo;
|
||||
|
|
@ -1,84 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.SimpleAddUI = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var FixedUiElement_1 = require("./Base/FixedUiElement");
|
||||
var Button_1 = require("./Base/Button");
|
||||
/**
|
||||
* Asks to add a feature at the last clicked location, at least if zoom is sufficient
|
||||
*/
|
||||
var SimpleAddUI = /** @class */ (function (_super) {
|
||||
__extends(SimpleAddUI, _super);
|
||||
function SimpleAddUI(zoomlevel, lastClickLocation, changes, selectedElement, dataIsLoading, userDetails, addButtons) {
|
||||
var _this = _super.call(this, zoomlevel) || this;
|
||||
_this._zoomlevel = zoomlevel;
|
||||
_this._lastClickLocation = lastClickLocation;
|
||||
_this._changes = changes;
|
||||
_this._selectedElement = selectedElement;
|
||||
_this._dataIsLoading = dataIsLoading;
|
||||
_this._userDetails = userDetails;
|
||||
_this.ListenTo(userDetails);
|
||||
_this.ListenTo(dataIsLoading);
|
||||
_this._addButtons = [];
|
||||
for (var _i = 0, addButtons_1 = addButtons; _i < addButtons_1.length; _i++) {
|
||||
var option = addButtons_1[_i];
|
||||
// <button type='button'> looks SO retarded
|
||||
// the default type of button is 'submit', which performs a POST and page reload
|
||||
var button = new Button_1.Button(new FixedUiElement_1.FixedUiElement("Voeg hier een " + option.name + " toe"), _this.CreatePoint(option));
|
||||
_this._addButtons.push(button);
|
||||
}
|
||||
return _this;
|
||||
}
|
||||
SimpleAddUI.prototype.CreatePoint = function (option) {
|
||||
var self = this;
|
||||
return function () {
|
||||
console.log("Creating a new ", option.name, " at last click location");
|
||||
var loc = self._lastClickLocation.data;
|
||||
var feature = self._changes.createElement(option.tags, loc.lat, loc.lon);
|
||||
option.layerToAddTo.AddNewElement(feature);
|
||||
self._selectedElement.setData(feature.properties);
|
||||
};
|
||||
};
|
||||
SimpleAddUI.prototype.InnerRender = function () {
|
||||
var header = "<h2>Geen selectie</h2>" +
|
||||
"Je klikte ergens waar er nog geen gezochte data is.<br/>";
|
||||
if (!this._userDetails.data.loggedIn) {
|
||||
return header + "<a class='activate-osm-authentication'>Gelieve je aan te melden om een nieuw punt toe te voegen</a>";
|
||||
}
|
||||
if (this._zoomlevel.data.zoom < 19) {
|
||||
return header + "Zoom verder in om een element toe te voegen.";
|
||||
}
|
||||
if (this._dataIsLoading.data) {
|
||||
return header + "De data is nog aan het laden. Nog even geduld, dan kan je een punt toevoegen";
|
||||
}
|
||||
var html = "";
|
||||
for (var _i = 0, _a = this._addButtons; _i < _a.length; _i++) {
|
||||
var button = _a[_i];
|
||||
html += button.Render();
|
||||
}
|
||||
return header + html;
|
||||
};
|
||||
SimpleAddUI.prototype.InnerUpdate = function (htmlElement) {
|
||||
_super.prototype.InnerUpdate.call(this, htmlElement);
|
||||
for (var _i = 0, _a = this._addButtons; _i < _a.length; _i++) {
|
||||
var button = _a[_i];
|
||||
button.Update();
|
||||
}
|
||||
this._userDetails.data.osmConnection.registerActivateOsmAUthenticationClass();
|
||||
};
|
||||
return SimpleAddUI;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.SimpleAddUI = SimpleAddUI;
|
||||
|
|
@ -1,92 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.SlideShow = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var UIEventSource_1 = require("./UIEventSource");
|
||||
var FixedUiElement_1 = require("./Base/FixedUiElement");
|
||||
var SlideShow = /** @class */ (function (_super) {
|
||||
__extends(SlideShow, _super);
|
||||
function SlideShow(embeddedElements, noImages) {
|
||||
var _this = _super.call(this, embeddedElements) || this;
|
||||
_this._currentSlide = new UIEventSource_1.UIEventSource(0);
|
||||
_this._embeddedElements = embeddedElements;
|
||||
_this.ListenTo(_this._currentSlide);
|
||||
_this._noimages = noImages;
|
||||
var self = _this;
|
||||
_this._prev = new FixedUiElement_1.FixedUiElement("<div class='prev-button'>" +
|
||||
"<div class='vspan'></div>" +
|
||||
"<img src='assets/arrow-left-smooth.svg' alt='Prev'/>" +
|
||||
"</div>")
|
||||
.onClick(function () {
|
||||
var current = self._currentSlide.data;
|
||||
self.MoveTo(current - 1);
|
||||
});
|
||||
_this._next = new FixedUiElement_1.FixedUiElement("<div class='next-button'>" +
|
||||
"<div class='vspan'></div>" +
|
||||
"<img src='assets/arrow-right-smooth.svg' alt='Next'/>" +
|
||||
"</div>")
|
||||
.onClick(function () {
|
||||
var current = self._currentSlide.data;
|
||||
self.MoveTo(current + 1);
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
SlideShow.prototype.InnerRender = function () {
|
||||
if (this._embeddedElements.data.length == 0) {
|
||||
return this._noimages.Render();
|
||||
}
|
||||
if (this._embeddedElements.data.length == 1) {
|
||||
return "<div class='image-slideshow'><div class='slides'><div class='slide'>" +
|
||||
this._embeddedElements.data[0].Render() +
|
||||
"</div></div></div>";
|
||||
}
|
||||
var slides = "";
|
||||
for (var i = 0; i < this._embeddedElements.data.length; i++) {
|
||||
var embeddedElement = this._embeddedElements.data[i];
|
||||
var state = "hidden";
|
||||
if (this._currentSlide.data === i) {
|
||||
state = "active-slide";
|
||||
}
|
||||
slides += " <div class=\"slide " + state + "\">" + embeddedElement.Render() + "</div>\n";
|
||||
}
|
||||
return "<div class='image-slideshow'>"
|
||||
+ this._prev.Render()
|
||||
+ "<div class='slides'>" + slides + "</div>"
|
||||
+ this._next.Render()
|
||||
+ "</div>";
|
||||
};
|
||||
SlideShow.prototype.MoveTo = function (index) {
|
||||
if (index < 0) {
|
||||
index = this._embeddedElements.data.length - 1;
|
||||
}
|
||||
index = index % this._embeddedElements.data.length;
|
||||
this._currentSlide.setData(index);
|
||||
};
|
||||
SlideShow.prototype.InnerUpdate = function (htmlElement) {
|
||||
this._next.Update();
|
||||
this._prev.Update();
|
||||
};
|
||||
SlideShow.prototype.Activate = function () {
|
||||
for (var _i = 0, _a = this._embeddedElements.data; _i < _a.length; _i++) {
|
||||
var embeddedElement = _a[_i];
|
||||
embeddedElement.Activate();
|
||||
}
|
||||
this._next.Update();
|
||||
this._prev.Update();
|
||||
};
|
||||
return SlideShow;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.SlideShow = SlideShow;
|
||||
115
UI/UIElement.js
115
UI/UIElement.js
|
|
@ -1,115 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.UIElement = void 0;
|
||||
var FixedUiElement_1 = require("./Base/FixedUiElement");
|
||||
var UIElement = /** @class */ (function () {
|
||||
function UIElement(source) {
|
||||
this._hideIfEmpty = false;
|
||||
this.id = "ui-element-" + UIElement.nextId;
|
||||
this._source = source;
|
||||
UIElement.nextId++;
|
||||
this.ListenTo(source);
|
||||
}
|
||||
UIElement.prototype.ListenTo = function (source) {
|
||||
if (source === undefined) {
|
||||
return;
|
||||
}
|
||||
var self = this;
|
||||
source.addCallback(function () {
|
||||
self.Update();
|
||||
});
|
||||
};
|
||||
UIElement.prototype.onClick = function (f) {
|
||||
this._onClick = f;
|
||||
this.Update();
|
||||
return this;
|
||||
};
|
||||
UIElement.Fix = function (element) {
|
||||
if (typeof (element) === 'string') {
|
||||
return new FixedUiElement_1.FixedUiElement(element);
|
||||
}
|
||||
return element;
|
||||
};
|
||||
UIElement.prototype.Update = function () {
|
||||
var element = document.getElementById(this.id);
|
||||
if (element === null || element === undefined) {
|
||||
// The element is not painted
|
||||
return;
|
||||
}
|
||||
element.innerHTML = this.InnerRender();
|
||||
if (this._hideIfEmpty) {
|
||||
if (element.innerHTML === "") {
|
||||
element.parentElement.style.display = "none";
|
||||
}
|
||||
else {
|
||||
element.parentElement.style.display = undefined;
|
||||
}
|
||||
}
|
||||
if (this._onClick !== undefined) {
|
||||
var self_1 = this;
|
||||
element.onclick = function () {
|
||||
self_1._onClick();
|
||||
};
|
||||
element.style.pointerEvents = "all";
|
||||
element.style.cursor = "pointer";
|
||||
}
|
||||
this.InnerUpdate(element);
|
||||
for (var i in this) {
|
||||
var child = this[i];
|
||||
if (child instanceof UIElement) {
|
||||
child.Update();
|
||||
}
|
||||
else if (child instanceof Array) {
|
||||
for (var _i = 0, child_1 = child; _i < child_1.length; _i++) {
|
||||
var ch = child_1[_i];
|
||||
if (ch instanceof UIElement) {
|
||||
ch.Update();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
UIElement.prototype.HideOnEmpty = function (hide) {
|
||||
this._hideIfEmpty = hide;
|
||||
this.Update();
|
||||
return this;
|
||||
};
|
||||
// Called after the HTML has been replaced. Can be used for css tricks
|
||||
UIElement.prototype.InnerUpdate = function (htmlElement) { };
|
||||
UIElement.prototype.Render = function () {
|
||||
return "<span class='uielement' id='" + this.id + "'>" + this.InnerRender() + "</span>";
|
||||
};
|
||||
UIElement.prototype.AttachTo = function (divId) {
|
||||
var element = document.getElementById(divId);
|
||||
if (element === null) {
|
||||
console.log("SEVERE: could not attach UIElement to ", divId);
|
||||
return;
|
||||
}
|
||||
element.innerHTML = this.Render();
|
||||
this.Update();
|
||||
return this;
|
||||
};
|
||||
UIElement.prototype.Activate = function () {
|
||||
for (var i in this) {
|
||||
var child = this[i];
|
||||
if (child instanceof UIElement) {
|
||||
child.Activate();
|
||||
}
|
||||
else if (child instanceof Array) {
|
||||
for (var _i = 0, child_2 = child; _i < child_2.length; _i++) {
|
||||
var ch = child_2[_i];
|
||||
if (ch instanceof UIElement) {
|
||||
ch.Activate();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
;
|
||||
UIElement.prototype.IsEmpty = function () {
|
||||
return this.InnerRender() === "";
|
||||
};
|
||||
UIElement.nextId = 0;
|
||||
return UIElement;
|
||||
}());
|
||||
exports.UIElement = UIElement;
|
||||
|
|
@ -1,58 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.UIEventSource = void 0;
|
||||
var UIEventSource = /** @class */ (function () {
|
||||
function UIEventSource(data) {
|
||||
this._callbacks = [];
|
||||
this.data = data;
|
||||
}
|
||||
UIEventSource.prototype.addCallback = function (callback) {
|
||||
this._callbacks.push(callback);
|
||||
return this;
|
||||
};
|
||||
UIEventSource.prototype.setData = function (t) {
|
||||
if (this.data === t) {
|
||||
return;
|
||||
}
|
||||
this.data = t;
|
||||
this.ping();
|
||||
};
|
||||
UIEventSource.prototype.ping = function () {
|
||||
for (var _i = 0, _a = this._callbacks; _i < _a.length; _i++) {
|
||||
var callback = _a[_i];
|
||||
callback(this.data);
|
||||
}
|
||||
};
|
||||
UIEventSource.flatten = function (source, possibleSources) {
|
||||
var _a;
|
||||
var sink = new UIEventSource((_a = source.data) === null || _a === void 0 ? void 0 : _a.data);
|
||||
source.addCallback(function (latestData) {
|
||||
sink.setData(latestData === null || latestData === void 0 ? void 0 : latestData.data);
|
||||
});
|
||||
for (var _i = 0, possibleSources_1 = possibleSources; _i < possibleSources_1.length; _i++) {
|
||||
var possibleSource = possibleSources_1[_i];
|
||||
possibleSource.addCallback(function () {
|
||||
var _a;
|
||||
sink.setData((_a = source.data) === null || _a === void 0 ? void 0 : _a.data);
|
||||
});
|
||||
}
|
||||
return sink;
|
||||
};
|
||||
UIEventSource.prototype.map = function (f, extraSources) {
|
||||
if (extraSources === void 0) { extraSources = []; }
|
||||
var self = this;
|
||||
var update = function () {
|
||||
newSource.setData(f(self.data));
|
||||
newSource.ping();
|
||||
};
|
||||
this.addCallback(update);
|
||||
for (var _i = 0, extraSources_1 = extraSources; _i < extraSources_1.length; _i++) {
|
||||
var extraSource = extraSources_1[_i];
|
||||
extraSource.addCallback(update);
|
||||
}
|
||||
var newSource = new UIEventSource(f(this.data));
|
||||
return newSource;
|
||||
};
|
||||
return UIEventSource;
|
||||
}());
|
||||
exports.UIEventSource = UIEventSource;
|
||||
112
UI/UserBadge.js
112
UI/UserBadge.js
|
|
@ -1,112 +0,0 @@
|
|||
"use strict";
|
||||
var __extends = (this && this.__extends) || (function () {
|
||||
var extendStatics = function (d, b) {
|
||||
extendStatics = Object.setPrototypeOf ||
|
||||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||
return extendStatics(d, b);
|
||||
};
|
||||
return function (d, b) {
|
||||
extendStatics(d, b);
|
||||
function __() { this.constructor = d; }
|
||||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||
};
|
||||
})();
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.UserBadge = void 0;
|
||||
var UIElement_1 = require("./UIElement");
|
||||
var leaflet_1 = require("leaflet");
|
||||
var FixedUiElement_1 = require("./Base/FixedUiElement");
|
||||
var VariableUIElement_1 = require("./Base/VariableUIElement");
|
||||
/**
|
||||
* Handles and updates the user badge
|
||||
*/
|
||||
var UserBadge = /** @class */ (function (_super) {
|
||||
__extends(UserBadge, _super);
|
||||
function UserBadge(userDetails, pendingChanges, basemap) {
|
||||
var _this = _super.call(this, userDetails) || this;
|
||||
_this._userDetails = userDetails;
|
||||
_this._pendingChanges = pendingChanges;
|
||||
_this._basemap = basemap;
|
||||
_this._logout = new FixedUiElement_1.FixedUiElement("<img src='assets/logout.svg' class='small-userbadge-icon' alt='logout'>")
|
||||
.onClick(function () {
|
||||
userDetails.data.osmConnection.LogOut();
|
||||
});
|
||||
userDetails.addCallback(function () {
|
||||
var profilePic = document.getElementById("profile-pic");
|
||||
if (profilePic) {
|
||||
profilePic.onload = function () {
|
||||
profilePic.style.opacity = "1";
|
||||
};
|
||||
}
|
||||
});
|
||||
_this._homeButton = new VariableUIElement_1.VariableUiElement(userDetails.map(function (userinfo) {
|
||||
if (userinfo.home) {
|
||||
return "<img id='home' src='./assets/home.svg' alt='home' class='small-userbadge-icon'> ";
|
||||
}
|
||||
return "";
|
||||
})).onClick(function () {
|
||||
var _a;
|
||||
var home = (_a = userDetails.data) === null || _a === void 0 ? void 0 : _a.home;
|
||||
if (home === undefined) {
|
||||
return;
|
||||
}
|
||||
basemap.map.flyTo([home.lat, home.lon], 18);
|
||||
});
|
||||
return _this;
|
||||
}
|
||||
UserBadge.prototype.InnerRender = function () {
|
||||
var user = this._userDetails.data;
|
||||
if (!user.loggedIn) {
|
||||
return "<div class='activate-osm-authentication'>Klik hier om aan te melden bij OSM</div>";
|
||||
}
|
||||
var messageSpan = "<span id='messages'>" +
|
||||
" <a href='https://www.openstreetmap.org/messages/inbox' target='_blank'><img class='small-userbadge-icon' src='./assets/envelope.svg' alt='msgs'>" +
|
||||
user.totalMessages +
|
||||
"</a></span>";
|
||||
if (user.unreadMessages > 0) {
|
||||
messageSpan = "<span id='messages' class='alert'>" +
|
||||
" <a href='https://www.openstreetmap.org/messages/inbox' target='_blank'><img class='small-userbadge-icon' src='./assets/envelope.svg' alt='msgs'/>" +
|
||||
" " +
|
||||
"" +
|
||||
user.unreadMessages.toString() +
|
||||
"</a></span>";
|
||||
}
|
||||
var dryrun = "";
|
||||
if (user.dryRun) {
|
||||
dryrun = " <span class='alert'>TESTING</span>";
|
||||
}
|
||||
if (user.home !== undefined) {
|
||||
var icon = leaflet_1.default.icon({
|
||||
iconUrl: 'assets/home.svg',
|
||||
iconSize: [20, 20],
|
||||
iconAnchor: [10, 10]
|
||||
});
|
||||
leaflet_1.default.marker([user.home.lat, user.home.lon], { icon: icon }).addTo(this._basemap.map);
|
||||
}
|
||||
var settings = "<a href='https://www.openstreetmap.org/user/" + encodeURIComponent(user.name) + "/account' target='_blank'>" +
|
||||
"<img class='small-userbadge-icon' src='./assets/gear.svg' alt='settings'>" +
|
||||
"</a> ";
|
||||
return "<a href='https://www.openstreetmap.org/user/" + encodeURIComponent(user.name) + "' target='_blank'>" +
|
||||
"<img id='profile-pic' src='" + user.img + "' alt='profile-pic'/> " +
|
||||
"</a>" +
|
||||
"<div id='usertext'>" +
|
||||
"<p id='username'>" +
|
||||
"<a href='https://www.openstreetmap.org/user/" + user.name + "' target='_blank'>" + user.name + "</a>" +
|
||||
dryrun +
|
||||
"</p> " +
|
||||
"<p id='userstats'>" +
|
||||
this._homeButton.Render() +
|
||||
settings +
|
||||
messageSpan +
|
||||
"<span id='csCount'> " +
|
||||
" <a href='https://www.openstreetmap.org/user/" + user.name + "/history' target='_blank'><img class='small-userbadge-icon' src='./assets/star.svg' alt='star'/> " + user.csCount +
|
||||
"</a></span> " +
|
||||
this._logout.Render() +
|
||||
this._pendingChanges.Render() +
|
||||
"</p>" +
|
||||
"</div>";
|
||||
};
|
||||
return UserBadge;
|
||||
}(UIElement_1.UIElement));
|
||||
exports.UserBadge = UserBadge;
|
||||
Loading…
Add table
Add a link
Reference in a new issue