Used realfavicongenerator.net to generate new favicons

server/public/assets/css/style.css

@@ -2479,7 +2479,7 @@ nav ul li:hover, nav ul li.active {
     }
 
     .footer-copyright {
-      margin-bottom: 40px;
+      margin-bottom: 10px;
     }
 
     #duration{

server/public/assets/images/safari-pinned-tab.svg

@@ -0,0 +1,26 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="1024.000000pt" height="1024.000000pt" viewBox="0 0 1024.000000 1024.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.11, written by Peter Selinger 2001-2013
+</metadata>
+<g transform="translate(0.000000,1024.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M4855 10233 c-394 -26 -679 -71 -1020 -158 -1295 -331 -2412 -1169
+-3115 -2335 -83 -138 -254 -475 -314 -620 -161 -385 -269 -757 -335 -1155 -19
+-117 -23 -146 -36 -270 -4 -33 -9 -71 -11 -85 -24 -154 -24 -766 0 -970 2 -14
+7 -56 11 -95 4 -38 8 -77 10 -85 1 -8 6 -40 9 -70 4 -30 11 -77 16 -105 5 -27
+12 -66 15 -85 3 -19 22 -106 41 -194 54 -241 111 -432 219 -726 34 -95 135
+-321 203 -455 276 -547 649 -1040 1108 -1465 79 -74 256 -224 320 -271 32 -24
+61 -46 64 -49 11 -13 182 -132 291 -203 351 -231 772 -433 1191 -571 237 -78
+556 -156 783 -191 113 -17 352 -45 445 -51 205 -15 757 -8 858 10 9 2 46 7 82
+11 98 10 201 24 305 41 66 11 276 57 389 85 636 160 1269 465 1808 871 325
+245 606 515 892 858 127 153 329 446 452 655 389 662 622 1424 681 2226 14
+199 7 727 -12 842 -2 12 -9 67 -15 122 -35 308 -117 677 -222 990 -212 637
+-535 1207 -982 1730 -586 685 -1383 1220 -2251 1510 -373 125 -793 212 -1150
+240 -44 4 -91 9 -105 11 -27 6 -560 11 -625 7z"/>
+</g>
+</svg>

server/public/assets/js/frontpage.js

@@ -193,7 +193,7 @@ var Frontpage = {
             var img = new Image();
             img.src = "/assets/images/thumbnails/"+id+".jpg";
 
-            img.onerror = function(){ // Failed to load
+            img.onerror = function(e){ // Failed to load
                 $.ajax({
                     type: "POST",
                     data: {id:id},

server/public/assets/js/listeners.js

@@ -351,6 +351,10 @@ function init(){
     $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color));
     $("#search").attr("placeholder", "Find song on YouTube...");
 
+    if(!$("footer").hasClass("padding-bottom-novideo")) {
+        $("footer").addClass("padding-bottom-novideo");
+    }
+
     if(!/chrom(e|ium)/.test(navigator.userAgent.toLowerCase()) && !Helper.mobilecheck()){
         $(".castButton").css("display", "none");
     }
@@ -1919,7 +1923,7 @@ function onepage_load(){
                 else $("main").append($(response.find("#main_section_frontpage")).wrap("<div>").parent().html());
                 $(".page-footer").removeClass("padding-bottom-extra");
                 $(".page-footer").removeClass("padding-bottom-novideo");
-                $("#favicon").attr("href", "/assets/images/favicon.png");
+                $("#favicon").attr("href", "/assets/images/favicon-32x32.png");
 
                 $(".context-menu-list").remove();
                 Helper.log(socket);

server/public/assets/manifest.json

@@ -1,16 +1,31 @@
 {
     "short_name": "Zoff",
-  "name": "Zoff",
+    "name": "Zoff - the shared YouTube based radio",
-  "icons": [
+    "description": "A free YouTube based radio, where no registration is needed for listening to channels, or creating your own channels. ",
-    {
+    "dir": "ltr",
-      "src": "/assets/images/144x144.png",
+    "lang": "en-US",
-      "sizes": "144x144",
-      "type": "image/png"
-    }
-  ],
     "start_url": "/",
     "display": "standalone",
     "background_color": "#2D2D2D",
     "theme_color": "#2D2D2D",
-  "orientation": "portrait"
+    "orientation": "portrait",
+    "related_applications": [
+        {
+            "platform": "play",
+            "id": "zoff.me.zoff",
+            "url": "https://play.google.com/store/apps/details?id=zoff.me.zoff"
+        }
+    ],
+    "icons": [
+        {
+            "src": "/assets/images/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/assets/images/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ]
 }

server/public/layouts/main.handlebars

@@ -11,12 +11,12 @@
     <title>Zoff - the shared YouTube based radio</title>
     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
     <meta name="author" content="Nicolas 'Nixo' Almagro Tonne &amp; Kasper 'KasperRT' Rynning-Tønnesen"/>
-    <meta name="description" content="The Shared (free) YouTube radio."/>
+    <meta name="description" content="The shared (free) YouTube radio."/>
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no"/>
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="mobile-web-app-capable" content="yes">
     <meta name="theme-color" content="#2D2D2D" />
-    <meta property="og:image" content="https://zoff.me/assets/images/favicon.png" />
+    <meta property="og:image" content="https://zoff.me/assets/images/favicon-32x32.png" />
     <meta property="og:url" content="https://zoff.me" />
     <meta property="og:title" content="Zoff"/>
     <meta property="og:description" content="The Shared (free) YouTube radio."/>
@@ -28,7 +28,10 @@
     <link type="text/css" rel="stylesheet" href="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.css" />
     <link type="text/css" rel="stylesheet" href="/assets/css/materialize.min.css" />
     <link rel="stylesheet" type="text/css" href="/assets/css/style.css" title="Default" />
-    <link rel="icon" id="favicon" type="image/png" href="/assets/images/favicon.png"/>
+    <link rel="apple-touch-icon" sizes="180x180" href="/assets/images/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon-32x32.png">
+    <link rel="icon" id="favicon" type="image/png" sizes="16x16" href="/assets/images/favicon-16x16.png">
+    <link rel="mask-icon" href="/assets/images/safari-pinned-tab.svg" color="#2d2d2d">
     <script>
     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
         (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

server/routing/router.js

@@ -11,6 +11,10 @@ router.use(function(req, res, next) {
     next(); // make sure we go to the next routes and don't stop here
 });
 
+router.route('/favicon.ico').get(function(req, res, next) {
+    res.sendFile(path.join(pathThumbnails, '/public/assets/images/favicon.ico'));
+});
+
 router.route('/:channel_name').get(function(req, res, next){
     try{
         var url = req.headers['x-forwarded-host'] ? req.headers['x-forwarded-host'] : req.headers.host.split(":")[0];