53 lines
1.5 KiB
HTML
53 lines
1.5 KiB
HTML
<div id="lastfm-stats-app">
|
|
<div class="stats-form">
|
|
<div class="form-group">
|
|
<label for="lastfm-username">Last.fm Username</label>
|
|
<input
|
|
type="text"
|
|
id="lastfm-username"
|
|
placeholder="Enter your username"
|
|
/>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="time-period">Time Period</label>
|
|
<select id="time-period">
|
|
<option value="7day">Past Week (7 days)</option>
|
|
<option value="1month">Past Month (30 days)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<button id="fetch-stats" class="btn-primary">Get Stats</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="stats-results" class="stats-results" style="display: none">
|
|
<div id="stats-loading" class="loading" style="display: none">
|
|
<p>Loading your stats...</p>
|
|
</div>
|
|
|
|
<div id="stats-content" style="display: none">
|
|
<h2>Your Last.fm Stats</h2>
|
|
|
|
<div class="stat-box">
|
|
<h3>Total Tracks</h3>
|
|
<p id="total-tracks" class="stat-number">-</p>
|
|
</div>
|
|
|
|
<div class="stat-box">
|
|
<h3>Top 5 Artists</h3>
|
|
<ul id="top-artists" class="artist-list"></ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="export-buttons" class="export-buttons" style="display: none">
|
|
<button id="copy-markdown" class="btn-export">Copy as Markdown</button>
|
|
<button id="copy-plaintext" class="btn-export">Copy as Plain Text</button>
|
|
</div>
|
|
|
|
<div id="stats-error" class="error" style="display: none">
|
|
<p id="error-message"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|