Dynamic favicon (POC)

This commit is contained in:
James Barnsley
2019-04-22 21:39:40 +12:00
parent 4cae019e17
commit 4c0dbeffb3
13 changed files with 67 additions and 28 deletions

View File

@ -63476,6 +63476,27 @@ var toJSON = exports.toJSON = function toJSON(data) {
return {};
};
/**
* Set the app's favicon to a specific image.
*
* @param file String
* @return Boolean
*/
var setFavicon = exports.setFavicon = function setFavicon(favicon) {
console.log(favicon);
var link = document.createElement('link'),
oldLink = document.getElementById('favicon');
link.id = 'favicon';
link.rel = 'shortcut icon';
link.href = "/iris/assets/" + favicon;
if (oldLink) {
document.head.removeChild(oldLink);
}
document.head.appendChild(link);
};
/**
* Check if an image URL is cached or not
* Useful for bypassing load animations for cached assets (eg parallax)
@ -72252,10 +72273,6 @@ var PusherMiddleware = function () {
setTimeout(function () {
store.dispatch(pusherActions.connect());
}, 5000);
if (e.code !== 3001) {
store.dispatch(coreActions.handleException('Pusher websocket connection error', e));
};
};
socket.onerror = function (e) {
@ -76598,11 +76615,16 @@ var _reactGa = __webpack_require__(/*! react-ga */ "./node_modules/react-ga/dist
var _reactGa2 = _interopRequireDefault(_reactGa);
var _helpers = __webpack_require__(/*! ../../helpers */ "./src/js/helpers.js");
var helpers = _interopRequireWildcard(_helpers);
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var uiActions = __webpack_require__(/*! ./actions.js */ "./src/js/services/ui/actions.js");
var mopidyActions = __webpack_require__(/*! ../mopidy/actions.js */ "./src/js/services/mopidy/actions.js");
var helpers = __webpack_require__(/*! ../../helpers.js */ "./src/js/helpers.js");
var UIMiddleware = function () {
@ -76637,9 +76659,13 @@ var UIMiddleware = function () {
}
if (play_state == 'playing') {
window_title = '\u25B6';
helpers.setFavicon('favicon.png');
} else {
window_title = '\u25A0';
helpers.setFavicon('favicon_paused.png');
}
if (!store.getState().mopidy.connected) {
helpers.setFavicon('favicon_error.png');
}
if (action.title) {

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

View File

@ -17,13 +17,10 @@
<meta name="mobile-web-app-capable" content="yes" />
<meta name="theme-color" content="#222222" />
<!-- Icons -->
<link rel="apple-touch-startup-image" href="/iris/assets/app-icon_512.png" />
<link rel="apple-touch-icon" sizes="192x192" href="/iris/assets/logo-app_192.png" />
<link rel="apple-touch-icon" sizes="512x512" href="/iris/assets/logo-app_512.png" />
<link rel="shortcut icon" type="image/ico" href="/iris/assets/app-icon_64.png" />
<link rel="shortcut icon" type="image/x-icon" href="/iris/assets/app-icon_64.png" />
<link rel="shortcut-icon" href="/iris/assets/app-icon_64.png" />
<link id="favicon" rel="shortcut icon" type="image/ico" href="/iris/assets/app-icon_64.png" />
<link rel="mask-icon" href="/iris/assets/app-icon.svg" color="#08d58f" />
<!-- Loading screen styles -->
@ -98,7 +95,7 @@
// Release details
// These are automatically injected to built HTML
var build = "1555898186";
var build = "1555925931";
var version = "3.36.0";
// Construct the script tag

BIN
src/assets/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

View File

@ -17,13 +17,10 @@
<meta name="mobile-web-app-capable" content="yes" />
<meta name="theme-color" content="#222222" />
<!-- Icons -->
<link rel="apple-touch-startup-image" href="/iris/assets/app-icon_512.png" />
<link rel="apple-touch-icon" sizes="192x192" href="/iris/assets/logo-app_192.png" />
<link rel="apple-touch-icon" sizes="512x512" href="/iris/assets/logo-app_512.png" />
<link rel="shortcut icon" type="image/ico" href="/iris/assets/app-icon_64.png" />
<link rel="shortcut icon" type="image/x-icon" href="/iris/assets/app-icon_64.png" />
<link rel="shortcut-icon" href="/iris/assets/app-icon_64.png" />
<link id="favicon" rel="shortcut icon" type="image/ico" href="/iris/assets/app-icon_64.png" />
<link rel="mask-icon" href="/iris/assets/app-icon.svg" color="#08d58f" />
<!-- Loading screen styles -->

View File

@ -144,6 +144,28 @@ export let toJSON = function(data){
}
/**
* Set the app's favicon to a specific image.
*
* @param file String
* @return Boolean
*/
export let setFavicon = function(favicon){
console.log(favicon);
let link = document.createElement('link'),
oldLink = document.getElementById('favicon');
link.id = 'favicon';
link.rel = 'shortcut icon';
link.href = "/iris/assets/"+favicon;
if (oldLink) {
document.head.removeChild(oldLink);
}
document.head.appendChild(link);
}
/**
* Check if an image URL is cached or not
* Useful for bypassing load animations for cached assets (eg parallax)

View File

@ -261,13 +261,6 @@ const PusherMiddleware = (function(){
setTimeout(() => {
store.dispatch(pusherActions.connect())
}, 5000);
if (e.code !== 3001) {
store.dispatch(coreActions.handleException(
'Pusher websocket connection error',
e
));
};
};
socket.onerror = (e) => {

View File

@ -1,9 +1,9 @@
import ReactGA from 'react-ga'
import ReactGA from 'react-ga';
import * as helpers from '../../helpers';
var uiActions = require('./actions.js')
var mopidyActions = require('../mopidy/actions.js')
var helpers = require('../../helpers.js')
const UIMiddleware = (function(){
@ -36,9 +36,13 @@ const UIMiddleware = (function(){
}
if (play_state == 'playing'){
window_title = '\u25B6';
helpers.setFavicon('favicon.png');
} else {
window_title = '\u25A0';
helpers.setFavicon('favicon_paused.png');
}
if (!store.getState().mopidy.connected){
helpers.setFavicon('favicon_error.png');
}
if (action.title){