Add support for Web notifications

This commit is contained in:
Omar Roth 2019-05-05 07:46:01 -05:00
parent b3788bc143
commit 0338fd42e1
No known key found for this signature in database
GPG key ID: B8254FB7EC3D37F2
22 changed files with 456 additions and 30 deletions

View file

@ -2,24 +2,24 @@
<html lang="<%= env.get("preferences").as(Preferences).locale %>">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="thumbnail" content="<%= thumbnail %>">
<%= rendered "components/player_sources" %>
<link rel="stylesheet" href="/css/default.css?v=<%= ASSET_COMMIT %>">
<title><%= HTML.escape(video.title) %> - Invidious</title>
<style>
#player {
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
}
</style>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="thumbnail" content="<%= thumbnail %>">
<%= rendered "components/player_sources" %>
<link rel="stylesheet" href="/css/default.css?v=<%= ASSET_COMMIT %>">
<title><%= HTML.escape(video.title) %> - Invidious</title>
<style>
#player {
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
}
</style>
</head>
<body>

View file

@ -23,6 +23,20 @@
</td>
</tr>
<tr>
<td>
<a href="/js/notifications.js?v=<%= ASSET_COMMIT %>">notifications.js</a>
</td>
<td>
<a href="https://www.gnu.org/licenses/agpl-3.0.html">AGPL-3.0</a>
</td>
<td>
<a href="/js/notifications.js?v=<%= ASSET_COMMIT %>"><%= translate(locale, "source") %></a>
</td>
</tr>
<tr>
<td>
<a href="/js/player.js?v=<%= ASSET_COMMIT %>">player.js</a>
@ -51,6 +65,20 @@
</td>
</tr>
<tr>
<td>
<a href="/js/sse.js?v=<%= ASSET_COMMIT %>">sse.js</a>
</td>
<td>
<a href="http://www.jclark.com/xml/copying.txt">Expat</a>
</td>
<td>
<a href="https://github.com/mpetazzoni/sse.js"><%= translate(locale, "source") %></a>
</td>
</tr>
<tr>
<td>
<a href="/js/subscribe_widget.js?v=<%= ASSET_COMMIT %>">subscribe_widget.js</a>

View file

@ -165,6 +165,13 @@ function update_value(element) {
<label for="notifications_only"><%= translate(locale, "Only show notifications (if there are any): ") %></label>
<input name="notifications_only" id="notifications_only" type="checkbox" <% if preferences.notifications_only %>checked<% end %>>
</div>
<% # Conditions for supporting web notifications %>
<% if CONFIG.use_pubsub_feeds && (Kemal.config.ssl || config.https_only) %>
<div class="pure-control-group">
<a href="#" onclick="Notification.requestPermission()"><%= translate(locale, "Enable web notifications") %></a>
</div>
<% end %>
<% end %>
<% if env.get?("user") && config.admins.includes? env.get?("user").as(User).email %>

View file

@ -51,10 +51,10 @@
</a>
</div>
<div class="pure-u-1-4">
<a title="<%= translate(locale, "Subscriptions") %>" href="/feed/subscriptions" class="pure-menu-heading">
<a id="notification_ticker" title="<%= translate(locale, "Subscriptions") %>" href="/feed/subscriptions" class="pure-menu-heading">
<% notification_count = env.get("user").as(User).notifications.size %>
<% if notification_count > 0 %>
<%= notification_count %> <i class="icon ion-ios-notifications"></i>
<span id="notification_count"><%= notification_count %></span> <i class="icon ion-ios-notifications"></i>
<% else %>
<i class="icon ion-ios-notifications-outline"></i>
<% end %>
@ -151,6 +151,16 @@
<div class="pure-u-1 pure-u-md-2-24"></div>
</div>
<script src="/js/themes.js?v=<%= ASSET_COMMIT %>"></script>
<% if env.get? "user" %>
<script src="/js/sse.js?v=<%= ASSET_COMMIT %>"></script>
<script>
var notification_data = {
upload_text: '<%= HTML.escape(translate(locale, "`x` uploaded a video")) %>',
live_upload_text: '<%= HTML.escape(translate(locale, "`x` is live")) %>',
}
</script>
<script src="/js/notifications.js?v=<%= ASSET_COMMIT %>"></script>
<% end %>
</body>
</html>