From 9f548ae8de6b74785ff977ef00102d4f7df6a425 Mon Sep 17 00:00:00 2001
From: Dele Olajide <dele@4ng.net>
Date: Mon, 2 Nov 2020 08:10:07 +0000
Subject: [PATCH] fix #1250 (#2323)

Fixes #1250 Change favicon color when unread messages
---
 CHANGES.md                         | 1 +
 package.json                       | 1 +
 src/headless/converse-chatboxes.js | 4 ++++
 3 files changed, 6 insertions(+)

diff --git a/CHANGES.md b/CHANGES.md
index 600dd2ec3..8b22324b5 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -41,6 +41,7 @@ Soon we'll deprecate the latter, so prepare now.
 - #2307: BootstrapModal is not accessible to plugins
 - #2308: Allow getHats method to be overriden in the `overrides` object in plugins.
 - #2321: When Converse runs inside a browser extension, enable browser sync and local storage for persistent storage
+- #1250: Change favicon color when unread messages
 - The `trusted` configuration setting has been removed in favor of two new settings:
     [allow_user_trust_override](https://conversejs.org/docs/html/configuration.html#allow-user-trust-override)
     [clear_cache_on_logout](https://conversejs.org/docs/html/configuration.html#clear-cache-on-logout)
diff --git a/package.json b/package.json
index dce238502..d985d095d 100644
--- a/package.json
+++ b/package.json
@@ -78,6 +78,7 @@
     "eslint-plugin-lodash": "^7.1.0",
     "exports-loader": "^0.7.0",
     "fast-text-encoding": "^1.0.2",
+    "favico.js-slevomat": "^0.3.11",    
     "file-loader": "^6.0.0",
     "haunted": "^4.7.0",
     "html-webpack-plugin": "^4.3.0",
diff --git a/src/headless/converse-chatboxes.js b/src/headless/converse-chatboxes.js
index 7455f2041..cf542d8d2 100644
--- a/src/headless/converse-chatboxes.js
+++ b/src/headless/converse-chatboxes.js
@@ -7,6 +7,7 @@ import "./converse-emoji";
 import { Collection } from "@converse/skeletor/src/collection";
 import { _converse, api, converse } from "./converse-core";
 import log from "./log";
+import Favico from 'favico.js-slevomat';
 
 const { Strophe } = converse.env;
 
@@ -32,9 +33,11 @@ converse.plugins.add('converse-chatboxes', {
         ]);
 
         let msg_counter = 0;
+        const favicon = new Favico({type : 'circle', position: 'up', animation: 'none'});
 
         _converse.incrementMsgCounter = function () {
             msg_counter += 1;
+            favicon.badge(msg_counter);
             const title = document.title;
             if (!title) {
                 return;
@@ -48,6 +51,7 @@ converse.plugins.add('converse-chatboxes', {
 
         _converse.clearMsgCounter = function () {
             msg_counter = 0;
+            favicon.badge(msg_counter);
             const title = document.title;
             if (!title) {
                 return;