https://www.impactpool.org/assets/controllers/campaign_booster_controller-4586158b.js

1import { Controller } from "@hotwired/stimulus";
2
3export default class extends Controller {
4  static targets = ["price", "number", "slider", "freeBooster", "candidates"];
5  static values = {
6    price: Number,
7    discount: Number,
8  };
9
10  connect() {
11    this.updatePrice();
12  }
13
14  updateNumber(event) {
15    this.numberTarget.value = event.target.value;
16    this.candidatesTarget.innerHTML = event.target.value + " candidates";
17
18    this.updatePrice();
19  }
20
21  updateSlider(event) {
22    this.sliderTarget.value = event.target.value;
23    this.candidatesTarget.innerHTML = event.target.value + " candidates";
24
25    this.updatePrice();
26  }
27
28  toggleFreeBooster(_event) {
29    this.updatePrice();
30  }
31
32  updatePrice() {
33    let currentQuantity = this.numberTarget.value;
34    let discountElement = this.hasFreeBoosterTarget ? this.freeBoosterTarget : null;
35    let initialPrice = this.priceValue;
36    let totalPrice = 0;
37
38    if (currentQuantity <= 500) {
39      if (discountElement && discountElement.checked) {
40        totalPrice = initialPrice - this.discountValue;
41      } else {
42        totalPrice = initialPrice;
43      }
44    } else {
45      totalPrice = currentQuantity;
46
47      if (discountElement && discountElement.checked) {
48        totalPrice -= this.discountValue;
49      }
50    }
51
52    if (totalPrice < 0) {
53      totalPrice = 0;
54    }
55
56    if (discountElement && discountElement.checked) {
57      this.priceTarget.innerHTML = `<del>$${totalPrice + this.discountValue}</del> $${totalPrice}`;
58    } else {
59      this.priceTarget.innerHTML = `$${totalPrice}`;
60    }
61  }
62}