erikabell/work.js at master · erikaBell/erikabell · GitHub

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
90
91
92
93
94
95
96
97
98
99
100
101
 const workTitle1 = document.getElementById('work-title-1')
 const workTitle2 = document.getElementById('work-title-2')
 const workTitle3 = document.getElementById('work-title-3')
 const workTitle4 = document.getElementById('work-title-4')
 const workTitle5 = document.getElementById('work-title-5')

 const workInfo1 = document.getElementById('work-info-1')
 const workInfo2 = document.getElementById('work-info-2')
 const workInfo3 = document.getElementById('work-info-3')
 const workInfo4 = document.getElementById('work-info-4')
 const workInfo5 = document.getElementById('work-info-5')

 let workInfoArray = [workInfo1, workInfo2, workInfo3, workInfo4, workInfo5]


 workTitle1.addEventListener("click", function(){
	workInfo1.style.display === "none" ? workInfo1.style.display = "block" : workInfo1.style.display = "none"

	//TODO: refactor, make DRY
	if (workInfoArray[1].style.display === 'block') {
		workInfoArray[1].style.display = 'none'
		workInfo1.style.display = "block"
	} else if (workInfoArray[2].style.display === 'block') {
		workInfoArray[2].style.display = 'none'
		workInfo1.style.display = "block"
	} else if (workInfoArray[3].style.display === 'block') {
		workInfoArray[3].style.display = 'none'
		workInfo1.style.display = "block"
	} else if (workInfoArray[4].style.display === 'block') {
		workInfoArray[4].style.display = 'none'
		workInfo1.style.display = "block"
	}
 })
 workTitle2.addEventListener("click", function(){
 	workInfo2.style.display === "none" ? workInfo2.style.display = "block" : workInfo2.style.display = "none"

 	if (workInfoArray[0].style.display === 'block') {
		workInfoArray[0].style.display = 'none'
		workInfo2.style.display = "block"
	} else if (workInfoArray[2].style.display === 'block') {
		workInfoArray[2].style.display = 'none'
		workInfo2.style.display = "block"
	} else if (workInfoArray[3].style.display === 'block') {
		workInfoArray[3].style.display = 'none'
		workInfo2.style.display = "block"
	} else if (workInfoArray[4].style.display === 'block') {
		workInfoArray[4].style.display = 'none'
		workInfo2.style.display = "block"
	}
 })
 workTitle3.addEventListener("click", function(){
 	workInfo3.style.display === "none" ? workInfo3.style.display = "block" : workInfo3.style.display = "none"

 	if (workInfoArray[0].style.display === 'block') {
		workInfoArray[0].style.display = 'none'
		workInfo3.style.display = "block"
	} else if (workInfoArray[1].style.display === 'block') {
		workInfoArray[1].style.display = 'none'
		workInfo3.style.display = "block"
	} else if (workInfoArray[3].style.display === 'block') {
		workInfoArray[3].style.display = 'none'
		workInfo3.style.display = "block"
	} else if (workInfoArray[4].style.display === 'block') {
		workInfoArray[4].style.display = 'none'
		workInfo3.style.display = "block"
	}
 })
 workTitle4.addEventListener("click", function(){
 	workInfo4.style.display === "none" ? workInfo4.style.display = "block" : workInfo4.style.display = "none"

 	if (workInfoArray[0].style.display === 'block') {
		workInfoArray[0].style.display = 'none'
		workInfo4.style.display = "block"
	} else if (workInfoArray[1].style.display === 'block') {
		workInfoArray[1].style.display = 'none'
		workInfo4.style.display = "block"
	} else if (workInfoArray[2].style.display === 'block') {
		workInfoArray[2].style.display = 'none'
		workInfo4.style.display = "block"
	} else if (workInfoArray[4].style.display === 'block') {
		workInfoArray[4].style.display = 'none'
		workInfo4.style.display = "block"
	}
 })
 workTitle5.addEventListener("click", function(){
 	workInfo5.style.display === "none" ? workInfo5.style.display = "block" : workInfo5.style.display = "none"

 	if (workInfoArray[0].style.display === 'block') {
		workInfoArray[0].style.display = 'none'
		workInfo5.style.display = "block"
	} else if (workInfoArray[1].style.display === 'block') {
		workInfoArray[1].style.display = 'none'
		workInfo5.style.display = "block"
	} else if (workInfoArray[2].style.display === 'block') {
		workInfoArray[2].style.display = 'none'
		workInfo5.style.display = "block"
	} else if (workInfoArray[3].style.display === 'block') {
		workInfoArray[3].style.display = 'none'
		workInfo5.style.display = "block"
	}
 })