
let mainMenu = [];
let intervalTime = 0;
////////////////////
// Variables de configuración
let modoFrontal = true;
let modoMirror = true;
let modoDiestro = true;
let modoSyncrono = true;
let modoReflejo = false;
let lVideoExp = true;

let memSrc = "";
let nPuntos = 0;
let game;
let ball;
let player1;
let player2;

let txClocalDown = "";
let txClocalUp = "";
let lInit = true;

let frameBuffer = []; // Buffer para almacenar fotogramas
const bufferSize = 10; // Número de fotogramas de retraso

let nAlpha = 126;

//let deviceOrientation = "";
let autoImageDisplay = false;
let tiempoBase = 3;

let arraymp4 = []
let angle;
/////////////////////////////////////
let timeoutId;
let imageCst;
////////////////////////////////////////
let nSwitch = 0;
let nSwitchTmp = -1;
let timer = 0;
let timerMedio = 0;
let timerInit = 0;
let timerProc = 0;
let timerPass = 0;
let timerTmp = 0;
let camStrTimer = 0;
//////////////////////////
let CopyRight = "© SEFiR"; //® //©
//////////////////////////////////////////////

let ballPos, ballVel, ballRadius = 80;
let gravity = 1.0, initialV = 4;
let pt1, pt2;
/////////////////////////////////////////////
let diameter;
let centerX = 0;
let centerY = 0;
let loadFoto;
let imgLoad = null;
let sMess = ""
let lFlex = true;
let unaVez = true;
let nRandom = 100;
//let ColorWhite = "[255,255,255,128]";
let p = [];
let nCountR = 0;
let nCountL = 0;
/*let pCadera23 = [];
let pCadera24 = [];
let pMano20 = [];
let pMano19 = [];
let pBoca = [];*/

let puntoOriginal = { x: 1, y: 0, z: 0 };
let puntoRotado = { x: 0, y: 0, z: 1 };
let anguloGiro = 0;
let identificadorTiempoDeEspera;
let identificadorIntervaloDeTiempo;
let nVeces = 1;

let xpDcha = 0;
let ypDcha = 0;
let xpIzda = 0;
let ypIzda = 0;

let nFoto = 0;
let numR = 0, numL = 0, numT = 0;
//let irotate = 0;
let nLado = 0;
//////////////////////////////
let historyP = [];
let pgPaint;
class JitVectorP {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
}
///////////////////////////////////
let subcategorias = [];
let categorias = [];
//let genericos = [];
///////////////////////////
//let nombrePdf = "";
let pC = true;
let isHard = "";
let platform = "";
let deviceAndroid = false;
let lDrawMedia = true;
/////////////////////////////////////////////////
let wVideoLoc;
let hVideoLoc;
let ArrPdf = [];
let lUpMenu = true;
//let lBackGround = true;
//let mailUnload = "";
let srcFinal = "";
let autoVideo;
let posTextHeight = 0;
///////////////////////////////////
let recording = false;
let encoder;
const numFrames = 100 // num of frames to record
let recordedFrames = 0
////////////////////////////////////////

let lDelayLocal = false;
let lDelayLocalManual = false;
let TOLERANCETRACK = 12; //10 ;//20
let nScale = 1;
///////////////////////////////////////////////////

let selectProcedure;
///////////////////////////////////////////
let lx = 0;
let w1 = 2;
let w2 = 2 * w1;

let imgLeft, imgRight;

let lTira = true;

//DISPLAY

//let lDisplayDouble = false;
let lVideo = true;
let ldisplayImage = true;
let lMediaImage = false;
//////////////////////////

let MAPA = 0;
let EVA = 0;
let nlStored = 0;
let bloqueo = true;
//let ldrawHand = true;
let facingUserCam = true;
let nPorc = 50;
let nBackground = 225;
let nFontSize = 18;

let alphaColor = true;

let divisionTiempo = 1;

let label;

let numSlice = 0;
let modoTracking = "";

////////////////////////////////////////
let resizeAuto = true;

///////////////////////////////////
let nameComputer = "0000";
let pass = "";
let lPass = false;
///////////////////////////////////
let img;
let imagenLoad;
let lapse = 0;      // timer
let src = ""

///////////////////////////////////
let lWebgl = false;
let txScreen = "";
//let mShow = false;
//////////////////////////////////
//let changeUserCam = true;

let pV1;
let pV2;
let posHandLW;
let posHandLH;
//////////////////////////////////////////
//BUBBLES/DIANA
let masMenosSpeedBall = 1;
let bubblesLocation = [];
let bubblesStep = [];
let bubbleSize = 100;
let maxBolaCount = 15;
//let diffThreshold = 20;
//////////////////////////////////////////////
/*let pVideoJava;
let videoFrame;
let videoImage;
let prevFrame;*/
let displayImage;
//let clearImage;
let wVideo = 640;
let hVideo = 480;
let wsIni = 0;
let hsIni = 0;
//let nElip = 0;
//let longlarg = 0;
//let wVideo = 960;
//let hVideo = 720;
//let wVideo = 720; 
//let hVideo = 480;
//let wVideo = 1280; 
//let hVideo = 720;
////////////////////
////////////////////////////////////////////
let iniFrameCount = 1;
let lCirculo = false;
let numWidth;
let numHeight;
////////////////////////////////////////
let showPoints = true;
let lhandsfree = false;
let isPlaying = false;
/////////////////////////////////////

let nFrames = 6;
let iWrite = 0;
let iRead = 1;
let buffer = [];
////////////////////////////////////////

let frmRate = "";

//////////////////////////////////////////////////////////////
//let imagesM = [];
//let imagesA = [];
let mFoto;
let imageLines;
////////////////////////////////////////////////////////////
/*let buttonMenu;
let buttonMano
let buttonReflex;*/

let autoImageOpen;

let modelRight;
let urljson;

let imgs = [];
let canvasMirror;
//////////////////////
let winClose;
/////////////////////////////////////////////////////////////
let xp = 0;
let yp = 0;
let rp = 50;
///////////////////////
let numSpheres = 12; // Número de esferas
let radius = 4; // Radio del reloj
let posSpheres = [];
let nCoefi = 2.80;
let pos = 0;
let ocupado = false;
let nDedo = 0;
////////////////////////////
let spheresUp = [];
let spheresDown = [];
let damping = 0.4;
/////////////////////////////////
class SphereDown {
  constructor(x, y, ctx, radius, wVideo, hVideo, color) {
    this.x = x;
    this.y = y;
    this.vx = Math.random() * 2 - 2; // Velocidad inicial aleatoria en x
    this.vy = Math.random() * 2 - 2; // Velocidad inicial aleatoria en y
    this.radius = radius; // Radio de la esfera
    this.ctx = ctx; // Contexto del canvas para dibujar
    this.wVideo = wVideo; // Ancho del canvas
    this.hVideo = hVideo; // Alto del canvas
    this.color = color;
  }

  update(gravity, damping) {
    // Aplicar gravedad
    this.vy += gravity;

    // Actualizar posición
    this.x += this.vx;
    this.y += this.vy;

    // Rebote en los bordes
    if (this.x - this.radius < 0 || this.x + this.radius > this.wVideo) {
      this.vx *= -damping * 4;
      this.x = Math.max(this.radius, Math.min(this.wVideo - this.radius, this.x));
    }

    if (this.y - this.radius < 0) {
      this.vy *= -damping * 8;
      this.y = Math.max(this.radius, Math.min(this.hVideo - this.radius, this.y));
    } else {
      if (this.y + this.radius > this.hVideo) {
        this.vy *= -damping * 4;
        this.y = Math.max(this.radius, Math.min(this.hVideo - this.radius, this.y));
      }
    }
  }

  draw() {
    // Dibujar la esfera en el canvas
    this.ctx.beginPath();
    this.ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2);
    this.ctx.fillStyle = this.color;
    this.ctx.fill();
    this.ctx.closePath();
  }
}
///////////////////////////////////////////////
class SphereUp {
  constructor(x, y, ctx, radius, wVideo, hVideo, color) {
    this.x = x;
    this.y = y;
    this.vx = Math.random() * 2 - 2; // Velocidad inicial aleatoria en x
    this.vy = Math.random() * 2 - 2; // Velocidad inicial aleatoria en y
    this.radius = radius; // Radio de la esfera
    this.ctx = ctx; // Contexto del canvas para dibujar
    this.wVideo = wVideo; // Ancho del canvas
    this.hVideo = hVideo; // Alto del canvas
    this.color = color;
  }

  update(gravity, damping) {
    // Aplicar gravedad
    this.vy -= gravity;

    // Actualizar posición
    this.x += this.vx;
    this.y += this.vy;

    // Rebote en los bordes
    if (this.x - this.radius < 0 || this.x + this.radius > this.wVideo) {
      this.vx *= -damping * 4;
      this.x = Math.max(this.radius, Math.min(this.wVideo - this.radius, this.x));
    }
    if (this.y - this.radius < 0) {
      this.vy *= -damping * 4;
      this.y = Math.max(this.radius, Math.min(this.hVideo - this.radius, this.y));
    } else
      if (this.y + this.radius > this.hVideo) {
        this.vy *= -damping * 8;
        this.y = Math.max(this.radius, Math.min(this.hVideo - this.radius, this.y));
      }
  }

  draw() {
    // Dibujar la esfera en el canvas
    this.ctx.beginPath();
    this.ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2);
    this.ctx.fillStyle = this.color;
    this.ctx.fill();
    this.ctx.closePath();
  }
}
/////////////////////////////////////////////////////

function numAleatEntre(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

function loadScriptapp(urlapp) {
  return new Promise((resolve, reject) => {
    const script = document.createElement('script');
    script.src = urlapp;
    script.async = true;
    script.onload = () => resolve();
    script.onerror = () => reject(new Error(`Failed to load script: ${urlapp}`));
    document.head.appendChild(script);
  });
}

class Particle {
  constructor(ctx, x, y) {
    this.x = x;
    this.y = y;
    this.xSpeed = Math.random() * 10 - 5;
    this.ySpeed = Math.random() * -10;
    this.opacity = 0.5;
  }

  show(ctx) {
    ctx.beginPath();
    ctx.arc(this.x, this.y, Math.random() * 25, 0, Math.PI * 2);
    ctx.fillStyle = `rgba(${Math.random() * 255}, ${Math.random() * 255}, ${Math.random() * 255}, ${this.opacity})`;
    ctx.fill();
  }

  move() {
    this.x += this.xSpeed;
    this.y += this.ySpeed;
    this.ySpeed += 0.1; // Gravedad
    this.opacity -= 0.01; // Desvanecimiento
  }
}
