var idStreaming = "";
var campos;
var uri;
var arrCampos = [
  "tipoIdentificacion",
  "identificacion",
  "nombre",
  "apellidos",
  "email",
  "telefono",
  "cargo",
  "empresa",
  "nitEmpresa",
  "region",
  "zona",
  "codigo",
  "tipoLista",
  "tipoLista2",
  "chTerminos",
];

var textUsuario = false;

var firebaseConfig = {
  apiKey: "AIzaSyAiLZ8sPsgt7cHyGwjvk0NA2H11e0WcesY",
  authDomain: "chat-9de4e.firebaseapp.com",
  databaseURL: "https://chat-9de4e.firebaseio.com",
  projectId: "chat-9de4e",
  storageBucket: "chat-9de4e.appspot.com",
  messagingSenderId: "928552096573",
  appId: "1:928552096573:web:170af619aae4871e",
  measurementId: "G-7JZVVEJRQ0",
};

var defaultAnalytics;

var dbconexion;
var uid;
var nombreUsuario;
var estado;
var perEnviar = false;

var formulario = false;
var chat = false;
var activarChat = true;
var activarChatPersonal = true;
var ipUsuario;

var unloaded = false;

var date = new Date();

var campoLista;

var banners = [];

var codigo;

$(document).ready(function () {
  // Initialize Firebase
  idStreaming = decodeURI(getUrlVars()["id"]);
  //campos = decodeURI(getUrlVars()["campos"]).split("");

  //uri = decodeURI(getUrlVars()["uri"]);

  for (var i = 0; i < arrCampos.length; i++) {
    $("#" + arrCampos[i])
      .parent()
      .hide();
  }

  firebase.initializeApp(firebaseConfig);
  const appCheck = firebase.appCheck();
  appCheck.activate("6LclzNwaAAAAAEjuXyWsuTAf98Y80Gr6Z4fc4xlZ");

  defaultAnalytics = firebase.analytics();
  defaultAnalytics.logEvent("pagina_registro", {
    name: "Streaming: " + idStreaming,
  });

  var perf = firebase.performance();

  autenticacionFirebase();
});

function autenticacionFirebase() {
  firebase
    .auth()
    .setPersistence(firebase.auth.Auth.Persistence.SESSION)
    .then(function () {
      firebase
        .auth()
        .signInAnonymously()
        .then(function () {
          firebase.auth().onAuthStateChanged(function (user) {
            if (user) {
              var isAnonymous = user.isAnonymous;
              uid = user.uid;
              localStorage.uid = uid;
              ini();
            }
          });
        })
        .catch(function (error) {
          var errorCode = error.code;
          var errorMessage = error.message;
          console.error(errorCode, errorMessage);
        });
    });
}

function ini() {
  dbconexion = firebase.database();

  //console.log("UID", uid);

  firebase
    .database()
    .ref("streamingsRetail/" + idStreaming)
    .on("value", function (childSnapshot) {
      var datos = childSnapshot.val();
      estado = datos.estado;
      //console.log(datos);

      uri = datos.uri;
      campos = datos.campos.split("");

      if (datos.lista) {
        campoLista = datos.lista;
        // console.log("campoLista",campoLista);
      }

      if (datos.lista2) {
        campoLista2 = datos.lista2;
        console.log("campoLista2", campoLista2);
      }

      if (datos.banners) {
        banners = datos.banners;
      }

      if (datos.codigo) {
        codigo = datos.codigo;
      }

      if (estado == "preparacion") {
        verAlert(
          "Estamos preparando todo para que <b>una hora antes</b> puedas ingresar. <b>¡Te esperamos!</b>"
        );
      } else if (estado == "finalizado") {
        verAlert("El evento ha finalizado, gracias por visitarnos.");

        if (chat) {
          firebase.auth().signOut();
          location.reload();
        }
      } else if (estado == "iniciado") {
        $(".contInfo").hide();
        $(".contForm").show();
      }
    });

  var refUID = dbconexion.ref("registro/" + idStreaming + "/" + uid);

  refUID.once("value", function (snapshot) {
    if (snapshot.val() === null) {
      cargarFormulario();
    } else {
      //console.log("Registrado");
      cargarStreaming();

    }
  });
}

function cargarFormulario() {
  var refStreamings = firebase
    .database()
    .ref("streamingsRetail/" + idStreaming);

  refStreamings.once("value").then(function (snapshot) {
    var datos = snapshot.val();

    $(".fondo1").css("background", "url(" + datos.imagen1 + ")");
    $(".fondo1").css("background-repeat", "no-repeat");
    $(".fondo1").css("background-position", "left center");
    $(".fondo2").attr("src", datos.imagen2);
    $(".principalLogin").fadeIn();

    formulario = true;
    if (datos.terminos != undefined) {
      $("#refTerminos").attr("href", datos.terminos);
      $("#refTerminos").attr("target", "new");
      $("#refTerminos").removeClass("refTerminos1").addClass("refTerminos2");
    }

    cargarCampos();
    $("#frmLogin").on("submit", enviarForm);
  });
}

function cargarCampos() {
  for (var i = 0; i < arrCampos.length; i++) {
    $("#" + arrCampos[i])
      .parent()
      .hide();

    if (campos[i] != "0") {
      console.log(arrCampos[i]);
      if (campos[i] == "1") {
        $("#" + arrCampos[i]).prop("required", true);
      } else if (campos[i] == "2") {
        var param = $("#" + arrCampos[i])
          .prop("placeholder")
          .replace("*", "");
        $("#" + arrCampos[i]).prop("placeholder", param);
      }

      if (arrCampos[i] == "tipoLista") {
        var htmlCampos = "";
        for (var j = 0; j < campoLista.length; j++) {
          if (j == 0) {
            htmlCampos +=
              '<option selected  disabled value="">' +
              campoLista[j] +
              "*</option>";
          } else {
            htmlCampos += "<option>" + campoLista[j] + "</option>";
          }
        }
      }

      if (arrCampos[i] == "tipoLista2") {
        var htmlCampos2 = "";
        for (var k = 0; k < campoLista2.length; k++) {
          if (k == 0) {
            htmlCampos2 +=
              '<option selected  disabled value="">' +
              campoLista2[k] +
              "*</option>";
          } else {
            htmlCampos2 += "<option>" + campoLista2[k] + "</option>";
          }
        }
      }

      $("#" + arrCampos[i])
        .parent()
        .show();
    }
  }

  $("#tipoLista").append(htmlCampos);
  $("#tipoLista2").append(htmlCampos2);
}

function verAlert(msg) {
  $("#msgAlert").html(msg);
  $(".contInfo").show();
  $(".contForm").hide();
}

function enviarForm(evt) {
  //console.log("enviarForm");
  evt.preventDefault();

  if (estado == "preparacion") {
    verAlert(
      "Estamos preparando todo para que <b>una hora antes</b> puedas ingresar. <b>¡Te esperamos!</b>"
    );
    return;
  } else if (estado == "finalizado") {
    verAlert("El evento ha finalizado, gracias por visitarnos.");
    return;
  }

  if (codigo) {
    if (clearText($("#codigo").val()) != codigo) {
      alert("Clave de acceso incorrecta");
      return;
    }
  }

  var refBaneados = dbconexion.ref("baneados/" + idStreaming + "/" + uid + "/");

  refBaneados.child("baneado").once("value", function (dataSnapshot) {
    if (dataSnapshot.val()) {
      alert("No puedes ingresar al streaming\n ESTADO BLOQUEADO");
    } else {
      var registro = {};

      for (var i = 0; i < arrCampos.length; i++) {
        if (campos[i] != "0") {
          console.log(arrCampos[i]);
          registro[arrCampos[i]] = clearText($("#" + arrCampos[i]).val());

          if (arrCampos[i] === "chTerminos") {
            registro[arrCampos[i]] = $("#chTerminos").is(":checked");
          }
        }
      }

      registro.fechaCliente = Date(Date.now());
      registro.fechaServidor = firebase.database.ServerValue.TIMESTAMP;

      registro.activo = true;
      registro.online = true;
      registro.uid = uid;

      var refRegistro = dbconexion.ref("registro/" + idStreaming + "/" + uid);

      refRegistro
        .set(registro)
        .then(function () {
          localStorage.nombre = registro.nombre;
          cargarStreaming();
        })
        .catch(function (error) {
          alert("No se ha realizado tu registro " + error);
        });
    }
  });
}

function cargarStreaming() {
  chat = true;

  nombreUsuario = localStorage.nombre;

  $("#frVideo").attr("src", uri);

  $(".principalLogin").remove();
  $(".principalStreaming").fadeIn("slow");

  $(".txtNombre").text(nombreUsuario);
  $("#btnEnviar").on("click", enviarMensaje);

  $("#txtEscribir").on("keydown", pressTeclas);
  $("#txtEscribir").on("keyup", upTeclas);

  defaultAnalytics.logEvent("pagina_chat", { name: "Chat: " + idStreaming });

  activarEventosFirebase();

}

function activarEventosFirebase() {
  var refChat = dbconexion.ref("chat/" + idStreaming + "/");

  refChat
    .orderByKey()
    .limitToLast(15)
    .on("child_added", function (childSnapshot, prevChildKey) {
      cargarMensaje(childSnapshot.val());
    });

  dbconexion.ref("chat").on("child_removed", function (oldChildSnapshot) {
    if (oldChildSnapshot.key === idStreaming) {
      $("#listaMSG").html("");
    }
  });

  dbconexion
    .ref("registro/" + idStreaming + "/" + uid + "/")
    .on("child_removed", function (oldChildSnapshot) {
      firebase.auth().signOut();
      location.reload();
    });

  dbconexion
    .ref("streamingsRetail/" + idStreaming + "/activarChat")
    .on("value", function (childSnapshot) {
      //console.log("activarChat " + idStreaming, childSnapshot.val());

      if (childSnapshot.val() != null) {
        activarChat = childSnapshot.val();
        bloquearDesbloquearChat(activarChat);
      }

      dbconexion
        .ref("registro/" + idStreaming + "/" + uid + "/activo")
        .on("value", function (snapshot) {
          if (!activarChat) {
            return;
          }

          activarChatPersonal = snapshot.val();
          bloquearDesbloquearChat(activarChatPersonal);
        });
    });

  dbconexion
    .ref("streamingsRetail/" + idStreaming + "/msgSoporte")
    .on("value", function (childSnapshot) {
      if (childSnapshot.val()) {
        $(".contSoporte").slideDown();
      } else {
        $(".contSoporte").slideUp();
      }
    });

  dbconexion
    .ref("baneados/" + idStreaming + "/" + uid + "/baneado/")
    .on("value", function (childSnapshot) {
      //console.log(childSnapshot.val());
      if (childSnapshot.val() != undefined) {
        if (childSnapshot.val()) {
          firebase.auth().signOut();
          location.reload();
        }
      }
    });

  var refMsgSoporte = dbconexion.ref("msgSoporte/" + idStreaming);
  refMsgSoporte.on("value", function (childSnapshot) {
    if (childSnapshot.val() != null) {
      //console.log(key,Object.entries(childSnapshot.val()).length);
      $(".contSoporte").text(childSnapshot.val());
    } else {
      $(".contSoporte").text("");
    }
  });

  var refBanners = dbconexion.ref(
    "streamingsRetail/" + idStreaming + "/banners"
  );
  refBanners.on("child_changed", function (childSnapshot) {
    //console.log(childSnapshot.val());
    $("#banner").html("");
    $("#banner").hide();

    if (childSnapshot.val().activar) {
      //console.log("Activar");
      let html = `<a href="${childSnapshot.val().path
        }" target="_blank"><img src="${childSnapshot.val().img
        }" class="img-fluid"/></a>`;
      $("#banner").html(html);
      $("#banner").fadeIn();
    }
  });

  refBanners.once("value", function (childSnapshot) {
    //console.log(childSnapshot.val());
    if (childSnapshot.val() != null) {
      for (let i = 0; i < childSnapshot.val().length; i++) {
        if (childSnapshot.val()[i].activar) {
          let html = `<a href="${childSnapshot.val()[i].path
            }" target="_blank"><img src="${childSnapshot.val()[i].img
            }" class="img-fluid"/></a>`;
          $("#banner").html(html);
          $("#banner").fadeIn();
        }
      }
    }
  });

  var refIframe = dbconexion.ref("streamingsRetail/" + idStreaming + "/iframe");

  refIframe.on("value", (snapshot) => {
    if (snapshot.exists()) {
      //console.log("Iframe activo!!!", snapshot.val());
      cargarIframe(snapshot.val());
    } else {
      //console.log("Iframe inactivo!!!");
      cerrarIframe();
    }
  });

  window.onbeforeunload = unloadHandler;
  window.onunload = unloadHandler;
}

function cargarIframe(path) {
  $("#contIframe").show();
  $("#uriIframe").attr("src", path);
}

function cerrarIframe() {
  $("#contIframe").hide();
  $("#uriIframe").attr("src", "");
}

function bloquearDesbloquearChat(estado) {
  var chatContainer = document.querySelector(".contChat");
  var buttonContainer = document.querySelector(".contBoton");

  if (!estado) {
    chatContainer.style.display = "none";
    buttonContainer.style.display = "flex";
    buttonContainer.style.pointerEvents = "none";
    $(".btnMostrar").text("CHAT DESHABILITADO");
  } else {
    chatContainer.style.display = "flex";
    buttonContainer.style.display = "none";
    buttonContainer.style.pointerEvents = "all";
    $(".btnMostrar").text("MOSTRAR CHAT");
  }
}

function pressTeclas(evt) {
  if (evt.keyCode == 13) {
    evt.preventDefault();

    if (!perEnviar) {
      perEnviar = true;
      enviarMensaje();
    }
  }

  if ($(this).text().length >= 250 && evt.keyCode !== 46 && evt.keyCode !== 8) {
    evt.preventDefault();
  }
}

function upTeclas(evt) {
  //console.log($("#txtEscribir").text().length);
  $("#conCaracteres").text($("#txtEscribir").text().length + "/250");

  perEnviar = false;
}

function enviarMensaje(evt) {
  //console.log("Espacio",$("#txtEscribir").text().trim().length);

  if (!activarChat) {
    return;
  }

  if (
    $("#txtEscribir").text() === "" ||
    $("#txtEscribir").text().trim().length <= 0
  )
    return;

  var mensaje = {
    mensaje: clearText($("#txtEscribir").text()),
    usuario: clearText(nombreUsuario),
    fecha: firebase.database.ServerValue.TIMESTAMP,
  };

  $("#txtEscribir").text("");

  var refChat = dbconexion.ref("chat/" + idStreaming + "/");

  refChat.push(mensaje).then(function () {
    $("#conCaracteres").text("0/250");
    $("#txtEscribir").focus();
  });

  //cargarMensaje();
}

function cargarMensaje(data) {
  var html = `<li class="msgUsuario"><span id="txtNombreUsuario">${data.usuario}:  </span>${data.mensaje}</li>`;

  $("#listaMSG").append(html);

  if ($("li").length > 100) {
    $("#listaMSG li").first().remove();
  }

  $(".contMSG").scrollTop($(".contMSG")[0].scrollHeight);
}

function clearText(texto) {
  return texto.replace(/(<([^>]+)>)/gi, "");
}

function getUrlVars() {
  var vars = {};
  var parts = window.location.href.replace(
    /[?&]+([^=&]+)=([^&]*)/gi,
    function (m, key, value) {
      vars[key] = value;
    }
  );
  return vars;
}

var chatHandler = {
  hide: function () {
    // console.log('something')
    var chatContainer = document.querySelector(".contChat");
    var buttonContainer = document.querySelector(".contBoton");

    chatContainer.style.display = "none";
    buttonContainer.style.display = "flex";
  },
  show: function () {
    var chatContainer = document.querySelector(".contChat");
    var buttonContainer = document.querySelector(".contBoton");

    chatContainer.style.display = "flex";
    buttonContainer.style.display = "none";
  },
};

function unloadHandler() {
  if (!unloaded) {
    unloaded = true;
    if (estado == "iniciado") {
      var refOnline = dbconexion.ref(
        "registro/" + idStreaming + "/" + uid + "/online"
      );

      refOnline.set(false, function (error) {
        if (error) {
          console.log("No se puede guardar el dato", error);
        } else {
          console.log("Usuaro offline");
        }
      });
    }
  }
}