-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathhome.js
More file actions
130 lines (113 loc) · 4.55 KB
/
home.js
File metadata and controls
130 lines (113 loc) · 4.55 KB
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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
/* eslint-disable no-unused-vars */
const featuredSpeakers = [
{
name: 'yochai Benkler',
photo: 'images/pf1.jpg',
position: 'program Manager Live Alive',
description: `Lorem ipsum dolor sit amet consectetur adipisicing elit.
Labore, saepe molestias. Nemo animi, quaerat voluptatem recusandae tenetur a`,
},
{
name: 'kilnam Chon',
photo: 'images/pf2.jpg',
position: '',
description: `Est dolores sit ea labore tempor Eirmod sadipscing sed et est vero vero invidunt.
Vero consetetur ipsum voluptua no Lorem kasd diam ipsum eos nonumy ut diam accusam kasd. Est invidunt`,
},
{
name: 'SohYeong Noh',
photo: 'images/pf3.jpg',
position: 'Director of Art Center Nabi and a board member of Live Alive',
description: `Est dolores sit ea labore tempor Eirmod sadipscing sed et est vero vero invidunt.
Vero consetetur ipsum voluptua no Lorem kasd diam ipsum eos nonumy ut diam accusam kasd. Est invidunt`,
},
{
name: 'Julia Leda',
photo: 'images/pf4.jpg',
position: 'President of Young Pirates of Europe',
description: `Est dolores sit ea labore tempor Eirmod sadipscing sed et est vero vero invidunt.
Vero consetetur ipsum voluptua no Lorem kasd diam ipsum eos nonumy ut diam accusam kasd. Est invidunt`,
},
{
name: 'Lila Tretikov',
photo: 'images/pf5.jpg',
position: 'Executive Director of the Wikipedia Foundation',
description: `Est dolores sit ea labore tempor Eirmod sadipscing sed et est vero vero invidunt.
Vero consetetur ipsum voluptua no Lorem kasd diam ipsum eos nonumy ut diam accusam kasd. Est invidunt`,
},
{
name: 'Ryan Merkley',
photo: 'images/pf6.jpg',
position: 'CEO of LiveLive, ex COO of thr Moxilla Foundation',
description: `Est dolores sit ea labore tempor Eirmod sadipscing sed et est vero vero invidunt.
Vero consetetur ipsum voluptua no Lorem kasd diam ipsum eos nonumy ut diam accusam kasd. Est invidunt`,
},
];
function showBottom() {
document.querySelector('.partners').classList.remove('m-hidden');
document.querySelector('.bottom').classList.remove('m-hidden');
}
const container = document.querySelector('.featured-speakers .speakers');
const isMobile = window.matchMedia('all and (max-width: 768px)').matches;
function showSpeakers(override = false) {
featuredSpeakers.every((speaker, index) => {
const draftImg = document.createElement('img');
draftImg.src = 'images/draft.jpg';
draftImg.alt = 'draft pic';
const img = document.createElement('img');
img.src = speaker.photo;
img.alt = 'profile pic';
const profileDv = document.createElement('div');
profileDv.classList.add('profile');
profileDv.appendChild(draftImg);
profileDv.appendChild(img);
const h = document.createElement('h3');
h.innerText = speaker.name;
const p1 = document.createElement('p');
p1.classList.add('position');
p1.innerText = speaker.position;
const p2 = document.createElement('p');
p2.classList.add('spliter');
const p3 = document.createElement('p');
p3.classList.add('description');
p3.innerText = speaker.description;
const biodataDv = document.createElement('div');
biodataDv.classList.add('biodata');
biodataDv.appendChild(h);
biodataDv.appendChild(p1);
biodataDv.appendChild(p2);
biodataDv.appendChild(p3);
const speakerDv = document.createElement('div');
speakerDv.classList.add('speaker');
speakerDv.appendChild(profileDv);
speakerDv.appendChild(biodataDv);
if (isMobile && index > 1 && override === false) {
const icon = document.createElement('i');
icon.classList.add('fa', 'fa-chevron-down', 'icon');
icon.setAttribute('aria-hidden', 'true');
const input = document.createElement('input');
input.classList.add('input-field');
input.setAttribute('type', 'text');
input.setAttribute('placeholder', 'MORE');
const inputSpeakers = document.createElement('div');
inputSpeakers.classList.add('input-speakers');
inputSpeakers.appendChild(icon);
inputSpeakers.appendChild(input);
const speakerBtn = document.createElement('div');
speakerBtn.classList.add('speaker-btn');
speakerBtn.appendChild(inputSpeakers);
speakerBtn.addEventListener('click', () => {
container.innerHTML = '';
showBottom();
showSpeakers(true);
});
container.appendChild(speakerBtn);
return false;
}
container.appendChild(speakerDv);
return true;
});
}
window.addEventListener('DOMContentLoaded', (event) => {
showSpeakers();
});