red-france-69804
08/07/2022, 9:34 PMpython
import secrets
from django_htmx.http import trigger_client_event
class MessageMixin:
"""Provide a way to add a formatable message (like toast) to a class based view, using attributes. Kwargs can be added to format message with dynamic data.
An HX-Trigger event is fired to be handled client-side.
"""
message: str | None = None
message_level: str | None = None
message_kwargs: dict = {}
def build_response(self, request, *args, **kwargs):
response = super().build_response(self, request, *args, **kwargs)
trigger_client_event(
response,
name="showMessage",
params=dict(
level=self.message_level,
message=self.message.format(**self.message_kwargs),
randomId=secrets.token_urlsafe(nbytes=5), # allow to handle multiple toasts concurrenly
),
)
return response
toaster.html
html
{# Toast template used to create actual toasts with render hyperscript method #}
<template id="toast-template">
<div
id="toast-${randomId}"
class="alert alert-${level} shadow-lg mb-3"
_="init
wait 2s
transition my opacity to 0
remove me"
>
<span>${message}</span>
<button
_="on click remove #toast-${randomId}"
class="btn btn-xs btn-circle">
✕
</button>
</template>
{# Toaster (toasts wrapper) #}
<div
class="z-20 fixed bottom-4 right-8 ml-8"
_="on showMessage(message,level,randomId) from body
render #toast-template with (message: message, level: level, randomId: randomId)
then put it at the end of me"
>
</div>