Improvements to OH picker
This commit is contained in:
parent
418658a1e8
commit
2795e7c0db
3 changed files with 50 additions and 24 deletions
|
@ -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")
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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 {
|
||||
|
|
Loading…
Reference in a new issue