https://hawk.ru/static/hawk25/js/championship.js

1document.addEventListener("DOMContentLoaded", () => {
2  const conference_tabs = document.querySelectorAll(".championship__tab");
3  const championship_teams = document.querySelectorAll(".championship__team");
4
5  function handleConferenceTabClick(e) {
6    const target = e.currentTarget;
7    if (target.classList.contains("championship__tab--active")) return;
8    conference_tabs.forEach((tab) =>
9      tab.classList.remove("championship__tab--active")
10    );
11    championship_teams.forEach((row) =>
12      row.dataset.conference == target.dataset.conference
13        ? row.classList.remove("championship__team--hidden")
14        : row.classList.add("championship__team--hidden")
15    );
16    document.querySelectorAll(".championship__tab");
17    target.classList.add("championship__tab--active");
18  }
19
20  conference_tabs.forEach((tab) =>
21    tab.addEventListener("click", handleConferenceTabClick)
22  );
23
24  document.querySelectorAll(".playoff-bracket").forEach((bracket) => {
25    const stageBtns = Array.from(
26      bracket.querySelectorAll(".playoff-bracket__stage")
27    );
28    const playoff_pairs = Array.from(
29      bracket.querySelectorAll(".playoff-column")
30    );
31
32    if (!stageBtns.length) return;
33
34    const setActiveStage = (stage) => {
35      stageBtns.forEach((btn) =>
36        btn.classList.toggle(
37          "playoff-bracket__stage--active",
38          btn.dataset.stage == stage
39        )
40      );
41      playoff_pairs.forEach((row) =>
42        row.classList.toggle(
43          "playoff-column--hidden",
44          row.dataset.stage != stage
45        )
46      );
47    };
48
49    stageBtns.forEach((btn) => {
50      const hasContent = playoff_pairs.some(
51        (row) => row.dataset.stage == btn.dataset.stage
52      );
53
54      if (!hasContent) {
55        btn.disabled = true;
56        btn.setAttribute("aria-disabled", "true");
57        btn.classList.remove("playoff-bracket__stage--active");
58      }
59
60      btn.addEventListener("click", function (e) {
61        const target = e.currentTarget;
62        if (
63          target.disabled ||
64          target.classList.contains("playoff-bracket__stage--active")
65        ) {
66          return;
67        }
68        setActiveStage(target.dataset.stage);
69      });
70    });
71
72    const activeStageBtn = stageBtns.find(
73      (btn) =>
74        !btn.disabled &&
75        btn.classList.contains("playoff-bracket__stage--active")
76    );
77    const firstAvailableStageBtn = stageBtns.find((btn) => !btn.disabled);
78    const initialStageBtn = activeStageBtn || firstAvailableStageBtn;
79
80    if (initialStageBtn) {
81      setActiveStage(initialStageBtn.dataset.stage);
82    }
83  });
84
85  const statsSlider = document.querySelector(
86    ".championship__stats-scroll-container"
87  );
88  if (statsSlider) {
89    let isDown = false;
90    let isDragging = false;
91    let startX;
92    let scrollLeft;
93
94    statsSlider.addEventListener("dragstart", (e) => e.preventDefault());
95    statsSlider
96      .querySelectorAll(".championship__stats-card")
97      .forEach((card) => card.setAttribute("draggable", "false"));
98
99    statsSlider.addEventListener("mousedown", (e) => {
100      if (e.button !== 0) return;
101      isDown = true;
102      isDragging = false;
103      statsSlider.classList.add("active");
104      startX = e.pageX - statsSlider.offsetLeft;
105      scrollLeft = statsSlider.scrollLeft;
106    });
107
108    statsSlider.addEventListener("mouseleave", () => {
109      isDown = false;
110      statsSlider.classList.remove("active");
111    });
112
113    statsSlider.addEventListener("mouseup", () => {
114      isDown = false;
115      statsSlider.classList.remove("active");
116    });
117
118    statsSlider.addEventListener("mousemove", (e) => {
119      if (!isDown) return;
120      e.preventDefault();
121      isDragging = true;
122      const x = e.pageX - statsSlider.offsetLeft;
123      const walk = (x - startX) * 1;
124      statsSlider.scrollLeft = scrollLeft - walk;
125    });
126
127    statsSlider
128      .querySelectorAll(".championship__stats-card")
129      .forEach((card) => {
130        card.addEventListener("click", (e) => {
131          if (isDragging) {
132            e.preventDefault();
133          }
134        });
135      });
136  }
137});