-
Notifications
You must be signed in to change notification settings - Fork 2
/
app.js
84 lines (78 loc) · 2.67 KB
/
app.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
async function fetchNew() {
document.getElementById("quote").style.display='none';
document.getElementById("author").style.display='none';
document.getElementById("loader").style.display='block';
const quote = await fetch(randomUrl());
const json = await quote.json();
var x = document.createElement('img');
x.src = json.img;
x.alt = json.alt;
console.log(json.img);
console.log(json.safe_title);
document.getElementById("quote").appendChild(x);
document.getElementById("author").innerHTML=json.safe_title;
document.getElementById("loader").style.display='none';
document.getElementById("quote").style.display='block';
document.getElementById("author").style.display='block';
}
function randomUrl(){
var rand = Math.floor((Math.random() * 10000) + 1)%2100;
const proxyurl = "https://cors-anywhere.herokuapp.com/";
//console.log(proxyurl+'https://xkcd.com/'+rand.toString()+'/info.0.json')
return proxyurl+'https://xkcd.com/'+rand.toString()+'/info.0.json';
}
function reload(){
location.reload();
}
function displayNotification(mhead,mbody) {
if (Notification.permission == 'granted') {
navigator.serviceWorker.getRegistration().then(function(reg) {
var options = {
body: mbody,
icon: './images/icons/icon-96x96.png',
vibrate: [100, 50, 100],
data: {
dateOfArrival: Date.now(),
primaryKey: 1
},
actions: [
{action: 'explore', title: 'retry'},
{action: 'close', title: 'close'}
]
};
reg.showNotification(mhead, options);
});
}
}
function random_bg_color() {
var x = Math.floor(Math.random() * 150);
var y = Math.floor(Math.random() * 150);
var z = Math.floor(Math.random() * 150);
var bgColor = "rgb(" + x + "," + y + "," + z + ")";
document.body.style.background = bgColor;
document.getElementById("title").style.color = bgColor;
document.getElementsByClassName("btn")[0].style.background= bgColor;
}
window.addEventListener('load', async e => {
random_bg_color();
console.log(navigator.onLine);
if ('serviceWorker' in navigator) {
try {
navigator.serviceWorker.register('serviceworker.js');
console.log('SW registered');
} catch (error) {
console.log('SW failed');
}
}
/*
if(navigator.onLine){
navigator.serviceWorker.controller.postMessage("online");
}
else
{
displayNotification('no internet','please connent to a network for fresh quotes');
navigator.serviceWorker.controller.postMessage("offline");
}
*/
await fetchNew();
});