Improved dialog styling and made dialogs draggable

1 files changed, 17 insertions, 38 deletions

diff --git a/Pages/Component/Dialog.razor b/Pages/Component/Dialog.razor
index e71ddc6..dbfec49 100644
--- a/Pages/Component/Dialog.razor
+++ b/Pages/Component/Dialog.razor
@@ -1,13 +1,20 @@
-@inject IDialogService dialogService
+@inject IJSRuntime jsRuntime
 @implements IDialog
-@implements IDisposable
 
-<div @onclick=Bump style="@(style)">
+<div
+    class="dialog"
+    onmousedown="dialogMouseDown(event)"
+    style="opacity:0;visibility:hidden;@(heightStyle)"
+    @ref=dialogDiv>
     @if(Title is not null) {
-        <p>@Title</p>
-        <hr/>
+        <div class="titlebar" onmousedown="dialogTitleMouseDown(event)">
+            <p class="title">@Title</p>
+            <hr/>
+        </div>
     }
-    @ChildContent
+    <div class="content">
+        @ChildContent
+    </div>
 </div>
 
 @code {
@@ -26,49 +33,21 @@
         get => visible;
         set {
             visible = value;
-            if(value)
-                Bump();
-            StateHasChanged();
-        }
-    }
-
-    public int? ZIndex {
-        get => zIndex;
-        set {
-            zIndex = value;
-            StateHasChanged();
+            jsRuntime.InvokeVoidAsync(
+                "setDialogVisibility",
+                new object?[] { dialogDiv, value });
         }
     }
 
     private bool visible = false;
 
-    private int? zIndex;
-
     private string? height;
 
-    protected override void OnInitialized() =>
-       dialogService.Register(this);
+    private ElementReference dialogDiv;
 
     public void Show() => Visible = true;
     public void Hide() => Visible = false;
 
-    private void Bump() =>
-        dialogService.BumpZIndex(this);
-
-    private string style =>
-        zIndexStyle +
-        heightStyle +
-        visiblilityStyle;
-
-    private string zIndexStyle =>
-        zIndex is null ? "display:none;" : $"z-index:{zIndex};";
-
     private string heightStyle =>
         $"{(height is null ? "" : $"max-height:{height};")}";
-
-    private string visiblilityStyle =>
-        Visible ? "opacity:1;visibility:visible;" : "opacity:0;visibility:hidden;";
-
-    public void Dispose() =>
-        dialogService.Unregister(this);
 }