Mango.Nop.Plugins/Nop.Plugin.Misc.AuctionPlugin/Views/PublicProductBidBox.cshtml

538 lines
22 KiB
Plaintext

@using Nop.Plugin.Misc.AuctionPlugin.Domains.Enums
@using Nop.Web.Framework.TagHelpers.Shared
@model ProductBidBoxViewModel
@* @inject IJsonHelper JsonHelper; *@
@* @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(myObj) as String) *@
@{
if (!Model.IsGuest)
{
if (Model.FirstProductToAuction != null)
{
var bgClass = Model.FirstProductToAuction.WinnerCustomerId == Model.CustomerId ? "bg-success" : "bg-primary";
var bidButtonActive = Model.IsItemActive && (Model.FirstProductToAuction.WinnerCustomerId != Model.CustomerId || Model.IsAdmin);
var auctionStatus = Model.FirstProductToAuction.AuctionStatus;
var lastBidIsMine = Model.FirstProductToAuction.WinnerCustomerId == Model.CustomerId;
var title = auctionStatus switch
{
AuctionStatus.Sold => lastBidIsMine ? @T("Plugins.Misc.AuctionPlugin.YouWin") : @T("Plugins.Misc.AuctionPlugin.Sold"),
AuctionStatus.NotSold => @T("Plugins.Misc.AuctionPlugin.Finished"),
_ => lastBidIsMine ? @T("Plugins.Misc.AuctionPlugin.YourBidLeading") : @T("Plugins.Misc.AuctionPlugin.PlaceABid")
};
<div class="d-flex justify-content-between" id="otherAuctionItems">
<a href="@(string.IsNullOrEmpty(Model.LastProductUrl) ? "#" : Model.LastProductUrl)" @(string.IsNullOrEmpty(Model.LastProductUrl) ? "disabled" : string.Empty)>
<div class="card mb-3" style="max-width: 540px;">
<div class="row g-0">
<div class="col-md-4">
<img src="@(string.IsNullOrEmpty(Model.LastProductImageUrl) ? "https://placehold.co/400" : Model.LastProductImageUrl)" class="img-fluid rounded-start" alt="...">
</div>
<div class="col-md-8">
<div class="card-body">
<h5 class="card-title">@(string.IsNullOrEmpty(Model.LastProductUrl) ? @T("Plugins.Misc.AuctionPlugin.StartOfList") : @T("Plugins.Misc.AuctionPlugin.BackToLast"))</h5>
<p class="card-text">@(string.IsNullOrEmpty(Model.LastProductName) ? "---" : Model.LastProductName)</p>
</div>
</div>
</div>
</div>
</a>
<a href="@(string.IsNullOrEmpty(Model.NextProductUrl) ? "#" : Model.NextProductUrl)" @(string.IsNullOrEmpty(Model.NextProductUrl) ? "disabled" : string.Empty)>
<div class="card mb-3" style="max-width: 540px;">
<div class="row g-0">
<div class="col-md-4">
<img src="@(string.IsNullOrEmpty(Model.NextProductImageUrl) ? "https://placehold.co/400" : Model.NextProductImageUrl)" class="img-fluid rounded-start" alt="...">
</div>
<div class="col-md-8">
<div class="card-body">
<h5 class="card-title">@(string.IsNullOrEmpty(Model.NextProductUrl) ? @T("Plugins.Misc.AuctionPlugin.EndOfList") : @T("Plugins.Misc.AuctionPlugin.ComingUp"))</h5>
<p class="card-text">@(string.IsNullOrEmpty(Model.NextProductName) ? "---" : Model.NextProductName)</p>
</div>
</div>
</div>
</div>
</a>
</div>
<div id="publicProductBidBox" class="p-3 @bgClass text-white">
<strong>#@(Model.AuctionDto.ProductToAuctionDtos.FirstOrDefault().SortIndex)</strong>
<h4 id="bidBoxTitle">@title</h4>
<div class="d-flex justify-content-between">
<div class="m-auto">
<strong>Base Price:</strong>
<span class="value">
@($"{Model.BasePrice:c}")
@* @(decimal?.Round(Model.BasePrice, 2, MidpointRounding.AwayFromZero)) *@
</span>
</div>
<div class="m-auto">
<strong>Bid Step:</strong>
<span id="licitStepText" class="value">@($"{Model.LicitStep:c}")</span>
</div>
<div class="m-auto">
<button id="signalRBidButton" class="btn btn-success" style="text-transform: uppercase;" type="button" @(!bidButtonActive ? "disabled" : string.Empty)>
@T("Plugins.Misc.AuctionPlugin.BidButtonPrefix") @($"{Model.NextBidPrice:c}")
</button>
@* <button id="bidButton" class="btn btn-success">
Bid @String.Format("{0:c}", Model.NextBidPrice)
</button> *@
</div>
</div>
@* <button id="testButton" class="btn btn-success">
TestButton
</button> *@
<div id="bidFeedback" class="mt-3"></div>
</div>
if (Model.IsAdmin)
{
<div id="publicProductBidBoxAdmin" class="p-3 bg-secondary text-white">
<h4>Manage auction!</h4>
<div id="bidBoxAdminButtons" class="d-flex justify-content-between mb-3">
<div>
<button id="signalROpenItemButton" class="btn btn-primary" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus == AuctionStatus.None || Model.AuctionStatus == AuctionStatus.Pause ? string.Empty : "disabled hidden")>
Open item
</button>
<button id="signalRPauseItemButton" class="btn btn-warning" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus == AuctionStatus.Active || Model.AuctionStatus == AuctionStatus.FirstWarning || Model.AuctionStatus == AuctionStatus.SecondWarning ? string.Empty : "disabled hidden")>
Pause auction
</button>
<button id="signalRRevertBidButton" class="btn btn-warning" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus != AuctionStatus.Pause ? "disabled hidden" : string.Empty)>
Revert bid
</button>
<button id="signalRResetItemButton" class="btn btn-danger" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus != AuctionStatus.Pause ? "disabled hidden" : string.Empty)>
Reset auction
</button>
</div>
<div>
<button id="signalRFirstWarningButton" class="btn btn-warning" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus != AuctionStatus.Active ? "disabled hidden" : string.Empty)>
First warning
</button>
<button id="signalRSecondWarningButton" class="btn btn-danger" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus != AuctionStatus.FirstWarning ? "disabled hidden" : string.Empty)>
Second warning
</button>
<button id="signalRCloseItemButton" class="btn btn-success" style="text-transform: uppercase;" type="button" @(Model.AuctionStatus != AuctionStatus.SecondWarning ? "disabled hidden" : string.Empty)>
Finished
</button>
</div>
</div>
</div>
}
else
{
// <p>No access to admin level buttons</p>
}
}
}
else
{
<div id="publicProductBidBoxGuest" class="p-3 bg-primary text-white">
<h4>This item is under auction!</h4>
<div id="bidBoxGuestMessage" class="d-flex justify-content-between mb-3">
<p>@T("Plugins.Misc.AuctionPlugin.PleaseLogInOrRegister")</p>
</div>
</div>
}
}
<script>
var bidBoxPageViewModel;
$(window).load(function () {
try {
bidBoxPageViewModel = @Html.Raw(Json.Serialize(Model));
}
catch (e) {
console.log(e); // Logs the error
}
console.log("bidBoxPageViewModel " + bidBoxPageViewModel);
console.log(bidBoxPageViewModel.WidgetZone);
console.log(typeof sendMessageToServer);
$("#signalRBidButton").on("click", function () {
document.getElementById("signalRBidButton").disabled = true;
event.preventDefault();
if (!bidBoxPageViewModel) {
console.log("we need viewmodel data");
bidBoxPageViewModel = @Html.Raw(Json.Serialize(Model));
}
var bidMessage = {
ProductAuctionMappingId: bidBoxPageViewModel.ProductToAuctionId,
AuctionId: bidBoxPageViewModel.AuctionId,
BidPrice: bidBoxPageViewModel.NextBidPrice,
ProductId: bidBoxPageViewModel.ProductId,
CustomerId: bidBoxPageViewModel.CustomerId
};
var content = JSON.stringify(bidMessage);
console.log("WTF " + content);
sendMessageToServer("BidRequestMessage", bidBoxPageViewModel.CustomerId, content);
return false;
});
$("#signalROpenItemButton").on("click", function () {
document.getElementById("signalROpenItemButton").disabled = true;
event.preventDefault();
sendAuctionStatusChange(AuctionStatus.Active);
return false;
});
$("#signalRCloseItemButton").on("click", function () {
document.getElementById("signalRCloseItemButton").disabled = true;
event.preventDefault();
sendAuctionStatusChange(AuctionStatus.Sold);
return false;
});
$("#signalRFirstWarningButton").on("click", function () {
document.getElementById("signalRFirstWarningButton").disabled = true;
event.preventDefault();
sendAuctionStatusChange(AuctionStatus.FirstWarning);
return false;
});
$("#signalRSecondWarningButton").on("click", function () {
document.getElementById("signalRSecondWarningButton").disabled = true;
event.preventDefault();
sendAuctionStatusChange(AuctionStatus.SecondWarning);
return false;
});
$("#signalRPauseItemButton").on("click", function () {
document.getElementById("signalRPauseItemButton").disabled = true;
event.preventDefault();
sendAuctionStatusChange(AuctionStatus.Pause);
return false;
});
$("#signalRRevertBidButton").on("click", function () {
document.getElementById("signalRRevertBidButton").disabled = true;
event.preventDefault();
if (!bidBoxPageViewModel) {
console.log("we need viewmodel data");
bidBoxPageViewModel = @Html.Raw(Json.Serialize(Model));
}
var revertMessage = {
ProductToAuctionId: bidBoxPageViewModel.ProductToAuctionId,
};
var content = JSON.stringify(revertMessage);
console.log("WTF " + content);
sendMessageToServer("RevertAuctionBidRequest", bidBoxPageViewModel.CustomerId, content);
return false;
});
$("#signalRResetItemButton").on("click", function () {
document.getElementById("signalRResetItemButton").disabled = true;
event.preventDefault();
sendAuctionStatusChange(AuctionStatus.None);
return false;
});
//var status = bidBoxPageViewModel.auctionDto.productToAuctionDtos[0].auctionStatus;
//setButtons(status);
});
function sendAuctionStatusChange(auctionStatus) {
// Create the message object
var auctionMessage = {
ProductToAuctionId: bidBoxPageViewModel.ProductToAuctionId,
AuctionStatus: auctionStatus
};
// Convert to JSON and log
var content = JSON.stringify(auctionMessage);
console.log(content);
// Send the message via SignalR
sendMessageToServer("AuctionProductStatusRequest", bidBoxPageViewModel.CustomerId, content);
return false;
}
function SendRevertAuctionBidRequest() {
var revertButtonElement = document.getElementById("signalRRevertBidButton");
revertButtonElement.disabled = true;
sendMessageServer("RevertAuctionBidRequest", bidBoxPageViewModel.ProductToAuctionId);
}
function refreshPublicBidBox(data) {
//TODO: is it for me?
// if () {
// data.AuctionDto.
// }
var widgetPriceElement = document.getElementById("price-value-" + bidBoxPageViewModel.ProductId);
var bidButtonElement = document.getElementById("signalRBidButton");
var licitStepElement = document.getElementById("licitStepText");
var bidBox = document.getElementById("publicProductBidBox");
var bidBoxTitle = document.getElementById("bidBoxTitle");
console.log(data);
let auctionDto = data.auctionDto;
let productToAuction = auctionDto.productToAuctionDtos[0];
var productAuctionMappingId = productToAuction.id;
var winnerId = productToAuction.winnerCustomerId;
var isMyBid;
if (winnerId == bidBoxPageViewModel.CustomerId) {
isMyBid = true;
}
console.log(productAuctionMappingId);
//TODO: TESZT STATUS!!! - JTEST.
var status = data.auctionDto.productToAuctionDtos[0].auctionStatus;
//var status = AuctionStatus.TEST;
//if (status == AuctionStatus.FirstWarning) {
setButtons(status);
//}
// if (productAuctionMappingId == bidBoxPageViewModel.ProductToAuctionId) {
// console.log("THIS IS FOR US! SORRY FOR SHOUTING");
// }
if (widgetPriceElement) {
if (productAuctionMappingId == bidBoxPageViewModel.ProductToAuctionId) {
console.log("THIS IS FOR US! SORRY FOR SHOUTING");
widgetPriceElement.textContent = HUFFormatter.format(data.currentPrice); // Update the price
licitStepElement.textContent = HUFFormatter.format(data.nextStepAmount);
bidBoxPageViewModel.NextBidPrice = Number(data.nextBidPrice);
bidButtonElement.disabled = false;
var list;
if (isMyBid) {
console.log("This is my bid");
list = bidBox.classList;
list.add("bg-success");
list.remove("bg-primary");
bidButtonElement.textContent = "@(T("Plugins.Misc.AuctionPlugin.GoodJob"))";
bidBoxTitle.textContent = productToAuction.auctionStatus == AuctionStatus.Sold ? "@(T("Plugins.Misc.AuctionPlugin.YouWin"))" : "@(T("Plugins.Misc.AuctionPlugin.YourBidLeading"))";
if (bidBoxPageViewModel.IsAdmin) {
console.log("I AM WEASEL!!! " + bidBoxPageViewModel.IsAdmin);
bidButtonElement.disabled = false;
}
else {
console.log("I AM NOT WEASEL!!! " + bidBoxPageViewModel.IsAdmin);
bidButtonElement.disabled = true;
}
}
else {
list = bidBox.classList;
list.add("bg-primary");
list.remove("bg-success");
bidBoxTitle.textContent = productToAuction.auctionStatus == AuctionStatus.Sold ? "@(T("Plugins.Misc.AuctionPlugin.Sold"))" : "@(T("Plugins.Misc.AuctionPlugin.PlaceABid"))";
bidButtonElement.textContent = "@(T("Plugins.Misc.AuctionPlugin.BidButtonPrefix")) " + HUFFormatter.format(bidBoxPageViewModel.NextBidPrice);
}
console.log(`WidgetPrice updated to: ${data.currentPrice}, next bid is ${bidBoxPageViewModel.NextBidPrice}`);
//bidButtonElement.disabled = false;
}
else {
console.log("Not for this product");
}
} else {
console.warn("Element with ID 'WidgetPrice' not found in the DOM.");
}
}
function handleAuctionUpdate(data) {
var widgetPriceElement = document.getElementById("price-value-" + bidBoxPageViewModel.ProductId);
var bidBoxTitle = document.getElementById("bidBoxTitle");
var productAuctionMappingId = data.auctionDto.productToAuctionDtos[0].id;
//TODO: TESZT STATUS!!! - JTEST.
var itemStatus = data.auctionDto.productToAuctionDtos[0].auctionStatus;
//var itemStatus = AuctionStatus.TEST;
console.log("handle auction update called" + productAuctionMappingId);
console.log("auction status:" + itemStatus);
if (widgetPriceElement) {
if (productAuctionMappingId == bidBoxPageViewModel.ProductToAuctionId) {
console.log("THIS IS FOR US! SORRY FOR SHOUTING");
if (itemStatus == AuctionStatus.None) {
bidBoxTitle.textContent = "The auction has not started yet";
}
else if (itemStatus == AuctionStatus.Pause) {
bidBoxTitle.textContent = "The auction is paused! Please hold on...";
}
else if (itemStatus == AuctionStatus.FirstWarning) {
bidBoxTitle.textContent = "First warning!";
}
else if (itemStatus == AuctionStatus.SecondWarning) {
bidBoxTitle.textContent = "Second warning! Hurry up!";
}
setButtons(itemStatus);
console.log(`WidgetPrice updated to: ${data.currentPrice}, next bid is ${bidBoxPageViewModel.NextBidPrice}`);
}
else {
console.log("Not for this product");
}
} else {
console.warn("Element with ID 'WidgetPrice' not found in the DOM.");
}
}
function setButtons(auctionStatus) {
console.log("SetButtons called: " + auctionStatus);
// Button IDs and their default states for each AuctionStatus
//true = disabled
var buttonStates = {
[AuctionStatus.None]: {
signalRBidButton: true,
signalRFirstWarningButton: true,
signalRSecondWarningButton: true,
signalROpenItemButton: false,
signalRCloseItemButton: true,
signalRPauseItemButton: true,
signalRRevertBidButton: true,
signalRResetItemButton: true,
},
[AuctionStatus.Active]: {
signalRBidButton: false,
signalRFirstWarningButton: false,
signalRSecondWarningButton: true,
signalROpenItemButton: true,
signalRCloseItemButton: true,
signalRPauseItemButton: false,
signalRRevertBidButton: true,
signalRResetItemButton: true,
},
[AuctionStatus.FirstWarning]: {
signalRBidButton: false,
signalRFirstWarningButton: true,
signalRSecondWarningButton: false,
signalROpenItemButton: true,
signalRCloseItemButton: true,
signalRPauseItemButton: false,
signalRRevertBidButton: true,
signalRResetItemButton: true,
},
[AuctionStatus.SecondWarning]: {
signalRBidButton: false,
signalRFirstWarningButton: true,
signalRSecondWarningButton: true,
signalROpenItemButton: true,
signalRCloseItemButton: false,
signalRPauseItemButton: false,
signalRRevertBidButton: true,
signalRResetItemButton: true,
},
[AuctionStatus.Pause]: {
signalRBidButton: true,
signalRFirstWarningButton: true,
signalRSecondWarningButton: true,
signalROpenItemButton: false,
signalRCloseItemButton: true,
signalRPauseItemButton: true,
signalRRevertBidButton: false,
signalRResetItemButton: false,
},
[AuctionStatus.Sold]: {
signalRBidButton: true,
signalRFirstWarningButton: true,
signalRSecondWarningButton: true,
signalROpenItemButton: true,
signalRCloseItemButton: true,
signalRPauseItemButton: true,
signalRRevertBidButton: true,
signalRResetItemButton: true,
},
[AuctionStatus.NotSold]: {
signalRBidButton: true,
signalRFirstWarningButton: true,
signalRSecondWarningButton: true,
signalROpenItemButton: true,
signalRCloseItemButton: true,
signalRPauseItemButton: true,
signalRRevertBidButton: false,
signalRResetItemButton: false,
},
[AuctionStatus.TEST]: {
signalRBidButton: false,
signalRFirstWarningButton: false,
signalRSecondWarningButton: false,
signalROpenItemButton: false,
signalRCloseItemButton: false,
signalRPauseItemButton: false,
signalRRevertBidButton: false,
signalRResetItemButton: false,
},
};
// Get the states for the given auctionStatus
var states = buttonStates[auctionStatus];
if (!states) {
console.error("Unknown AuctionStatus: ", auctionStatus);
return;
}
// Apply the states to each button
Object.keys(states).forEach((buttonId) => {
var button = document.getElementById(buttonId);
if (button) {
button.disabled = states[buttonId];
button.hidden = states[buttonId];
} else {
console.warn(`Button with ID ${buttonId} not found.`);
}
});
}
</script>