*{
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: "Quicksand", serif;
}
.main-box{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #FBF5DD;
padding: 3em 0em;
}
.main-box h1{
font-size: 3.5em;
color: #16404D;
margin-bottom: 1.3em;
text-align: center;
}
.container-buttons{
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
width: 80%;
}
.container-buttons a{
text-decoration: none;
font-size: 1.5em;
margin: 1em 0em;
padding: 0.8em;
border-radius: 0.3em;
color:#16404D;
background-color: #DDA853;
transition: 0.3s;
border: 1px solid #16404D;
}
.container-buttons details{
background-color: #DDA853;
border: 1px solid #16404D;
border-radius: 0.3em;
margin: 1em 0em;
padding: 0.8em;
color:#16404D;
}
.container-buttons details summary{
font-size: 1.5em;
transition: 0.3s;
cursor: pointer;
}
.container-buttons button {
border: 1px solid #16404D;
text-decoration: none;
font-size: 1.5em;
margin: 1em 0em;
padding: 0.8em;
border-radius: 0.3em;
color:#16404D;
background-color: #DDA853;
transition: 0.3s;
cursor: pointer;
}
.container-buttons button:hover{
background-color: #c4a065;
}
.container-buttons a:hover{
background-color: #c4a065;
}
form{
margin-top: 0.8em;
display: flex;
flex-direction: column;
padding: 0.8em;
border-radius: 0.3em;
}
form label {
font-size: 1.3em;
border-radius: 0.8em;
}
form select{
margin-top: 0.6em;
font-size: 1.3em;
border-radius: 0.3em;
border: 1px solid #16404D;
padding: 0.3em;
background-color: #FBF5DD;
color: #16404D;
}
form button{
color: #16404D;
font-size: 1.5em;
background-color: #A6CDC6 !important;
border-radius: 0.3em;
border: none;
cursor: pointer;
padding: 0.6em 0em;
border: 1px solid #16404D;
}
form button:hover{
background-color: #7e9b95 !important;
}
form p {
margin-top: 0.8em;
text-align: center;
font-size: 1.3em;
}
import { initializeApp } from "https://www.gstatic.com/firebasejs/11.1.0/firebase-app.js";
import { getFirestore, collection, getDocs, updateDoc, doc,where,query } from "https://www.gstatic.com/firebasejs/11.1.0/firebase-firestore.js";
// Configuración de Firebase
const firebaseConfig = {
apiKey: "AIzaSyC8932MdKpEpMy3J2cmKNddlCxWo91ILE4",
authDomain: "balthvs-users-i.firebaseapp.com",
projectId: "balthvs-users-i",
storageBucket: "balthvs-users-i.firebasestorage.app",
messagingSenderId: "744488301382",
appId: "1:744488301382:web:cb525866e3ba7f36eeab47"
};
// Inicializa Firebase y Firestore
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
const btnNewRelease = document.querySelector(".btn-new-release")
const btnClearUsers = document.querySelector(".btn-clear-users")
const uniqueForm = document.querySelector("#unique-form")
const inputCity = document.querySelector("#input-city")
const btnUpdateUsersConcert = document.querySelector("#btn-update-users-concert")
async function loadCities() {
try {
const btnUpdateUsersConcert = document.querySelector("#btn-update-users-concert");
const selectElement = document.querySelector("#input-city");
if (!btnUpdateUsersConcert || !selectElement) {
throw new Error("El botón o el select no están definidos en el DOM.");
}
btnUpdateUsersConcert.disabled = true;
btnUpdateUsersConcert.textContent = "Loading Cities...";
const citiesCollection = collection(db, "citys");
const citiesSnapshot = await getDocs(citiesCollection);
const citiesArray = [];
citiesSnapshot.forEach((doc) => {
const cityData = doc.data();
if (cityData.city && cityData.latandlng) {
citiesArray.push({
city: cityData.city,
latandlng: cityData.latandlng,
});
}
});
citiesArray.sort((a, b) => a.city.localeCompare(b.city));
citiesArray.forEach((cityData) => {
const option = document.createElement("option");
option.value = cityData.latandlng;
option.textContent = cityData.city;
selectElement.appendChild(option);
});
btnUpdateUsersConcert.disabled = false;
btnUpdateUsersConcert.textContent = "Update";
} catch (error) {
console.error("Error al cargar las ciudades:", error);
btnUpdateUsersConcert.disabled = false;
btnUpdateUsersConcert.textContent = "Error Loading Cities";
}
}
// Llamar a la función al cargar la página
document.addEventListener("DOMContentLoaded", loadCities);
async function clearAllUsers() {
try {
btnClearUsers.textContent = "cleaning..."
btnClearUsers.disabled = true;
// Referencia a la colección "users"
const usersCollection = collection(db, "users");
const usersSnapshot = await getDocs(usersCollection);
// Iterar sobre cada documento y actualizarlo
const updatePromises = usersSnapshot.docs.map(async (docSnapshot) => {
const userDocRef = doc(db, "users", docSnapshot.id);
return updateDoc(userDocRef, {
state: "none" // Campo "state" con valor "none"
});
});
// Esperar a que todas las actualizaciones terminen
await Promise.all(updatePromises);
btnClearUsers.textContent = "cleaned"
btnClearUsers.disabled = false;
swal({
title: "¡Users Cleaned Up Successfully!",
text: `Users have been cleaned`,
icon: "success",
button: "Ok",
})
} catch (error) {
swal("Error", `Users could not be cleaned. Check your internet connection`, "error");
btnClearUsers.textContent = "Clear User Status"
btnClearUsers.disabled = false;
}
}
async function updateUsersByCity(targetCity) {
try {
btnUpdateUsersConcert.textContent = "updating...";
btnUpdateUsersConcert.disabled = true;
// Crear la consulta para obtener solo los usuarios con el campo "city" igual al valor especificado
const q = query(collection(db, "users"), where("city", "==", targetCity));
const querySnapshot = await getDocs(q);
if (querySnapshot.empty) {
btnUpdateUsersConcert.textContent = "No users found";
swal("information", `No users found in the city: ${targetCity}.`, "info");
return;
}
// Iterar sobre los documentos filtrados y actualizar
const updatePromises = querySnapshot.docs.map(async (docSnapshot) => {
const userDocRef = doc(db, "users", docSnapshot.id);
return updateDoc(userDocRef, {
state: "pending" // Campo "state" con valor "pending"
});
});
// Esperar a que todas las actualizaciones terminen
await Promise.all(updatePromises);
btnUpdateUsersConcert.textContent = "updated";
btnUpdateUsersConcert.disabled = false;
swal({
title: "¡Successfully Updated Users!",
text: `Users in the city "${targetCity}" have been upgraded to "pending".`,
icon: "success",
button: "ok",
});
} catch (error) {
swal(
"Error",
`Users could not be updated. Check your internet connection.`,
"error"
);
btnUpdateUsersConcert.textContent = "Update";
btnUpdateUsersConcert.disabled = false;
}
}
async function updateAllUsers() {
try {
btnNewRelease.textContent = "updating..."
btnNewRelease.disabled = true;
// Referencia a la colección "users"
const usersCollection = collection(db, "users");
const usersSnapshot = await getDocs(usersCollection);
// Iterar sobre cada documento y actualizarlo
const updatePromises = usersSnapshot.docs.map(async (docSnapshot) => {
const userDocRef = doc(db, "users", docSnapshot.id);
return updateDoc(userDocRef, {
state: "pending" // Campo "state" con valor "none"
});
});
// Esperar a que todas las actualizaciones terminen
await Promise.all(updatePromises);
btnNewRelease.textContent = "Actualizados"
btnNewRelease.disabled = true;
swal({
title: "Updated Users with Success!",
text: `Users have been updated to been pending announcement new release`,
icon: "success",
button: "ok",
})
btnNewRelease.textContent = "updated"
btnNewRelease.disabled = false;
} catch (error) {
swal("Error", `Users could not be updated to state pending announcement of new release. Check your internet connection`, "error");
btnNewRelease.textContent = "New Releases"
btnNewRelease.disabled = false;
}
}
btnNewRelease.addEventListener("click", () => {
updateAllUsers();
})
btnClearUsers.addEventListener("click",() => {
clearAllUsers();
})
uniqueForm.addEventListener("submit",(ev) => {
ev.preventDefault();
const dataUser = new FormData(ev.currentTarget);
// Obtener el valor del campo `city` (lat, lng)
const cityValue = dataUser.get("city"); // Ejemplo: "52.37403, 52.37403"
const [lat, lng] = cityValue.split(", ").map(coord => parseFloat(coord)); // Divide y convierte a números
// Obtener el texto del seleccionado
const cityText = ev.currentTarget.querySelector("#input-city option:checked").textContent;
updateUsersByCity(cityText)
})