treehouse
/
mastodon
22
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Add notification badge to favicon

lolsob-rspec
Thibaut Girka 2018-09-06 16:09:57 +02:00 committed by ThibG
parent 44b647abe7
commit dc381facbd
3 changed files with 15 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/javascript/flavours/glitch/features/ui/index.js
View File

@ -17,6 +17,7 @@ import { WrappedSwitch, WrappedRoute } from 'flavours/glitch/util/react_router_h
import UploadArea from './components/upload_area'; import UploadArea from './components/upload_area';
import ColumnsAreaContainer from './containers/columns_area_container'; import ColumnsAreaContainer from './containers/columns_area_container';
import classNames from 'classnames'; import classNames from 'classnames';
import Favico from 'favico.js';
import { import {
Drawer, Drawer,
Status, Status,
@ -64,6 +65,7 @@ const mapStateToProps = state => ({
isWide: state.getIn(['local_settings', 'stretch']), isWide: state.getIn(['local_settings', 'stretch']),
navbarUnder: state.getIn(['local_settings', 'navbar_under']), navbarUnder: state.getIn(['local_settings', 'navbar_under']),
dropdownMenuIsOpen: state.getIn(['dropdown_menu', 'openId']) !== null, dropdownMenuIsOpen: state.getIn(['dropdown_menu', 'openId']) !== null,
unreadNotifications: state.getIn(['notifications', 'unread']),
}); });
const keyMap = { const keyMap = {
@ -115,6 +117,7 @@ export default class UI extends React.Component {
history: PropTypes.object.isRequired, history: PropTypes.object.isRequired,
intl: PropTypes.object.isRequired, intl: PropTypes.object.isRequired,
dropdownMenuIsOpen: PropTypes.bool, dropdownMenuIsOpen: PropTypes.bool,
unreadNotifications: PropTypes.number,
}; };
state = { state = {
@ -239,6 +242,8 @@ export default class UI extends React.Component {
navigator.serviceWorker.addEventListener('message', this.handleServiceWorkerPostMessage); navigator.serviceWorker.addEventListener('message', this.handleServiceWorkerPostMessage);
} }
this.favicon = new Favico({ animation:"none" });
this.props.dispatch(expandHomeTimeline()); this.props.dispatch(expandHomeTimeline());
this.props.dispatch(expandNotifications()); this.props.dispatch(expandNotifications());
setTimeout(() => this.props.dispatch(fetchFilters()), 500); setTimeout(() => this.props.dispatch(fetchFilters()), 500);
@ -267,6 +272,11 @@ export default class UI extends React.Component {
if (![this.props.location.pathname, '/'].includes(prevProps.location.pathname)) { if (![this.props.location.pathname, '/'].includes(prevProps.location.pathname)) {
this.columnsAreaNode.handleChildrenContentChange(); this.columnsAreaNode.handleChildrenContentChange();
} }
if (this.props.unreadNotifications != prevProps.unreadNotifications) {
if (this.favicon) {
this.favicon.badge(this.props.unreadNotifications);
}
}
} }
componentWillUnmount () { componentWillUnmount () {

1
package.json
View File

@ -52,6 +52,7 @@
"escape-html": "^1.0.3", "escape-html": "^1.0.3",
"exif-js": "^2.3.0", "exif-js": "^2.3.0",
"express": "^4.16.2", "express": "^4.16.2",
"favico.js": "^0.3.10",
"file-loader": "^1.1.11", "file-loader": "^1.1.11",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"glob": "^7.1.1", "glob": "^7.1.1",

4
yarn.lock
View File

@ -3091,6 +3091,10 @@ fastparse@^1.1.1:
version "1.1.1" version "1.1.1"
resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.1.tgz#d1e2643b38a94d7583b479060e6c4affc94071f8" resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.1.tgz#d1e2643b38a94d7583b479060e6c4affc94071f8"
favico.js@^0.3.10:
version "0.3.10"
resolved "https://registry.yarnpkg.com/favico.js/-/favico.js-0.3.10.tgz#80586e27a117f24a8d51c18a99bdc714d4339301"
faye-websocket@^0.10.0: faye-websocket@^0.10.0:
version "0.10.0" version "0.10.0"
resolved "https://registry.yarnpkg.com/faye-websocket/-/faye-websocket-0.10.0.tgz#4e492f8d04dfb6f89003507f6edbf2d501e7c6f4" resolved "https://registry.yarnpkg.com/faye-websocket/-/faye-websocket-0.10.0.tgz#4e492f8d04dfb6f89003507f6edbf2d501e7c6f4"