Minor changes and refactoring

pull/26/head
Maciej 2021-12-28 22:01:00 +01:00
rodzic f259adc09a
commit 0f85baa98b
2 zmienionych plików z 71 dodań i 62 usunięć

Wyświetl plik

@ -77,15 +77,18 @@ function showDetails() {
}
function getNodeUrl(nodeId) {
return `${auth.options().url}/node/${nodeId}`
return `${auth.options().url}/node/${nodeId}`;
}
function renderModalMessage(newNodeUrl) {
return `<p>Dodano element: <a target="_blank" rel="noopener" href="${newNodeUrl}">${newNodeUrl}</a></p>`
return `
<p>AED dodany z powodzeniem:
<a target="_blank" rel="noopener" href="${newNodeUrl}">${newNodeUrl}</a>
</p>`;
}
function renderModalErrorMessage(message) {
return `<p>Wystąpił błąd: ${message}</p>`
return `<p>Wystąpił błąd: ${message}</p>`;
}
function showSuccessModal(newNodeId) {
@ -124,10 +127,17 @@ function addDefibrillatorToOSM(changesetId, data) {
method: 'PUT',
path: '/api/0.6/node/create',
content: xml,
options: {header: {"Content-Type": "text/xml"}},
options: {
header: {
"Content-Type": "text/xml"
}
},
}, (err, res) => {
if (err) reject(err);
else {resolve(res); console.log(`response: ${res}`)}
else {
resolve(res);
console.log(`response: ${res}`);
}
});
})
}
@ -147,29 +157,29 @@ function stopSaveButtonAnimation() {
function saveNode(data) {
startSaveButtonAnimation();
getOpenChangesetId()
.then(changesetId => {
return addDefibrillatorToOSM(changesetId, data)
})
.then(newNodeId => {
stopSaveButtonAnimation();
showSuccessModal(newNodeId);
})
.catch(err => {
stopSaveButtonAnimation();
console.log(err);
showFailureModal(err);
});
.then(changesetId => {
return addDefibrillatorToOSM(changesetId, data);
})
.then(newNodeId => {
stopSaveButtonAnimation();
showSuccessModal(newNodeId);
})
.catch(err => {
stopSaveButtonAnimation();
console.log(err);
showFailureModal(err);
});
}
document.getElementById('addNode').onclick = function() {
document.getElementById('addNode').onclick = function () {
// add marker
const mapCenter = map.getCenter();
const initialCoordinates = [mapCenter.lng, mapCenter.lat];
if (marker !== null) marker.remove();
marker = new maplibregl.Marker({
draggable: true
})
.setLngLat(initialCoordinates);
draggable: true
})
.setLngLat(initialCoordinates);
marker.addTo(map);
// show sidebar
let properties = {

Wyświetl plik

@ -37,19 +37,19 @@ const indoorMapping = {
// --------------------------------------------------------------------------------------
function defineColor(access) {
return accessToColourMapping[access] || accessToColourMapping['default']
return accessToColourMapping[access] || accessToColourMapping['default'];
}
function defineAccessDescription(access) {
return accessToDescriptionMapping[access] || accessToDescriptionMapping['default']
return accessToDescriptionMapping[access] || accessToDescriptionMapping['default'];
}
function defineIndoor(indoor) {
return indoorMapping[indoor] || indoorMapping['default']
return indoorMapping[indoor] || indoorMapping['default'];
}
function getOsmEditLink(id) {
return `https://www.openstreetmap.org/edit?editor=id&node=${id}`
return `https://www.openstreetmap.org/edit?editor=id&node=${id}`;
}
function parseOpeningHours(openingHours) {
@ -107,14 +107,14 @@ function renderIfIndoor(indoor) {
let beginning = '<p class="has-text-weight-light">Wewnątrz budynku?: <span class="add-new has-text-weight-medium">';
let middle = defineIndoor(indoor) || '<span class="has-text-grey-light is-italic has-text-weight-light">brak informacji</span>';
let end = '</span></p>';
return beginning + middle + end
return beginning + middle + end;
}
function renderLocation(properties) {
let beginning = '<p class="has-text-weight-light">Dokładna lokalizacja: <span class="add-new has-text-weight-medium">';
let middle = properties['defibrillator:location:pl'] || properties['defibrillator:location'] || '<span class="has-text-grey-light is-italic has-text-weight-light">brak informacji</span>';
let end = '</span></p>';
return beginning + middle + end
return beginning + middle + end;
}
function renderDescription(properties) {
@ -128,17 +128,17 @@ function renderContactNumber(phone) {
let beginning = '<p class="has-text-weight-light">Numer kontaktowy: <span class="add-new has-text-weight-medium">';
let middle = phone || '<span class="has-text-grey-light is-italic has-text-weight-light">brak informacji</span>';
let end = '</span></p>';
return beginning + middle + end
return beginning + middle + end;
}
function renderAccessibleTime(openingHours) {
if (openingHours) {
let beginning = '<p class="has-text-weight-light">Dostępny w godzinach: <span class="add-new has-text-weight-medium">';
let middle = parseOpeningHours(openingHours) || '<span class="has-text-grey-light is-italic has-text-weight-light">brak informacji </span>';
let end = (renderCurrentlyOpenStatus(openingHours) || '') + '</span></p>';
return beginning + middle + end
let end = (renderCurrentlyOpenStatus(openingHours) || '') + '</span></p>';
return beginning + middle + end;
} else {
return ''
return '';
}
}
@ -147,7 +147,7 @@ function renderNotes(properties) {
let beginning = '<p class="has-text-weight-light">Uwagi: <span class="add-new has-text-weight-medium">';
let middle = properties['note:pl'] || properties.note || 'brak uwag';
let end = '</span></p>';
return beginning + middle + end
return beginning + middle + end;
} else {
return ''
}
@ -167,49 +167,48 @@ function renderSidebarContent(properties) {
function renderSidebarForm() {
let content = `
<form>
<div class="field">
<label class="label">Telefon kontaktowy operatora</label>
<label class="label has-text-weight-semibold">Rodzaj dostępu</label>
<div class="control">
<input id="${formPhoneFieldId}" tag="phone" class="input" type="tel" placeholder="+48 123 456 789">
</div>
<p class="help">Jeżeli znany</p>
</div>
<div class="field">
<label class="label">Rodzaj dostępu</label>
<div class="control">
<div class="select">
<div class="select is-success">
<select id="${formAccessFieldId}" tag="access">
<option val="">Wybierz z listy</option>
<option val="yes">Publicznie dostępny</option>
<option val="private">Dostępny za zgodą właściciela</option>
<option val="customers">Tylko w godzinach pracy</option>
<option val="customers">Dostępny tylko w godzinach pracy</option>
</select>
</div>
</div>
</div>
<div class="field">
<label class="label">Opis lokalizacji</label>
<label class="label has-text-weight-semibold">Opis lokalizacji defibrylatora</label>
<div class="control">
<textarea id="${formLocationFieldId}" tag="defibrillator:location" class="textarea" placeholder="Na przykład: Na ścianie przy wejściu"></textarea>
<textarea id="${formLocationFieldId}" tag="defibrillator:location" class="textarea is-success" placeholder="Na przykład: Na ścianie przy wejściu"></textarea>
</div>
</div>
<div class="field">
<label class="label has-text-weight-semibold">Telefon kontaktowy operatora</label>
<div class="control">
<input id="${formPhoneFieldId}" tag="phone" class="input is-success" type="tel" placeholder="+48 123 456 789">
</div>
<p class="help has-text-weight-light">Pole opcjonalne</p>
</div>
<form>
`;
return content
return content;
}
function renderEditButton(osm_id) {
return `<a href="${getOsmEditLink(osm_id)}" target="_blank" rel="noopener"
class="has-background-success-light card-footer-item has-text-centered is-size-7 has-text-weight-semibold"
>Dodaje brakujące informacje w OSM</a>`
>Dodaje brakujące informacje w OSM</a>`;
}
function renderSaveButton() {
return `<button id="sidebar-save-button" class="button" onclick="saveNode(prepareNodeData())">Zapisz</button>`
return `<button id="sidebar-save-button" class="button is-fullwidth" onclick="saveNode(prepareNodeData())">Zapisz</button>`;
}
// --------------------------------------------------------------
@ -241,9 +240,9 @@ function showSidebar(properties) {
} else if (properties.action === "addNode") {
prepareSidebarAddingNode(properties.data);
} else
console.log(`Unknown action: ${properties.action}.`)
console.log(`Unknown action: ${properties.action}.`);
} else
console.log('Sidebar not found.')
console.log('Sidebar not found.');
}
function hideSidebar() {
@ -289,23 +288,23 @@ document.addEventListener('DOMContentLoaded', () => {
// Check if there are any navbar burgers
if ($navbarBurgers.length > 0) {
// Add a click event on each of them
$navbarBurgers.forEach( el => {
el.addEventListener('click', () => {
// Add a click event on each of them
$navbarBurgers.forEach(el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
});
}
});
// button listeners
sidebarButtonCloseIds.forEach(id => {
document.getElementById(id).addEventListener('click', hideSidebar);
});
});