Skip to content

Commit

Permalink
Some progress.
Browse files Browse the repository at this point in the history 
What species are detected? looks goog both with and
without a file loaded for all modes

Results / Summary look ok

Summary not files specific when useWeek is selected global species used
  • Loading branch information
@Mattk70
Mattk70 committed Feb 4, 2024
1 parent ae417a3 commit 206b96f
Show file tree
Hide file tree
Showing 7 changed files with 1,461 additions and 1,291 deletions.
5 changes: 4 additions & 1 deletion css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -538,12 +538,15 @@ input[type="range"].vertical {

#settingsForm {
height: 75vh;
min-width: 550px;
width: 65vw;
max-height: 925px;
overflow-y: auto;
overflow-x: hidden;
}

#settingsMap {
height: 300px;
}

#context-menu {
/* One more than modal */
Expand Down
2,396 changes: 1,196 additions & 1,200 deletions index.html
View file

Large diffs are not rendered by default.

8 changes: 7 additions & 1 deletion js/BirdNet2.4.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -135,6 +135,9 @@ onmessage = async (e) => {
postMessage({
message: "update-list",
blocked: BLOCKED_IDS,
lat: myModel.lat,
lon: myModel.lon,
week: myModel.week,
updateResults: false
});
myModel.warmUp(batch);
Expand Down Expand Up @@ -215,7 +218,10 @@ onmessage = async (e) => {
postMessage({
message: "update-list",
blocked: BLOCKED_IDS,
updateResults: true
lat: myModel.lat,
lon: myModel.lon,
week: myModel.week,
updateResults: false
});
break;
}
Expand Down
8 changes: 7 additions & 1 deletion js/model.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,13 +60,16 @@ tf.setBackend(backend).then(async () => {
myModel.list = e.data.list;
myModel.lat = parseFloat(e.data.lat);
myModel.lon = parseFloat(e.data.lon);
myModel.week = parseInt(e.data.week) || myModel.week;
myModel.week = parseInt(e.data.week);
myModel.speciesThreshold = parseFloat(e.data.threshold);
myModel.labels = labels;
await myModel.loadModel();
postMessage({
message: "update-list",
blocked: BLOCKED_IDS,
lat: myModel.lat,
lon: myModel.lon,
week: myModel.week,
updateResults: false
});
myModel.warmUp(batch);
Expand Down Expand Up @@ -146,6 +149,9 @@ await myModel.setList();
postMessage({
message: "update-list",
blocked: BLOCKED_IDS,
lat: myModel.lat,
lon: myModel.lon,
week: myModel.week,
updateResults: true
});
break;
Expand Down
9 changes: 6 additions & 3 deletions js/state.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ export class State {
this.filteredOffset = {}, // Current species start number for filtered results
this.selection = false,
this.blocked = [],
this.audio = { format: 'mp3', bitrate: 128, padding: false, fade: false, downmix: false, quality: 5, },
this.filters = { active: false, highPassFrequency: 0, lowShelfFrequency: 0, lowShelfAttenuation: -6, SNR: 0 },
this.audio = { format: 'mp3', bitrate: 128, padding: false, fade: false, downmix: false, quality: 5 },
this.filters = { active: false, highPassFrequency: 0, lowShelfFrequency: 0, lowShelfAttenuation: 0, SNR: 0 },
this.detect = { nocmig: false, contextAware: false, confidence: 450 },
this.chart = { range: { start: undefined, end: undefined }, species: undefined },
this.explore = { range: { start: undefined, end: undefined } },
Expand All @@ -26,7 +26,10 @@ export class State {
this.lon = undefined,
this.locationID = undefined,
this.locale = 'en_uk',
this.speciesThreshold = undefined
this.speciesThreshold = undefined,
this.useWeek = false,
this.week = -1,
this.list = 'everything'
}


Expand Down
105 changes: 79 additions & 26 deletions js/ui.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -664,7 +664,6 @@ const displayLocationAddress = async (where) => {
action: 'update-list',
list: 'location'
});

}
}

Expand Down Expand Up @@ -1361,14 +1360,15 @@ window.onload = async () => {
timeOfDay: false,
list: 'migrants',
speciesThreshold: 0.03,
useWeek: false,
model: 'chirpity',
chirpity: {locale: 'en_uk'},
birdnet: {locale: 'en_uk'},
latitude: 52.87,
longitude: 0.89, // Great Snoring :)
longitude: 0.89,
location: 'Great Snoring, North Norfolk',
detect: { nocmig: false, contextAware: false, confidence: 45 },
filters: { active: false, highPassFrequency: 250, lowShelfFrequency: 0, lowShelfAttenuation: 0, SNR: 0 },
filters: { active: false, highPassFrequency: 0, lowShelfFrequency: 0, lowShelfAttenuation: 0, SNR: 0 },
warmup: true,
backend: 'tensorflow',
tensorflow: { threads: DIAGNOSTICS['Cores'], batchSize: 32 },
Expand Down Expand Up @@ -1421,9 +1421,13 @@ window.onload = async () => {
document.getElementById('list-to-use').value = config.list;
// Show Locale
document.getElementById('locale').value = config[config.model].locale;


config.list === 'location' ? speciesThresholdEl.classList.remove('d-none') :
speciesThresholdEl.classList.add('d-none');
speciesThreshold.value = config.speciesThreshold;
document.getElementById('species-week').checked = config.useWeek;

// And update the icon
updateListIcon();
timelineSetting.value = config.timeOfDay ? 'timeOfDay' : 'timecode';
Expand Down Expand Up @@ -1493,7 +1497,9 @@ window.onload = async () => {
audio: config.audio,
limit: config.limit,
locale: config[config.model].locale,
speciesThreshold: config.speciesThreshold
speciesThreshold: config.speciesThreshold,
list: config.list,
useWeek: config.useWeek
});
const {model, backend, list} = config;
t0_warmup = Date.now();
Expand Down Expand Up @@ -1528,6 +1534,7 @@ break;
case "chart-data": {onChartData(args);
break;
}
case "current-file-week": { STATE.week = args.week}
case "diskDB-has-records": {chartsLink.classList.remove("disabled");
exploreLink.classList.remove("disabled");
break;
Expand Down Expand Up @@ -2153,24 +2160,24 @@ colourmap.addEventListener('change', (e) => {
}
})

const locale = document.getElementById('locale')
locale.addEventListener('change', async ()=> {
config[config.model].locale = locale.value;
updatePrefs();
const chirpity = config[config.model].locale === 'en_uk' && config.model !== 'birdnet' ? 'chirpity' : '';
const labelFile = `labels/V2.4/BirdNET_GLOBAL_6K_V2.4_${chirpity}Labels_${config[config.model].locale}.txt`;
fetch(labelFile).then(response => {
if (! response.ok) throw new Error('Network response was not ok');
return response.text();
}).then(filecontents => {
LABELS = filecontents.trim().split(/\r?\n/);
// Add unknown species
LABELS.push('Unknown Sp._Unknown Sp.');
worker.postMessage({action: 'update-locale', locale: config[config.model].locale, labels: LABELS})
}).catch(error =>{
console.error('There was a problem fetching the label file:', error);
})
})
// const locale = document.getElementById('locale')
// locale.addEventListener('change', async ()=> {
// config[config.model].locale = locale.value;
// updatePrefs();
// const chirpity = config[config.model].locale === 'en_uk' && config.model !== 'birdnet' ? 'chirpity' : '';
// const labelFile = `labels/V2.4/BirdNET_GLOBAL_6K_V2.4_${chirpity}Labels_${config[config.model].locale}.txt`;
// fetch(labelFile).then(response => {
// if (! response.ok) throw new Error('Network response was not ok');
// return response.text();
// }).then(filecontents => {
// LABELS = filecontents.trim().split(/\r?\n/);
// // Add unknown species
// LABELS.push('Unknown Sp._Unknown Sp.');
// worker.postMessage({action: 'update-locale', locale: config[config.model].locale, labels: LABELS})
// }).catch(error =>{
// console.error('There was a problem fetching the label file:', error);
// })
// })

// list mode icons
const listIcon = document.getElementById('list-icon')
Expand Down Expand Up @@ -2989,7 +2996,7 @@ async function renderResult({
selectionTable.textContent = '';
}
else {
showElement(['resultTableContainer', 'resultsHead'], false);
if (fileLoaded) showElement(['resultTableContainer', 'resultsHead'], false);
const resultTable = document.getElementById('resultTableBody');
resultTable.textContent = ''
}
Expand Down Expand Up @@ -3297,7 +3304,7 @@ document.getElementById('settings').addEventListener('click', async () => {
});

document.getElementById('species').addEventListener('click', async () => {
worker.postMessage({action: 'get-valid-species'})
worker.postMessage({action: 'get-valid-species', file: currentFile})
});

document.getElementById('usage').addEventListener('click', async () => {
Expand Down Expand Up @@ -3353,9 +3360,13 @@ function replaceCtrlWithCommand() {

const populateSpeciesModal = async (included, excluded) => {
const count = included.length;
const current_file_text = STATE.week !== -1 && STATE.week ? `. The current file was saved in week <b>${STATE.week}</b>` : '';
const model = config.model === 'birdnet' ? 'BirdNET' : 'Chirpity';
const location = config.list === 'location' ? ` centered on <b>${place.textContent.replace('fmd_good', '')}</b> and with a location filter threshold of <b>${config.speciesThreshold}</b>` : '';
let includedContent = `<br/><p>The number of species detected depends on the model, the list being used and in the case of the location filter, the species filter threshold. As you are using the <b>${model}</b> model and the <b>${config.list}</b> list${location}, Chirpity will display detections of the following ${count} classes:</p>`;
const species_filter_text = config.useWeek && config.list === 'location' ? `week-specific species filter threshold of <b>${config.speciesThreshold}</b>` : config.list === 'location' ? `species filter threshold of <b>${config.speciesThreshold}</b>` : '';
const location_filter_text = config.list === 'location' ? ` focused on <b>${place.textContent.replace('fmd_good', '')}</b>, with a ${species_filter_text}${current_file_text}` : '';
let includedContent = `<br/><p>The number of species detected depends on the model, the list being used and in the case of the location filter, the species filter threshold and possibly the week in which the recording was made.<p>
You are using the <b>${model}</b> model and the <b>${config.list}</b> list${location_filter_text}. With these settings, Chirpity will display detections for ${config.useWeek && config.list === 'location' && (STATE.week === -1 || !STATE.week ) ? 'up to' : ''}
<b>${count}</b> classes${config.useWeek && config.list === 'location' && (STATE.week === -1 || !STATE.week ) ? ', depending on the date of the file you analyse' : ''}:</p>`;
includedContent += '<table class="table table-striped"><thead class="sticky-top text-bg-dark"><tr><th>Common Name</th><th>Scientific Name</th></tr></thead><tbody>\n';
includedContent += generateBirdIDList(included);
includedContent += '</tbody></table>\n';
Expand Down Expand Up @@ -4119,11 +4130,53 @@ function getSnameFromCname(cname) {
return ; // Substring not found in any item
}


document.addEventListener('click', function (e) {
contextMenu.classList.add("d-none");
hideConfidenceSlider();
})



// Beginnings of the all-powerful document 'change' listener
// One listener to rule them all!
document.addEventListener('change', function (e) {
const element = e.target.closest('[id]');
if (element){
const target = element.id;
config.debug && console.log('Change target:', target)
switch (target) {
case 'species-week': {
config.useWeek = element.checked;
updatePrefs();
if (! config.useWeek) STATE.week = -1;
worker.postMessage({action:'update-state', useWeek: config.useWeek})
break;
}
case 'locale': {
config[config.model].locale = element.value;
updatePrefs();
const chirpity = config[config.model].locale === 'en_uk' && config.model !== 'birdnet' ? 'chirpity' : '';
const labelFile = `labels/V2.4/BirdNET_GLOBAL_6K_V2.4_${chirpity}Labels_${config[config.model].locale}.txt`;
fetch(labelFile).then(response => {
if (! response.ok) throw new Error('Network response was not ok');
return response.text();
}).then(filecontents => {
LABELS = filecontents.trim().split(/\r?\n/);
// Add unknown species
LABELS.push('Unknown Sp._Unknown Sp.');
worker.postMessage({action: 'update-locale', locale: config[config.model].locale, labels: LABELS})
}).catch(error =>{
console.error('There was a problem fetching the label file:', error);
})
break;
}
}
}
})



async function createContextMenu(e) {
const target = e.target;
if (target.classList.contains('circle') || target.closest('thead')) return;
Expand Down
Loading

0 comments on commit 206b96f

Please sign in to comment.