Skip to content

Commit 0cb268f

Browse files
GrouvexGrouvex
authored
Update index.js
1 parent dc3b02d commit 0cb268f

File tree

1 file changed

+85
-176
lines changed

1 file changed

+85
-176
lines changed

‎index.js‎

Lines changed: 85 additions & 176 deletions
Original file line numberDiff line numberDiff line change
@@ -3,76 +3,20 @@ window.addEventListener('load', function() {
33
// Llama a todas las funciones que quieres ejecutar cuando se carga la página
44
showNotification();openNav();closeNav();
55
flower();sol();leaf();nieve();
6+
cookies();acceptCookies();declineCookies();
67
jurassicworld();starwars();taylorswift();
7-
cookies();
88
});
99

10-
function cookies() {
11-
var acceptedCookies = localStorage.getItem('acceptedCookies');
12-
if (!acceptedCookies) {
13-
document.getElementById('cookieBanner').style.display = 'block';
14-
} else {
15-
acceptCookies();
16-
}
17-
};
18-
19-
function acceptCookies() {
20-
localStorage.setItem('acceptedCookies', true);
21-
document.getElementById('cookieBanner').style.display = 'none';
22-
}
23-
24-
function declineCookies() {
25-
// Aquí puedes redirigir al usuario a una página diferente o cambiar el comportamiento de tu sitio según sea necesario
26-
document.getElementById('cookieBanner').style.display = 'none';
27-
}
28-
2910
function openNav() {
3011
document.getElementById("mySidenav").style.width = "250px";
3112
}
32-
3313
function closeNav() {
3414
document.getElementById("mySidenav").style.width = "0";
3515
}
36-
3716
function showNotification() {
3817
document.getElementById("notification").style.display = "block";
3918
}
4019

41-
function starwars() {
42-
var date = new Date();
43-
var startStarWarsWeek = new Date(date.getFullYear(), 4, 4); // 4 de mayo
44-
var endStarWarsWeek = new Date(date.getFullYear(), 4, 14); // 14 de mayo
45-
46-
if (date >= startStarWarsWeek && date <= endStarWarsWeek) {
47-
document.querySelector('#themeSelect option[value="starwars"]').classList.remove('hiddenOption');
48-
} else {
49-
document.querySelector('#themeSelect option[value="starwars"]').classList.add('hiddenOption');
50-
}
51-
};
52-
function jurassicworld() {
53-
var date = new Date();
54-
var startJurassicWorldWeek = new Date(date.getFullYear(), 5, 10); // 10 de Junio
55-
var endJurassicWorldWeek = new Date(date.getFullYear(), 5, 20); // 20 de Junio
56-
57-
if (date >= startJurassicWorldWeek && date <= endJurassicWorldWeek) {
58-
document.querySelector('#themeSelect option[value="jurassicworld"]').classList.remove('hiddenOption');
59-
} else {
60-
document.querySelector('#themeSelect option[value="jurassicworld"]').classList.add('hiddenOption');
61-
}
62-
};
63-
64-
function taylorswift() {
65-
var date = new Date();
66-
var startTaylorSwiftWeek = new Date(date.getFullYear(), 11, 13); // 13 de Diciembre
67-
var endTaylorSwiftWeek = new Date(date.getFullYear(), 11, 23); // 23 de Diciembre
68-
69-
if (date >= startTaylorSwiftWeek && date <= endTaylorSwiftWeek) {
70-
document.querySelector('#themeSelect option[value="taylorswift"]').classList.remove('hiddenOption');
71-
} else {
72-
document.querySelector('#themeSelect option[value="taylorswift"]').classList.add('hiddenOption');
73-
}
74-
};
75-
7620
function flower() {
7721
var today = new Date();
7822
var month = today.getMonth();
@@ -150,128 +94,93 @@ function nieve() {
15094
}
15195
}
15296
}
153-
var videos = [
154-
{id: 'x09D-9ZpF_o',
155-
title: `Stars In The Starry Sky`,
156-
description: 'Descripción 1',
157-
credits:
158-
`<p>Director: Grouvex</p>
159-
<p>Productor: Grouvex Studio</p>
160-
<p>2023 Grouvex Studio</p>`},
161-
{id: 'x09D-9ZpF_o',
162-
title: `Stars In The Starry Sky`,
163-
description: 'Descripción 1',
164-
credits:
165-
`<p>Director: Grouvex</p>
166-
<p>Productor: Grouvex Studio</p>
167-
<p>2023 Grouvex Studio</p>`},
168-
{id: 'x09D-9ZpF_o',
169-
title: `Stars In The Starry Sky`,
170-
description: 'Descripción 1',
171-
credits:
172-
`<p>Director: Grouvex</p>
173-
<p>Productor: Grouvex Studio</p>
174-
<p>2023 Grouvex Studio</p>`},
175-
{id: 'x09D-9ZpF_o',
176-
title: `Stars In The Starry Sky`,
177-
description: 'Descripción 1',
178-
credits:
179-
`<p>Director: Grouvex</p>
180-
<p>Productor: Grouvex Studio</p>
181-
<p>2023 Grouvex Studio</p>`},
182-
{id: 'x09D-9ZpF_o',
183-
title: `Stars In The Starry Sky`,
184-
description: 'Descripción 1',
185-
credits:
186-
`<p>Director: Grouvex</p>
187-
<p>Productor: Grouvex Studio</p>
188-
<p>2023 Grouvex Studio</p>`},
189-
{id: 'x09D-9ZpF_o',
190-
title: `Stars In The Starry Sky`,
191-
description: 'Descripción 1',
192-
credits:
193-
`<p>Director: Grouvex</p>
194-
<p>Productor: Grouvex Studio</p>
195-
<p>2023 Grouvex Studio</p>`},
196-
{id: 'x09D-9ZpF_o',
197-
title: `Stars In The Starry Sky`,
198-
description: 'Descripción 1',
199-
credits:
200-
`<p>Director: Grouvex</p>
201-
<p>Productor: Grouvex Studio</p>
202-
<p>2023 Grouvex Studio</p>`},
203-
// Añade más videos aquí
204-
];
205-
var carousel = document.getElementById('videoCarousel');
206-
var modal = document.getElementById('modal');
207-
var modalContent = document.getElementById('modalContent');
97+
function cookies() {
98+
var acceptedCookies = localStorage.getItem('acceptedCookies');
99+
if (!acceptedCookies) {
100+
document.getElementById('cookieBanner').style.display = 'block';
101+
}
102+
};
103+
104+
function acceptCookies() {
105+
localStorage.setItem('acceptedCookies', true);
106+
document.getElementById('cookieBanner').style.display = 'none';
107+
}
208108

209-
videos.forEach(function(video) {
210-
var div = document.createElement('div');
211-
div.className = 'video';
212-
div.innerHTML = `
213-
<h2>${video.title}</h2>
214-
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/${video.id}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
215-
<section>
216-
<p>${video.description}</p>
217-
</section>
218-
<div class="credits"><strong>Créditos:</strong> ${video.credits}</div>
219-
`;
220-
div.onclick = function() {
221-
modal.style.display = "block";
222-
modalContent.innerHTML = `
223-
<h2>${video.title}</h2>
224-
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/${video.id}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
225-
<section>
226-
<p>${video.description}</p>
227-
</section>
228-
<div class="credits"><strong>Créditos:</strong> ${video.credits}</div>
229-
`;
230-
};
231-
carousel.appendChild(div);
109+
function declineCookies() {
110+
// Aquí puedes redirigir al usuario a una página diferente o cambiar el comportamiento de tu sitio según sea necesario
111+
document.getElementById('cookieBanner').style.display = 'none';
112+
}
113+
114+
function starwars() {
115+
var date = new Date();
116+
var startStarWarsWeek = new Date(date.getFullYear(), 4, 4); // 4 de mayo
117+
var endStarWarsWeek = new Date(date.getFullYear(), 4, 14); // 14 de mayo
118+
119+
if (date >= startStarWarsWeek && date <= endStarWarsWeek) {
120+
document.querySelector('#themeSelect option[value="starwars"]').classList.remove('hiddenOption');
121+
} else {
122+
document.querySelector('#themeSelect option[value="starwars"]').classList.add('hiddenOption');
123+
}
124+
}
125+
126+
function jurassicworld() {
127+
var date = new Date();
128+
var startJurassicWorldWeek = new Date(date.getFullYear(), 5, 10); // 10 de Junio
129+
var endJurassicWorldWeek = new Date(date.getFullYear(), 5, 20); // 20 de Junio
130+
131+
if (date >= startJurassicWorldWeek && date <= endJurassicWorldWeek) {
132+
document.querySelector('#themeSelect option[value="jurassicworld"]').classList.remove('hiddenOption');
133+
} else {
134+
document.querySelector('#themeSelect option[value="jurassicworld"]').classList.add('hiddenOption');
135+
}
136+
}
137+
138+
function taylorswift() {
139+
var date = new Date();
140+
var startTaylorSwiftWeek = new Date(date.getFullYear(), 11, 13); // 13 de Diciembre
141+
var endTaylorSwiftWeek = new Date(date.getFullYear(), 11, 23); // 23 de Diciembre
142+
143+
if (date >= startTaylorSwiftWeek && date <= endTaylorSwiftWeek) {
144+
document.querySelector('#themeSelect option[value="taylorswift"]').classList.remove('hiddenOption');
145+
} else {
146+
document.querySelector('#themeSelect option[value="taylorswift"]').classList.add('hiddenOption');
147+
}
148+
}
149+
150+
var themeSelect = document.getElementById('themeSelect');
151+
152+
// Cuando se cambia el tema
153+
themeSelect.addEventListener('change', function() {
154+
// Obtiene todos los elementos a los que se les aplicará el cambio de tema
155+
var elements = document.querySelectorAll('p, body, main, mainTop, h1, h2, h3, h4, h5, h6, h7, h8, .avatar1, article, section, aside, panel');
156+
157+
// Elimina las clases de las opciones antiguas
158+
elements.forEach(function(element) {
159+
element.classList.remove('theme1', 'theme2', 'space', 'starwars', 'jurassicworld', 'taylorswift');
232160
});
233161

234-
window.onclick = function(event) {
235-
if (event.target == modal) {
236-
modal.style.display = "none";
237-
}
238-
};
239-
var themeSelect = document.getElementById('themeSelect');
240-
241-
// Cuando se cambia el tema
242-
themeSelect.addEventListener('change', function() {
243-
// Obtiene todos los elementos a los que se les aplicará el cambio de tema
162+
// Si la opción seleccionada no es "default", añade la clase de la opción seleccionada
163+
if (this.value !== 'default') {
164+
elements.forEach(function(element) {
165+
element.classList.add(this.value);
166+
}.bind(this));
167+
}
168+
169+
// Guarda la selección del usuario en el almacenamiento local
170+
localStorage.setItem('selectedTheme', this.value);
171+
});
172+
173+
// Cuando se carga la página
174+
window.addEventListener('load', function() {
175+
// Obtiene la selección del usuario del almacenamiento local
176+
var selectedTheme = localStorage.getItem('selectedTheme');
177+
178+
// Si hay una selección guardada y no es "default", aplica el tema seleccionado
179+
if (selectedTheme && selectedTheme !== 'default') {
244180
var elements = document.querySelectorAll('p, body, main, mainTop, h1, h2, h3, h4, h5, h6, h7, h8, .avatar1, article, section, aside, panel');
245-
246-
// Elimina las clases de las opciones antiguas
247181
elements.forEach(function(element) {
248-
element.classList.remove('theme1', 'theme2', 'space', 'starwars', 'jurassicworld', 'taylorswift');
182+
element.classList.add(selectedTheme);
249183
});
250-
251-
// Si la opción seleccionada no es "default", añade la clase de la opción seleccionada
252-
if (this.value !== 'default') {
253-
elements.forEach(function(element) {
254-
element.classList.add(this.value);
255-
}.bind(this));
256-
}
257-
258-
// Guarda la selección del usuario en el almacenamiento local
259-
localStorage.setItem('selectedTheme', this.value);
260-
});
261-
262-
// Cuando se carga la página
263-
window.addEventListener('load', function() {
264-
// Obtiene la selección del usuario del almacenamiento local
265-
var selectedTheme = localStorage.getItem('selectedTheme');
266-
267-
// Si hay una selección guardada y no es "default", aplica el tema seleccionado
268-
if (selectedTheme && selectedTheme !== 'default') {
269-
var elements = document.querySelectorAll('p, body, main, mainTop, h1, h2, h3, h4, h5, h6, h7, h8, .avatar1, article, section, aside, panel');
270-
elements.forEach(function(element) {
271-
element.classList.add(selectedTheme);
272-
});
273-
themeSelect.value = selectedTheme; // Asegúrate de que el menú desplegable muestre el tema correcto
274-
}
275-
// Informa al usuario de que su selección se ha guardado
276-
alert('Tu selección de tema se ha guardado y se aplicará la próxima vez que visites esta página.');
277-
});
184+
themeSelect.value = selectedTheme; // Asegúrate de que el menú desplegable muestre el tema correcto
185+
}
186+
});

0 commit comments

Comments
 (0)