Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

[p5.js 2.0+ Bug Report]: Incorrect isDone assignment in MediaElement.onended() example

Abierto Apto para principiantes
#9,339 2 comentarios 0 reacciones 1 asignado Ver en GitHub

Los mantenedores suelen responder en 3 días

@BhumitSahani ya está trabajando en esto.

Desde el 27/10/2026.

  • #9346 de @BhumitSahani — abierto

Evaluación

Dificultad
1/5
Tiempo estimado
Menos de una hora
Aptitud para principiantes
86/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
javascript

Línea de trabajo

Abre el ejemplo de referencia de p5.MediaElement onended() enlazado en el issue y busca el código de handleEnd() que aparece en el fragmento. Comprueba la asignación comparándola con la condición de draw() para mostrar «Done!». Corrige el ejemplo para que el mensaje de finalización aparezca después de que termine la reproducción; luego ejecuta el ejemplo y confirma que muestra «Done!» cuando termina el audio.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Area:DOM p5.js 2.0+
Most appropriate sub-area of p5.js?
  • Accessibility
  • Color
  • Core/Environment/Rendering
  • Data
  • DOM
  • Events
  • Image
  • IO
  • Math
  • Typography
  • Utilities
  • WebGL
  • WebGPU
  • p5.strands
  • Build process
  • Unit testing
  • Internationalization
  • Friendly errors
  • Other (specify if possible)
p5.js version

2.3.2

Web browser and version

Microsoft Edge 156.0.4314.42 (Official build) (64-bit)

Operating system

Windows 11 Version 26H2 (Build 26300.9711)

Steps to reproduce this
Steps:
  1. Open the onended() reference example: https://p5js.org/es/reference/p5.MediaElement/onended/
  2. Run the example and click the canvas to start audio playback.
  3. Wait for the audio to finish. The example is intended to display "Done!", but handleEnd() assigns isDone = false, while draw() displays "Done!" only when isDone === true.
Snippet:
Image

let beat;
let isPlaying = false;
let isDone = false;

function setup() {
  createCanvas(100, 100);

  // Create a p5.MediaElement using createAudio().
  beat = createAudio('/assets/beat.mp3');

  // Call handleEnd() when the beat finishes.
  beat.onended(handleEnd);

  describe('The text "Click to play" written in black on a gray square. A beat plays when the user clicks. The text "Done!" appears when the beat finishes playing.');
}

function draw() {
  background(200);

  // Style the text.
  textAlign(CENTER);
  textSize(16);

  // Display different messages based on playback.
  if (isDone === true) {
    text('Done!', 50, 50);
  } else if (isPlaying === false) {
    text('Click to play', 50, 50);
  } else {
    text('Playing...', 50, 50);
  }
}

// Play the beat when the user presses the mouse.
function mousePressed() {
  if (isPlaying === false) {
    isPlaying = true;
    beat.play();
  }
}

// Set isDone when playback ends.
function handleEnd() {
  isDone = false;
}

Lenguaje dominante
JavaScript
Estrellas
24.3k
Forks
3.9k
Merge medio
4 d 4 h
PR fusionados (30 d)
43

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de processing/p5.js

Todos los issues de processing/p5.js

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.