Skip to content

Commit dc3b02d

Browse files
GrouvexGrouvex
committed
Update index.js
1 parent 4a96bc4 commit dc3b02d

File tree

1 file changed

+78
-86
lines changed

1 file changed

+78
-86
lines changed

‎index.js‎

Lines changed: 78 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,18 @@
1+
// Cuando se carga la página
12
window.addEventListener('load', function() {
23
// Llama a todas las funciones que quieres ejecutar cuando se carga la página
3-
showNotification();
4-
flower();
5-
sol();
6-
leaf();
7-
nieve();
8-
jurassicworld();
9-
starwars();
10-
taylorswift();
11-
cookies()
12-
acceptCookies()
13-
declineCookies()
4+
showNotification();openNav();closeNav();
5+
flower();sol();leaf();nieve();
6+
jurassicworld();starwars();taylorswift();
7+
cookies();
148
});
9+
1510
function cookies() {
1611
var acceptedCookies = localStorage.getItem('acceptedCookies');
1712
if (!acceptedCookies) {
1813
document.getElementById('cookieBanner').style.display = 'block';
14+
} else {
15+
acceptCookies();
1916
}
2017
};
2118

@@ -28,12 +25,15 @@ function declineCookies() {
2825
// Aquí puedes redirigir al usuario a una página diferente o cambiar el comportamiento de tu sitio según sea necesario
2926
document.getElementById('cookieBanner').style.display = 'none';
3027
}
28+
3129
function openNav() {
3230
document.getElementById("mySidenav").style.width = "250px";
3331
}
32+
3433
function closeNav() {
3534
document.getElementById("mySidenav").style.width = "0";
3635
}
36+
3737
function showNotification() {
3838
document.getElementById("notification").style.display = "block";
3939
}
@@ -202,84 +202,76 @@ var videos = [
202202
<p>2023 Grouvex Studio</p>`},
203203
// Añade más videos aquí
204204
];
205+
var carousel = document.getElementById('videoCarousel');
206+
var modal = document.getElementById('modal');
207+
var modalContent = document.getElementById('modalContent');
205208

206-
var carousel = document.getElementById('videoCarousel');
207-
var modal = document.getElementById('modal');
208-
var modalContent = document.getElementById('modalContent');
209-
210-
videos.forEach(function(video) {
211-
var div = document.createElement('div');
212-
div.className = 'video';
213-
div.innerHTML = `
214-
<h2>${video.title}</h2>
215-
<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>
216-
<section>
217-
<p>${video.description}</p>
218-
</section>
219-
<div class="credits"><strong>Créditos:</strong> ${video.credits}</div>
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>
220229
`;
221-
div.onclick = function() {
222-
modal.style.display = "block";
223-
modalContent.innerHTML = `
224-
<h2>${video.title}</h2>
225-
<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>
226-
<section>
227-
<p>${video.description}</p>
228-
</section>
229-
<div class="credits"><strong>Créditos:</strong> ${video.credits}</div>
230-
`;
231-
};
232-
carousel.appendChild(div);
233-
});
234-
235-
window.onclick = function(event) {
236-
if (event.target == modal) {
237-
modal.style.display = "none";
238-
}
239230
};
240-
var selectedTheme = localStorage.getItem('selectedTheme');
241-
242-
// Si hay una selección guardada y no es "default", aplica el tema seleccionado
243-
if (selectedTheme && selectedTheme !== 'default') {
244-
applyTheme(selectedTheme);
245-
themeSelect.value = selectedTheme; // Asegúrate de que el menú desplegable muestre el tema correcto
246-
}
247-
248-
// Muestra el banner de cookies si el usuario no ha aceptado las cookies
249-
var acceptedCookies = localStorage.getItem('acceptedCookies');
250-
if (!acceptedCookies) {
251-
document.getElementById('cookieBanner').style.display = 'block';
252-
}
253-
});
254-
255-
// Aplica el tema seleccionado
256-
function applyTheme(theme) {
257-
var elements = document.querySelectorAll('p, body, main, mainTop, h1, h2, h3, h4, h5, h6, h7, h8, .avatar1, article, section, aside, panel');
258-
elements.forEach(function(element) {
259-
element.classList.add(theme);
260-
});
261-
}
262-
263-
// Cuando se cambia el tema
264-
themeSelect.addEventListener('change', function() {
265-
// Obtiene todos los elementos a los que se les aplicará el cambio de tema
266-
var elements = document.querySelectorAll('p, body, main, mainTop, h1, h2, h3, h4, h5, h6, h7, h8, .avatar1, article, section, aside, panel');
267-
268-
// Elimina las clases de las opciones antiguas
269-
elements.forEach(function(element) {
270-
element.classList.remove('theme1', 'theme2', 'space', 'starwars', 'jurassicworld', 'taylorswift');
231+
carousel.appendChild(div);
271232
});
272233

273-
// Si la opción seleccionada no es "default", añade la clase de la opción seleccionada
274-
if (this.value !== 'default') {
275-
applyTheme(this.value);
276-
}
277-
278-
// Comprueba si el usuario ha aceptado las cookies
279-
var acceptedCookies = localStorage.getItem('acceptedCookies');
280-
281-
// Si el usuario ha aceptado las cookies, guarda la selección del tema
282-
if (acceptedCookies) {
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
244+
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
247+
elements.forEach(function(element) {
248+
element.classList.remove('theme1', 'theme2', 'space', 'starwars', 'jurassicworld', 'taylorswift');
249+
});
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
283259
localStorage.setItem('selectedTheme', this.value);
284-
}
285-
});
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+
});

0 commit comments

Comments
 (0)