html-midi-player

🎹 Play and display MIDI files on the web

BSD-2-CLAUSE License

Downloads
334
Stars
663
Committers
2
View Code on GitHub Visit Website View on X
Ecosystems: Web Components, TypeScript, JavaScript

Bot releases are hidden (Show)

html-midi-player - Latest Release

Published by cifkao over 2 years ago

  • Add loop attribute
  • Add reload() method to player and visualizer
  • When assigning to noteSequence, do not reload it if it was already loaded (if the sequence was changed in place, reload() now needs to be called)
    • This also means the visualizer now won't reload when restarting playback
  • Reduce some stuttering at playback start by reloading the visualizers first
html-midi-player -

Published by cifkao about 3 years ago

  • Add a loading shimmer effect
  • Add an error icon and tooltip
html-midi-player -

Published by cifkao about 3 years ago

html-midi-player -

Published by cifkao about 3 years ago

html-midi-player -

Published by cifkao over 3 years ago

  • Add a scroll bar to the piano roll visualizer
  • Make <midi-visualizer> a block element to force it to have dimensions
  • Make <midi-visualizer> use shadow DOM, but put the actual visualizer in a slot so that it can still be easily styled with CSS
  • Import @magenta/music as ES modules
html-midi-player -

Published by cifkao over 3 years ago

  • Fixed behavior after playback finishes
html-midi-player -

Published by cifkao over 3 years ago

  • Improved seeking behavior during playback
html-midi-player -

Published by cifkao over 3 years ago

  • The player now resumes from the correct position after being paused.
  • The stop icon has been changed to the pause icon.
html-midi-player -

Published by cifkao over 3 years ago

html-midi-player -

Published by cifkao about 4 years ago

html-midi-player -

Published by cifkao about 4 years ago

html-midi-player -

Published by cifkao about 4 years ago

html-midi-player -

Published by cifkao about 4 years ago

html-midi-player -

Published by cifkao about 4 years ago

Package Rankings
Top 6.75% on Proxy.golang.org
Top 5.43% on Npmjs.org
Badges
Extracted from project README
npm package npm package daily downloads jsDelivr Published on webcomponents.org
Related Projects
polymer-midi-player

MIDI Player Web Component

10 Nov 2018 3
bg-sound

Web Component to emulate the old-school <bgsound> HTML element

16 Nov 2018 100
stemplayer-js

A streaming, low latency Stem Player Web-Component

12 May 2023 3