diff --git a/src/control.html b/src/control.html
index e46dda8..e613037 100644
--- a/src/control.html
+++ b/src/control.html
@@ -53,7 +53,7 @@
- Trascina ⠿ per riordinare · ⌨ tasto rapido · ▶/⏸ avvia/pausa
+ Clic sul nome = avvia/riavvia dall'inizio · ▶/⏸ pausa/riprendi · ⠿ trascina per riordinare · ⌨ tasto rapido
diff --git a/src/control.js b/src/control.js
index 980aedd..9fa51e8 100644
--- a/src/control.js
+++ b/src/control.js
@@ -274,7 +274,7 @@ function renderPlaylist() {
const prog = (isCur && playDur > 0) ? Math.min(100, playCur / playDur * 100) : 0;
li.innerHTML =
'⠿' +
- '' + tr.name + '' +
+ '' + tr.name + '' +
'' + timeLabel + '' +
'' +
@@ -282,6 +282,8 @@ function renderPlaylist() {
'' +
(isCur ? '' : '');
+ // Clicking the name (re)starts the track from the beginning.
+ li.querySelector('.tname').addEventListener('click', () => playIndex(i));
// On the current track the button pauses/resumes/replays; on others it starts that track.
li.querySelector('.play-btn').addEventListener('click', () => {
if (i === currentIndex) togglePlayPause();
diff --git a/src/style.css b/src/style.css
index 207c89b..71fcf2e 100644
--- a/src/style.css
+++ b/src/style.css
@@ -331,7 +331,9 @@ textarea.textarea-lg {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
+ cursor: pointer;
}
+.track .tname:hover { color: #cde0ff; }
.track button {
flex: 0 0 auto;
padding: 3px 8px;