move price display

This commit is contained in:
Pablo Martin 2025-03-17 17:52:15 +01:00
parent a3643ee9d0
commit 865b974f38
2 changed files with 65 additions and 61 deletions

View file

@ -0,0 +1,64 @@
const formatNumberWithSpaces = require('../utils/formatNumbersWithSpaces');
class PriceDisplay {
constructor({
parentElement,
id,
premiumProvidingCallback,
priceProvidingCallback,
}) {
this.element = null;
this.parentElement = parentElement;
this.id = id;
this.premiumProvidingCallback = premiumProvidingCallback;
this.priceProvidingCallback = priceProvidingCallback;
}
render() {
const container = document.createElement('div');
container.id = 'premium-price-display-area';
const offerParagraph = document.createElement('p');
offerParagraph.id = 'offer-price-paragraph';
offerParagraph.textContent = 'Tu precio: ';
const offerSpan = document.createElement('span');
offerSpan.id = 'offer-price';
this.offerPriceSpan = offerSpan;
offerParagraph.appendChild(offerSpan);
offerParagraph.append('€/BTC');
const marketParagraph = document.createElement('p');
marketParagraph.id = 'market-price-paragraph';
marketParagraph.textContent = '(Precio mercado: ';
const marketSpan = document.createElement('span');
marketSpan.id = 'market-price';
this.marketPriceSpan = marketSpan;
marketParagraph.appendChild(marketSpan);
marketParagraph.append('€/BTC)');
container.appendChild(offerParagraph);
container.appendChild(marketParagraph);
this.updatePrices();
this.element = container;
this.parentElement.appendChild(this.element);
}
updatePrices() {
const marketPrice = this.priceProvidingCallback();
const marketPriceString = formatNumberWithSpaces(marketPrice);
const offerPriceString = formatNumberWithSpaces(
Math.round(marketPrice * (1 + this.premiumProvidingCallback()))
);
this.marketPriceSpan.innerText = marketPriceString;
this.offerPriceSpan.innerText = offerPriceString;
}
}
module.exports = PriceDisplay;

View file

@ -2,67 +2,7 @@ const formatNumberWithSpaces = require('../utils/formatNumbersWithSpaces');
const PublishOfferButton = require('../components/PublishOfferButton');
const BuyOrSellButtonGroup = require('../components/BuyOrSellButtonGroup');
const PremiumSelector = require('../components/PremiumSelector');
class PriceDisplay {
constructor({
parentElement,
id,
premiumProvidingCallback,
priceProvidingCallback,
}) {
this.element = null;
this.parentElement = parentElement;
this.id = id;
this.premiumProvidingCallback = premiumProvidingCallback;
this.priceProvidingCallback = priceProvidingCallback;
}
render() {
const container = document.createElement('div');
container.id = 'premium-price-display-area';
const offerParagraph = document.createElement('p');
offerParagraph.id = 'offer-price-paragraph';
offerParagraph.textContent = 'Tu precio: ';
const offerSpan = document.createElement('span');
offerSpan.id = 'offer-price';
this.offerPriceSpan = offerSpan;
offerParagraph.appendChild(offerSpan);
offerParagraph.append('€/BTC');
const marketParagraph = document.createElement('p');
marketParagraph.id = 'market-price-paragraph';
marketParagraph.textContent = '(Precio mercado: ';
const marketSpan = document.createElement('span');
marketSpan.id = 'market-price';
this.marketPriceSpan = marketSpan;
marketParagraph.appendChild(marketSpan);
marketParagraph.append('€/BTC)');
container.appendChild(offerParagraph);
container.appendChild(marketParagraph);
this.updatePrices();
this.element = container;
this.parentElement.appendChild(this.element);
}
updatePrices() {
const marketPrice = this.priceProvidingCallback();
const marketPriceString = formatNumberWithSpaces(marketPrice);
const offerPriceString = formatNumberWithSpaces(
Math.round(marketPrice * (1 + this.premiumProvidingCallback()))
);
this.marketPriceSpan.innerText = marketPriceString;
this.offerPriceSpan.innerText = offerPriceString;
}
}
const PriceDisplay = require('../components/PriceDisplay');
function offersPage() {
const createOfferEventBus = new EventTarget();