features/rewrite/modal1 #10
@ -1,7 +1,8 @@
 | 
				
			|||||||
@if (IsVisible)
 | 
					@using Connected.Models.Modal;
 | 
				
			||||||
 | 
					@if (IsVisible)
 | 
				
			||||||
{
 | 
					{
 | 
				
			||||||
    <div class="modal fade show" tabindex="-1" @onclick="@CloseIfEnabled" @onkeydown="@(e => CheckEscape(e))">
 | 
					    <div class="modal fade show" tabindex="-1" @onclick="@CloseIfEnabled" @onkeydown="@(e => CheckEscape(e))">
 | 
				
			||||||
        <div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" >
 | 
					        <div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" @ref="@root" >
 | 
				
			||||||
            <div class="modal-content" @onclick="PreventClose">
 | 
					            <div class="modal-content" @onclick="PreventClose">
 | 
				
			||||||
                @if (!ModalOptions.NoHeader)
 | 
					                @if (!ModalOptions.NoHeader)
 | 
				
			||||||
                {
 | 
					                {
 | 
				
			||||||
@ -13,8 +14,10 @@
 | 
				
			|||||||
                    @Content
 | 
					                    @Content
 | 
				
			||||||
                </div>
 | 
					                </div>
 | 
				
			||||||
                <div class="modal-footer">
 | 
					                <div class="modal-footer">
 | 
				
			||||||
                    <button type="button" class="btn btn-secondary" @onclick="@(()=>CloseModal())">@CancelButtonText</button>
 | 
					                    @foreach(ModalButton button in buttons)
 | 
				
			||||||
                    <button type="button" class="btn btn-core" @onclick="@(()=>CloseModal(true))">@OKButtonText</button>
 | 
					                    {
 | 
				
			||||||
 | 
					                        <button type="button" class="btn @button.GetButtonClass" @onclick="@(()=>CloseModal(button))">@button.ButtonText</button>
 | 
				
			||||||
 | 
					                    }
 | 
				
			||||||
                </div>
 | 
					                </div>
 | 
				
			||||||
            </div>
 | 
					            </div>
 | 
				
			||||||
        </div>
 | 
					        </div>
 | 
				
			||||||
 | 
				
			|||||||
@ -1,9 +1,10 @@
 | 
				
			|||||||
using Connected.Services.Modal;
 | 
					using Connected.Models.Modal;
 | 
				
			||||||
 | 
					using Connected.Services.Modal;
 | 
				
			||||||
using Microsoft.AspNetCore.Components;
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
using Microsoft.AspNetCore.Components.Web;
 | 
					using Microsoft.AspNetCore.Components.Web;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
namespace Connected.Components;
 | 
					namespace Connected.Components;
 | 
				
			||||||
public partial class ModalDialog: IDisposable
 | 
					public partial class ModalDialog : IDisposable
 | 
				
			||||||
{
 | 
					{
 | 
				
			||||||
	[Inject] ModalDialogService? ModalService { get; set; }
 | 
						[Inject] ModalDialogService? ModalService { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -11,54 +12,51 @@ public partial class ModalDialog: IDisposable
 | 
				
			|||||||
	protected bool IsVisible { get; set; }
 | 
						protected bool IsVisible { get; set; }
 | 
				
			||||||
	protected string? Title { get; set; }
 | 
						protected string? Title { get; set; }
 | 
				
			||||||
	protected RenderFragment? Content { get; set; }
 | 
						protected RenderFragment? Content { get; set; }
 | 
				
			||||||
 | 
					 | 
				
			||||||
	protected bool OverlayClickToClose { get; set; } = true;
 | 
						protected bool OverlayClickToClose { get; set; } = true;
 | 
				
			||||||
	protected Event? OnOk { get; set; }
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
	protected Event? OnClose { get; set; }
 | 
						protected List<ModalButton> buttons { get; set; } = new();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	protected ModalOptions? ModalOptions { get; set; }
 | 
						protected ModalOptions? ModalOptions { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	protected override void OnInitialized()
 | 
						protected override void OnInitialized()
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		ModalService.OnShow += ShowModal;
 | 
							ModalService.OnShow += ShowModal;
 | 
				
			||||||
		ModalService.OnClose += CloseModal;
 | 
							ModalService.OnClose += CloseModal;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						protected override async Task OnAfterRenderAsync(bool firstRender)
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							if (IsVisible)
 | 
				
			||||||
 | 
								await root.FocusAsync();
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public void ShowModal(string title, RenderFragment content, Event OnOk = null, Event OnClose = null, ModalOptions options = null, string CancelButtonText = "Cancel", string OKButtonText = "OK")
 | 
					
 | 
				
			||||||
 | 
						public void ShowModal(string title, RenderFragment content, List<ModalButton> buttons, ModalOptions options)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		Title = title;
 | 
							Title = title;
 | 
				
			||||||
		Content = content;
 | 
							Content = content;
 | 
				
			||||||
		IsVisible = true;
 | 
							IsVisible = true;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		this.OKButtonText = OKButtonText;
 | 
					 | 
				
			||||||
		this.CancelButtonText = CancelButtonText;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
		ModalOptions = options;
 | 
							ModalOptions = options;
 | 
				
			||||||
 | 
							this.buttons = buttons;
 | 
				
			||||||
		this.OnOk = OnOk;
 | 
					 | 
				
			||||||
		this.OnClose = OnClose;
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
		StateHasChanged();
 | 
							StateHasChanged();
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public void CloseModal(bool OkClicked = false)
 | 
						public void CloseModal(ModalButton? button)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		IsVisible = false;
 | 
							if (button is not null)
 | 
				
			||||||
		Title = "";
 | 
					 | 
				
			||||||
		Content = null;
 | 
					 | 
				
			||||||
		if (OkClicked)
 | 
					 | 
				
			||||||
		{
 | 
							{
 | 
				
			||||||
			if (OnOk is not null)
 | 
								if (button.CloseDialogOnClick)
 | 
				
			||||||
				OnOk.Delegate.DynamicInvoke(OnOk.args);
 | 
								{
 | 
				
			||||||
 | 
									IsVisible = false;
 | 
				
			||||||
 | 
									Title = "";
 | 
				
			||||||
 | 
									Content = null;
 | 
				
			||||||
 | 
								}
 | 
				
			||||||
 | 
								button.OnClickEvent.Delegate.DynamicInvoke(button.OnClickEvent.args);
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
		else
 | 
					 | 
				
			||||||
		{
 | 
					 | 
				
			||||||
			if (OnClose is not null)
 | 
					 | 
				
			||||||
				OnClose.Delegate.DynamicInvoke(OnClose.args);
 | 
					 | 
				
			||||||
		}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
		StateHasChanged();
 | 
							StateHasChanged();
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -71,24 +69,26 @@ public partial class ModalDialog: IDisposable
 | 
				
			|||||||
		}
 | 
							}
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public string OKButtonText { get; set; } ="OK";
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	public string CancelButtonText { get; set; } = "Cancel";
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	public void CheckEscape(KeyboardEventArgs args)
 | 
						public void CheckEscape(KeyboardEventArgs args)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		var key = args.Key.ToLower();
 | 
							if (ModalOptions.CloseOnEscKey)
 | 
				
			||||||
		if (key.Equals("escape"))
 | 
					 | 
				
			||||||
		{
 | 
							{
 | 
				
			||||||
			CloseModal();
 | 
								var key = args.Key.ToLower();
 | 
				
			||||||
 | 
								if (key.Equals("escape"))
 | 
				
			||||||
 | 
								{
 | 
				
			||||||
 | 
									CloseModal(null);
 | 
				
			||||||
 | 
								}
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public void CloseIfEnabled(MouseEventArgs args)
 | 
						public void CloseIfEnabled(MouseEventArgs args)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		if (OverlayClickToClose)
 | 
							if (!ModalOptions.DisableBackdropClick)
 | 
				
			||||||
		{
 | 
							{
 | 
				
			||||||
			CloseModal();
 | 
								if (OverlayClickToClose)
 | 
				
			||||||
 | 
								{
 | 
				
			||||||
 | 
									CloseModal(null);
 | 
				
			||||||
 | 
								}
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
		OverlayClickToClose = true;
 | 
							OverlayClickToClose = true;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
				
			|||||||
							
								
								
									
										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;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
@ -1,24 +1,28 @@
 | 
				
			|||||||
using Microsoft.AspNetCore.Components;
 | 
					using Connected.Components;
 | 
				
			||||||
 | 
					using Connected.Models.Modal;
 | 
				
			||||||
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
namespace Connected.Services.Modal;
 | 
					namespace Connected.Services.Modal;
 | 
				
			||||||
public class ModalDialogService
 | 
					public class ModalDialogService
 | 
				
			||||||
{
 | 
					{
 | 
				
			||||||
	public event Action<string, RenderFragment, Event, Event, ModalOptions, string, string> OnShow;
 | 
						public event Action<string, RenderFragment, List<ModalButton>, ModalOptions> OnShow;
 | 
				
			||||||
	public event Action<bool> OnClose;
 | 
						public event Action<ModalButton?> OnClose;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public void ShowDialog(string title, RenderFragment content, Event OnConfirm, Event OnCancel, ModalOptions options, string CancelButtonText="Cancel", string OKButtonText="OK")
 | 
						public void ShowDialog(string title, RenderFragment content, List<ModalButton> buttons, ModalOptions options)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		OnShow?.Invoke(title, content, OnConfirm, OnCancel, options, OKButtonText, CancelButtonText);
 | 
							OnShow?.Invoke(title, content, buttons, options);
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public void ShowDialog(string title, MarkupString contentMarkup, Event OnConfirm, Event OnCancel, ModalOptions options, string CancelButtonText = "Cancel", string OKButtonText = "OK")
 | 
						public void ShowDialog(string title, MarkupString contentMarkup, List<ModalButton> buttons, ModalOptions options)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		var content = new RenderFragment(x => x.AddContent(1, contentMarkup));
 | 
							var content = new RenderFragment(x => x.AddContent(1, contentMarkup));
 | 
				
			||||||
		OnShow?.Invoke(title, content, OnConfirm, OnCancel, options, OKButtonText, CancelButtonText);
 | 
							OnShow?.Invoke(title, content, buttons, options);
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	public void Close(bool OkClicked)
 | 
						public void Close(ModalButton? button)
 | 
				
			||||||
	{
 | 
						{
 | 
				
			||||||
		OnClose?.Invoke(OkClicked);
 | 
							OnClose?.Invoke(button);
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user