the-glorious-startpage/js/dock-buttons.js

101 lines
2.4 KiB
JavaScript
Raw Normal View History

2020-06-04 02:14:24 +02:00
var dock = document.getElementById('dock');
// Create mouse event for passed div
const addMouseUpEvent = (li, url) => {
li.onmouseup = () => {
window.location.href = encodeURI(url);
}
}
// Generate button from user
const generateFromManual = (id, icon, callback) => {
var customButtonCallback;
2020-06-04 02:35:05 +02:00
var dockButton = document.createElement('div');
dockButton.id = 'button' + id;
dockButton.className = 'dockButton';
2020-06-04 02:14:24 +02:00
2020-06-04 02:35:05 +02:00
dockButton.onmouseup = callback;
2020-06-04 02:14:24 +02:00
var buttonImage = document.createElement('div');
buttonImage.id = 'buttonImage' + id;
2020-06-04 02:35:05 +02:00
buttonImage.className = 'dockButtonImage';
2020-06-04 02:14:24 +02:00
buttonImage.style.background = "url('assets/buttons/" + icon + ".svg')";
buttonImage.style.backgroundSize = 'cover';
2020-06-04 02:35:05 +02:00
dockButton.appendChild(buttonImage);
dock.appendChild(dockButton);
2020-06-04 02:14:24 +02:00
}
// Create callback event for onmouse up
const addCallbackEvent = (element, callback) => {
element.onmouseup = callback;
}
// Generate buttons from array
const generateFromList = () => {
for (i = 0; i < (dockSites.length); i++) {
var site = dockSites[i].site;
var icon = dockSites[i].icon;
var url = dockSites[i].url;
2020-06-04 02:35:05 +02:00
var dockButton = document.createElement('div');
dockButton.id = 'button' + i;
dockButton.className = 'dockButton';
addMouseUpEvent(dockButton, url);
2020-06-04 02:14:24 +02:00
var buttonImage = document.createElement('div');
buttonImage.id = 'buttonImage' + i;
2020-06-04 02:35:05 +02:00
buttonImage.className = 'dockButtonImage';
2020-06-04 02:14:24 +02:00
buttonImage.style.background = "url('assets/webcons/" + icon + ".svg')";
buttonImage.style.backgroundSize = 'cover';
// Append divs
2020-06-04 02:35:05 +02:00
dockButton.appendChild(buttonImage);
dock.appendChild(dockButton);
2020-06-04 02:14:24 +02:00
};
2020-06-04 02:39:09 +02:00
}
const populateDock = () => {
// Create launcher button
generateFromManual(
'Launch',
'launch',
() => {
// Toggle web pad
alert('toggle web pad');
}
);
// Create dock buttons fetched from sites-list.js
generateFromList();
2020-06-04 02:14:24 +02:00
// Create weather button
generateFromManual(
'Weather',
'weather',
() => {
2020-06-04 02:39:09 +02:00
alert('toggle weather creen');
2020-06-04 02:14:24 +02:00
}
);
// Create menu button
generateFromManual(
'Dashboard',
'dashboard',
() => {
// Toggle dashboard
2020-06-04 02:39:09 +02:00
alert('toggle dashboard');
2020-06-04 02:14:24 +02:00
}
);
2020-06-04 02:39:09 +02:00
2020-06-04 02:14:24 +02:00
}
2020-06-04 02:39:09 +02:00
// Populate dock
window.onload = populateDock();
2020-06-04 02:14:24 +02:00