invidious/assets/js/notifications.js

145 lines
5.5 KiB
JavaScript
Raw Normal View History

2022-04-20 04:38:24 -04:00
'use strict';
var notification_data = JSON.parse(document.getElementById('notification_data').textContent);
2019-05-05 08:46:01 -04:00
var notifications, delivered;
function get_subscriptions(callback, retries) {
2022-04-20 05:13:16 -04:00
if (retries === undefined) retries = 5;
2019-06-15 11:08:06 -04:00
if (retries <= 0) {
return;
2019-05-05 08:46:01 -04:00
}
var xhr = new XMLHttpRequest();
xhr.responseType = 'json';
2019-06-16 13:34:00 -04:00
xhr.timeout = 10000;
2019-06-16 18:33:24 -04:00
xhr.open('GET', '/api/v1/auth/subscriptions?fields=authorId', true);
2019-05-05 08:46:01 -04:00
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
2022-04-20 06:23:24 -04:00
var subscriptions = xhr.response;
2019-05-05 08:46:01 -04:00
callback(subscriptions);
}
}
2022-04-20 05:05:19 -04:00
};
2019-05-05 08:46:01 -04:00
2019-06-15 11:08:06 -04:00
xhr.onerror = function () {
console.warn('Pulling subscriptions failed... ' + retries + '/5');
2022-04-20 05:05:19 -04:00
setTimeout(function () { get_subscriptions(callback, retries - 1); }, 1000);
};
2019-06-15 11:08:06 -04:00
2019-05-05 08:46:01 -04:00
xhr.ontimeout = function () {
console.warn('Pulling subscriptions failed... ' + retries + '/5');
2019-06-15 11:08:06 -04:00
get_subscriptions(callback, retries - 1);
2022-04-20 05:05:19 -04:00
};
2019-06-15 11:08:06 -04:00
xhr.send();
2019-05-05 08:46:01 -04:00
}
function create_notification_stream(subscriptions) {
notifications = new SSE(
'/api/v1/auth/notifications?fields=videoId,title,author,authorId,publishedText,published,authorThumbnails,liveNow', {
withCredentials: true,
2022-04-20 05:05:19 -04:00
payload: 'topics=' + subscriptions.map(function (subscription) { return subscription.authorId; }).join(','),
2019-05-05 08:46:01 -04:00
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
delivered = [];
var start_time = Math.round(new Date() / 1000);
notifications.onmessage = function (event) {
if (!event.id) {
return;
2019-05-05 08:46:01 -04:00
}
var notification = JSON.parse(event.data);
console.info('Got notification:', notification);
2019-05-05 08:46:01 -04:00
if (start_time < notification.published && !delivered.includes(notification.videoId)) {
if (Notification.permission === 'granted') {
var system_notification =
new Notification((notification.liveNow ? notification_data.live_now_text : notification_data.upload_text).replace('`x`', notification.author), {
body: notification.title,
icon: '/ggpht' + new URL(notification.authorThumbnails[2].url).pathname,
img: '/ggpht' + new URL(notification.authorThumbnails[4].url).pathname,
tag: notification.videoId
});
system_notification.onclick = function (event) {
window.open('/watch?v=' + event.currentTarget.tag, '_blank');
2022-04-20 05:05:19 -04:00
};
2019-05-05 08:46:01 -04:00
}
delivered.push(notification.videoId);
localStorage.setItem('notification_count', parseInt(localStorage.getItem('notification_count') || '0') + 1);
var notification_ticker = document.getElementById('notification_ticker');
if (parseInt(localStorage.getItem('notification_count')) > 0) {
notification_ticker.innerHTML =
'<span id="notification_count">' + localStorage.getItem('notification_count') + '</span> <i class="icon ion-ios-notifications"></i>';
} else {
notification_ticker.innerHTML =
'<i class="icon ion-ios-notifications-outline"></i>';
}
}
2022-04-20 05:05:19 -04:00
};
2019-05-05 08:46:01 -04:00
notifications.addEventListener('error', handle_notification_error);
2019-05-05 08:46:01 -04:00
notifications.stream();
}
function handle_notification_error(event) {
console.warn('Something went wrong with notifications, trying to reconnect...');
notifications = { close: function () { } };
2022-04-20 05:05:19 -04:00
setTimeout(function () { get_subscriptions(create_notification_stream); }, 1000);
}
2019-05-05 08:46:01 -04:00
window.addEventListener('load', function (e) {
localStorage.setItem('notification_count', document.getElementById('notification_count') ? document.getElementById('notification_count').innerText : '0');
if (localStorage.getItem('stream')) {
localStorage.removeItem('stream');
} else {
setTimeout(function () {
if (!localStorage.getItem('stream')) {
2019-06-16 13:34:00 -04:00
notifications = { close: function () { } };
2019-05-05 08:46:01 -04:00
localStorage.setItem('stream', true);
2019-06-16 13:57:56 -04:00
get_subscriptions(create_notification_stream);
2019-05-05 08:46:01 -04:00
}
2019-06-16 13:34:00 -04:00
}, Math.random() * 1000 + 50);
2019-05-05 08:46:01 -04:00
}
window.addEventListener('storage', function (e) {
if (e.key === 'stream' && !e.newValue) {
if (notifications) {
localStorage.setItem('stream', true);
} else {
setTimeout(function () {
if (!localStorage.getItem('stream')) {
2019-06-16 13:34:00 -04:00
notifications = { close: function () { } };
localStorage.setItem('stream', true);
2019-06-16 13:57:56 -04:00
get_subscriptions(create_notification_stream);
}
2019-06-16 13:34:00 -04:00
}, Math.random() * 1000 + 50);
}
} else if (e.key === 'notification_count') {
var notification_ticker = document.getElementById('notification_ticker');
if (parseInt(e.newValue) > 0) {
notification_ticker.innerHTML =
'<span id="notification_count">' + e.newValue + '</span> <i class="icon ion-ios-notifications"></i>';
} else {
notification_ticker.innerHTML =
'<i class="icon ion-ios-notifications-outline"></i>';
}
}
});
2019-05-05 08:46:01 -04:00
});
window.addEventListener('unload', function (e) {
if (notifications) {
localStorage.removeItem('stream');
}
});