Added general playback information on web UI

This commit is contained in:
2023-12-16 22:10:26 +01:00
parent 9009e55d4f
commit 6668d56171

View File

@@ -62,25 +62,83 @@ void api_root() {
html += "<div class='accordion text-start' id='accordion-info'>"; html += "<div class='accordion text-start' id='accordion-info'>";
html += " <div class='accordion-item'>"; html += " <div class='accordion-item'>";
html += " <h2 class='accordion-header'>"; html += " <h2 class='accordion-header'>";
html += " <button class='accordion-button collapsed' type='button' data-bs-toggle='collapse' data-bs-target='#accordion-info-general' aria-expanded='true' aria-controls='accordion-info-general'>";
html += " General information";
html += " </button>";
html += " </h2>";
html += " <div id='accordion-info-general' class='accordion-collapse collapse' data-bs-parent='#accordion-info'>";
html += " <div class='accordion-body'>";
html += " <strong>Work in progress</strong>";
html += " </div>";
html += " </div>";
html += " </div>";
html += " <div class='accordion-item'>";
html += " <h2 class='accordion-header'>";
html += " <button class='accordion-button collapsed' type='button' data-bs-toggle='collapse' data-bs-target='#accordion-info-playback' aria-expanded='true' aria-controls='accordion-info-playback'>"; html += " <button class='accordion-button collapsed' type='button' data-bs-toggle='collapse' data-bs-target='#accordion-info-playback' aria-expanded='true' aria-controls='accordion-info-playback'>";
html += " Playback information"; html += " Playback information";
html += " </button>"; html += " </button>";
html += " </h2>"; html += " </h2>";
html += " <div id='accordion-info-playback' class='accordion-collapse collapse' data-bs-parent='#accordion-info'>"; html += " <div id='accordion-info-playback' class='accordion-collapse collapse' data-bs-parent='#accordion-info'>";
html += " <div class='accordion-body'>"; html += " <div class='accordion-body'>";
html += " <strong>Work in progress</strong>"; html += " <table class='table table-striped'><tbody><tr>";
html += " <td>Playing</td>";
html += " <td class='text-end'>";
html += audioPlaying ? "yes" : "no";
html += " </td>";
html += " </tr><tr>";
html += " <td>Volume</td>";
html += " <td class='text-end'>" + String(currentVolume) + "/" + String(maxVolume) + "%</td>";
html += " </tr><tr>";
html += " <td>Muted</td>";
html += " <td class='text-end'>";
html += muted ? "yes" : "no";
html += " </td>";
html += " </tr><tr>";
html += " <td>Equalizer Low</td>";
html += " <td class='text-end'>" + String(eqLow-40) + "dB</td>";
html += " </tr><tr>";
html += " <td>Equalizer Mid</td>";
html += " <td class='text-end'>" + String(eqMid-40) + "dB</td>";
html += " </tr><tr>";
html += " <td>Equalizer High</td>";
html += " <td class='text-end'>" + String(eqHigh-40) + "dB</td>";
html += " </tr><tr>";
html += " <td>Balance (range -16 | +16)</td>";
html += " <td class='text-end'>" + String(balanceLevel-16) + "</td>";
html += " </tr><tr>";
html += " <td>Path to playlist</td>";
html += " <td class='text-end'>" + currentPlaylist + "</td>";
html += " </tr><tr>";
html += " <td>Index in playlist (starting from 0)</td>";
html += " <td class='text-end'>" + String(currentPlaylistPosition) + "</td>";
html += " </tr><tr>";
html += " <td>Resource type</td>";
html += " <td class='text-end'>" + pbInfo.type + "</td>";
html += " </tr><tr>";
html += " <td>Resource title</td>";
html += " <td class='text-end'>" + pbInfo.title + "</td>";
html += " </tr><tr>";
html += " <td>Resource album</td>";
html += " <td class='text-end'>" + pbInfo.album + "</td>";
html += " </tr><tr>";
html += " <td>Resource artist</td>";
html += " <td class='text-end'>" + pbInfo.artist + "</td>";
html += " </tr><tr>";
html += " <td>Resource track number</td>";
html += " <td class='text-end'>" + pbInfo.track + "</td>";
html += " </tr><tr>";
html += " <td>Resource year</td>";
html += " <td class='text-end'>" + pbInfo.year + "</td>";
html += " </tr><tr>";
html += " <td>Resource genre</td>";
html += " <td class='text-end'>" + pbInfo.genre + "</td>";
html += " </tr></tbody></table>";
html += " </div>";
html += " </div>";
html += " </div>";
html += " <div class='accordion-item'>";
html += " <h2 class='accordion-header'>";
html += " <button class='accordion-button collapsed' type='button' data-bs-toggle='collapse' data-bs-target='#accordion-info-general' aria-expanded='true' aria-controls='accordion-info-general'>";
html += " General information";
html += " </button>";
html += " </h2>";
html += " <div id='accordion-info-general' class='accordion-collapse collapse' data-bs-parent='#accordion-info'>";
html += " <div class='accordion-body'>";
html += " <table class='table table-striped'><tbody><tr>";
html += " <td>Version</td>";
html += " <td class='text-end'>" + version + "</td>";
html += " </tr><tr>";
html += " <td>Friendly name</td>";
html += " <td class='text-end'>" + configuration.getString(PREFERENCES_KEY_FRIENDLY_NAME, "<not_given>") + "</td>";
html += " </tr></tbody></table>";
html += " </div>"; html += " </div>";
html += " </div>"; html += " </div>";
html += " </div>"; html += " </div>";