Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
wants to merge 1 commit into
base: 16.0
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions web_notify/README.rst
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Expand Down Expand Up @@ -147,6 +162,8 @@ Contributors

* David Vidal

* Cetmix OÜ <https://cetmix.com/>

Maintainers
~~~~~~~~~~~

Expand Down
5 changes: 3 additions & 2 deletions web_notify/__manifest__.py
Original file line number Diff line number Diff line change
Expand Up @@ -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"],
Expand Down
27 changes: 22 additions & 5 deletions web_notify/models/res_users.py
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand All @@ -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,
Expand All @@ -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,
Expand All @@ -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,
Expand All @@ -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,
Expand All @@ -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
Expand All @@ -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]
Expand Down
2 changes: 2 additions & 0 deletions web_notify/readme/CONTRIBUTORS.rst
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,5 @@
* `Tecnativa <https://www.tecnativa.com>`_:

* David Vidal

* Cetmix OÜ <https://cetmix.com/>
15 changes: 15 additions & 0 deletions web_notify/readme/USAGE.rst
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Expand Down
22 changes: 15 additions & 7 deletions web_notify/static/description/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,10 @@

/*
:Author: David Goodger (goodger@python.org)
: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.
Expand Down Expand Up @@ -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 }
Expand All @@ -301,7 +300,7 @@
span.pre {
white-space: pre }

span.problematic, pre.problematic {
span.problematic {
color: red }

span.section-subtitle {
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -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>
Expand Down
70 changes: 70 additions & 0 deletions web_notify/static/src/components/audio_player.esm.js
Original file line number Diff line number Diff line change
@@ -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 {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why not using a service like SoundEffects

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@chienandalu

this service is limited to predefined sound effect settings and does not allow you to specify a link to any sound. In my case, only the sound effect link is passed for playback, which allows any sound to be dynamically played back

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I mean, you can take inspiration in that code to implement your own sound service, resulting in a simpler impletation

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@chienandalu I was already inspired by this effect to write the current solution :-)

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";
10 changes: 10 additions & 0 deletions web_notify/static/src/components/audio_player.xml
Original file line number Diff line number Diff line change
@@ -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>
38 changes: 21 additions & 17 deletions web_notify/static/src/js/services/notification_services.esm.js
Original file line number Diff line number Diff line change
Expand Up @@ -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) {
Expand All @@ -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,
}
);
});
});
}
Expand Down
Loading
Loading