Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

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

Offen Anfängerfreundlich
#9,339 2 Kommentare 0 Reaktionen 1 zugewiesene Person Auf GitHub ansehen

Maintainer antworten meist innerhalb von 2 Tagen

@BhumitSahani arbeitet bereits daran.

Seit 27.10.2026.

  • #9346 von @BhumitSahani — offen

Bewertung

Schwierigkeit
1/5
Geschätzter Aufwand
Unter einer Stunde
Anfängerfreundlichkeit
86/100
Issue-Typ
Bug
Klarheit
Klar beschrieben
Aktivitätsstatus
Aktiv
Tech-Stack
javascript
Bereich
documentation

Rechercherichtung

Öffne das im Issue verlinkte Referenzbeispiel für p5.MediaElement onended() und suche den handleEnd()-Code im Ausschnitt. Prüfe die Zuweisung anhand der Bedingung in draw() für die Anzeige von „Done!“. Korrigiere das Beispiel, sodass die Abschlussmeldung nach dem Ende der Wiedergabe erscheint, führe das Beispiel anschließend aus und bestätige, dass „Done!“ angezeigt wird, wenn die Audiowiedergabe endet.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

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;
}

Vorherrschende Sprache
JavaScript
Sterne
24.3k
Forks
3.9k
Ø Merge
3 T. 19 Std.
Gemergte PRs (30 T.)
48

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus processing/p5.js

Alle Issues in processing/p5.js

Ähnliche Issues

Weitere Issues zu JavaScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.