[16.0][IMP] web_notify:t3894 Allow notify with sound

web_notify/README.rst

@@ -83,6 +83,21 @@ or
 
    self.env.user.notify_default(message='My default message')
 
+You can also add sound to your notifications by using the sound parameter. The sound parameter expects a string containing the URL path to the audio file that should be played when the notification is displayed.
+
+Example:
+
+.. code-block:: python
+
+    self.env.user.notify_success(message='My success message', sound='/<YOUR_MODULE>/static/audio/success.mp3' )
+
+or
+
+.. code-block:: python
+
+    self.env.user.notify_info( message='My information message', sound='/<YOUR_MODULE>/static/audio/info.mp3' )
+
+The sound parameter can be used with any notification type (success, danger, warning, info, or default). If the sound parameter is not provided, the notification will be displayed without any sound.
 
 The notifications can bring interactivity with some buttons.
 
@@ -147,6 +162,8 @@ Contributors
 
   * David Vidal
 
+* Cetmix OÜ <https://cetmix.com/>
+
 Maintainers
 ~~~~~~~~~~~
 

web_notify/__manifest__.py

@@ -6,15 +6,16 @@
     "name": "Web Notify",
     "summary": """
         Send notification messages to user""",
-    "version": "16.0.2.0.2",
+    "version": "16.0.3.0.0",
     "license": "AGPL-3",
     "author": "ACSONE SA/NV," "AdaptiveCity," "Odoo Community Association (OCA)",
     "development_status": "Production/Stable",
     "website": "https://github.com/OCA/web",
     "depends": ["web", "bus", "base", "mail"],
     "assets": {
         "web.assets_backend": [
-            "web_notify/static/src/js/services/*.js",
+            "web_notify/static/src/**/*.js",
+            "web_notify/static/src/**/*.xml",
         ]
     },
     "demo": ["views/res_users_demo.xml"],

web_notify/models/res_users.py

@@ -50,9 +50,12 @@ def notify_success(
         target=None,
         action=None,
         params=None,
+        sound=None,
     ):
         title = title or _("Success")
-        self._notify_channel(SUCCESS, message, title, sticky, target, action, params)
+        self._notify_channel(
+            SUCCESS, message, title, sticky, target, action, params, sound
+        )
 
     def notify_danger(
         self,
@@ -62,9 +65,12 @@ def notify_danger(
         target=None,
         action=None,
         params=None,
+        sound=None,
     ):
         title = title or _("Danger")
-        self._notify_channel(DANGER, message, title, sticky, target, action, params)
+        self._notify_channel(
+            DANGER, message, title, sticky, target, action, params, sound
+        )
 
     def notify_warning(
         self,
@@ -74,9 +80,12 @@ def notify_warning(
         target=None,
         action=None,
         params=None,
+        sound=None,
     ):
         title = title or _("Warning")
-        self._notify_channel(WARNING, message, title, sticky, target, action, params)
+        self._notify_channel(
+            WARNING, message, title, sticky, target, action, params, sound
+        )
 
     def notify_info(
         self,
@@ -86,9 +95,12 @@ def notify_info(
         target=None,
         action=None,
         params=None,
+        sound=None,
     ):
         title = title or _("Information")
-        self._notify_channel(INFO, message, title, sticky, target, action, params)
+        self._notify_channel(
+            INFO, message, title, sticky, target, action, params, sound
+        )
 
     def notify_default(
         self,
@@ -98,9 +110,12 @@ def notify_default(
         target=None,
         action=None,
         params=None,
+        sound=None,
     ):
         title = title or _("Default")
-        self._notify_channel(DEFAULT, message, title, sticky, target, action, params)
+        self._notify_channel(
+            DEFAULT, message, title, sticky, target, action, params, sound
+        )
 
     def _notify_channel(
         self,
@@ -111,6 +126,7 @@ def _notify_channel(
         target=None,
         action=None,
         params=None,
+        sound=None,
     ):
         if not (self.env.user._is_admin() or self.env.su) and any(
             user.id != self.env.uid for user in self
@@ -129,6 +145,7 @@ def _notify_channel(
             "sticky": sticky,
             "action": action,
             "params": dict(params or []),
+            "sound": sound,
         }
 
         notifications = [[partner, "web.notify", [bus_message]] for partner in target]

web_notify/readme/CONTRIBUTORS.rst

@@ -6,3 +6,5 @@
 * `Tecnativa <https://www.tecnativa.com>`_:
 
   * David Vidal
+
+* Cetmix OÜ <https://cetmix.com/>

web_notify/readme/USAGE.rst

@@ -29,6 +29,21 @@ or
 
    self.env.user.notify_default(message='My default message')
 
+You can also add sound to your notifications by using the sound parameter. The sound parameter expects a string containing the URL path to the audio file that should be played when the notification is displayed.
+
+Example:
+
+.. code-block:: python
+
+    self.env.user.notify_success(message='My success message', sound='/<YOUR_MODULE>/static/audio/success.mp3' )
+
+or
+
+.. code-block:: python
+
+    self.env.user.notify_info( message='My information message', sound='/<YOUR_MODULE>/static/audio/info.mp3' )
+
+The sound parameter can be used with any notification type (success, danger, warning, info, or default). If the sound parameter is not provided, the notification will be displayed without any sound.
 
 The notifications can bring interactivity with some buttons.
 

web_notify/static/description/index.html

@@ -8,11 +8,10 @@
 
 /*
 :Author: David Goodger ([email protected])
-:Id: $Id: html4css1.css 9511 2024-01-13 09:50:07Z milde $
+:Id: $Id: html4css1.css 8954 2022-01-20 10:10:25Z milde $
 :Copyright: This stylesheet has been placed in the public domain.
 
 Default cascading style sheet for the HTML output of Docutils.
-Despite the name, some widely supported CSS2 features are used.
 
 See https://docutils.sourceforge.io/docs/howto/html-stylesheets.html for how to
 customize this style sheet.
@@ -275,7 +274,7 @@
   margin-left: 2em ;
   margin-right: 2em }
 
-pre.code .ln { color: gray; } /* line numbers */
+pre.code .ln { color: grey; } /* line numbers */
 pre.code, code { background-color: #eeeeee }
 pre.code .comment, code .comment { color: #5C6576 }
 pre.code .keyword, code .keyword { color: #3B0D06; font-weight: bold }
@@ -301,7 +300,7 @@
 span.pre {
   white-space: pre }
 
-span.problematic, pre.problematic {
+span.problematic {
   color: red }
 
 span.section-subtitle {
@@ -420,6 +419,16 @@ <h1><a class="toc-backref" href="#toc-entry-2">Usage</a></h1>
 <pre class="code python literal-block">
 <span class="bp">self</span><span class="o">.</span><span class="n">env</span><span class="o">.</span><span class="n">user</span><span class="o">.</span><span class="n">notify_default</span><span class="p">(</span><span class="n">message</span><span class="o">=</span><span class="s1">'My default message'</span><span class="p">)</span>
 </pre>
+<p>You can also add sound to your notifications by using the sound parameter. The sound parameter expects a string containing the URL path to the audio file that should be played when the notification is displayed.</p>
+<p>Example:</p>
+<pre class="code python literal-block">
+<span class="bp">self</span><span class="o">.</span><span class="n">env</span><span class="o">.</span><span class="n">user</span><span class="o">.</span><span class="n">notify_success</span><span class="p">(</span><span class="n">message</span><span class="o">=</span><span class="s1">'My success message'</span><span class="p">,</span> <span class="n">sound</span><span class="o">=</span><span class="s1">'/&lt;YOUR_MODULE&gt;/static/audio/success.mp3'</span> <span class="p">)</span>
+</pre>
+<p>or</p>
+<pre class="code python literal-block">
+<span class="bp">self</span><span class="o">.</span><span class="n">env</span><span class="o">.</span><span class="n">user</span><span class="o">.</span><span class="n">notify_info</span><span class="p">(</span> <span class="n">message</span><span class="o">=</span><span class="s1">'My information message'</span><span class="p">,</span> <span class="n">sound</span><span class="o">=</span><span class="s1">'/&lt;YOUR_MODULE&gt;/static/audio/info.mp3'</span> <span class="p">)</span>
+</pre>
+<p>The sound parameter can be used with any notification type (success, danger, warning, info, or default). If the sound parameter is not provided, the notification will be displayed without any sound.</p>
 <p>The notifications can bring interactivity with some buttons.</p>
 <ul class="simple">
 <li>One allowing to refresh the active view</li>
@@ -477,14 +486,13 @@ <h2><a class="toc-backref" href="#toc-entry-6">Contributors</a></h2>
 <li>David Vidal</li>
 </ul>
 </li>
+<li>Cetmix OÜ &lt;<a class="reference external" href="https://cetmix.com/">https://cetmix.com/</a>&gt;</li>
 </ul>
 </div>
 <div class="section" id="maintainers">
 <h2><a class="toc-backref" href="#toc-entry-7">Maintainers</a></h2>
 <p>This module is maintained by the OCA.</p>
-<a class="reference external image-reference" href="https://odoo-community.org">
-<img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" />
-</a>
+<a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a>
 <p>OCA, or the Odoo Community Association, is a nonprofit organization whose
 mission is to support the collaborative development of Odoo features and
 promote its widespread use.</p>

web_notify/static/src/components/audio_player.esm.js

@@ -0,0 +1,70 @@
+/** @odoo-module alias=web_notify.AudioPlayer **/
+
+import {Component, useState} from "@odoo/owl";
+
+/**
+ * @typedef AudioPlayerProps
+ * @property {string} src URL of the audio file to be played
+ * @property {number} [volume=1.0] Volume level of the audio (from 0.0 to 1.0)
+ * @property {boolean} [loop=false] Whether the audio should loop
+ * @property {Function} [onEnded] Callback function to be called when the audio ends
+ */
+
+/**
+ * The AudioPlayer component is responsible for playing audio files with
+ * specified settings like volume and looping. It also provides the ability
+ * to trigger actions when the audio playback ends.
+ */
+export class AudioPlayer extends Component {
+    setup() {
+        this.state = useState({isPlaying: false});
+        this.audioElement = new Audio(this.props.src);
+
+        // Set audio properties
+        this.audioElement.volume = this.props.volume || 1.0;
+        this.audioElement.loop = this.props.loop || false;
+
+        // Start playing the audio
+        this.audioElement
+            .play()
+            .then(() => {
+                this.state.isPlaying = true;
+            })
+            .catch((error) => {
+                console.error("Audio playback failed:", error);
+            });
+
+        // Listen for the end of the audio playback
+        this.audioElement.addEventListener("ended", this.onAudioEnded.bind(this));
+    }
+
+    /**
+     * Stops the audio playback and triggers the onEnded callback if provided.
+     */
+    stopAudio() {
+        this.audioElement.pause();
+        this.audioElement.currentTime = 0;
+        this.state.isPlaying = false;
+
+        if (this.props.onEnded) {
+            this.props.onEnded();
+        }
+    }
+
+    /**
+     * Handler for when the audio playback ends.
+     */
+    onAudioEnded() {
+        if (!this.props.loop) {
+            this.stopAudio();
+        }
+    }
+
+    willUnmount() {
+        // Clean up the audio element and listeners
+        this.audioElement.removeEventListener("ended", this.onAudioEnded);
+        this.audioElement.pause();
+    }
+}
+
+AudioPlayer.template = "web_notify.AudioPlayer";

web_notify/static/src/components/audio_player.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!-- Copyright 2024 Cetmix OÜ
+     License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). -->
+<templates xml:space="preserve">
+
+    <t t-name="web_notify.AudioPlayer" owl="1">
+        <!-- No visual elements needed, audio is controlled programmatically -->
+    </t>
+
+</templates>

web_notify/static/src/js/services/notification_services.esm.js

@@ -4,12 +4,12 @@ import {browser} from "@web/core/browser/browser";
 import {registry} from "@web/core/registry";
 
 export const webNotificationService = {
-    dependencies: ["bus_service", "notification", "action"],
+    dependencies: ["bus_service", "action", "notification_sound"],
 
-    start(env, {bus_service, notification, action}) {
+    start(env, {bus_service, action, notification_sound}) {
         let webNotifTimeouts = {};
         /**
-         * Displays the web notification on user's screen
+         * Displays the web notification with sound on user's screen
          * @param {*} notifications
          */
         function displaywebNotification(notifications) {
@@ -34,20 +34,24 @@ export const webNotificationService = {
                             },
                         ];
                     }
-                    const notificationRemove = notification.add(Markup(notif.message), {
-                        title: notif.title,
-                        type: notif.type,
-                        sticky: notif.sticky,
-                        className: notif.className,
-                        buttons: buttons.map((button) => {
-                            const onClick = button.onClick;
-                            button.onClick = async () => {
-                                await onClick();
-                                notificationRemove();
-                            };
-                            return button;
-                        }),
-                    });
+                    const notificationRemove = notification_sound.add(
+                        Markup(notif.message),
+                        {
+                            title: notif.title,
+                            type: notif.type,
+                            sticky: notif.sticky,
+                            className: notif.className,
+                            buttons: buttons.map((button) => {
+                                const onClick = button.onClick;
+                                button.onClick = async () => {
+                                    await onClick();
+                                    notificationRemove();
+                                };
+                                return button;
+                            }),
+                            sound: notif.sound,
+                        }
+                    );
                 });
             });
         }