Improvements to OH picker

This commit is contained in:
Pieter Vander Vennet 2020-10-21 20:54:15 +02:00
parent 418658a1e8
commit 2795e7c0db
3 changed files with 50 additions and 24 deletions

View file

@ -122,7 +122,8 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour[]>
let row = table.rows[i]
for (let j = 0; j < row.cells.length; j++) {
let cell = row.cells[j]
cell?.classList?.remove("oh-timecell-selected")
cell?.classList?.remove("oh-timecell-selected");
row.classList?.remove("oh-timerow-selected");
}
}
}
@ -163,12 +164,17 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour[]>
}
offset = -1;
}
row.classList?.add("oh-timerow-selected");
if (iStart <= i && i <= iEnd &&
jStart <= j + offset && j + offset <= jEnd) {
cell?.classList?.add("oh-timecell-selected")
} else {
cell?.classList?.remove("oh-timecell-selected")
cell?.classList?.remove("oh-timecell-selected")
row.classList?.remove("oh-timerow-selected")
}
}

View file

@ -150,16 +150,23 @@ export default class OpeningHoursVisualization extends UIElement {
nextSunday.setDate(nextSunday.getDate() + 7);
const tags = this._source.data;
if(tags._country === undefined){
if (tags._country === undefined) {
return "Loading...";
}
const oh = new opening_hours(tags[this._key], {
lat: tags._lat,
lon: tags._lon,
address: {
country_code: tags._country
}
}, {tag_key: this._key});
let oh = null;
try {
oh = new opening_hours(tags[this._key], {
lat: tags._lat,
lon: tags._lon,
address: {
country_code: tags._country
}
}, {tag_key: this._key});
} catch (e) {
console.log(e);
return "Error: could not visualize these opening hours"
}
if (!oh.getState() && !oh.getUnknown()) {
// POI is currently closed

View file

@ -5,6 +5,14 @@
height: 100%;
}
.oh-timecell {
background-color: white;
border-left: 1px solid #000;
border-right: 1px solid #000000;
position: relative;
box-sizing: border-box;
}
.oh-table th {
font-weight: bold;
font-size: medium;
@ -16,37 +24,40 @@
}
.oh-timecell:hover {
background-color: #ffd1be !important;
background-color: #92b1ff !important;
}
.oh-timecell {
background-color: white;
border-left: 1px solid #eee;
border-right: 1px solid #ccc;
position: relative;
box-sizing: border-box;
}
.oh-timecell-selected {
background-color: orange;
background-color: #0048ff;
}
.oh-timerow-selected {
border-left: 10px solid black;
margin-left: 0px;
}
.oh-timecell-half{
.oh-timecell-half {
background-color: aliceblue;
}
.oh-timecell-half.oh-timecell-selected {
background-color: lightsalmon;
background-color: #0048ff;
}
.oh-table tr {
background: #ddd;
}
.oh-left-col {
border-bottom: 1px solid #aaa;
margin: 0;
margin-left: 10px;
width: 0.5em;
font-size: large;
padding: 0;
padding-right: 0.2em;
background: #ddd;
}
.oh-draggable-header {
@ -62,17 +73,19 @@
top: 0;
left: 0;
width: 100%;
background: orange;
background: #0048ff;
z-index: 1;
box-sizing: border-box
box-sizing: border-box;
}
.oh-timerange-inner {
display: flex;
flex-direction: column;
overflow-x: hidden;
justify-content: space-between;
align-content: center;
height: 100%;
overflow-y: hidden;
}
.oh-timerange-inner input {