From ed8cbd56f5c66ce866244fbb0dd381e78b7e779d Mon Sep 17 00:00:00 2001 From: Mijalski Date: Wed, 10 Feb 2021 20:47:05 +0100 Subject: [PATCH] On click handler Add a way to customize on click behaviour for each toast. --- samples/BlazorServer/Pages/Index.razor | 8 ++- samples/BlazorServer/Shared/NavMenu.razor | 42 +++++++-------- samples/BlazorWebAssembly/Pages/Index.razor | 8 ++- src/Blazored.Toast/BlazoredToast.razor | 2 +- src/Blazored.Toast/BlazoredToast.razor.cs | 6 +++ src/Blazored.Toast/BlazoredToasts.razor | 2 +- src/Blazored.Toast/BlazoredToasts.razor.cs | 18 ++++--- .../Configuration/ToastSettings.cs | 12 ++++- src/Blazored.Toast/Services/IToastService.cs | 22 ++++---- src/Blazored.Toast/Services/ToastService.cs | 52 +++++++++++-------- src/Blazored.Toast/Styles/blazored-toast.css | 6 ++- 11 files changed, 111 insertions(+), 67 deletions(-) diff --git a/samples/BlazorServer/Pages/Index.razor b/samples/BlazorServer/Pages/Index.razor index bb965fd..b10dd63 100644 --- a/samples/BlazorServer/Pages/Index.razor +++ b/samples/BlazorServer/Pages/Index.razor @@ -9,12 +9,18 @@ + @code { + [Inject] + public NavigationManager NavigationManager { get; set; } + private void OnShowHtml() { - RenderFragment message = @I'm an INFO message with some bold text; + RenderFragment message =@I'm an INFO message with some bold text; toastService.ShowToast(ToastLevel.Info, message); } } diff --git a/samples/BlazorServer/Shared/NavMenu.razor b/samples/BlazorServer/Shared/NavMenu.razor index b2d7a10..98217be 100644 --- a/samples/BlazorServer/Shared/NavMenu.razor +++ b/samples/BlazorServer/Shared/NavMenu.razor @@ -1,27 +1,27 @@ -
- Blazor Server - -
- -
+
+ Blazor Server + +
+ +
  • Home
    • -
-
- -@code { - bool collapseNavMenu = true; - - string NavMenuCssClass => collapseNavMenu ? "collapse" : null; - - void ToggleNavMenu() - { - collapseNavMenu = !collapseNavMenu; - } -} + +
+ +@code { + bool collapseNavMenu = true; + + string NavMenuCssClass => collapseNavMenu ? "collapse" : null; + + void ToggleNavMenu() + { + collapseNavMenu = !collapseNavMenu; + } +} diff --git a/samples/BlazorWebAssembly/Pages/Index.razor b/samples/BlazorWebAssembly/Pages/Index.razor index 88a3e78..f6d07a4 100644 --- a/samples/BlazorWebAssembly/Pages/Index.razor +++ b/samples/BlazorWebAssembly/Pages/Index.razor @@ -8,12 +8,18 @@ + @code { + [Inject] + public NavigationManager NavigationManager { get; set; } + private void OnShowHtml() { - RenderFragment message = @Info Toast with bold text; + RenderFragment message =@Info Toast with bold text; toastService.ShowToast(ToastLevel.Info, message); } } diff --git a/src/Blazored.Toast/BlazoredToast.razor b/src/Blazored.Toast/BlazoredToast.razor index 5d1c31a..24386b0 100644 --- a/src/Blazored.Toast/BlazoredToast.razor +++ b/src/Blazored.Toast/BlazoredToast.razor @@ -1,6 +1,6 @@ @using Microsoft.AspNetCore.Components.Web -
+
@if (!string.IsNullOrWhiteSpace(ToastSettings.Icon)) { diff --git a/src/Blazored.Toast/BlazoredToast.razor.cs b/src/Blazored.Toast/BlazoredToast.razor.cs index 8ba9231..a3bb413 100644 --- a/src/Blazored.Toast/BlazoredToast.razor.cs +++ b/src/Blazored.Toast/BlazoredToast.razor.cs @@ -22,6 +22,7 @@ protected override void OnInitialized() _countdownTimer.OnTick += CalculateProgress; _countdownTimer.OnElapsed += () => { Close(); }; _countdownTimer.Start(); + } private async void CalculateProgress(int percentComplete) @@ -35,6 +36,11 @@ private void Close() ToastsContainer.RemoveToast(ToastId); } + private void ToastClick() + { + ToastSettings.OnClick?.Invoke(); + } + public void Dispose() { _countdownTimer.Dispose(); diff --git a/src/Blazored.Toast/BlazoredToasts.razor b/src/Blazored.Toast/BlazoredToasts.razor index 3d06a21..284dd56 100644 --- a/src/Blazored.Toast/BlazoredToasts.razor +++ b/src/Blazored.Toast/BlazoredToasts.razor @@ -4,7 +4,7 @@ @foreach (var toast in ToastList.OrderBy(x=>x.TimeStamp)) { - + }
diff --git a/src/Blazored.Toast/BlazoredToasts.razor.cs b/src/Blazored.Toast/BlazoredToasts.razor.cs index c29eae3..11116f7 100644 --- a/src/Blazored.Toast/BlazoredToasts.razor.cs +++ b/src/Blazored.Toast/BlazoredToasts.razor.cs @@ -73,31 +73,35 @@ private void ClearToasts(object sender, LocationChangedEventArgs args) }); } - private ToastSettings BuildToastSettings(ToastLevel level, RenderFragment message, string heading) + private ToastSettings BuildToastSettings(ToastLevel level, RenderFragment message, string heading, Action? onclick) { switch (level) { case ToastLevel.Error: - return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Error" : heading, message, IconType, "blazored-toast-error", ErrorClass, ErrorIcon, ShowProgressBar); + return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Error" : heading, message, IconType, + "blazored-toast-error", ErrorClass, ErrorIcon, ShowProgressBar, onclick); case ToastLevel.Info: - return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Info" : heading, message, IconType, "blazored-toast-info", InfoClass, InfoIcon, ShowProgressBar); + return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Info" : heading, message, IconType, + "blazored-toast-info", InfoClass, InfoIcon, ShowProgressBar, onclick); case ToastLevel.Success: - return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Success" : heading, message, IconType, "blazored-toast-success", SuccessClass, SuccessIcon, ShowProgressBar); + return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Success" : heading, message, IconType, + "blazored-toast-success", SuccessClass, SuccessIcon, ShowProgressBar, onclick); case ToastLevel.Warning: - return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Warning" : heading, message, IconType, "blazored-toast-warning", WarningClass, WarningIcon, ShowProgressBar); + return new ToastSettings(string.IsNullOrWhiteSpace(heading) ? "Warning" : heading, message, IconType, + "blazored-toast-warning", WarningClass, WarningIcon, ShowProgressBar, onclick); } throw new InvalidOperationException(); } - private void ShowToast(ToastLevel level, RenderFragment message, string heading) + private void ShowToast(ToastLevel level, RenderFragment message, string heading, Action? onClick) { InvokeAsync(() => { - var settings = BuildToastSettings(level, message, heading); + var settings = BuildToastSettings(level, message, heading, onClick); var toast = new ToastInstance { Id = Guid.NewGuid(), diff --git a/src/Blazored.Toast/Configuration/ToastSettings.cs b/src/Blazored.Toast/Configuration/ToastSettings.cs index adbe70e..36a13b0 100644 --- a/src/Blazored.Toast/Configuration/ToastSettings.cs +++ b/src/Blazored.Toast/Configuration/ToastSettings.cs @@ -1,4 +1,5 @@ -using Microsoft.AspNetCore.Components; +using System; +using Microsoft.AspNetCore.Components; namespace Blazored.Toast.Configuration { @@ -11,7 +12,8 @@ public ToastSettings( string baseClass, string additionalClasses, string icon, - bool showProgressBar) + bool showProgressBar, + Action? onClick) { Heading = heading; Message = message; @@ -20,6 +22,11 @@ public ToastSettings( AdditionalClasses = additionalClasses; Icon = icon; ShowProgressBar = showProgressBar; + OnClick = onClick; + if (onClick != null) + { + AdditionalClasses += " blazored-toast-action"; + } } public string Heading { get; set; } @@ -29,5 +36,6 @@ public ToastSettings( public string Icon { get; set; } public IconType? IconType { get; set; } public bool ShowProgressBar { get; set; } + public Action? OnClick { get; set; } } } diff --git a/src/Blazored.Toast/Services/IToastService.cs b/src/Blazored.Toast/Services/IToastService.cs index 299f5d2..85e9b30 100644 --- a/src/Blazored.Toast/Services/IToastService.cs +++ b/src/Blazored.Toast/Services/IToastService.cs @@ -8,63 +8,63 @@ public interface IToastService /// /// A event that will be invoked when showing a toast /// - event Action OnShow; + event Action OnShow; /// /// Shows a information toast /// /// Text to display on the toast /// The text to display as the toasts heading - void ShowInfo(string message, string heading = ""); + void ShowInfo(string message, string heading = "", Action? onClick = null); /// /// Shows a information toast /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - void ShowInfo(RenderFragment message, string heading = ""); + void ShowInfo(RenderFragment message, string heading = "", Action? onClick = null); /// /// Shows a success toast /// /// Text to display on the toast /// The text to display as the toasts heading - void ShowSuccess(string message, string heading = ""); + void ShowSuccess(string message, string heading = "", Action? onClick = null); /// /// Shows a success toast /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - void ShowSuccess(RenderFragment message, string heading = ""); + void ShowSuccess(RenderFragment message, string heading = "", Action? onClick = null); /// /// Shows a warning toast /// /// Text to display on the toast /// The text to display as the toasts heading - void ShowWarning(string message, string heading = ""); + void ShowWarning(string message, string heading = "", Action? onClick = null); /// /// Shows a warning toast /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - void ShowWarning(RenderFragment message, string heading = ""); + void ShowWarning(RenderFragment message, string heading = "", Action? onClick = null); /// /// Shows a error toast /// /// Text to display on the toast /// The text to display as the toasts heading - void ShowError(string message, string heading = ""); + void ShowError(string message, string heading = "", Action? onClick = null); /// /// Shows a error toast /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - void ShowError(RenderFragment message, string heading = ""); + void ShowError(RenderFragment message, string heading = "", Action? onClick = null); /// /// Shows a toast using the supplied settings @@ -72,7 +72,7 @@ public interface IToastService /// Toast level to display /// Text to display on the toast /// The text to display as the toasts heading - void ShowToast(ToastLevel level, string message, string heading = ""); + void ShowToast(ToastLevel level, string message, string heading = "", Action? onClick = null); /// /// Shows a toast using the supplied settings @@ -80,6 +80,6 @@ public interface IToastService /// Toast level to display /// RenderFragment to display on the toast /// The text to display as the toasts heading - void ShowToast(ToastLevel level, RenderFragment message, string heading = ""); + void ShowToast(ToastLevel level, RenderFragment message, string heading = "", Action? onClick = null); } } diff --git a/src/Blazored.Toast/Services/ToastService.cs b/src/Blazored.Toast/Services/ToastService.cs index 79c74dc..86edde7 100644 --- a/src/Blazored.Toast/Services/ToastService.cs +++ b/src/Blazored.Toast/Services/ToastService.cs @@ -8,16 +8,17 @@ public class ToastService : IToastService /// /// A event that will be invoked when showing a toast /// - public event Action OnShow; + public event Action OnShow; /// /// Shows a information toast /// /// Text to display on the toast /// The text to display as the toasts heading - public void ShowInfo(string message, string heading = "") + /// Action to be executed on click + public void ShowInfo(string message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Info, message, heading); + ShowToast(ToastLevel.Info, message, heading, onClick); } /// @@ -25,9 +26,10 @@ public void ShowInfo(string message, string heading = "") /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - public void ShowInfo(RenderFragment message, string heading = "") + /// Action to be executed on click + public void ShowInfo(RenderFragment message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Info, message, heading); + ShowToast(ToastLevel.Info, message, heading, onClick); } /// @@ -35,9 +37,10 @@ public void ShowInfo(RenderFragment message, string heading = "") /// /// Text to display on the toast /// The text to display as the toasts heading - public void ShowSuccess(string message, string heading = "") + /// Action to be executed on click + public void ShowSuccess(string message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Success, message, heading); + ShowToast(ToastLevel.Success, message, heading, onClick); } /// @@ -45,9 +48,10 @@ public void ShowSuccess(string message, string heading = "") /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - public void ShowSuccess(RenderFragment message, string heading = "") + /// Action to be executed on click + public void ShowSuccess(RenderFragment message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Success, message, heading); + ShowToast(ToastLevel.Success, message, heading, onClick); } /// @@ -55,9 +59,10 @@ public void ShowSuccess(RenderFragment message, string heading = "") /// /// Text to display on the toast /// The text to display as the toasts heading - public void ShowWarning(string message, string heading = "") + /// Action to be executed on click + public void ShowWarning(string message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Warning, message, heading); + ShowToast(ToastLevel.Warning, message, heading, onClick); } /// @@ -65,9 +70,10 @@ public void ShowWarning(string message, string heading = "") /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - public void ShowWarning(RenderFragment message, string heading = "") + /// Action to be executed on click + public void ShowWarning(RenderFragment message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Warning, message, heading); + ShowToast(ToastLevel.Warning, message, heading, onClick); } /// @@ -75,9 +81,10 @@ public void ShowWarning(RenderFragment message, string heading = "") /// /// Text to display on the toast /// The text to display as the toasts heading - public void ShowError(string message, string heading = "") + /// Action to be executed on click + public void ShowError(string message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Error, message, heading); + ShowToast(ToastLevel.Error, message, heading, onClick); } /// @@ -85,9 +92,10 @@ public void ShowError(string message, string heading = "") /// /// RenderFragment to display on the toast /// The text to display as the toasts heading - public void ShowError(RenderFragment message, string heading = "") + /// Action to be executed on click + public void ShowError(RenderFragment message, string heading = "", Action? onClick = null) { - ShowToast(ToastLevel.Error, message, heading); + ShowToast(ToastLevel.Error, message, heading, onClick); } /// @@ -96,9 +104,10 @@ public void ShowError(RenderFragment message, string heading = "") /// Toast level to display /// Text to display on the toast /// The text to display as the toasts heading - public void ShowToast(ToastLevel level, string message, string heading = "") + /// Action to be executed on click + public void ShowToast(ToastLevel level, string message, string heading = "", Action? onClick = null) { - ShowToast(level, builder => builder.AddContent(0, message), heading); + ShowToast(level, builder => builder.AddContent(0, message), heading, onClick); } @@ -108,9 +117,10 @@ public void ShowToast(ToastLevel level, string message, string heading = "") /// Toast level to display /// RenderFragment to display on the toast /// The text to display as the toasts heading - public void ShowToast(ToastLevel level, RenderFragment message, string heading = "") + /// Action to be executed on click + public void ShowToast(ToastLevel level, RenderFragment message, string heading = "", Action? onClick = null) { - OnShow?.Invoke(level, message, heading); + OnShow?.Invoke(level, message, heading, onClick); } } } diff --git a/src/Blazored.Toast/Styles/blazored-toast.css b/src/Blazored.Toast/Styles/blazored-toast.css index 48d97c6..cc978da 100644 --- a/src/Blazored.Toast/Styles/blazored-toast.css +++ b/src/Blazored.Toast/Styles/blazored-toast.css @@ -119,6 +119,10 @@ border-bottom-left-radius: .25rem; } +.blazored-toast-action { + cursor: pointer; +} + @keyframes fadein { from { opacity: 0; @@ -167,4 +171,4 @@ width: 30rem; border-radius: .25rem; } -} +} \ No newline at end of file