Musician

Musician

Addons
376k Downloads

[Feature] Main UI revamp without import field

LenweSaralonde opened this issue · 1 comments

commented

Overview

Revamp the main UI into a Winamp style to make it more intuitive and more user-friendly.

Implementation

  • Clicking the minimap icon opens the main UI instead of the menu.
  • Move the EditBox for importing the base 64 music code into a popup. Replace it by a 1-line container showing the song title. The song title scrolls if it doesn't fit the container. Clicking the container opens the import popup and sets the focus to the import EditBox. When no song is loaded, display "Click to import a song...".
  • Move menu options as buttons in the main UI. Add an icon button frame in menu table for display. Don't show the button label if it doesn't fit. Remove all button/menu logic from plugins. Size and anchors of the buttons are calculated dynamically.
  • Add transport buttons for previewing.
  • Add a visualizer with timers for previewing and playing songs.
  • Move playing progress bars and streaming meter to the visualizer.
  • Add spectrum analyzer style bar visualizer. 1 bar per MIDI key or 1 bar per track (use the one that has better looking or click the visualizer to toggle between the 2 modes). Set the instrument color to the bar. Use ADD to combine textures when the same notes are playing simultaneously. The visualizer shows the song actually heard (the previewing song or the one being played if there is no song being previewed)
  • Make all URLs clickable. Clicking an URL will show a small popup with a read-only focused EditBox + message "Press Ctrl+C to copy the URL."
  • Keep some free space to add controls for upcoming features (MusicianList playlists with repeat / shuffle buttons etc.)

Additional context

Main UI

 ┌─────────────┐         
 │ 🔊 ⯈  01:08 │ [ Song title ***         ]          
 │ 🎧 ⯈  02:42 │ [28] Tracks    [🎚️][📥][🔗] 
 │ 📊📊📊📊📊📊📊 │        [📜][⌨️][🎹][ℹ️][⚙️]
 └─────────────┘        
 ━━━━━━━━━━━━━━━━━━━━━╋━━━━━━━━━━━━━━━━━━━━
 [⏮️][⏪][⏯️][⏩] [⏏️ LOAD] [🟢🧑‍🤝‍🧑][ 🔊  PLAY ]

Import popup

Import your song in MIDI format at:
https://musician.lenwe.io

then paste the music code here (Ctrl+V):
┌──────────────────────────────────────────┐  
│                                          │ 
│                                          │ 
└──────────────────────────────────────────┘  
[ CANCEL ]                        [ IMPORT ]
commented

The clickable URLs will be done in #85 .