Added similarity search
Build and Publish / Build and Publish Docker Image (push) Successful in 3m29s
Build and Publish / Build and Publish Docker Image (push) Successful in 3m29s
This commit is contained in:
Aleksandr Bogomiakov
+180
-2
@@ -2192,6 +2192,63 @@ tbody tr:hover {
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="panel">
|
||||
<div class="panel-head">
|
||||
<div class="panel-title">
|
||||
<strong>Similarity Search</strong>
|
||||
<span>Local audio embeddings and federated nearest-track search</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="settings-grid">
|
||||
<div class="setting-toggle settings-wide">
|
||||
<label>
|
||||
<span>Similarity search enabled</span>
|
||||
<span class="source-pill" :class="sourceClass('similarity_enabled')" x-text="settingSource('similarity_enabled')"></span>
|
||||
</label>
|
||||
<div class="setting-toggle-row">
|
||||
<span x-text="settingsDraft.similarity_enabled ? 'Enabled for this instance' : 'Disabled'"></span>
|
||||
<input type="checkbox" x-model="settingsDraft.similarity_enabled" />
|
||||
</div>
|
||||
<div class="setting-help">Downloads the selected model and processes every visible local track. When federation is also enabled, this instance sends anonymized query embeddings to peers and answers their searches.</div>
|
||||
</div>
|
||||
<div class="setting-field settings-wide">
|
||||
<label>
|
||||
<span>Embedding model</span>
|
||||
<span class="source-pill" :class="sourceClass('similarity_model')" x-text="settingSource('similarity_model')"></span>
|
||||
</label>
|
||||
<select x-model="settingsDraft.similarity_model">
|
||||
<template x-for="model in similarityStatus.models || []" :key="model.id">
|
||||
<option :value="model.id" x-text="`${model.id} · ${model.dimensions}d`"></option>
|
||||
</template>
|
||||
</select>
|
||||
<div class="setting-help" x-text="(similarityStatus.models || []).find(model => model.id === settingsDraft.similarity_model)?.license || ''"></div>
|
||||
</div>
|
||||
<div class="setting-field settings-wide">
|
||||
<label>
|
||||
<span>Preprocessing profile</span>
|
||||
<span class="source-pill" :class="sourceClass('similarity_profile')" x-text="settingSource('similarity_profile')"></span>
|
||||
</label>
|
||||
<select x-model="settingsDraft.similarity_profile">
|
||||
<template x-for="profile in similarityStatus.profiles || []" :key="profile.id">
|
||||
<option :value="profile.id" x-text="profile.title"></option>
|
||||
</template>
|
||||
</select>
|
||||
<details class="setting-help" style="margin-top:8px">
|
||||
<summary style="cursor:pointer">Show profile details</summary>
|
||||
<pre style="white-space:pre-wrap;font:inherit;margin:8px 0 0" x-text="selectedSimilarityProfile()?.details || 'Profile details are loading…'"></pre>
|
||||
</details>
|
||||
</div>
|
||||
<div class="setting-field">
|
||||
<label>
|
||||
<span>Background workers</span>
|
||||
<span class="source-pill" :class="sourceClass('similarity_workers')" x-text="settingSource('similarity_workers')"></span>
|
||||
</label>
|
||||
<input type="number" min="1" max="16" step="1" x-model="settingsDraft.similarity_workers" />
|
||||
<div class="setting-help">Applied immediately after saving.</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="settings-column settings-side">
|
||||
@@ -2323,7 +2380,7 @@ tbody tr:hover {
|
||||
</div>
|
||||
<div class="probe-row"><span>RTT</span><strong x-text="fedRtt(fedTransport().last_rtt_ms)"></strong></div>
|
||||
<div class="probe-row"><span>Path samples</span><strong x-text="`${fedTransport().direct_samples || 0} direct · ${fedTransport().relay_samples || 0} relay · ${fedTransport().custom_samples || 0} custom · ${fedTransport().unknown_samples || 0} unknown`"></strong></div>
|
||||
<div class="probe-row"><span>Protocols</span><strong x-text="`${fedTransport().audio_samples || 0} audio · ${fedTransport().catalog_samples || 0} catalog · ${fedTransport().sync_samples || 0} sync`"></strong></div>
|
||||
<div class="probe-row"><span>Protocols</span><strong x-text="`${fedTransport().audio_samples || 0} audio · ${fedTransport().catalog_samples || 0} catalog · ${fedTransport().similarity_samples || 0} similarity · ${fedTransport().sync_samples || 0} sync`"></strong></div>
|
||||
<div class="probe-row"><span>Last peer</span><strong x-text="fedShort(fedTransport().last_peer)"></strong></div>
|
||||
</div>
|
||||
<div class="probe-table" x-show="fedTransport().last && fedTransport().last.length" style="margin-top:10px">
|
||||
@@ -2366,6 +2423,44 @@ tbody tr:hover {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="panel">
|
||||
<div class="panel-head">
|
||||
<div class="panel-title">
|
||||
<strong>Similarity Status</strong>
|
||||
<span>Model download, indexing, and active profile</span>
|
||||
</div>
|
||||
<span class="badge" :class="similarityBadge()" x-text="similarityStatus.status?.phase || 'disabled'"></span>
|
||||
</div>
|
||||
<div class="probe-body">
|
||||
<div class="probe-table">
|
||||
<div class="probe-row"><span>Model</span><strong x-text="similarityStatus.status?.model || settingsDraft.similarity_model || '-' "></strong></div>
|
||||
<div class="probe-row"><span>Active profile</span><strong :title="similarityStatus.status?.active_profile || ''" x-text="similarityStatus.status?.active_profile ? similarityStatus.status.active_profile.slice(0, 22) + '…' : 'not ready'"></strong></div>
|
||||
<div class="probe-row" x-show="similarityStatus.status?.target_profile && similarityStatus.status?.target_profile !== similarityStatus.status?.active_profile">
|
||||
<span>Processing profile</span><strong :title="similarityStatus.status?.target_profile || ''" x-text="similarityStatus.status?.target_profile?.slice(0, 22) + '…'"></strong>
|
||||
</div>
|
||||
<div class="probe-row"><span>Visible tracks</span><strong x-text="similarityStatus.status?.total_tracks ?? 0"></strong></div>
|
||||
<div class="probe-row"><span>Processed</span><strong x-text="`${similarityStatus.status?.completed_tracks || 0} · ${similarityProgress()}%`"></strong></div>
|
||||
<div class="probe-row"><span>Failed</span><strong x-text="similarityStatus.status?.failed_tracks || 0"></strong></div>
|
||||
<div class="probe-row"><span>Stored</span><strong x-text="`${similarityStatus.status?.stored_vectors || 0} vectors · ${formatBytes(similarityStatus.status?.stored_bytes || 0)}`"></strong></div>
|
||||
<div class="probe-row" x-show="similarityStatus.status?.current_track"><span>Current track</span><strong x-text="similarityStatus.status?.current_track"></strong></div>
|
||||
</div>
|
||||
<div style="height:6px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden;margin-top:12px" x-show="similarityStatus.status?.phase === 'processing'">
|
||||
<div style="height:100%;background:var(--accent);transition:width .25s" :style="`width:${similarityProgress()}%`"></div>
|
||||
</div>
|
||||
<p class="probe-intro muted" x-show="similarityStatus.status?.last_error" x-text="similarityStatus.status?.last_error"></p>
|
||||
<div class="toolbar" style="margin-top:14px;flex-wrap:wrap;gap:8px">
|
||||
<button class="btn" type="button" @click="loadSimilarity()" :disabled="similarityLoading">
|
||||
<i data-lucide="refresh-cw"></i>
|
||||
Refresh
|
||||
</button>
|
||||
<button class="btn danger" type="button" @click="clearSimilarityEmbeddings()" :disabled="similarityLoading || !(similarityStatus.status?.stored_vectors > 0)">
|
||||
<i data-lucide="trash-2"></i>
|
||||
Clear all embeddings
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="panel">
|
||||
<div class="panel-head">
|
||||
<div class="panel-title">
|
||||
@@ -2936,7 +3031,11 @@ function adminV2() {
|
||||
agent_concurrency: '',
|
||||
federation_enabled: false,
|
||||
federation_network_id: '',
|
||||
federation_save_on_listen: false
|
||||
federation_save_on_listen: false,
|
||||
similarity_enabled: false,
|
||||
similarity_model: 'discogs-effnet-bsdynamic-1',
|
||||
similarity_profile: 'furumi-full-track-v1',
|
||||
similarity_workers: '1'
|
||||
},
|
||||
settingsProbe: { status: 'idle', ok: false },
|
||||
settingsProbeLoading: false,
|
||||
@@ -2944,6 +3043,8 @@ function adminV2() {
|
||||
federationLoading: false,
|
||||
federationTicket: '',
|
||||
fedConnectTicket: '',
|
||||
similarityStatus: { status: { phase: 'disabled' }, models: [], profiles: [] },
|
||||
similarityLoading: false,
|
||||
settingsSaving: false,
|
||||
routeReady: false,
|
||||
poller: null,
|
||||
@@ -3007,6 +3108,11 @@ function adminV2() {
|
||||
]);
|
||||
} else if (this.activeView === 'users') {
|
||||
await Promise.allSettled([this.loadUsers(false)]);
|
||||
} else if (this.activeView === 'settings') {
|
||||
await Promise.allSettled([
|
||||
this.loadFederation(false),
|
||||
this.loadSimilarity(false)
|
||||
]);
|
||||
} else {
|
||||
await Promise.allSettled([this.loadJobs(false), this.loadReviews(false)]);
|
||||
}
|
||||
@@ -3069,6 +3175,10 @@ function adminV2() {
|
||||
} else if (this.activeView === 'settings') {
|
||||
if (updateRoute) this.setRoute('#settings');
|
||||
await this.loadSettings();
|
||||
await Promise.allSettled([
|
||||
this.loadFederation(false),
|
||||
this.loadSimilarity(false)
|
||||
]);
|
||||
if (!this.settingsProbe.status || this.settingsProbe.status === 'idle') {
|
||||
await this.loadSettingsProbe(false);
|
||||
}
|
||||
@@ -3216,6 +3326,21 @@ function adminV2() {
|
||||
|
||||
async saveSettings() {
|
||||
if (this.settingsSaving) return;
|
||||
const networkSimilarityWasEnabled = Boolean(
|
||||
this.settings.values?.similarity_enabled
|
||||
&& this.settings.values?.federation_enabled
|
||||
);
|
||||
const networkSimilarityWillBeEnabled = Boolean(
|
||||
this.settingsDraft.similarity_enabled
|
||||
&& this.settingsDraft.federation_enabled
|
||||
);
|
||||
if (!networkSimilarityWasEnabled && networkSimilarityWillBeEnabled) {
|
||||
const accepted = window.confirm(
|
||||
'Similarity searches send an anonymized embedding of the selected track to federation peers. '
|
||||
+ 'Peers do not receive a user identity, but the query can technically reveal what is being searched. Enable this for the instance?'
|
||||
);
|
||||
if (!accepted) return;
|
||||
}
|
||||
this.settingsSaving = true;
|
||||
try {
|
||||
await this.request(`${this.apiBase}/settings`, {
|
||||
@@ -3224,6 +3349,7 @@ function adminV2() {
|
||||
});
|
||||
await this.loadSettings(false);
|
||||
await this.loadFederation(false);
|
||||
await this.loadSimilarity(false);
|
||||
this.showToast('Settings saved');
|
||||
} catch (error) {
|
||||
this.showToast(error.message);
|
||||
@@ -3238,6 +3364,7 @@ function adminV2() {
|
||||
this.setRoute('#settings');
|
||||
await this.loadSettings();
|
||||
await this.loadFederation(false);
|
||||
await this.loadSimilarity(false);
|
||||
if (!this.settingsProbe.status || this.settingsProbe.status === 'idle') {
|
||||
await this.loadSettingsProbe(false);
|
||||
}
|
||||
@@ -3255,6 +3382,57 @@ function adminV2() {
|
||||
}
|
||||
},
|
||||
|
||||
async loadSimilarity(showErrors = true) {
|
||||
this.similarityLoading = true;
|
||||
try {
|
||||
this.similarityStatus = await this.request(`${this.apiBase}/similarity`);
|
||||
} catch (error) {
|
||||
if (showErrors) this.showToast(error.message);
|
||||
} finally {
|
||||
this.similarityLoading = false;
|
||||
this.icons();
|
||||
}
|
||||
},
|
||||
|
||||
async clearSimilarityEmbeddings() {
|
||||
if (!window.confirm('Delete embeddings for every model and preprocessing profile? Audio files are not affected.')) return;
|
||||
this.similarityLoading = true;
|
||||
try {
|
||||
await this.request(`${this.apiBase}/similarity/clear`, {
|
||||
method: 'POST',
|
||||
body: '{}'
|
||||
});
|
||||
await this.loadSimilarity(false);
|
||||
this.showToast('All embeddings cleared');
|
||||
} catch (error) {
|
||||
this.showToast(error.message);
|
||||
} finally {
|
||||
this.similarityLoading = false;
|
||||
this.icons();
|
||||
}
|
||||
},
|
||||
|
||||
selectedSimilarityProfile() {
|
||||
return (this.similarityStatus.profiles || []).find(
|
||||
profile => profile.id === this.settingsDraft.similarity_profile
|
||||
) || null;
|
||||
},
|
||||
|
||||
similarityBadge() {
|
||||
const phase = this.similarityStatus.status?.phase || 'disabled';
|
||||
if (phase === 'ready') return 'ok';
|
||||
if (phase === 'error') return 'failed';
|
||||
if (['downloading', 'loading', 'processing'].includes(phase)) return 'running';
|
||||
return 'disabled';
|
||||
},
|
||||
|
||||
similarityProgress() {
|
||||
const status = this.similarityStatus.status || {};
|
||||
const total = Number(status.total_tracks || 0);
|
||||
const completed = Number(status.completed_tracks || 0);
|
||||
return total > 0 ? Math.min(100, Math.round(completed * 100 / total)) : 0;
|
||||
},
|
||||
|
||||
async fedSyncNow() {
|
||||
this.federationLoading = true;
|
||||
try {
|
||||
|
||||
@@ -653,6 +653,17 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<section class="user-settings-section">
|
||||
<div class="user-settings-section-head">
|
||||
<div>
|
||||
<h4>{{ t.player_interface_language }}</h4>
|
||||
<p>{{ t.player_language_description }}</p>
|
||||
</div>
|
||||
<button class="settings-secondary-btn"
|
||||
onclick="location.href='/set-lang?lang={% if t.lang.code() == "en" %}ru{% else %}en{% endif %}&next='+encodeURIComponent(location.pathname+location.search+location.hash)">{{ t.player_switch_language }}</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="user-settings-section">
|
||||
<div class="user-settings-section-head">
|
||||
<div>
|
||||
|
||||
@@ -44,6 +44,9 @@ const T = {
|
||||
lastfmDisconnectFailed: "{{ t.player_lastfm_disconnect_failed }}",
|
||||
startRadio: "{{ t.player_start_radio }}",
|
||||
radioFailed: "{{ t.player_radio_failed }}",
|
||||
searchSimilarTo: "{{ t.player_search_similar_to }}",
|
||||
findSimilar: "{{ t.player_find_similar }}",
|
||||
similarityFailed: "{{ t.player_similarity_failed }}",
|
||||
share: "{{ t.player_share }}",
|
||||
shareTrack: "{{ t.player_share_track }}",
|
||||
shareQueue: "{{ t.player_share_queue }}",
|
||||
@@ -2503,6 +2506,8 @@ document.addEventListener('alpine:init', () => {
|
||||
searchQuery: '',
|
||||
searchResults: null,
|
||||
searchLoading: false,
|
||||
similaritySearchLabel: '',
|
||||
similaritySearchError: '',
|
||||
federationSearch: { loading: false, error: '', artists: [], releases: [], tracks: [] },
|
||||
artistFederation: { loading: false, error: '', releases: [], tracks: [] },
|
||||
federationPreparing: {},
|
||||
@@ -2594,6 +2599,8 @@ document.addEventListener('alpine:init', () => {
|
||||
this.searchQuery = q;
|
||||
this.search(q, options);
|
||||
}
|
||||
} else if (view === 'similar' && id) {
|
||||
this.searchSimilar(id, options);
|
||||
} else {
|
||||
this.goArtists(options);
|
||||
}
|
||||
@@ -3047,6 +3054,7 @@ document.addEventListener('alpine:init', () => {
|
||||
openTrackInfo(track) {
|
||||
Alpine.store('info').openRows(T.trackInfoTitle, this.trackInfoRows(track), [
|
||||
{ label: T.startRadio, run: () => this.startRadio('track', track?.id) },
|
||||
{ label: T.findSimilar, run: () => this.searchSimilar(track) },
|
||||
]);
|
||||
},
|
||||
|
||||
@@ -3385,6 +3393,8 @@ document.addEventListener('alpine:init', () => {
|
||||
}
|
||||
this.view = 'search';
|
||||
this.searchLoading = true;
|
||||
this.similaritySearchLabel = '';
|
||||
this.similaritySearchError = '';
|
||||
this.startFederationSearch(q);
|
||||
try {
|
||||
const res = await fetch(`/api/player/search?q=${encodeURIComponent(q)}&limit=10`);
|
||||
@@ -3397,11 +3407,59 @@ document.addEventListener('alpine:init', () => {
|
||||
this._afterNavigation(options);
|
||||
},
|
||||
|
||||
async searchSimilar(trackOrId, options = {}) {
|
||||
const id = Number(typeof trackOrId === 'object' ? trackOrId?.id : trackOrId);
|
||||
if (!Number.isInteger(id) || id <= 0) return;
|
||||
const track = typeof trackOrId === 'object' ? trackOrId : null;
|
||||
const artist = (track?.artists || []).map(item => item.name).filter(Boolean).join(', ');
|
||||
const initialLabel = track
|
||||
? [track.title, artist].filter(Boolean).join(' — ')
|
||||
: '';
|
||||
this._beginNavigation(`#similar/${id}`, options);
|
||||
if (this.view !== 'search') this._previousView = this.view;
|
||||
this.stopFederationSearch();
|
||||
this.view = 'search';
|
||||
this.searchQuery = initialLabel;
|
||||
this.similaritySearchLabel = initialLabel;
|
||||
this.similaritySearchError = '';
|
||||
this.searchLoading = true;
|
||||
this.searchResults = null;
|
||||
this.federationSearch = { loading: true, error: '', artists: [], releases: [], tracks: [] };
|
||||
Alpine.store('info').close();
|
||||
try {
|
||||
const response = await fetch(`/api/player/similarity/${id}`);
|
||||
const data = await response.json().catch(() => ({}));
|
||||
if (!response.ok) throw new Error(data.error || T.similarityFailed);
|
||||
this.similaritySearchLabel = data.label || initialLabel;
|
||||
this.searchQuery = this.similaritySearchLabel;
|
||||
this.searchResults = {
|
||||
artists: [],
|
||||
releases: [],
|
||||
tracks: Array.isArray(data.tracks) ? data.tracks : [],
|
||||
};
|
||||
this.federationSearch = {
|
||||
loading: false,
|
||||
error: data.federation_error || '',
|
||||
artists: [],
|
||||
releases: [],
|
||||
tracks: Array.isArray(data.federation_tracks) ? data.federation_tracks : [],
|
||||
};
|
||||
} catch (error) {
|
||||
this.searchResults = { artists: [], releases: [], tracks: [] };
|
||||
this.federationSearch = { loading: false, error: '', artists: [], releases: [], tracks: [] };
|
||||
this.similaritySearchError = error?.message || T.similarityFailed;
|
||||
}
|
||||
this.searchLoading = false;
|
||||
this._afterNavigation(options);
|
||||
},
|
||||
|
||||
clearSearch() {
|
||||
this.stopFederationSearch();
|
||||
this.searchQuery = '';
|
||||
this.searchResults = null;
|
||||
this.searchLoading = false;
|
||||
this.similaritySearchLabel = '';
|
||||
this.similaritySearchError = '';
|
||||
if (this.view === 'search') {
|
||||
this.view = this._previousView || 'artists';
|
||||
this._setHash(this.view === 'my_uploads' ? '#uploads' : '#artists');
|
||||
|
||||
@@ -379,12 +379,23 @@
|
||||
<!-- Search Results -->
|
||||
<template x-if="$store.library.view === 'search'">
|
||||
<div>
|
||||
<h2 class="search-similarity-title"
|
||||
x-show="$store.library.similaritySearchLabel"
|
||||
x-cloak>
|
||||
<span>{{ t.player_search_similar_to }}</span>
|
||||
<strong x-text="$store.library.similaritySearchLabel"></strong>
|
||||
</h2>
|
||||
<template x-if="$store.library.searchLoading">
|
||||
<div class="loading-spinner"><div class="spinner"></div></div>
|
||||
</template>
|
||||
<template x-if="!$store.library.searchLoading && $store.library.similaritySearchError">
|
||||
<div class="empty-state">
|
||||
<p x-text="$store.library.similaritySearchError"></p>
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="!$store.library.searchLoading && $store.library.searchResults">
|
||||
<div>
|
||||
<template x-if="$store.library.searchResults.artists.length === 0 && $store.library.searchResults.releases.length === 0 && $store.library.searchResults.tracks.length === 0">
|
||||
<template x-if="!$store.library.similaritySearchError && $store.library.searchResults.artists.length === 0 && $store.library.searchResults.releases.length === 0 && $store.library.searchResults.tracks.length === 0">
|
||||
<div class="empty-state">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
|
||||
<p>{{ t.player_no_results }}</p>
|
||||
|
||||
@@ -2872,6 +2872,21 @@ button.user-stat:hover {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.search-similarity-title {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: baseline;
|
||||
gap: 8px;
|
||||
margin: 0 0 20px;
|
||||
color: var(--text-muted);
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.search-similarity-title strong {
|
||||
color: var(--text);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.search-artists-row {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
|
||||
Reference in New Issue
Block a user