ydeng/props
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Removed ComponentSupport.js

Browse Source 
Unecessary for now.
This commit is contained in:
Harrison Deng
2021-05-22 01:01:26 -05:00
parent d2084efa7d
commit d87025c8b4
3 changed files with 2 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/MultiShop/Client/Shared/DragAndDropList.razor
View File

@@ -2,10 +2,10 @@
@typeparam TItem @typeparam TItem
@inject IJSRuntime JS @inject IJSRuntime JS
<ul class=@ListGroupCss style="width: max-content;" @ref="dragAndDrop"> <ul class=@ListGroupCss style="width: max-content;" ondragover="event.preventDefault()">
@foreach (TItem item in Items) @foreach (TItem item in Items)
{ {
<li class="list-group-item" draggable=@((!processingDropChange).ToString()) @ondragstart="@(() => itemDraggedIndex = Items.IndexOf(item))" @ondrop="@(async () => await OnDrop(item))"> <li class="list-group-item list-group-item-hover" draggable=@((!processingDropChange).ToString()) @ondragstart="@(() => itemDraggedIndex = Items.IndexOf(item))" @ondrop="@(async () => await OnDrop(item))">
<div class="d-inline-flex"> <div class="d-inline-flex">
<div class="mr-3"> <div class="mr-3">
<button class="btn" type="button" style="padding: 0px;" @onclick="@(() => OnButtonClickMove(Items.IndexOf(item), true))" disabled="@(processingDropChange || Items.IndexOf(item) <= 0)"><span class="oi oi-caret-top"></span></button> <button class="btn" type="button" style="padding: 0px;" @onclick="@(() => OnButtonClickMove(Items.IndexOf(item), true))" disabled="@(processingDropChange || Items.IndexOf(item) <= 0)"><span class="oi oi-caret-top"></span></button>
@@ -33,8 +33,6 @@
[Parameter] [Parameter]
public RenderFragment<TItem> DraggableItem { get; set; } public RenderFragment<TItem> DraggableItem { get; set; }
private ElementReference dragAndDrop;
private int itemDraggedIndex = -1; private int itemDraggedIndex = -1;
private bool processingDropChange = false; private bool processingDropChange = false;
@@ -50,14 +48,6 @@
await base.OnParametersSetAsync(); await base.OnParametersSetAsync();
} }
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
await JS.InvokeVoidAsync("dragAndDropList", dragAndDrop);
}
await base.OnAfterRenderAsync(firstRender);
}
private async Task OnDrop(TItem dropped) private async Task OnDrop(TItem dropped)

1
src/MultiShop/Client/wwwroot/index.html
View File

@@ -20,7 +20,6 @@
<a class="dismiss">🗙</a> <a class="dismiss">🗙</a>
</div> </div>
<script src="js/ComponentsSupport.js"></script>
<script src="_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script> <script src="_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script>
<script src="_framework/blazor.webassembly.js"></script> <script src="_framework/blazor.webassembly.js"></script>
</body> </body>

23
src/MultiShop/Client/wwwroot/js/ComponentsSupport.js
View File

@@ -1,23 +0,0 @@
function dragAndDropList(elem) {
elem.addEventListener("dragover", (e) => {
e.preventDefault();
});
let itemDragged;
for (let i = 0; i < elem.childElementCount; i++) {
let e = elem.children[i];
e.addEventListener("dragstart", () => {
itemDragged = e;
e.classList.add("list-group-item-secondary");
});
e.addEventListener("dragenter", () => {
e.classList.add("list-group-item-primary");
});
e.addEventListener("dragleave", () => {
e.classList.remove("list-group-item-primary");
});
e.addEventListener("drop", () => {
e.classList.remove("list-group-item-primary");
itemDragged.classList.remove("list-group-item-secondary");
});
}
}