Compare commits
	
		
			4 Commits
		
	
	
		
			858dd59688
			...
			ff3a36eb64
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 
						 | 
					ff3a36eb64 | ||
| 
						 | 
					422da4d079 | ||
| 
						 | 
					4f635b573c | ||
| 
						 | 
					69413494c5 | 
							
								
								
									
										25
									
								
								src/Connected.Components/Components/ModalDialog.razor
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										25
									
								
								src/Connected.Components/Components/ModalDialog.razor
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,25 @@
 | 
			
		||||
@using Connected.Models.Modal;
 | 
			
		||||
@if (IsVisible)
 | 
			
		||||
{
 | 
			
		||||
    <div class="modal fade show" tabindex="-1" @onclick="@CloseIfEnabled" @onkeydown="@(e => CheckEscape(e))">
 | 
			
		||||
        <div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" @ref="@root" >
 | 
			
		||||
            <div class="modal-content" @onclick="PreventClose">
 | 
			
		||||
                @if (!ModalOptions.NoHeader)
 | 
			
		||||
                {
 | 
			
		||||
                    <div class="modal-header" >
 | 
			
		||||
                        <h3 class="modal-title">@Title</h3>
 | 
			
		||||
                </div>
 | 
			
		||||
                }
 | 
			
		||||
                <div class="modal-body">
 | 
			
		||||
                    @Content
 | 
			
		||||
                </div>
 | 
			
		||||
                <div class="modal-footer">
 | 
			
		||||
                    @foreach(ModalButton button in buttons)
 | 
			
		||||
                    {
 | 
			
		||||
                        <button type="button" class="btn @button.GetButtonClass" @onclick="@(()=>CloseModal(button))">@button.ButtonText</button>
 | 
			
		||||
                    }
 | 
			
		||||
                </div>
 | 
			
		||||
            </div>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										101
									
								
								src/Connected.Components/Components/ModalDialog.razor.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										101
									
								
								src/Connected.Components/Components/ModalDialog.razor.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,101 @@
 | 
			
		||||
using Connected.Models.Modal;
 | 
			
		||||
using Connected.Services.Modal;
 | 
			
		||||
using Microsoft.AspNetCore.Components;
 | 
			
		||||
using Microsoft.AspNetCore.Components.Web;
 | 
			
		||||
 | 
			
		||||
namespace Connected.Components;
 | 
			
		||||
public partial class ModalDialog : IDisposable
 | 
			
		||||
{
 | 
			
		||||
	[Inject] ModalDialogService? ModalService { get; set; }
 | 
			
		||||
 | 
			
		||||
	protected ElementReference root;
 | 
			
		||||
	protected bool IsVisible { get; set; }
 | 
			
		||||
	protected string? Title { get; set; }
 | 
			
		||||
	protected RenderFragment? Content { get; set; }
 | 
			
		||||
	protected bool OverlayClickToClose { get; set; } = true;
 | 
			
		||||
 | 
			
		||||
	protected List<ModalButton> buttons { get; set; } = new();
 | 
			
		||||
 | 
			
		||||
	protected ModalOptions? ModalOptions { get; set; }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
	protected override void OnInitialized()
 | 
			
		||||
	{
 | 
			
		||||
		ModalService.OnShow += ShowModal;
 | 
			
		||||
		ModalService.OnClose += CloseModal;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	protected override async Task OnAfterRenderAsync(bool firstRender)
 | 
			
		||||
	{
 | 
			
		||||
		if (IsVisible)
 | 
			
		||||
			await root.FocusAsync();
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
	public void ShowModal(string title, RenderFragment content, List<ModalButton> buttons, ModalOptions options)
 | 
			
		||||
	{
 | 
			
		||||
		Title = title;
 | 
			
		||||
		Content = content;
 | 
			
		||||
		IsVisible = true;
 | 
			
		||||
 | 
			
		||||
		ModalOptions = options;
 | 
			
		||||
		this.buttons = buttons;
 | 
			
		||||
 | 
			
		||||
		StateHasChanged();
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void CloseModal(ModalButton? button)
 | 
			
		||||
	{
 | 
			
		||||
		if (button is not null)
 | 
			
		||||
		{
 | 
			
		||||
			if (button.CloseDialogOnClick)
 | 
			
		||||
			{
 | 
			
		||||
				IsVisible = false;
 | 
			
		||||
				Title = "";
 | 
			
		||||
				Content = null;
 | 
			
		||||
			}
 | 
			
		||||
			button.OnClickEvent.Delegate.DynamicInvoke(button.OnClickEvent.args);
 | 
			
		||||
		}
 | 
			
		||||
		StateHasChanged();
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void Dispose()
 | 
			
		||||
	{
 | 
			
		||||
		if (ModalService is not null)
 | 
			
		||||
		{
 | 
			
		||||
			ModalService.OnShow -= ShowModal;
 | 
			
		||||
			ModalService.OnClose -= CloseModal;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void CheckEscape(KeyboardEventArgs args)
 | 
			
		||||
	{
 | 
			
		||||
		if (ModalOptions.CloseOnEscKey)
 | 
			
		||||
		{
 | 
			
		||||
			var key = args.Key.ToLower();
 | 
			
		||||
			if (key.Equals("escape"))
 | 
			
		||||
			{
 | 
			
		||||
				CloseModal(null);
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void CloseIfEnabled(MouseEventArgs args)
 | 
			
		||||
	{
 | 
			
		||||
		if (!ModalOptions.DisableBackdropClick)
 | 
			
		||||
		{
 | 
			
		||||
			if (OverlayClickToClose)
 | 
			
		||||
			{
 | 
			
		||||
				CloseModal(null);
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
		OverlayClickToClose = true;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void PreventClose(MouseEventArgs args)
 | 
			
		||||
	{
 | 
			
		||||
		OverlayClickToClose = false;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										13
									
								
								src/Connected.Components/Enums/ModalButtonType.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								src/Connected.Components/Enums/ModalButtonType.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,13 @@
 | 
			
		||||
using System;
 | 
			
		||||
using System.Collections.Generic;
 | 
			
		||||
using System.Linq;
 | 
			
		||||
using System.Text;
 | 
			
		||||
using System.Threading.Tasks;
 | 
			
		||||
 | 
			
		||||
namespace Connected.Enums;
 | 
			
		||||
public enum ModalButtonType
 | 
			
		||||
{
 | 
			
		||||
	OkButton,
 | 
			
		||||
	CancelButton,
 | 
			
		||||
	RegularButton
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										37
									
								
								src/Connected.Components/Models/Modal/ModalButton.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										37
									
								
								src/Connected.Components/Models/Modal/ModalButton.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,37 @@
 | 
			
		||||
using Connected.Enums;
 | 
			
		||||
using Connected.Services.Modal;
 | 
			
		||||
 | 
			
		||||
namespace Connected.Models.Modal;
 | 
			
		||||
public class ModalButton
 | 
			
		||||
{
 | 
			
		||||
	ModalDialogService _dialogService;
 | 
			
		||||
	public Event OnClickEvent { get; set; }
 | 
			
		||||
	public ModalButtonType ModalButtonType { get; set; } = ModalButtonType.RegularButton;
 | 
			
		||||
	public string ButtonText { get; set; }
 | 
			
		||||
 | 
			
		||||
	public bool CloseDialogOnClick { get; set; } = true;
 | 
			
		||||
 | 
			
		||||
	public ModalButton(Event OnClickEvent, string ButtonText, ModalButtonType ModalButtonType = ModalButtonType.RegularButton, bool CloseDialogOnClick = true)
 | 
			
		||||
	{
 | 
			
		||||
		this.OnClickEvent = OnClickEvent;
 | 
			
		||||
		this.ButtonText = ButtonText;
 | 
			
		||||
		this.ModalButtonType= ModalButtonType;	
 | 
			
		||||
		this.CloseDialogOnClick = CloseDialogOnClick;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public string GetButtonClass
 | 
			
		||||
	{
 | 
			
		||||
		get
 | 
			
		||||
		{
 | 
			
		||||
			switch (this.ModalButtonType)
 | 
			
		||||
			{
 | 
			
		||||
				case ModalButtonType.CancelButton:
 | 
			
		||||
					return "btn-sm btn-core";
 | 
			
		||||
				case ModalButtonType.OkButton:
 | 
			
		||||
					return "btn-sm btn-info";
 | 
			
		||||
				default:
 | 
			
		||||
					return "btn-sm btn-secondary";
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										12
									
								
								src/Connected.Components/Models/Modal/ModalEvent.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								src/Connected.Components/Models/Modal/ModalEvent.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,12 @@
 | 
			
		||||
namespace Connected.Models.Modal;
 | 
			
		||||
public class Event
 | 
			
		||||
{
 | 
			
		||||
	public Delegate Delegate;
 | 
			
		||||
	public object[] args;
 | 
			
		||||
 | 
			
		||||
	public Event(Delegate Delegate, object[] Args)
 | 
			
		||||
	{
 | 
			
		||||
		this.Delegate = Delegate;
 | 
			
		||||
		args = Args;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										10
									
								
								src/Connected.Components/Models/Modal/ModalOptions.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										10
									
								
								src/Connected.Components/Models/Modal/ModalOptions.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,10 @@
 | 
			
		||||
namespace Connected.Models.Modal;
 | 
			
		||||
public class ModalOptions
 | 
			
		||||
{
 | 
			
		||||
	public bool CloseOnEscKey { get; set; } = true;
 | 
			
		||||
	public bool DisableBackdropClick { get; set; } = false;
 | 
			
		||||
	public bool NoHeader { get; set; } = false;
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
@ -0,0 +1,28 @@
 | 
			
		||||
using Connected.Components;
 | 
			
		||||
using Connected.Models.Modal;
 | 
			
		||||
using Microsoft.AspNetCore.Components;
 | 
			
		||||
 | 
			
		||||
namespace Connected.Services.Modal;
 | 
			
		||||
public class ModalDialogService
 | 
			
		||||
{
 | 
			
		||||
	public event Action<string, RenderFragment, List<ModalButton>, ModalOptions> OnShow;
 | 
			
		||||
	public event Action<ModalButton?> OnClose;
 | 
			
		||||
 | 
			
		||||
	public void ShowDialog(string title, RenderFragment content, List<ModalButton> buttons, ModalOptions options)
 | 
			
		||||
	{
 | 
			
		||||
		OnShow?.Invoke(title, content, buttons, options);
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void ShowDialog(string title, MarkupString contentMarkup, List<ModalButton> buttons, ModalOptions options)
 | 
			
		||||
	{
 | 
			
		||||
		var content = new RenderFragment(x => x.AddContent(1, contentMarkup));
 | 
			
		||||
		OnShow?.Invoke(title, content, buttons, options);
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public void Close(ModalButton? button)
 | 
			
		||||
	{
 | 
			
		||||
		OnClose?.Invoke(button);
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										12
									
								
								src/Connected.Components/Services/Modal/ModalEvent.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								src/Connected.Components/Services/Modal/ModalEvent.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,12 @@
 | 
			
		||||
namespace Connected.Services.Modal;
 | 
			
		||||
public class Event
 | 
			
		||||
{
 | 
			
		||||
	public Delegate Delegate;
 | 
			
		||||
	public object[] args;
 | 
			
		||||
 | 
			
		||||
	public Event(Delegate Delegate, object[] Args) 
 | 
			
		||||
	{
 | 
			
		||||
		this.Delegate = Delegate;
 | 
			
		||||
		this.args = Args;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										9
									
								
								src/Connected.Components/Services/Modal/ModalOptions.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								src/Connected.Components/Services/Modal/ModalOptions.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,9 @@
 | 
			
		||||
namespace Connected.Services.Modal;
 | 
			
		||||
public class ModalOptions
 | 
			
		||||
{
 | 
			
		||||
	public bool CloseOnEscKey { get; set; } = true;
 | 
			
		||||
	public bool DisableBackdropCLick { get; set; } = false;
 | 
			
		||||
	public bool NoHeader { get; set; } = false;
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
@ -0,0 +1,10 @@
 | 
			
		||||
using Connected.Services.Modal;
 | 
			
		||||
using Microsoft.Extensions.DependencyInjection;
 | 
			
		||||
 | 
			
		||||
namespace Connected.Services;
 | 
			
		||||
 | 
			
		||||
public static class ServiceCollectionExtensions
 | 
			
		||||
{
 | 
			
		||||
	public static IServiceCollection AddModalDialogService(this IServiceCollection services)
 | 
			
		||||
		 => services.AddScoped<ModalDialogService>();
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user