Tema para preguntas random a Chatgpt 🤖

BotBeta · 2023-08-22T10:36:16-0600

blankito1998 dijo:
$ciome = mysqli_query($conexion,"SELECT * FROM profileuser where id='1' group by email ORDER BY id DESC");
while($fila = mysqli_fetch_assoc($ciome)){
$timestamp_evento = strtotime($fila['horaday']);
$timestamp_24_horas_despues = $timestamp_evento + 24*60*60;
if(strtotime(date("Y-m-d H:i:s")) >= $timestamp_24_horas_despues) {
$skeleitor = mysqli_query($conexion,"SELECT * FROM userday group by ipdrump order by id desc");
$subkeleitor = mysqli_query($conexion,"SELECT * FROM search order by id desc");
if(mysqli_num_rows($skeleitor) ===0 and mysqli_num_rows($subkeleitor) ===0){
mysqli_query($conexion,"UPDATE profileuser SET userday='".mysqli_num_rows($skeleitor)."', horaday='".date("Y-m-d H:i:s",strtotime($fecha_actual."+ 24 hours"))."'");
}else{
if(date('N')=="7"){
mysqli_query($conexion,"UPDATE profileuser SET ipdrumps='', ipgolex='', userday='".mysqli_num_rows($skeleitor)."'");
mysqli_query($conexion,"TRUNCATE TABLE userday");
mysqli_query($conexion,"TRUNCATE TABLE lenguaje");
mysqli_query($conexion,"TRUNCATE TABLE search");
mysqli_query($conexion,"UPDATE watch SET ipdrump='', ipdrump2='', fox='0'");
$motup = mysqli_query($conexion,"SELECT * FROM enlaces");
while($golep = mysqli_fetch_assoc($motup)){
mysqli_query($conexion,"UPDATE enlaces SET ipdrump='',ipdrump2='',ganancia='".number_format($golep['ganancia'], 3, '.', false)."' where id='".$golep['id']."'");
}
}else{
mysqli_query($conexion,"UPDATE profileuser SET ipgolex='', userday='".mysqli_num_rows($skeleitor)."'");
mysqli_query($conexion,"TRUNCATE TABLE userday");
mysqli_query($conexion,"TRUNCATE TABLE search");
mysqli_query($conexion,"UPDATE watch SET ipdrump=''");
mysqli_query($conexion,"UPDATE enlaces SET ipdrump=''");
$motup = mysqli_query($conexion,"SELECT * FROM enlaces");
while($golep = mysqli_fetch_assoc($motup)){
mysqli_query($conexion,"UPDATE enlaces SET ipdrump='',ipdrump2='',ganancia='".number_format($golep['ganancia'], 3, '.', false)."' where id='".$golep['id']."'");
}
}
if(date('d') === '25'){
$cobrun = mysqli_query($conexion,"SELECT * FROM profileuser where gane != '0' order by id desc");
while($morantos = mysqli_fetch_assoc($cobrun)){
mysqli_query($conexion,"UPDATE profileuser SET gane='0', pendit='".$morantos['gane']."' WHERE email='".$morantos['email']."'");
}
$cobruna = mysqli_query($conexion,"SELECT * FROM profileuser where gananciax != '0.000' order by id desc");
while($morantoos = mysqli_fetch_assoc($cobruna)){
$valor = array($morantoos['gananciax'], $morantoos['penditx']);
$suma = array_sum($valor);
mysqli_query($conexion,"UPDATE profileuser SET gananciax='0.000', penditx='".number_format($suma, 3, '.', false)."' WHERE email='".$morantoos['email']."'");
}
}
}
}
}

me ayudas aqui porfa, el codigo no quiere actualizar los datos una vez pasada las 24h nose porque, que podria ser??

Por lo que veo en tu código, estás comprobando si han pasado 24 horas desde el último evento utilizando la columna 'horaday' en tu tabla 'profileuser'. Si la operación no está funcionando como esperas, lo más probable es que haya un problema con cómo estás almacenando o recuperando este valor.

1. Asegúrate de que 'horaday' se esté almacenando en el formato correcto. Debe ser una cadena de fecha y hora en el formato "YYYY-MM-DD HH:II:SS", que puedes obtener en PHP con date("Y-m-d H:i:s").

2. Haz un seguimiento para comprobar si los valores de tiempo se están calculando correctamente. Puedes hacer esto añadiendo algunas líneas de depuración para imprimir los valores de $timestamp_evento, $timestamp_24_horas_despues y el tiempo actual. Así podrás ver si los cálculos son correctos.

3. Verifica si tu consulta SQL para actualizar 'profileuser' se está ejecutando correctamente. Si mysqli_query() está fallando, debe dar un error que puedes comprobar con mysqli_error().

4. Asegúrate de estar utilizando la variable $fecha_actual correctamente. En el fragmento de código que diste no veo dónde se define esa variable. Deberías definirla antes de usarla.

Sin más detalles sobre tu base de datos y tu entorno es difícil hacer un diagnóstico más preciso. Te recomendaría que hagas estas comprobaciones y veas si puedes encontrar el problema. Si no, por favor proporciona más detalles.

blankito1998 · 2023-08-22T10:56:06-0600

BotBeta dijo:
Por lo que veo en tu código, estás comprobando si han pasado 24 horas desde el último evento utilizando la columna 'horaday' en tu tabla 'profileuser'. Si la operación no está funcionando como esperas, lo más probable es que haya un problema con cómo estás almacenando o recuperando este valor.

1. Asegúrate de que 'horaday' se esté almacenando en el formato correcto. Debe ser una cadena de fecha y hora en el formato "YYYY-MM-DD HH:II:SS", que puedes obtener en PHP con date("Y-m-d H:i:s").

2. Haz un seguimiento para comprobar si los valores de tiempo se están calculando correctamente. Puedes hacer esto añadiendo algunas líneas de depuración para imprimir los valores de $timestamp_evento, $timestamp_24_horas_despues y el tiempo actual. Así podrás ver si los cálculos son correctos.

3. Verifica si tu consulta SQL para actualizar 'profileuser' se está ejecutando correctamente. Si mysqli_query() está fallando, debe dar un error que puedes comprobar con mysqli_error().

4. Asegúrate de estar utilizando la variable $fecha_actual correctamente. En el fragmento de código que diste no veo dónde se define esa variable. Deberías definirla antes de usarla.

Sin más detalles sobre tu base de datos y tu entorno es difícil hacer un diagnóstico más preciso. Te recomendaría que hagas estas comprobaciones y veas si puedes encontrar el problema. Si no, por favor proporciona más detalles.

Si quito + 24*60*60 se actualizaría una vez pase dicha hora sugerida ??

BotBeta · 2023-08-22T10:56:29-0600

blankito1998 dijo:
Si quito + 24*60*60 se actualizaría una vez pase dicha hora sugerida ??

Si quitas "+ 24*60*60", $timestamp_24_horas_despues será igual al timestamp del evento original. Esto significa que en lugar de verificar si han pasado 24 horas desde el último evento, estarías verificando si el tiempo actual es mayor o igual al momento en que ocurrió el evento original. Dado que probablemente ya ha pasado ese momento, la condición probablemente siempre se evalúe como verdadera y la actualización se realice en cada iteración. Por lo tanto, no, no se actualizaría después de una hora específica, sino siempre que se ejecute este script (y el valor en "horaday" sea anterior a la hora actual).

blankito1998 · 2023-08-22T11:59:20-0600

BotBeta dijo:
Si quitas "+ 24*60*60", $timestamp_24_horas_despues será igual al timestamp del evento original. Esto significa que en lugar de verificar si han pasado 24 horas desde el último evento, estarías verificando si el tiempo actual es mayor o igual al momento en que ocurrió el evento original. Dado que probablemente ya ha pasado ese momento, la condición probablemente siempre se evalúe como verdadera y la actualización se realice en cada iteración. Por lo tanto, no, no se actualizaría después de una hora específica, sino siempre que se ejecute este script (y el valor en "horaday" sea anterior a la hora actual).

$(document).ready(function() {
if(!document.querySelector(".opioms")){
var startTime;
$("#miFormulario").ajaxForm({
beforeSend: function() {
startTime = new Date().getTime(); // Registra el tiempo de inicio
},
uploadProgress: function(event, position, total, percentComplete) {
if(!document.querySelector(".opioms")){
$(".lincoint").append("<section class=\'opioms\'><div class=\'barra\'><div class=\'barra_azul\' id=\'barra_estado\'><span></span></div></div><p class=\'timeRemaining\'></p><p class=\'sizeRemaining\'></p><span style=\'z-index:1;\' class=\'tevie\'>Subiendo archivo</span></section>");
document.getElementById("miFormulario").style.pointerEvents = "none";
$("#miFormulario").hide();
}
var percentVal = percentComplete + "%";
$("#barra_estado").width(percentVal);
$("#barra_estado span").html(percentVal);

if(percentComplete === 100) {
// Cambia el color de la barra a verde cuando la carga está completa
if(document.querySelector(".opioms")){
$("#barra_estado").css("background-color", "green");
document.getElementById("miFormulario").style.pointerEvents = "auto";
document.getElementById("miFormulario").reset();
$("#miFormulario").show();
$(".opioms").remove();
}
}

var currentTime = new Date().getTime();
var uploadTime = currentTime - startTime;
var totalEstimatedTime = uploadTime * total / position ;
var timeRemaining = totalEstimatedTime - uploadTime;

var seconds = Math.floor(timeRemaining / 1000);
var minutes = Math.floor(seconds / 60);
var hours = Math.floor(minutes / 60);
var days = Math.floor(hours / 24);

$(".timeRemaining").html(days + "d " + (hours % 24) + "h "
+ (minutes % 60) + "m restantes");

var sizeRemaining = total - position;
var sizeRemainingMB = (sizeRemaining / (1024*1024)).toFixed(2);
$(".sizeRemaining").html(sizeRemainingMB + "MB restantes");
},
error: function() {
if(document.querySelector(".opioms")){
$("#miFormulario").show();
}
$("#barra_estado").css("background-color", "#DE3152");
}
});
}
});

es posible hacer que el archivo se coloque en pausa cuando se valla el internet y vuelva a iniciar desde donde estaba cuando el internet este trabajando nuevamente??

BotBeta · 2023-08-22T11:59:47-0600

blankito1998 dijo:
$(document).ready(function() {
if(!document.querySelector(".opioms")){
var startTime;
$("#miFormulario").ajaxForm({
beforeSend: function() {
startTime = new Date().getTime(); // Registra el tiempo de inicio
},
uploadProgress: function(event, position, total, percentComplete) {
if(!document.querySelector(".opioms")){
$(".lincoint").append("<section class=\'opioms\'><div class=\'barra\'><div class=\'barra_azul\' id=\'barra_estado\'><span></span></div></div><p class=\'timeRemaining\'></p><p class=\'sizeRemaining\'></p><span style=\'z-index:1;\' class=\'tevie\'>Subiendo archivo</span></section>");
document.getElementById("miFormulario").style.pointerEvents = "none";
$("#miFormulario").hide();
}
var percentVal = percentComplete + "%";
$("#barra_estado").width(percentVal);
$("#barra_estado span").html(percentVal);

if(percentComplete === 100) {
// Cambia el color de la barra a verde cuando la carga está completa
if(document.querySelector(".opioms")){
$("#barra_estado").css("background-color", "green");
document.getElementById("miFormulario").style.pointerEvents = "auto";
document.getElementById("miFormulario").reset();
$("#miFormulario").show();
$(".opioms").remove();
}
}

var currentTime = new Date().getTime();
var uploadTime = currentTime - startTime;
var totalEstimatedTime = uploadTime * total / position ;
var timeRemaining = totalEstimatedTime - uploadTime;

var seconds = Math.floor(timeRemaining / 1000);
var minutes = Math.floor(seconds / 60);
var hours = Math.floor(minutes / 60);
var days = Math.floor(hours / 24);

$(".timeRemaining").html(days + "d " + (hours % 24) + "h "
+ (minutes % 60) + "m restantes");

var sizeRemaining = total - position;
var sizeRemainingMB = (sizeRemaining / (1024*1024)).toFixed(2);
$(".sizeRemaining").html(sizeRemainingMB + "MB restantes");
},
error: function() {
if(document.querySelector(".opioms")){
$("#miFormulario").show();
}
$("#barra_estado").css("background-color", "#DE3152");
}
});
}
});

es posible hacer que el archivo se coloque en pausa cuando se valla el internet y vuelva a iniciar desde donde estaba cuando el internet este trabajando nuevamente??

Desafortunadamente, la API AJAX que estás utilizando no admite pausar y reanudar las descargas automáticamente. Una interrupción de la red normalmente terminará en un error y deberás reiniciar la subida desde el principio.

Un enfoque posible para tener subidas pausables/resumibles sería dividir el archivo en bloques más pequeños (por ejemplo, 1MB cada uno) y luego subir esos bloques uno por uno. Si la conexión de red se interrumpe, solo necesitarías reenviar el bloque actual y no todo el archivo.

Sin embargo, este enfoque es considerablemente más complejo y requeriría un soporte significativo tanto en el lado del cliente como en el lado del servidor para manejar este tipo de subidas por bloques. Algunas bibliotecas de carga de archivos, como Resumable.js, ya ofrecen esta funcionalidad.

Te sugiero explorar estas bibliotecas o considerar la posibilidad de implementar una solución propia si necesitas absolutamente soportar subidas pausables/resumibles.

blankito1998 · 2023-08-22T12:01:25-0600

BotBeta dijo:
Desafortunadamente, la API AJAX que estás utilizando no admite pausar y reanudar las descargas automáticamente. Una interrupción de la red normalmente terminará en un error y deberás reiniciar la subida desde el principio.

Un enfoque posible para tener subidas pausables/resumibles sería dividir el archivo en bloques más pequeños (por ejemplo, 1MB cada uno) y luego subir esos bloques uno por uno. Si la conexión de red se interrumpe, solo necesitarías reenviar el bloque actual y no todo el archivo.

Sin embargo, este enfoque es considerablemente más complejo y requeriría un soporte significativo tanto en el lado del cliente como en el lado del servidor para manejar este tipo de subidas por bloques. Algunas bibliotecas de carga de archivos, como Resumable.js, ya ofrecen esta funcionalidad.

Te sugiero explorar estas bibliotecas o considerar la posibilidad de implementar una solución propia si necesitas absolutamente soportar subidas pausables/resumibles.

podrias hacerme algo igual, donde se pause y reanude la subida??

BotBeta · 2023-08-22T12:02:06-0600

blankito1998 dijo:
podrias hacerme algo igual, donde se pause y reanude la subida??

Para conseguir pausar y reanudar una carga necesitarías una biblioteca de JavaScript más avanzada orientada a esa funcionalidad.

Una opción muy popular es Resumable.js. Esta biblioteca tiene la función de dividir los archivos en chunks y permite pausar/reanudar las cargas.

Aquí hay un ejemplo simple de cómo se puede configurar usando la API de Resumable:

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024,
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file){
  r.upload();
});

r.on('fileSuccess', function(file,message){
  console.log('fileSuccess', file, message);
});

r.on('fileError', function(file, message){
  console.log('fileError', file, message);
});

En este código, el método 'assignDrop' es utilizado para designar una región como zona 'droppable' para los archivos, 'assignBrowse' es donde especificas en qué elemento hacer clic para abrir la exploración de archivos y el método 'fileAdded' se activa cada vez que se agrega un archivo, iniciando la carga de inmediato.

Te recomiendo revisar la documentación de Resumable.js para entender completamente cómo funcionan todas estas opciones y configuraciones: http://resumablejs.com/

Por último, ten en cuenta que necesitarás configurar el back-end para que soporte este tipo de cargas. Resumable.js provee algunos ejemplos en PHP y Node.js para que te sirvan como guía.

blankito1998 · 2023-08-22T12:05:18-0600

BotBeta dijo:
Para conseguir pausar y reanudar una carga necesitarías una biblioteca de JavaScript más avanzada orientada a esa funcionalidad.

Una opción muy popular es Resumable.js. Esta biblioteca tiene la función de dividir los archivos en chunks y permite pausar/reanudar las cargas.

Aquí hay un ejemplo simple de cómo se puede configurar usando la API de Resumable:

JavaScript:

var r = new Resumable({ target:'/api/upload', chunkSize:1*1024*1024, simultaneousUploads:4, testChunks:false, throttleProgressCallbacks:1, }); r.assignDrop(document.getElementById('dropTarget')); r.assignBrowse(document.getElementById('browseButton')); r.on('fileAdded', function(file){ r.upload(); }); r.on('fileSuccess', function(file,message){ console.log('fileSuccess', file, message); }); r.on('fileError', function(file, message){ console.log('fileError', file, message); });

En este código, el método 'assignDrop' es utilizado para designar una región como zona 'droppable' para los archivos, 'assignBrowse' es donde especificas en qué elemento hacer clic para abrir la exploración de archivos y el método 'fileAdded' se activa cada vez que se agrega un archivo, iniciando la carga de inmediato.

Te recomiendo revisar la documentación de Resumable.js para entender completamente cómo funcionan todas estas opciones y configuraciones: http://resumablejs.com/

Por último, ten en cuenta que necesitarás configurar el back-end para que soporte este tipo de cargas. Resumable.js provee algunos ejemplos en PHP y Node.js para que te sirvan como guía.

Mm como sería el código HTML? No entiendo nada

BotBeta · 2023-08-22T12:06:07-0600

blankito1998 dijo:
Mm como sería el código HTML? No entiendo nada

Por supuesto, para entender mejor, necesitarías dos elementos HTML para ser utilizados como el objetivo del drop de archivos y como el botón para explorar los archivos. Aquí te dejo un ejemplo:

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

Y posteriormente el código JavaScript que utiliza Resumable.js:

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024,
  simultaneousUploads:3,
  testChunks:false,
  throttleProgressCallbacks:1,
});

r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('fileSuccess', function(file,message) {
  console.log('Archivo cargado exitosamente', file, message);
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
});

Este código te permitirá arrastrar y soltar los archivos en el div llamado dropTarget o seleccionar los archivos al hacer clic en el botón browseButton.

Por último, debes tener en cuenta que el endpoint /api/upload en el objeto Resumable debe ser reemplazado por la URL de tu servidor que manejará la carga del archivo. Resumable.js enviará las porciones del archivo a ese endpoint.

Por tanto, necesitarás tener un código de servidor adecuado en esa URL para manejar la carga del archivo. Te sugiero que revises la documentación de Resumable.js para obtener más detalles.

blankito1998 · 2023-08-22T12:09:17-0600

BotBeta dijo:
Por supuesto, para entender mejor, necesitarías dos elementos HTML para ser utilizados como el objetivo del drop de archivos y como el botón para explorar los archivos. Aquí te dejo un ejemplo:

HTML:

 <div id="dropTarget">Arrastra y suelta los archivos aquí</div>  <button id="browseButton">Seleccionar archivos</button>  <form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data"> <input type="file" id="fileInput" name="file"> </form>

Y posteriormente el código JavaScript que utiliza Resumable.js:

JavaScript:

var r = new Resumable({ target:'/api/upload', chunkSize:1*1024*1024, simultaneousUploads:3, testChunks:false, throttleProgressCallbacks:1, }); r.assignDrop(document.getElementById('dropTarget')); r.assignBrowse(document.getElementById('browseButton')); r.on('fileAdded', function(file) { r.upload(); }); r.on('fileSuccess', function(file,message) { console.log('Archivo cargado exitosamente', file, message); }); r.on('fileError', function(file, message) { console.log('Error al cargar el archivo', file, message); });

Este código te permitirá arrastrar y soltar los archivos en el div llamado dropTarget o seleccionar los archivos al hacer clic en el botón browseButton.

Por último, debes tener en cuenta que el endpoint /api/upload en el objeto Resumable debe ser reemplazado por la URL de tu servidor que manejará la carga del archivo. Resumable.js enviará las porciones del archivo a ese endpoint.

Por tanto, necesitarás tener un código de servidor adecuado en esa URL para manejar la carga del archivo. Te sugiero que revises la documentación de Resumable.js para obtener más detalles.

Podrías agregarle cuántos mb le faltan y TMB cuando días horas y minutos porfa?

BotBeta · 2023-08-22T12:10:05-0600

blankito1998 dijo:
Podrías agregarle cuántos mb le faltan y TMB cuando días horas y minutos porfa?

Claro, aquí está el código actualizado. He añadido dos elementos HTML para mostrar la cantidad de MB y el tiempo restante:

HTML:

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

<!-- Aquí se mostrará la cantidad de MB que faltan -->
<div id="mbRemaining">MB restantes: N/A</div>

<!-- Aquí se mostrará el tiempo restante -->
<div id="timeRemaining">Tiempo restante: N/A</div>

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024, // 1MB
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('uploadStart', function() {
  // Actualizamos la interfaz al iniciar la subida
  document.getElementById('mbRemaining').textContent = 'MB restantes: calculando...';
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: calculando...';
});

r.on('progress', function() {
  // Actualizamos la interfaz durante la subida
  var remainingSize = r.getSize() - r.getProgress() * r.getSize();
  document.getElementById('mbRemaining').textContent = 'MB restantes: ' + (remainingSize / (1024 * 1024)).toFixed(2);
  
  var timeRemaining = r.timeRemaining();
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: ' + timeRemaining + ' segundos';
});

r.on('fileSuccess', function(file, message) {
  console.log('Archivo cargado exitosamente', file, message);
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
});

Por favor, ten en cuenta que este es un ejemplo muy básico. La cantidad de MB y el tiempo restante se actualizan cada vez que el evento progress es gatillado. Podrías querer formatear estos valores para hacerlos más amigables para el usuario.

blankito1998 · 2023-08-22T12:12:55-0600

BotBeta dijo:

Claro, aquí está el código actualizado. He añadido dos elementos HTML para mostrar la cantidad de MB y el tiempo restante:

HTML:

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

<!-- Aquí se mostrará la cantidad de MB que faltan -->
<div id="mbRemaining">MB restantes: N/A</div>

<!-- Aquí se mostrará el tiempo restante -->
<div id="timeRemaining">Tiempo restante: N/A</div>

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024, // 1MB
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('uploadStart', function() {
  // Actualizamos la interfaz al iniciar la subida
  document.getElementById('mbRemaining').textContent = 'MB restantes: calculando...';
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: calculando...';
});

r.on('progress', function() {
  // Actualizamos la interfaz durante la subida
  var remainingSize = r.getSize() - r.getProgress() * r.getSize();
  document.getElementById('mbRemaining').textContent = 'MB restantes: ' + (remainingSize / (1024 * 1024)).toFixed(2);
 
  var timeRemaining = r.timeRemaining();
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: ' + timeRemaining + ' segundos';
});

r.on('fileSuccess', function(file, message) {
  console.log('Archivo cargado exitosamente', file, message);
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
});

Por favor, ten en cuenta que este es un ejemplo muy básico. La cantidad de MB y el tiempo restante se actualizan cada vez que el evento progress es gatillado. Podrías querer formatear estos valores para hacerlos más amigables para el usuario.

<div class=\'barra\'><div class=\'barra_azul\' id=\'barra_estado\'><span></span></div></div>

Ahora agrégale esa barra porfa

BotBeta · 2023-08-22T12:14:02-0600

blankito1998 dijo:
<div class=\'barra\'><div class=\'barra_azul\' id=\'barra_estado\'><span></span></div></div>

Ahora agrégale esa barra porfa

¡Por supuesto! A continuación, te muestro cómo puedes incluir la barra de progreso en tu código:

HTML:

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

<!-- Aquí se mostrará la cantidad de MB que faltan -->
<div id="mbRemaining">MB restantes: N/A</div>

<!-- Aquí se mostrará el tiempo restante -->
<div id="timeRemaining">Tiempo restante: N/A</div>

<!-- Aquí irá la barra de progreso -->
<div class='barra'><div class='barra_azul' id='barra_estado'><span></span></div></div>

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024, // 1MB
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

// AssingFile Handlers
r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('uploadStart', function() {
  // Actualizamos la interfaz al iniciar la subida
  document.getElementById('mbRemaining').textContent = 'MB restantes: calculando...';
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: calculando...';
});

r.on('progress', function() {
  // Actualizamos la interfaz durante la subida
  var progress = r.progress() * 100;
  document.getElementById('barra_estado').style.width = progress + '%';
  
  var remainingSize = r.getSize() - r.getProgress() * r.getSize();
  document.getElementById('mbRemaining').textContent = 'MB restantes: ' + (remainingSize / (1024 * 1024)).toFixed(2);
  
  var timeRemaining = r.timeRemaining();
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: ' + timeRemaining + ' segundos';
});

r.on('fileSuccess', function(file, message) {
  console.log('Archivo cargado exitosamente', file, message);
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
});

Este fragmento de código ahora también mostrará el progreso de la carga del archivo en la barra de progreso. Ten en cuenta que esta barra de progreso es solo visual y que el styling (estilos CSS) puede variar según tus necesidades.

blankito1998 · 2023-08-22T12:19:58-0600

BotBeta dijo:

¡Por supuesto! A continuación, te muestro cómo puedes incluir la barra de progreso en tu código:

HTML:

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

<!-- Aquí se mostrará la cantidad de MB que faltan -->
<div id="mbRemaining">MB restantes: N/A</div>

<!-- Aquí se mostrará el tiempo restante -->
<div id="timeRemaining">Tiempo restante: N/A</div>

<!-- Aquí irá la barra de progreso -->
<div class='barra'><div class='barra_azul' id='barra_estado'><span></span></div></div>

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024, // 1MB
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

// AssingFile Handlers
r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('uploadStart', function() {
  // Actualizamos la interfaz al iniciar la subida
  document.getElementById('mbRemaining').textContent = 'MB restantes: calculando...';
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: calculando...';
});

r.on('progress', function() {
  // Actualizamos la interfaz durante la subida
  var progress = r.progress() * 100;
  document.getElementById('barra_estado').style.width = progress + '%';
 
  var remainingSize = r.getSize() - r.getProgress() * r.getSize();
  document.getElementById('mbRemaining').textContent = 'MB restantes: ' + (remainingSize / (1024 * 1024)).toFixed(2);
 
  var timeRemaining = r.timeRemaining();
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: ' + timeRemaining + ' segundos';
});

r.on('fileSuccess', function(file, message) {
  console.log('Archivo cargado exitosamente', file, message);
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
});

Este fragmento de código ahora también mostrará el progreso de la carga del archivo en la barra de progreso. Ten en cuenta que esta barra de progreso es solo visual y que el styling (estilos CSS) puede variar según tus necesidades.

target:'/api/upload
Esa parte que dice upload es mi upload.php verdad??

BotBeta · 2023-08-22T12:20:21-0600

blankito1998 dijo:
target:'/api/upload
Esa parte que dice upload es mi upload.php verdad??

Sí, efectivamente. En este caso, 'target' se refiere al URL del servidor al que se envían los fragmentos de archivo para su procesamiento. Si tu script del servidor es 'upload.php', entonces debes actualizarlo a 'target':'/ruta/a/tu/upload.php'. Obviamente, la ruta debe ser la dirección exacta donde se encuentra tu archivo 'upload.php' en el servidor.

blankito1998 · 2023-08-22T12:22:16-0600

BotBeta dijo:
Sí, efectivamente. En este caso, 'target' se refiere al URL del servidor al que se envían los fragmentos de archivo para su procesamiento. Si tu script del servidor es 'upload.php', entonces debes actualizarlo a 'target':'/ruta/a/tu/upload.php'. Obviamente, la ruta debe ser la dirección exacta donde se encuentra tu archivo 'upload.php' en el servidor.

Ok ahora haz que la barra pase a color rojo cuando haya un error en la carga y pase a color verde cuando termine el proceso

BotBeta · 2023-08-22T12:24:01-0600

blankito1998 dijo:
Ok ahora haz que la barra pase a color rojo cuando haya un error en la carga y pase a color verde cuando termine el proceso

Claro, aquí tienes un código de muestra sobre cómo puedes cambiar el color de la barra dependiendo del estado de la carga del archivo:

HTML (se mantiene igual):

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

<!-- Aquí se mostrará la cantidad de MB que faltan -->
<div id="mbRemaining">MB restantes: N/A</div>

<!-- Aquí se mostrará el tiempo restante -->
<div id="timeRemaining">Tiempo restante: N/A</div>

<!-- Aquí irá la barra de progreso -->
<div class='barra'><div class='barra_azul' id='barra_estado'><span></span></div></div>

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024,
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('uploadStart', function() {
  document.getElementById('mbRemaining').textContent = 'MB restantes: calculando...';
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: calculando...';
});

r.on('progress', function() {
  var progress = r.progress() * 100;
  document.getElementById('barra_estado').style.width = progress + '%';
  
  var remainingSize = r.getSize() - r.getProgress() * r.getSize();
  document.getElementById('mbRemaining').textContent = 'MB restantes: ' + (remainingSize / (1024 * 1024)).toFixed(2);
  
  var timeRemaining = r.timeRemaining();
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: ' + timeRemaining + ' segundos';
});

r.on('fileSuccess', function(file, message) {
  console.log('Archivo cargado correctamente', file, message);
  document.getElementById('barra_estado').style.backgroundColor = 'green';
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
  document.getElementById('barra_estado').style.backgroundColor = 'red';
});

En este fragmento de código, la barra cambiará a verde cuando se haya cargado correctamente el archivo y a rojo cuando haya un error durante la carga. Ten en cuenta que 'green' y 'red' son colores CSS predeterminados y se pueden cambiar a cualquier otro color o incluso a códigos de colores hexadecimales para ajustarse más precisamente a tus necesidades.

blankito1998 · 2023-08-22T14:21:05-0600

BotBeta dijo:

Claro, aquí tienes un código de muestra sobre cómo puedes cambiar el color de la barra dependiendo del estado de la carga del archivo:

HTML (se mantiene igual):

HTML:

<!-- Este es el objetivo del drop de archivos -->
<div id="dropTarget">Arrastra y suelta los archivos aquí</div>

<!-- Este es el botón para explorar los archivos -->
<button id="browseButton">Seleccionar archivos</button>

<!-- Este es el formulario de carga de archivos -->
<form id="uploadForm" action="/api/upload" method="POST" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file">
</form>

<!-- Aquí se mostrará la cantidad de MB que faltan -->
<div id="mbRemaining">MB restantes: N/A</div>

<!-- Aquí se mostrará el tiempo restante -->
<div id="timeRemaining">Tiempo restante: N/A</div>

<!-- Aquí irá la barra de progreso -->
<div class='barra'><div class='barra_azul' id='barra_estado'><span></span></div></div>

JavaScript:

var r = new Resumable({
  target:'/api/upload',
  chunkSize:1*1024*1024,
  simultaneousUploads:4,
  testChunks:false,
  throttleProgressCallbacks:1,
});

r.assignDrop(document.getElementById('dropTarget'));
r.assignBrowse(document.getElementById('browseButton'));

r.on('fileAdded', function(file) {
  r.upload();
});

r.on('uploadStart', function() {
  document.getElementById('mbRemaining').textContent = 'MB restantes: calculando...';
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: calculando...';
});

r.on('progress', function() {
  var progress = r.progress() * 100;
  document.getElementById('barra_estado').style.width = progress + '%';
 
  var remainingSize = r.getSize() - r.getProgress() * r.getSize();
  document.getElementById('mbRemaining').textContent = 'MB restantes: ' + (remainingSize / (1024 * 1024)).toFixed(2);
 
  var timeRemaining = r.timeRemaining();
  document.getElementById('timeRemaining').textContent = 'Tiempo restante: ' + timeRemaining + ' segundos';
});

r.on('fileSuccess', function(file, message) {
  console.log('Archivo cargado correctamente', file, message);
  document.getElementById('barra_estado').style.backgroundColor = 'green';
});

r.on('fileError', function(file, message) {
  console.log('Error al cargar el archivo', file, message);
  document.getElementById('barra_estado').style.backgroundColor = 'red';
});

En este fragmento de código, la barra cambiará a verde cuando se haya cargado correctamente el archivo y a rojo cuando haya un error durante la carga. Ten en cuenta que 'green' y 'red' son colores CSS predeterminados y se pueden cambiar a cualquier otro color o incluso a códigos de colores hexadecimales para ajustarse más precisamente a tus necesidades.

tengo una duda, lo acabo de probar pero selecciono el archivo pero no comienza a subir no hace nada

BotBeta · 2023-08-22T14:21:47-0600

blankito1998 dijo:
tengo una duda, lo acabo de probar pero selecciono el archivo pero no comienza a subir no hace nada

Puede haber varias razones por las que no se está subiendo el archivo. Aquí te dejo algunas posibilidades:

1. Verifica que la ruta a tu archivo PHP ('/api/upload') es accesible y correcta. Puedes probarla directamente en el navegador.

2. Asegúrate de que tu archivo PHP en el servidor esté configurado para manejar la carga del archivo. Este debe ser capaz de recibir los fragmentos del archivo, reensamblarlos y almacenar el archivo final.

3. Comprueba las configuraciones de tu servidor. Podría ser que la configuración de PHP o de tu servidor web esté limitando el tamaño de los archivos que se pueden cargar, o bloqueando las cargas por completo.

4. Ve al inspector de elementos de tu navegador, abre la consola y revisa si hay algún error de JavaScript. Esto te puede dar pistas sobre lo que está fallando.

Espero que esto ayude a orientarte a la solución. Si aún así no logras resolverlo, te sugeriría que pidas ayuda a un desarrollador con experiencia en PHP y JavaScript, o que publiques tu problema con más detalles en un foro de programación.

blankito1998 · 2023-08-22T14:22:56-0600

BotBeta dijo:
Puede haber varias razones por las que no se está subiendo el archivo. Aquí te dejo algunas posibilidades:

1. Verifica que la ruta a tu archivo PHP ('/api/upload') es accesible y correcta. Puedes probarla directamente en el navegador.

2. Asegúrate de que tu archivo PHP en el servidor esté configurado para manejar la carga del archivo. Este debe ser capaz de recibir los fragmentos del archivo, reensamblarlos y almacenar el archivo final.

3. Comprueba las configuraciones de tu servidor. Podría ser que la configuración de PHP o de tu servidor web esté limitando el tamaño de los archivos que se pueden cargar, o bloqueando las cargas por completo.

4. Ve al inspector de elementos de tu navegador, abre la consola y revisa si hay algún error de JavaScript. Esto te puede dar pistas sobre lo que está fallando.

Espero que esto ayude a orientarte a la solución. Si aún así no logras resolverlo, te sugeriría que pidas ayuda a un desarrollador con experiencia en PHP y JavaScript, o que publiques tu problema con más detalles en un foro de programación.

debo de usar algun script en head??