move premium selector
This commit is contained in:
parent
8449b74dc7
commit
82778b91ca
3 changed files with 30 additions and 31 deletions
|
|
@ -11,7 +11,7 @@
|
|||
max-width: 30%;
|
||||
}
|
||||
|
||||
#premium-selector-area {
|
||||
.premium-selector-area {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
width: 50px;
|
||||
}
|
||||
|
||||
#premium-selector-area {
|
||||
.premium-selector-area {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
|
|
@ -261,7 +261,7 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
#premium-selector-area {
|
||||
.premium-selector-area {
|
||||
margin-left: auto;
|
||||
margin-right: 5%;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ class PremiumSelector {
|
|||
render() {
|
||||
const premiumSelectorArea = document.createElement('div');
|
||||
premiumSelectorArea.id = this.id;
|
||||
premiumSelectorArea.classList = 'premium-selector-area';
|
||||
|
||||
const premiumValue = document.createElement('div');
|
||||
premiumValue.id = 'premium-value';
|
||||
|
|
|
|||
|
|
@ -57,8 +57,6 @@ class CreateOfferModal {
|
|||
this.buyOrSellButtonGroup.render();
|
||||
controls.appendChild(buyOrSellDiv);
|
||||
|
||||
breaks();
|
||||
//Continue moving components up here
|
||||
const premiumDiv = document.createElement('div');
|
||||
premiumDiv.id = 'premium-area';
|
||||
premiumDiv.className = 'create-offer-step';
|
||||
|
|
@ -70,6 +68,32 @@ class CreateOfferModal {
|
|||
premiumDiv.appendChild(premiumContentDiv);
|
||||
controls.appendChild(premiumDiv);
|
||||
|
||||
const createOfferEventBus = new EventTarget();
|
||||
|
||||
const mockPriceProvidingCallback = () => {
|
||||
return Math.floor(Math.random() * (95000 - 70000 + 1) + 70000);
|
||||
};
|
||||
|
||||
this.premiumSelector = new PremiumSelector({
|
||||
parentElement: premiumContentDiv,
|
||||
eventSink: createOfferEventBus,
|
||||
});
|
||||
this.premiumSelector.render();
|
||||
|
||||
const priceDisplay = new PriceDisplay({
|
||||
parentElement: premiumContentDiv,
|
||||
id: 'premium-price-display-area',
|
||||
premiumProvidingCallback: () => {
|
||||
return this.premiumSelector.getPremium();
|
||||
},
|
||||
priceProvidingCallback: mockPriceProvidingCallback,
|
||||
});
|
||||
priceDisplay.render();
|
||||
createOfferEventBus.addEventListener('premium-changed', () => {
|
||||
priceDisplay.updatePrices();
|
||||
});
|
||||
|
||||
//Continue moving components up here
|
||||
const amountDiv = document.createElement('div');
|
||||
amountDiv.id = 'amount-area';
|
||||
amountDiv.className = 'create-offer-step';
|
||||
|
|
@ -148,32 +172,6 @@ class CreateOfferModal {
|
|||
|
||||
this.parentElement.appendChild(this.element);
|
||||
|
||||
const createOfferEventBus = new EventTarget();
|
||||
|
||||
const mockPriceProvidingCallback = () => {
|
||||
return Math.floor(Math.random() * (95000 - 70000 + 1) + 70000);
|
||||
};
|
||||
|
||||
this.premiumSelector = new PremiumSelector({
|
||||
parentElement: document.getElementById('premium-content-area'),
|
||||
id: 'premium-selector-area',
|
||||
eventSink: createOfferEventBus,
|
||||
});
|
||||
this.premiumSelector.render();
|
||||
|
||||
const priceDisplay = new PriceDisplay({
|
||||
parentElement: document.getElementById('premium-content-area'),
|
||||
id: 'premium-price-display-area',
|
||||
premiumProvidingCallback: () => {
|
||||
return this.premiumSelector.getPremium();
|
||||
},
|
||||
priceProvidingCallback: mockPriceProvidingCallback,
|
||||
});
|
||||
priceDisplay.render();
|
||||
createOfferEventBus.addEventListener('premium-changed', () => {
|
||||
priceDisplay.updatePrices();
|
||||
});
|
||||
|
||||
this.amountInput = new AmountInput({
|
||||
parentElement: document.getElementById('amount-area'),
|
||||
id: 'amount-area-content',
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue