https://uflgame.com/wp-content/themes/theme/assets/js/main.js?ver=7.1.2

1document.addEventListener('DOMContentLoaded', () => {
2  const SELECTORS = {
3    header               : '.header',
4    headerMenu           : '.menu.header__menu',
5    headerButtonMenu     : '.button-menu.header__button',
6    lang                 : '.lang.header__lang',
7    langButton           : '.lang__button.header-lang__button',
8    langList             : '.lang__list.header-lang__list',
9    headerDownload       : '.header__download',
10    headerDownloadButton : '.button.button-download',
11    headerDownloadList   : '.header-download__list',
12    popup                : '.popup',
13    popupContent         : '.content.popup__content',
14    popupButton          : 'button.popup__button',
15    popupButtonClose     : 'button.popup__button-close',
16    select               : 'select.select'
17  }
18
19
20
21  const body                 = document.body
22  const header               = document.querySelector(SELECTORS.header)
23  const headerMenu           = document.querySelector(SELECTORS.headerMenu)
24  const headerButtonMenu     = document.querySelector(SELECTORS.headerButtonMenu)
25  const langSource           = document.querySelectorAll(SELECTORS.lang)
26  const lang                 = []
27  const headerDownload       = document.querySelector(SELECTORS.headerDownload)
28  const headerDownloadButton = document.querySelector(SELECTORS.headerDownloadButton)
29  const headerDownloadList   = document.querySelector(SELECTORS.headerDownloadList)
30  const popupSource          = document.querySelectorAll(SELECTORS.popup)
31  const popup                = []
32  const selectSource         = document.querySelectorAll(SELECTORS.select)
33  const select               = []
34
35
36
37  // HEADER STATE
38  function headerStateToggle(e) {
39    const scrollTop = window.scrollY || document.documentElement.scrollTop
40
41    if(scrollTop > 0) {
42      header.classList.add('active')
43    } else {
44      header.classList.remove('active')
45    }
46  }
47  //
48
49
50
51  // MENU
52  function headerMenuToggle(e) {
53    if(headerMenu.classList.contains('active') || headerButtonMenu.classList.contains('active')) {
54      headerMenu.classList.remove('active')
55      headerButtonMenu.classList.remove('active')
56      body.classList.remove('fixed')
57    } else if(!headerMenu.classList.contains('active') || !headerButtonMenu.classList.contains('active')) {
58      headerMenu.classList.add('active')
59      headerButtonMenu.classList.add('active')
60      body.classList.add('fixed')
61    }
62  }
63  //
64
65
66
67  // LANG
68  function langToggle(e) {
69    const _this = this
70    const target = lang[lang.findIndex(item => item.button == _this)]
71    if(target.list.classList.contains('active') || target.button.classList.contains('active')) {
72      target.list.classList.remove('active')
73      target.button.classList.remove('active')
74    } else if(!target.list.classList.contains('active') || !target.button.classList.contains('active')) {
75      target.list.classList.add('active')
76      target.button.classList.add('active')
77    }
78  }
79  //
80
81
82
83  // HEADER DOWNLOAD
84  function headerDownloadToggle(e) {
85    if(headerDownload.classList.contains('active')) {
86      headerDownload.classList.remove('active')
87    } else if(!headerDownload.classList.contains('active')) {
88      headerDownload.classList.add('active')
89    }
90  }
91  //
92
93
94
95  // CHECK OPEN DROPDOWNS
96  function checkDropdowns(e) {
97    if(!e.target.closest(SELECTORS.headerMenu) && !e.target.closest(SELECTORS.headerButtonMenu)) {
98      if(headerMenu && headerButtonMenu) {
99        if(headerMenu.classList.contains('active') || headerButtonMenu.classList.contains('active')) {
100          headerMenu.classList.remove('active')
101          headerButtonMenu.classList.remove('active')
102          body.classList.remove('fixed')
103        }
104      }
105    }
106    
107    if(!e.target.closest(SELECTORS.langList) && !e.target.closest(SELECTORS.langButton)) {
108      if(langSource.length > 0) {
109        lang.forEach(item => {
110          if(item.list.classList.contains('active') || item.button.classList.contains('active')) {
111            item.list.classList.remove('active')
112            item.button.classList.remove('active')
113          }
114        })
115      }
116    }
117
118    if(!e.target.closest(SELECTORS.headerDownload) && !e.target.closest(SELECTORS.headerDownloadButton)) {
119      if(headerDownload && headerDownloadButton) {
120        if(headerDownload.classList.contains('active')) {
121          headerDownload.classList.remove('active')
122        }
123      }
124    }
125  }
126  //
127
128
129
130  // POPUP
131  function popupClose(e) {
132    const currentTarget = e.currentTarget
133    if(!currentTarget) return
134
135    const root = currentTarget.closest('.popup')
136    if(!root) return
137    if(!root.classList.contains('active')) return
138
139    if(currentTarget.classList.contains('popup')) {
140      if(e.target.classList.contains('popup__content') || e.target.closest('.popup__content')) return
141    }
142
143    root.classList.remove('active')
144  }
145  //
146
147
148
149  // HEADER INIT
150  if(header) {
151    document.addEventListener('scroll', headerStateToggle)
152  }
153  //
154
155
156
157  // HEADER MENU INIT
158  if(headerMenu && headerButtonMenu) {
159    headerButtonMenu.addEventListener('click', headerMenuToggle)
160  }
161  //
162
163
164
165  // HEADER LANG INIT
166  if(langSource.length > 0) {
167    langSource.forEach(item => {
168      lang.push({
169        root   : item,
170        button : item.querySelector(SELECTORS.langButton),
171        list   : item.querySelector(SELECTORS.langList)
172      })
173      item.querySelector(SELECTORS.langButton).addEventListener('click', langToggle)
174    })
175  }
176  //
177
178
179
180  // HEADER DOWNLOAD INIT
181  if(headerDownload && headerDownloadButton && headerDownloadList) {
182    headerDownloadButton.addEventListener('click', headerDownloadToggle)
183  }
184  //
185
186
187
188  // POPUP INIT
189  if(popupSource.length > 0) {
190    popupSource.forEach(item => {
191      const _button      = item.querySelector(SELECTORS.popupButton) ?? null
192      const _buttonClose = item.querySelector(SELECTORS.popupButtonClose) ?? null
193
194      popup.push({
195        root        : item,
196        button      : _button,
197        buttonClose : _buttonClose
198      })
199
200      item.addEventListener('click', popupClose)
201      if(_button) _button.addEventListener('click', popupClose)
202      if(_buttonClose) _buttonClose.addEventListener('click', popupClose)
203    })
204  }
205  //
206
207
208
209  // SELECT INIT
210  if(selectSource.length > 0) {
211    selectSource.forEach(item => {
212      select.push({
213        root   : item,
214        option : item.querySelectorAll('option')
215      })
216    })
217  }
218  //
219
220
221
222  // TOTAL INIT
223  if(body) body.addEventListener('click', checkDropdowns)
224  //
225})