-
Notifications
You must be signed in to change notification settings - Fork 4
/
app.js
88 lines (61 loc) · 1.85 KB
/
app.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
let myCheckbox = document.querySelector(".switch input"),
duration = document.querySelector(".month"),
price = document.querySelector(".price .pricefix"),
switcher = document.querySelector(".switch"),
range = document.querySelector(".myrange");
// generate price on switch
switcher.onclick = function(){
if(myCheckbox.checked == true){
let priceInt = parseInt(price.textContent);
price.textContent = `${(priceInt - (priceInt * .25)) * 12}`;
duration.textContent = `/year`;
}else{
refreshPrices();
duration.textContent = `/month`;
}
}
// generate price on range
let pageViews = document.querySelector(".page-views span");
range.addEventListener('input', refreshPrices);
function refreshPrices(){
if(range.value == 1){
if(myCheckbox.checked == true){
price.textContent = `${(8 - (8 * .25)) * 12}`;
}else{
price.textContent = 8;
}
pageViews.textContent = "10k";
}
if(range.value == 2){
if(myCheckbox.checked == true){
price.textContent = 108;
}else{
price.textContent = 12;
}
pageViews.textContent = "50k";
}
if(range.value == 3){
if(myCheckbox.checked == true){
price.textContent = 144;
}else{
price.textContent = 16;
}
pageViews.textContent = "100k";
}
if(range.value == 4){
if(myCheckbox.checked == true){
price.textContent = 216;
}else{
price.textContent = 24;
}
pageViews.textContent = "500k";
}
if(range.value == 5){
if(myCheckbox.checked == true){
price.textContent = 324;
}else{
price.textContent = 36;
}
pageViews.textContent = "1M";
}
}