131 lines
4.3 KiB
JavaScript
131 lines
4.3 KiB
JavaScript
var forEach = function (array, callback, scope) {
|
|
for (var i = 0; i < array.length; i++) {
|
|
callback.call(scope, i, array[i]);
|
|
}
|
|
};
|
|
|
|
var ChartLoader = function() {
|
|
var charts = document.querySelectorAll('.chart-container');
|
|
|
|
forEach(charts, function(i, chart) {
|
|
var api = chart.getAttribute('data-api');
|
|
var canvas = chart.querySelector('.chart-canvas');
|
|
var height = chart.getAttribute('data-height');
|
|
var data = {};
|
|
var config = {
|
|
type: chart.getAttribute('data-type'),
|
|
data: data,
|
|
options: {}
|
|
};
|
|
var instance = new Chart(canvas, config);
|
|
|
|
chart.addEventListener('refresh', function() {
|
|
fetch(api)
|
|
.then(function(response) {
|
|
if(response.ok) {
|
|
response.json().then(function(json) {
|
|
if (json.hasOwnProperty('data')) {
|
|
instance.data = json.data;
|
|
}
|
|
|
|
if (json.hasOwnProperty('options')) {
|
|
instance.options = json.options;
|
|
}
|
|
|
|
if (json.hasOwnProperty('type')) {
|
|
instance.type = json.type;
|
|
}
|
|
|
|
instance.update();
|
|
instance.resize();
|
|
});
|
|
}
|
|
|
|
if (chart.hasAttribute('data-reload')) {
|
|
window.setTimeout(function() {
|
|
chart.dispatchEvent(new Event('refresh'));
|
|
}, chart.getAttribute('data-reload'))
|
|
}
|
|
});
|
|
});
|
|
chart.dispatchEvent(new Event('refresh'));
|
|
});
|
|
}
|
|
|
|
var CameraEvent = function() {
|
|
var cameras = document.querySelectorAll('.camera');
|
|
|
|
forEach(cameras, function(i, camera) {
|
|
camera.addEventListener('click', function() {
|
|
var isFullscreen = parseInt(camera.getAttribute('data-fullscreen'));
|
|
|
|
if (isFullscreen) {
|
|
camera.setAttribute('data-fullscreen', '0');
|
|
camera.classList.add('box');
|
|
|
|
if (document.exitFullscreen) {
|
|
document.exitFullscreen();
|
|
} else if (document.webkitExitFullscreen) {
|
|
document.webkitExitFullscreen();
|
|
} else if (document.mozCancelFullScreen) {
|
|
document.mozCancelFullScreen();
|
|
}
|
|
} else {
|
|
camera.setAttribute('data-fullscreen', '1');
|
|
camera.classList.remove('box');
|
|
|
|
if (camera.requestFullscreen) {
|
|
camera.requestFullscreen();
|
|
} else if (camera.webkitRequestFullscreen) {
|
|
camera.webkitRequestFullscreen();
|
|
} else if (camera.mozRequestFullScreen) {
|
|
camera.mozRequestFullScreen();
|
|
}
|
|
}
|
|
}, false);
|
|
});
|
|
}
|
|
|
|
var SnapshotEvent = function() {
|
|
var links = document.querySelectorAll('.snapshot-link');
|
|
var view = document.querySelector('#snapshot-view');
|
|
var body = document.querySelector('body');
|
|
|
|
forEach(links, function(i, link) {
|
|
link.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
|
|
var template = document.querySelector(link.getAttribute('data-template'));
|
|
|
|
body.classList.add('modal-open');
|
|
view.innerHTML = template.innerHTML
|
|
.replace(/{src}/g, link.getAttribute('href'))
|
|
.replace(/{title}/g, link.getAttribute('data-title'));
|
|
|
|
view.querySelector('.modal').addEventListener('click', function() {
|
|
e.preventDefault();
|
|
view.innerHTML = '';
|
|
body.classList.remove('modal-open');
|
|
}, false);
|
|
});
|
|
});
|
|
}
|
|
|
|
var NavbarEvent = function() {
|
|
var burger = document.querySelector('.navbar-burger');
|
|
var menu = document.querySelector('.navbar-menu');
|
|
|
|
if (burger && menu) {
|
|
burger.addEventListener('click', function(e) {
|
|
menu.classList.toggle('show');
|
|
})
|
|
}
|
|
}
|
|
|
|
window.addEventListener('load', function() {
|
|
ChartLoader();
|
|
CameraEvent();
|
|
SnapshotEvent();
|
|
NavbarEvent();
|
|
}, false)
|