Add extra number controls

app/SysTray-X/preferences.cpp

@@ -27,6 +27,9 @@ Preferences::Preferences( QObject *parent ) : QObject( parent )
     m_icon_mime = "image/png";
     m_icon_data = QByteArray();
 
+    m_show_number = true;
+    m_number_color = "#000000";
+
     m_hide_minimize = true;
     m_start_minimized = false;
 
@@ -137,6 +140,58 @@ void    Preferences::setIconData( const QByteArray& icon_data )
 }
 
 
+/*
+ *  Get the enable number state.
+ */
+bool    Preferences::getShowNumber() const
+{
+    return m_show_number;
+}
+
+
+/*
+ *  Set the enable number state.
+ */
+void    Preferences::setShowNumber( bool state )
+{
+    if( m_show_number != state )
+    {
+        m_show_number = state;
+
+        /*
+         *  Tell the world the new preference
+         */
+        emit signalShowNumberChange();
+    }
+}
+
+
+/*
+ *  Get the number color.
+ */
+QString    Preferences::getNumberColor() const
+{
+    return m_number_color;
+}
+
+
+/*
+ *  Set the enable number state.
+ */
+void    Preferences::setNumberColor( QString color )
+{
+    if( m_number_color != color )
+    {
+        m_number_color = color;
+
+        /*
+         *  Tell the world the new preference
+         */
+        emit signalNumberColorChange();
+    }
+}
+
+
 /*
  *  Get the hide on minimize pref.
  */

app/SysTray-X/preferences.h

@@ -93,6 +93,34 @@ class Preferences : public QObject
          */
         void setIconData( const QByteArray& icon_data );
 
+        /**
+         * @brief getShowNumber. Get the show number state.
+         *
+         * @return      The state.
+         */
+        bool getShowNumber() const;
+
+        /**
+         * @brief setShowNumber. Set the show number state.
+         *
+         * @param      The state.
+         */
+        void setShowNumber( bool state );
+
+        /**
+         * @brief getNumberColor. Get the number color.
+         *
+         * @return      The color.
+         */
+        QString getNumberColor() const;
+
+        /**
+         * @brief setNumberColor. Set the number color.
+         *
+         * @param      The color.
+         */
+        void setNumberColor( QString color );
+
         /**
          * @brief getHideOnMinimize. Get the hide on minimize state.
          *
@@ -193,6 +221,13 @@ class Preferences : public QObject
 
     signals:
 
+        /**
+         * @brief signalConsole. Send a console message.
+         *
+         *  @param message      The message.
+         */
+        void    signalConsole( QString message );
+
         /**
          * @brief signalIconTypeChange. Signal a icon type change.
          */
@@ -203,6 +238,16 @@ class Preferences : public QObject
          */
         void signalIconDataChange();
 
+        /**
+         * @brief signalShowNumberChange. Signal a show number state change.
+         */
+        void signalShowNumberChange();
+
+        /**
+         * @brief signalNumberColorChange. Signal a number color change.
+         */
+        void signalNumberColorChange();
+
         /**
          * @brief signalHideOnMinimizeChange. Signal a hide on mnimize state change.
          */
@@ -250,6 +295,16 @@ class Preferences : public QObject
          */
         QByteArray m_icon_data;
 
+        /**
+         * @brief m_show_number. Show number in systray icon.
+         */
+        bool m_show_number;
+
+        /**
+         * @brief m_number_color. The color of the number in systray icon.
+         */
+        QString m_number_color;
+
         /**
          * @brief m_hide_minimize. Hide the minimized window.
          */

app/SysTray-X/preferences.ui

@@ -6,8 +6,8 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>292</width>
+    <width>684</width>
-    <height>487</height>
+    <height>278</height>
    </rect>
   </property>
   <property name="windowTitle">
@@ -17,7 +17,9 @@
    <iconset resource="SysTray-X.qrc">
     <normaloff>:/files/icons/SysTray-X.png</normaloff>:/files/icons/SysTray-X.png</iconset>
   </property>
-  <layout class="QGridLayout" name="gridLayout">
+  <layout class="QGridLayout" name="gridLayout_4">
+   <item row="0" column="0">
+    <layout class="QGridLayout" name="gridLayout_3">
      <item row="0" column="0">
       <widget class="QGroupBox" name="groupBox">
        <property name="title">
@@ -44,7 +46,7 @@
        </layout>
       </widget>
      </item>
-   <item row="1" column="0">
+     <item row="0" column="1">
       <widget class="QGroupBox" name="iconTypeGroupBox">
        <property name="title">
         <string>Mail notification icon</string>
@@ -154,24 +156,22 @@
        </layout>
       </widget>
      </item>
-   <item row="2" column="0">
+     <item row="0" column="2">
       <widget class="QGroupBox" name="groupBox_2">
        <property name="title">
         <string>Mail actions</string>
        </property>
-     <layout class="QVBoxLayout" name="verticalLayout_5">
+       <layout class="QFormLayout" name="formLayout">
-      <item>
+        <item row="0" column="0">
-       <layout class="QVBoxLayout" name="verticalLayout_4">
+         <layout class="QGridLayout" name="gridLayout_2">
-        <item>
+          <item row="0" column="0" colspan="2">
-         <layout class="QHBoxLayout" name="horizontalLayout_4">
-          <item>
            <widget class="QLabel" name="pollStartupDelayLabel">
             <property name="text">
              <string>Poll startup delay</string>
             </property>
            </widget>
           </item>
-          <item>
+          <item row="0" column="2">
            <widget class="QSpinBox" name="pollStartupDelaySpinBox">
             <property name="minimum">
              <number>1</number>
@@ -181,18 +181,14 @@
             </property>
            </widget>
           </item>
-         </layout>
+          <item row="1" column="0">
-        </item>
-        <item>
-         <layout class="QHBoxLayout" name="horizontalLayout_5">
-          <item>
            <widget class="QLabel" name="pollIntervalLabel">
             <property name="text">
              <string>Poll interval</string>
             </property>
            </widget>
           </item>
-          <item>
+          <item row="1" column="2">
            <widget class="QSpinBox" name="pollIntervalSpinBox">
             <property name="minimum">
              <number>1</number>
@@ -205,31 +201,71 @@
          </layout>
         </item>
        </layout>
-      </item>
-     </layout>
       </widget>
      </item>
-   <item row="3" column="0">
+     <item row="1" column="0">
       <widget class="QCheckBox" name="debugWindowCheckBox">
        <property name="text">
         <string>Display debug window</string>
        </property>
       </widget>
      </item>
-   <item row="4" column="0">
+     <item row="1" column="1" colspan="2">
-    <spacer name="verticalSpacer">
+      <widget class="QGroupBox" name="groupBox_3">
+       <property name="title">
+        <string>Number properties</string>
+       </property>
+       <layout class="QGridLayout" name="gridLayout">
+        <item row="0" column="0">
+         <layout class="QHBoxLayout" name="horizontalLayout_6">
+          <item>
+           <widget class="QCheckBox" name="showNumberCheckBox">
+            <property name="text">
+             <string>Display unread message count</string>
+            </property>
+            <property name="checked">
+             <bool>true</bool>
+            </property>
+           </widget>
+          </item>
+          <item>
+           <spacer name="horizontalSpacer_3">
             <property name="orientation">
-      <enum>Qt::Vertical</enum>
+             <enum>Qt::Horizontal</enum>
             </property>
             <property name="sizeHint" stdset="0">
              <size>
-       <width>239</width>
+              <width>40</width>
-       <height>36</height>
+              <height>20</height>
              </size>
             </property>
            </spacer>
           </item>
-   <item row="5" column="0">
+          <item>
+           <widget class="QLabel" name="label">
+            <property name="text">
+             <string>Text color</string>
+            </property>
+           </widget>
+          </item>
+          <item>
+           <widget class="QPushButton" name="numberColorPushButton">
+            <property name="focusPolicy">
+             <enum>Qt::NoFocus</enum>
+            </property>
+            <property name="text">
+             <string/>
+            </property>
+           </widget>
+          </item>
+         </layout>
+        </item>
+       </layout>
+      </widget>
+     </item>
+    </layout>
+   </item>
+   <item row="1" column="0">
     <widget class="QDialogButtonBox" name="buttonBox">
      <property name="orientation">
       <enum>Qt::Horizontal</enum>

app/SysTray-X/preferencesdialog.cpp

@@ -9,8 +9,10 @@
 /*
  *	Qt includes
  */
+#include <QColor>
 #include <QPixmap>
 #include <QFileDialog>
+#include <QColorDialog>
 #include <QMimeDatabase>
 #include <QJsonDocument>
 #include <QJsonObject>
@@ -47,6 +49,12 @@ PreferencesDialog::PreferencesDialog( SysTrayXLink *link, Preferences *pref, QWi
     connect( m_ui->chooseCustomButton, &QPushButton::clicked, this, &PreferencesDialog::slotFileSelect );
     connect( m_ui->buttonBox, &QDialogButtonBox::accepted, this, &PreferencesDialog::slotAccept );
     connect( m_ui->buttonBox, &QDialogButtonBox::rejected, this, &PreferencesDialog::slotReject );
+    connect( m_ui->numberColorPushButton, &QPushButton::clicked, this, &PreferencesDialog::slotColorSelect );
+
+    /*
+     *  Set number color
+     */
+    setNumberColor( m_pref->getNumberColor() );
 }
 
 
@@ -139,6 +147,29 @@ void    PreferencesDialog::setIcon()
 }
 
 
+/*
+ *  Set the enable number state
+ */
+void    PreferencesDialog::setShowNumber( bool state )
+{
+   m_ui->showNumberCheckBox->setChecked( state );
+}
+
+
+/*
+ *  Set the number color
+ */
+void    PreferencesDialog::setNumberColor( QString color )
+{
+    m_number_color = color;
+
+    QPixmap pixmap( 256, 256 );
+    pixmap.fill( QColor( color ) );
+
+    m_ui->numberColorPushButton->setIcon( QIcon( pixmap ) );
+}
+
+
 /*
  *  Handle the accept signal
  */
@@ -162,6 +193,9 @@ void    PreferencesDialog::slotAccept()
     m_pref->setPollStartupDelay(m_ui->pollStartupDelaySpinBox->value());
     m_pref->setPollInterval(m_ui->pollIntervalSpinBox->value());
 
+    m_pref->setShowNumber( m_ui->showNumberCheckBox->isChecked() );
+    m_pref->setNumberColor( m_number_color );
+
     m_pref->setDebug( m_ui->debugWindowCheckBox->isChecked() );
 
     /*
@@ -215,6 +249,21 @@ void    PreferencesDialog::slotFileSelect()
 }
 
 
+/*
+ *  Handle the choose button
+ */
+void    PreferencesDialog::slotColorSelect()
+{
+    QColor color( m_number_color );
+    QColorDialog color_dialog( color );
+
+    if( color_dialog.exec() )
+    {
+        setNumberColor( color_dialog.selectedColor().name() );
+    }
+}
+
+
 /*
  *  Handle the debug change signal
  */
@@ -281,3 +330,21 @@ void    PreferencesDialog::slotIconDataChange()
      */
     setIcon();
 }
+
+
+/*
+ *  Handle the enable number state change
+ */
+void    PreferencesDialog::slotShowNumberChange()
+{
+    setShowNumber( m_pref->getShowNumber() );
+}
+
+
+/*
+ *  Handle the number color change
+ */
+void    PreferencesDialog::slotNumberColorChange()
+{
+    setNumberColor( m_pref->getNumberColor() );
+}

app/SysTray-X/preferencesdialog.h

@@ -96,8 +96,29 @@ class PreferencesDialog : public QDialog
          */
         void    setIcon();
 
+        /**
+         * @brief setShowNumber. Set the show number state.
+         *
+         *  @param state    The state.
+         */
+        void    setShowNumber( bool state );
+
+        /**
+         * @brief setNumberColor. Set the number color.
+         *
+         *  @param state    The state.
+         */
+        void    setNumberColor( QString color );
+
     signals:
 
+        /**
+         * @brief signalConsole. Send a console message.
+         *
+         *  @param message      The message.
+         */
+        void    signalConsole( QString message );
+
         /**
          * @brief signalUpdateSysTray. Signal to update the system tray icon.
          */
@@ -140,6 +161,16 @@ class PreferencesDialog : public QDialog
          */
         void    slotIconDataChange();
 
+        /**
+         * @brief slotShowNumberChange. Slot for handling show number state change.
+         */
+        void    slotShowNumberChange();
+
+        /**
+         * @brief slotNumberColorChange. Slot for handling number color change.
+         */
+        void    slotNumberColorChange();
+
     private slots:
 
         /**
@@ -157,6 +188,11 @@ class PreferencesDialog : public QDialog
          */
         void    slotFileSelect();
 
+        /**
+         * @brief slotColorSelect. Handle the choose color button click.
+         */
+        void    slotColorSelect();
+
     private:
 
         /**
@@ -184,6 +220,10 @@ class PreferencesDialog : public QDialog
          */
         QByteArray m_tmp_icon_data;
 
+        /**
+         * @brief m_number_color. Temporary storage for the number color.
+         */
+        QString m_number_color;
 };
 
 #endif // PREFERENCESDIALOG_H

app/SysTray-X/systrayx.cpp

@@ -68,6 +68,9 @@ SysTrayX::SysTrayX( QObject *parent ) : QObject( parent )
     connect( m_link, &SysTrayXLink::signalUnreadMail, m_debug, &DebugWidget::slotUnreadMail );
 
     connect( this, &SysTrayX::signalConsole, m_debug, &DebugWidget::slotConsole );
+    connect( m_preferences, &Preferences::signalConsole, m_debug, &DebugWidget::slotConsole );
+    connect( m_pref_dialog, &PreferencesDialog::signalConsole, m_debug, &DebugWidget::slotConsole );
+    connect( m_link, &SysTrayXLink::signalConsole, m_debug, &DebugWidget::slotConsole );
     connect( m_win_ctrl, &WindowCtrl::signalConsole, m_debug, &DebugWidget::slotConsole );
 
     connect( m_debug, &DebugWidget::signalTest1ButtonClicked, m_win_ctrl, &WindowCtrl::slotWindowTest1 );
@@ -79,13 +82,16 @@ SysTrayX::SysTrayX( QObject *parent ) : QObject( parent )
      */
     connect( m_preferences, &Preferences::signalIconTypeChange, m_tray_icon, &SysTrayXIcon::slotIconTypeChange );
     connect( m_preferences, &Preferences::signalIconDataChange, m_tray_icon, &SysTrayXIcon::slotIconDataChange );
+    connect( m_preferences, &Preferences::signalShowNumberChange, m_tray_icon, &SysTrayXIcon::slotShowNumberChange );
+    connect( m_preferences, &Preferences::signalNumberColorChange, m_tray_icon, &SysTrayXIcon::slotNumberColorChange );
 
     connect( m_preferences, &Preferences::signalHideOnMinimizeChange, m_win_ctrl, &WindowCtrl::slotHideOnMinimizeChange );
     connect( m_preferences, &Preferences::signalStartMinimizedChange, m_win_ctrl, &WindowCtrl::slotStartMinimizedChange );
 
-
     connect( m_preferences, &Preferences::signalIconTypeChange, m_pref_dialog, &PreferencesDialog::slotIconTypeChange );
     connect( m_preferences, &Preferences::signalIconDataChange, m_pref_dialog, &PreferencesDialog::slotIconDataChange );
+    connect( m_preferences, &Preferences::signalShowNumberChange, m_pref_dialog, &PreferencesDialog::slotShowNumberChange );
+    connect( m_preferences, &Preferences::signalNumberColorChange, m_pref_dialog, &PreferencesDialog::slotNumberColorChange );
     connect( m_preferences, &Preferences::signalHideOnMinimizeChange, m_pref_dialog, &PreferencesDialog::slotHideOnMinimizeChange );
     connect( m_preferences, &Preferences::signalStartMinimizedChange, m_pref_dialog, &PreferencesDialog::slotStartMinimizedChange );
     connect( m_preferences, &Preferences::signalPollStartupDelayChange, m_pref_dialog, &PreferencesDialog::slotPollStartupDelayChange );
@@ -94,6 +100,8 @@ SysTrayX::SysTrayX( QObject *parent ) : QObject( parent )
 
     connect( m_preferences, &Preferences::signalIconTypeChange, m_link, &SysTrayXLink::slotIconTypeChange );
     connect( m_preferences, &Preferences::signalIconDataChange, m_link, &SysTrayXLink::slotIconDataChange );
+    connect( m_preferences, &Preferences::signalShowNumberChange, m_link, &SysTrayXLink::slotShowNumberChange );
+    connect( m_preferences, &Preferences::signalNumberColorChange, m_link, &SysTrayXLink::slotNumberColorChange );
     connect( m_preferences, &Preferences::signalHideOnMinimizeChange, m_link, &SysTrayXLink::slotHideOnMinimizeChange );
     connect( m_preferences, &Preferences::signalStartMinimizedChange, m_link, &SysTrayXLink::slotStartMinimizedChange );
     connect( m_preferences, &Preferences::signalPollStartupDelayChange, m_link, &SysTrayXLink::slotPollStartupDelayChange );

app/SysTray-X/systrayxicon.cpp

@@ -30,6 +30,9 @@ SysTrayXIcon::SysTrayXIcon( SysTrayXLink* link, Preferences* pref, QObject* pare
 
     m_unread_mail = 0;
 
+    m_show_number = m_pref->getShowNumber();
+    m_number_color = m_pref->getNumberColor();
+
     connect( this, &QSystemTrayIcon::activated, this, &SysTrayXIcon::slotIconActivated );
 }
 
@@ -89,6 +92,46 @@ void    SysTrayXIcon::setIconData( const QByteArray& icon_data )
 }
 
 
+/*
+ *  Enable/disable number
+ */
+void    SysTrayXIcon::showNumber( bool state )
+{
+    if( m_show_number != state )
+    {
+        /*
+         *  Store the new value
+         */
+        m_show_number = state;
+
+        /*
+         *  Render and set a new icon in the tray
+         */
+        renderIcon();
+    }
+}
+
+
+/*
+ *  Enable/disable number
+ */
+void    SysTrayXIcon::setNumberColor( const QString& color )
+{
+    if( m_number_color != color )
+    {
+        /*
+         *  Store the new value
+         */
+        m_number_color = color;
+
+        /*
+         *  Render and set a new icon in the tray
+         */
+        renderIcon();
+    }
+}
+
+
 /*
  *  Set the number of unread mails
  */
@@ -145,7 +188,7 @@ void    SysTrayXIcon::renderIcon()
         pixmap = QPixmap( ":/files/icons/Thunderbird.png" );
     }
 
-    if( m_unread_mail > 0 )
+    if( m_show_number && ( m_unread_mail > 0 ) )
     {
         /*
          *  Paint the number
@@ -165,6 +208,8 @@ void    SysTrayXIcon::renderIcon()
         font.setBold( true );
         painter.setFont( font );
 
+        painter.setPen( QColor( m_number_color ) );
+
         painter.drawText( pixmap.rect(), Qt::AlignCenter, QString::number( m_unread_mail ) );
     }
 
@@ -203,6 +248,24 @@ void    SysTrayXIcon::slotIconDataChange()
 }
 
 
+/*
+ *  Handle the enable number state change signal
+ */
+void    SysTrayXIcon::slotShowNumberChange()
+{
+    showNumber( m_pref->getShowNumber() );
+}
+
+
+/*
+ *  Handle the number color change signal
+ */
+void    SysTrayXIcon::slotNumberColorChange()
+{
+    setNumberColor( m_pref->getNumberColor() );
+}
+
+
 /*
  *  Handle activation of the tray icon
  */

app/SysTray-X/systrayxicon.h

@@ -54,6 +54,20 @@ class SysTrayXIcon : public QSystemTrayIcon
          */
         void    setIconData( const QByteArray& icon_data );
 
+        /**
+         * @brief showNumber. Set the show number state.
+         *
+         *  @param state    Show / hide.
+         */
+        void    showNumber( bool state );
+
+        /**
+         * @brief setNumberColor. Set the number color.
+         *
+         *  @param color    The color.
+         */
+        void    setNumberColor( const QString& color );
+
         /**
          * @brief setUnreadMail. Set the number of unread mails.
          *
@@ -94,6 +108,16 @@ class SysTrayXIcon : public QSystemTrayIcon
          */
         void    slotIconDataChange();
 
+        /**
+         * @brief slotShowNumberChange. Slot for handling show number change signals.
+         */
+        void    slotShowNumberChange();
+
+        /**
+         * @brief slotNumberColorChange. Slot for handling number color change signals.
+         */
+        void    slotNumberColorChange();
+
     private slots:
 
         /**
@@ -130,6 +154,16 @@ class SysTrayXIcon : public QSystemTrayIcon
          */
         QByteArray  m_icon_data;
 
+        /**
+         * @brief m_show_number. Show the unread mail count.
+         */
+        bool m_show_number;
+
+        /**
+         * @brief m_number_color. Color of the unread mail number.
+         */
+        QString m_number_color;
+
         /**
          * @brief m_unread_mail. Storage for the number of unread mails.
          */

app/SysTray-X/systrayxlink.cpp

@@ -363,6 +363,26 @@ void    SysTrayXLink::DecodePreferences( const QJsonObject& pref )
         m_pref->setIconData( QByteArray::fromBase64( icon_base64.toUtf8() ) );
     }
 
+    if( pref.contains( "showNumber" ) && pref[ "showNumber" ].isString() )
+    {
+        bool show_number = pref[ "showNumber" ].toString() == "true";
+
+        /*
+         *  Store the new show number state
+         */
+        m_pref->setShowNumber( show_number );
+    }
+
+    if( pref.contains( "numberColor" ) && pref[ "numberColor" ].isString() )
+    {
+        QString number_color = pref[ "numberColor" ].toString();
+
+        /*
+         *  Store the new number color
+         */
+        m_pref->setNumberColor( number_color );
+    }
+
     if( pref.contains( "hideOnMinimize" ) && pref[ "hideOnMinimize" ].isString() )
     {
         bool hide_minimize = pref[ "hideOnMinimize" ].toString() == "true";
@@ -432,6 +452,8 @@ void    SysTrayXLink::EncodePreferences( const Preferences& pref )
     prefObject.insert("iconType", QJsonValue::fromVariant( QString::number( pref.getIconType() ) ) );
     prefObject.insert("iconMime", QJsonValue::fromVariant( pref.getIconMime() ) );
     prefObject.insert("icon", QJsonValue::fromVariant( QString( pref.getIconData().toBase64() ) ) );
+    prefObject.insert("showNumber", QJsonValue::fromVariant( QString( pref.getShowNumber() ? "true" : "false" ) ) );
+    prefObject.insert("numberColor", QJsonValue::fromVariant( QString( pref.getNumberColor() ) ) );
 
     QJsonObject preferencesObject;
     preferencesObject.insert("preferences", prefObject );
@@ -548,6 +570,30 @@ void    SysTrayXLink::slotIconDataChange()
 }
 
 
+/*
+ *  Handle a show number state change signal
+ */
+void    SysTrayXLink::slotShowNumberChange()
+{
+    if( m_pref->getAppPrefChanged() )
+    {
+        sendPreferences();
+    }
+}
+
+
+/*
+ *  Handle a number color change signal
+ */
+void    SysTrayXLink::slotNumberColorChange()
+{
+    if( m_pref->getAppPrefChanged() )
+    {
+        sendPreferences();
+    }
+}
+
+
 /*
  *  Handle the window normal signal
  */

app/SysTray-X/systrayxlink.h

@@ -145,6 +145,13 @@ class SysTrayXLink : public QObject
 
     signals:
 
+        /**
+         * @brief signalConsole. Send a console message.
+         *
+         *  @param message      The message.
+         */
+        void    signalConsole( QString message );
+
         /**
          * @brief signalTitle. Signal the title.
          */
@@ -209,6 +216,16 @@ class SysTrayXLink : public QObject
          */
         void    slotIconDataChange();
 
+        /**
+         * @brief slotShowNumberChange. Handle a change in show number state.
+         */
+        void    slotShowNumberChange();
+
+        /**
+         * @brief slotNumberColorChange. Handle a change in number color.
+         */
+        void    slotNumberColorChange();
+
         /**
          * @brief slotWindowNormal. Slot for handling window normal signals.
          */

webext/background.js

@@ -159,6 +159,8 @@ SysTrayX.Messaging = {
       "iconType",
       "iconMime",
       "icon",
+      "showNumber",
+      "numberColor",
     ]);
     getter.then(this.sendPreferencesStorage, this.onSendPreferecesStorageError);
   },
@@ -172,6 +174,8 @@ SysTrayX.Messaging = {
     const iconType = result.iconType || "0";
     const iconMime = result.iconMime || "image/png";
     const icon = result.icon || [];
+    const showNumber = result.showNumber || "true";
+    const numberColor = result.numberColor || "#000000";
 
     //  Send it to the app
     SysTrayX.Link.postSysTrayXMessage({
@@ -184,6 +188,8 @@ SysTrayX.Messaging = {
         iconType: iconType,
         iconMime: iconMime,
         icon: icon,
+        showNumber: showNumber,
+        numberColor: numberColor,
       },
     });
   },
@@ -297,6 +303,20 @@ SysTrayX.Link = {
         });
       }
 
+      const showNumber = response["preferences"].showNumber;
+      if (showNumber) {
+        browser.storage.sync.set({
+          showNumber: showNumber,
+        });
+      }
+
+      const numberColor = response["preferences"].numberColor;
+      if (numberColor) {
+        browser.storage.sync.set({
+          numberColor: numberColor,
+        });
+      }
+
       const hideOnMinimize = response["preferences"].hideOnMinimize;
       if (hideOnMinimize) {
         browser.storage.sync.set({

webext/css/options.css

@@ -60,6 +60,13 @@ body {
   color: dodgerblue;
 }
 
+#iconselect {
+  border-style: solid;
+  border-width: 1px;
+  margin:  10px 10px 10px 10px;
+  padding: 10px 10px 10px 10px;
+}
+
 ul,
 #accountsTree {
   list-style-type: none;
@@ -68,6 +75,7 @@ ul,
 /* Remove margins and padding from the parent ul */
 #accountsTree {
   border-style: solid;
+  border-width: 1px;
   margin: 0;
   padding: 10px;
 }

webext/options.html

@@ -79,6 +79,25 @@
                 style="display: none;"
               />
             </td>
+            <td>
+              &emsp;
+            </td>
+          </tr>
+        </table>
+
+        <table id="numberprops">
+          <tr>
+            <td>
+              <input type="checkbox" name="showNumber" value="" /> Display
+              unread message count &emsp;
+              <label for="numberColor">Text color:</label>
+              <input
+                type="color"
+                id="numberColor"
+                name="numberColor"
+                value=""
+              />
+            </td>
           </tr>
         </table>
       </form>
@@ -95,7 +114,7 @@
         <ul id="accountsTree"></ul>
 
         <br />
-        <table id="iconselect">
+        <table id="pollselect">
           <tr>
             <td>
               <label for="pollStartupDelay" }>Poll startup delay</label>

webext/options.js

@@ -112,6 +112,22 @@ SysTrayX.SaveOptions = {
     browser.storage.sync.set({
       addonprefchanged: true,
     });
+
+    //
+    //  Save enable number state
+    //
+    let showNumber = document.querySelector('input[name="showNumber"]').checked;
+    browser.storage.sync.set({
+      showNumber: `${showNumber}`,
+    });
+
+    //
+    //  Save number color
+    //
+    let numberColor = document.querySelector('input[name="numberColor"]').value;
+    browser.storage.sync.set({
+      numberColor: `${numberColor}`,
+    });
   },
 };
 
@@ -179,6 +195,24 @@ SysTrayX.RestoreOptions = {
       SysTrayX.RestoreOptions.setPollInterval,
       SysTrayX.RestoreOptions.onPollIntervalError
     );
+
+    //
+    //  Restore enable number state
+    //
+    const getShowNumber = browser.storage.sync.get("showNumber");
+    getShowNumber.then(
+      SysTrayX.RestoreOptions.setShowNumber,
+      SysTrayX.RestoreOptions.onShowNumberError
+    );
+
+    //
+    //  Restore number color
+    //
+    const getNumberColor = browser.storage.sync.get("numberColor");
+    getNumberColor.then(
+      SysTrayX.RestoreOptions.setNumberColor,
+      SysTrayX.RestoreOptions.onNumberColorError
+    );
   },
 
   //
@@ -285,6 +319,34 @@ SysTrayX.RestoreOptions = {
     console.log(`Icon Error: ${error}`);
   },
 
+  //
+  //  Restore enable number state
+  //
+  setShowNumber: function (result) {
+    const showNumber = result.showNumber || "true";
+
+    const checkbox = document.querySelector(`input[name="showNumber"]`);
+    checkbox.checked = showNumber === "true";
+  },
+
+  onShowNumberError: function (error) {
+    console.log(`showNumber Error: ${error}`);
+  },
+
+  //
+  //  Restore number color
+  //
+  setNumberColor: function (result) {
+    const numberColor = result.numberColor || "#000000";
+
+    const input = document.querySelector(`input[name="numberColor"]`);
+    input.value = numberColor;
+  },
+
+  onNumberColorError: function (error) {
+    console.log(`numberColor Error: ${error}`);
+  },
+
   //
   //  Restore poll startup delay state callbacks
   //
@@ -337,6 +399,16 @@ SysTrayX.StorageChanged = {
         });
         changed_icon_mime = true;
       }
+      if (item === "showNumber") {
+        SysTrayX.RestoreOptions.setShowNumber({
+          showNumber: changes[item].newValue,
+        });
+      }
+      if (item === "numberColor") {
+        SysTrayX.RestoreOptions.setNumberColor({
+          numberColor: changes[item].newValue,
+        });
+      }
       if (item === "hideOnMinimize") {
         SysTrayX.RestoreOptions.setHideOnMinimize({
           hideOnMinimize: changes[item].newValue,