-
Notifications
You must be signed in to change notification settings - Fork 2
Feature/open 57: Openingsuren component (STIJ-238) #164
base: develop
Are you sure you want to change the base?
Changes from 4 commits
e85d845
3f496a2
785a7c1
c29f235
e391c25
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
Currently in Alpha since Openinghours isn't in production yet. |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<div class="openinghours" data-date="Mon Jan 01 2018 00:00:00 GMT+0100 (CET)" data-service="1" data-channel="12" data-type="month"></div> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<div class="openinghours" data-service="1" data-channel="12" data-type="week"></div> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
{ | ||
"title": "Openinghours", | ||
"name": "openinghours", | ||
"status": "alpha", | ||
"preview": "@preview", | ||
"handle": "openinghours", | ||
"default": "open-now", | ||
"variants": [ | ||
{ | ||
"name": "open-now", | ||
"title": "Open now" | ||
}, | ||
{ | ||
"name": "week", | ||
"title": "Open now" | ||
}, | ||
{ | ||
"name": "month", | ||
"title": "Open now" | ||
} | ||
] | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,98 @@ | ||
window.openingHours = (function () { | ||
'use strict'; | ||
|
||
var defaults = { | ||
endpoint: 'https://openingsuren.gentgrp.gent.be' | ||
}; | ||
|
||
function OpeningHours(items, options) { | ||
this.s = Object.assign({}, defaults, options); | ||
this.items = items; | ||
|
||
for (var i = 0; i < items.length; i++) { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. try for(var i = items.length; i--;) This will only calculate the length of your array once, plus comparing to zero is faster. https://stackoverflow.com/questions/1340589/are-loops-really-faster-in-reverse |
||
this._current = items[i]; | ||
this.init(items[i]); | ||
} | ||
|
||
return this; | ||
} | ||
|
||
OpeningHours.prototype.init = function () { | ||
if (isNaN(this._current.dataset.service) || isNaN(this._current.dataset.channel)) { | ||
this._current.innerHTML = 'Error: Please provide a service and channel.'; | ||
return false; | ||
} | ||
|
||
if (typeof this._current.dataset.date === 'string' && this._current.dataset.type === 'open-now') { | ||
this._current.innerHTML = 'Error: Date is not supported in the "open now" widget.'; | ||
return false; | ||
} | ||
|
||
if (typeof this._current.dataset.date === 'undefined') { | ||
this._current.dataset.date = new Date().toUTCString(); | ||
} | ||
|
||
var url = this.constructRequest(); | ||
this.request(url, this.print); | ||
}; | ||
|
||
OpeningHours.prototype.formattedDate = function (d) { | ||
var date; | ||
if (!d) { | ||
date = new Date(); | ||
} | ||
else { | ||
date = new Date(d); | ||
} | ||
|
||
return date.getDate() + '-' + (date.getMonth() + 1) + '-' + date.getFullYear(); | ||
}; | ||
|
||
OpeningHours.prototype.constructRequest = function () { | ||
switch (this._current.dataset.type) { | ||
case 'open-now': | ||
return this.s.endpoint + '/api/v1/services/' + this._current.dataset.service + '/channels/' + this._current.dataset.channel + '/open-now'; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I'd put these strings in a function variable, so it's easy to change version numbers etc. |
||
case 'month': | ||
return this.s.endpoint + '/api/v1/services/' + this._current.dataset.service + '/channels/' + this._current.dataset.channel + '/openinghours/month?date=' + this.formattedDate(this._current.dataset.date); | ||
default: | ||
var until = new Date(this._current.dataset.date); | ||
until.setDate(until.getDate() + 6); | ||
return this.s.endpoint + '/api/v1/services/' + this._current.dataset.service + '/channels/' + this._current.dataset.channel + '/openinghours?from=' + this.formattedDate(this._current.dataset.date) + '&until=' + this.formattedDate(until); | ||
} | ||
}; | ||
|
||
OpeningHours.prototype.request = function (url, callback) { | ||
var xmlhttp; | ||
xmlhttp = new XMLHttpRequest(); | ||
xmlhttp.element = this._current; | ||
xmlhttp.onreadystatechange = function () { | ||
if (xmlhttp.readyState === 4 && xmlhttp.status === 200) { | ||
callback(xmlhttp.element, xmlhttp.responseText); | ||
} | ||
}; | ||
xmlhttp.open('GET', url, true); | ||
xmlhttp.setRequestHeader('Accept', 'text/html'); | ||
xmlhttp.send(); | ||
}; | ||
|
||
OpeningHours.prototype.print = function (element, data) { | ||
element.innerHTML = data; | ||
}; | ||
|
||
var openinghours = { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. variable is redundant |
||
load: function (options) { | ||
var items = document.querySelectorAll('.openinghours'); | ||
new OpeningHours(items, options); | ||
} | ||
}; | ||
|
||
return openinghours; | ||
}()); | ||
|
||
document.onreadystatechange = function () { | ||
'use strict'; | ||
|
||
if (document.readyState === 'interactive') { | ||
window.openingHours.load(); | ||
} | ||
}; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<div class="openinghours" data-service="1" data-channel="12" data-type="open-now"></div> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think this is necessary if you use the default preview.