Add Album and Album Artist editing with modal dialog UI

[Copilot]

Enables editing of Album and Album Artist fields for Last.fm scrobbles. Previously only Track and Artist were editable.

Changes

Modal Dialog UI

• Replaced inline editing with centered modal over darkened overlay
• Fields: Track, Artist, Album, Album Artist, Timestamp (read-only)
• Close via X button, Cancel, Escape, or overlay click
• Enter key saves from any input field

API Integration

• Fetch album metadata via track.getInfo endpoint
• Submit album/albumartist params to track.scrobble endpoint
• Change detection includes all fields, not just track/artist

Security

• HTML entity escaping prevents XSS from malicious track names
• Event listener cleanup prevents memory leaks
• Modal close guard prevents race conditions

Screenshot

Implementation Notes

Album data flows from Last.fm's track info response:

fetchTrackInfo(artist, track, function(albumInfo) {
    showEditModal(trackinfo, track, artist, albumInfo.album, albumInfo.albumArtist, timestamp);
});

The modal uses inline styles for portability and proper HTML escaping via textContent:

function escapeHtml(text) {
    var div = document.createElement('div');
    div.textContent = text;
    return div.innerHTML;
}

Original prompt

---

This section details on the original issue you should resolve

<issue_title>[Edit Last.fm Scrobbles] Edit Album/Album Artist</issue_title>
<issue_description>would be great if the album/album artist fields could be edited too</issue_description>

<agent_instructions>Get the necessary data from Last.fm, add the new Data to last.fm

Centered modal dialog over a darkened website background.

Modal structure:

White rectangular modal with rounded corners and a subtle drop shadow.

Title at the top: “Edit Scrobble”, centered.

Close icon (X) in the top-right corner of the modal.

Form content (single-column layout):

Each row consists of a left-aligned label and a right-aligned text input.

Labels are short, bold or semibold.

Fields in order:

1. Track

Text input prefilled with the track title

2. Artist

Text input prefilled with the artist name

3. Album

Text input prefilled with the album title

4. Album Artist

Text input prefilled with the Album artist

5. Timestamp

Read-only text, not an input field

Displays “Thursday 14 Mar 2019, 9:03pm” or similiar

Buttons (centered):

“Cancel”

Light gray button, secondary action.

“Save edit”

Red button, primary confirmation action.

Interaction notes:

Modal blocks background interaction.

Keyboard focus is expected to be trapped within the modal.

Save and cancel actions clearly separated by color and hierarchy.</agent_instructions>

Comments on the Issue (you are @copilot in this section)

@CennoxX This is possible, but would require big UI changes, I don't have the time for. If someone else wants to build this, I am open for PRs. @CennoxX > > This is possible, but would require big UI changes, I don't have the time for. If someone else wants to build this, I am open for PRs. > > You can't just copy & paste some?

The issue isn't about copying and pasting code. Editing album and album artist fields requires reworking the UI and syncing changes back to last.fm. It's definitely doable, just not a small task. I'm happy to review and support a PR if someone wants to tackle it!</comment_new>

• Fixes [Edit Last.fm Scrobbles] Edit Album/Album Artist #16

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.