-
Notifications
You must be signed in to change notification settings - Fork 0
/
utils.js
89 lines (75 loc) · 3.16 KB
/
utils.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
import {LoadWeaponStats} from "./weaponStats.js";
import {LoadAgentStats} from "./agentStats.js";
export const getItemsPerPage = (element) => {
return parseInt(getComputedStyle(element).getPropertyValue("--slider-items-per-page"));
}
export const getSliderIndex = (element) => {
return parseInt(getComputedStyle(element).getPropertyValue("--slider-index"));
}
export const getItemCount = (element) => {
return element.querySelectorAll(".slider-item").length;
}
export const addSliderItemToSlider = (slider, imageUrl, imageAlt, item) => {
const sliderContent = slider.querySelector('.slider-content');
const sliderItem = document.createElement("div");
sliderItem.classList.add("slider-item");
const sliderImage = document.createElement("img");
sliderImage.src = imageUrl;
sliderImage.alt = imageAlt;
sliderItem.onclick = function() {
if(item.isPlayableCharacter)
{
LoadAgentStats(item);
}
else
{
LoadWeaponStats(item);
}
};
sliderImage.setAttribute('draggable', 'false');
sliderItem.appendChild(sliderImage);
sliderContent.appendChild(sliderItem);
}
export const addSliderIndexTilesToSlider = (slider, elements) => {
slider.querySelector('.slider-index-indicator').innerHTML = '';
const itemsPerPage = getItemsPerPage(slider);
const pages = Math.ceil(elements.length / itemsPerPage);
for (let i = 0; i < pages; i++) {
const tile = document.createElement("div");
tile.classList.add("slider-index-tile");
if (i === 0) tile.classList.add("active");
slider.querySelector('.slider-index-indicator').appendChild(tile);
}
}
export const incrementSliderIndex = (slider) => {
const itemCount = getItemCount(slider);
const currentIndex = getSliderIndex(slider);
const itemsPerPage = getItemsPerPage(slider);
let newIndex;
if (currentIndex * itemsPerPage + itemsPerPage < itemCount) {
slider.style.setProperty("--slider-index", currentIndex + 1);
newIndex = currentIndex + 1;
}
else {
slider.style.setProperty("--slider-index", 0);
newIndex = 0;
}
slider.querySelector('.slider-index-indicator').querySelectorAll(".slider-index-tile")[currentIndex].classList.remove("active");
slider.querySelector('.slider-index-indicator').querySelectorAll(".slider-index-tile")[newIndex].classList.add("active");
}
export const decrementSliderIndex = (slider) => {
const itemCount = getItemCount(slider);
const currentIndex = getSliderIndex(slider);
const itemsPerPage = getItemsPerPage(slider);
let newIndex;
if (currentIndex * itemsPerPage - itemsPerPage >= 0) {
slider.style.setProperty("--slider-index", currentIndex - 1);
newIndex = currentIndex - 1;
}
else {
slider.style.setProperty("--slider-index", Math.floor(itemCount / itemsPerPage));
newIndex = Math.floor(itemCount / itemsPerPage);
}
slider.querySelector('.slider-index-indicator').querySelectorAll(".slider-index-tile")[currentIndex].classList.remove("active");
slider.querySelector('.slider-index-indicator').querySelectorAll(".slider-index-tile")[newIndex].classList.add("active");
}