commit 13/10/2025
Soundbank menu
This commit is contained in:
2
html/webpage/assets/js/select2.min.js
vendored
Normal file
2
html/webpage/assets/js/select2.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -26,11 +26,7 @@ window.soundbankdata = [];
|
||||
*/
|
||||
window.selectedsoundrow = null;
|
||||
|
||||
/**
|
||||
* List of sound files in the soundbank directory, that ends with .wav or .mp3
|
||||
* @type {string[]}
|
||||
*/
|
||||
window.soundbankfiles = [];
|
||||
|
||||
|
||||
/**
|
||||
* Select2 data source
|
||||
@@ -97,28 +93,58 @@ function fill_soundbanktablebody(vv) {
|
||||
$('#tablesize').text("Table Size: " + vv.length);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Reload soundbank files from server
|
||||
* @param {String} APIURL API URL endpoint (default "SoundBank/")
|
||||
* Reload soundbank files from server and filter by language, category, and voiceType
|
||||
* @param {String} language
|
||||
* @param {String} category
|
||||
* @param {String} voiceType
|
||||
*/
|
||||
function reloadSoundbankFiles(APIURL = "SoundBank/") {
|
||||
window.soundbankfiles = [];
|
||||
fetchAPI(APIURL + "ListFiles", "GET", {}, null, (okdata) => {
|
||||
// okdata is a string contains elements separated by semicolon ;
|
||||
if (Array.isArray(okdata)) {
|
||||
window.soundbankfiles = okdata.filter(item => item.trim().length > 0);
|
||||
// refill select2data
|
||||
window.select2data = window.soundbankfiles.map((item, index) => ({ id: index + 1, text: item }));
|
||||
} else console.log("reloadSoundbankFiles: okdata is not array");
|
||||
}, (errdata) => {
|
||||
alert("Error loading soundbank files : " + errdata.message);
|
||||
});
|
||||
function reloadSoundbankFiles(language, category, voiceType) {
|
||||
window.select2data = [];
|
||||
$('#modalpath').empty().trigger('change');
|
||||
if (language && language.length > 0) {
|
||||
if (category && category.length > 0) {
|
||||
if (voiceType && voiceType.length > 0) {
|
||||
fetchAPI(`ListFiles/${language}/${voiceType}/${category}`, "GET", {}, null, (okdata) => {
|
||||
console.log("reloadSoundbankFiles: got " + okdata.length + " items");
|
||||
if (Array.isArray(okdata)){
|
||||
window.select2data = okdata.map(p => ({id: getFilenameFromPath(p), text: getFilenameFromPath(p)}));
|
||||
|
||||
$('#modalpath').select2({
|
||||
data: window.select2data,
|
||||
placeholder: 'Select a sound file',
|
||||
allowClear: true,
|
||||
width: '100%',
|
||||
dropdownParent: $('#soundbankmodal')
|
||||
});
|
||||
}
|
||||
}, (errdata) => {
|
||||
alert("Error loading soundbank files : " + errdata.message);
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function getFilenameFromPath(path) {
|
||||
if (!path || path.length === 0) return "";
|
||||
if (path.includes('\\')) {
|
||||
let parts = path.split('\\');
|
||||
return parts[parts.length - 1];
|
||||
} else if (!path.includes('/')) {
|
||||
let parts = path.split('/');
|
||||
return parts[parts.length - 1];
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
console.log("soundbank.js loaded successfully");
|
||||
reloadSoundbankFiles();
|
||||
$('#soundbanktablebody').empty();
|
||||
window.selectedsoundrow = null;
|
||||
let $btnClear = $('#btnClear');
|
||||
@@ -137,7 +163,9 @@ $(document).ready(function () {
|
||||
let $modalcategory = $modal.find('#modalcategory');
|
||||
let $modallanguage = $modal.find('#modallanguage');
|
||||
let $modalvoicetype = $modal.find('#modalvoicetype');
|
||||
let $modalpath = $modal.find('#modalpath');
|
||||
let selected_category = null;
|
||||
let selected_language = null;
|
||||
let selected_voicetype = null;
|
||||
|
||||
/**
|
||||
* Clear soundbank modal inputs
|
||||
@@ -164,12 +192,8 @@ $(document).ready(function () {
|
||||
$modalvoicetype.append(new Option(vt, vt));
|
||||
});
|
||||
$modalvoicetype.val(null);
|
||||
// fill modalpath options from soundbankfiles[]
|
||||
// TODO read https://jeesite.com/front/jquery-select2/4.0/index.htm
|
||||
console.log("window.select2data has " + window.select2data.length + " items");
|
||||
$('#modalpath').select2({
|
||||
data: window.select2data
|
||||
})
|
||||
$('#modalpath').select2()
|
||||
|
||||
}
|
||||
|
||||
reloadSoundBank(APIURL);
|
||||
@@ -193,14 +217,80 @@ $(document).ready(function () {
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function SetupEventForCategoryLanguageVoiceType() {
|
||||
$modalcategory.off('change').on('change', function () {
|
||||
selected_category = $(this).val();
|
||||
reloadSoundbankFiles(selected_language, selected_category, selected_voicetype);
|
||||
});
|
||||
$modallanguage.off('change').on('change', function () {
|
||||
selected_language = $(this).val();
|
||||
reloadSoundbankFiles(selected_language, selected_category, selected_voicetype);
|
||||
});
|
||||
$modalvoicetype.off('change').on('change', function () {
|
||||
selected_voicetype = $(this).val();
|
||||
reloadSoundbankFiles(selected_language, selected_category, selected_voicetype);
|
||||
});
|
||||
}
|
||||
|
||||
$btnAdd.click(() => {
|
||||
|
||||
$modal.modal('show');
|
||||
clearSoundbankModal();
|
||||
// event on selection change of language, category, voiceType
|
||||
SetupEventForCategoryLanguageVoiceType();
|
||||
|
||||
|
||||
// event on Click save button
|
||||
$modal.off('click.soundbanksave').on('click.soundbanksave', '#soundbanksave', function () {
|
||||
//TODO Add soundbank save process here
|
||||
let description = $modaldescription.val().trim();
|
||||
let tag = $modaltag.val().trim();
|
||||
let category = $modalcategory.val();
|
||||
let language = $modallanguage.val();
|
||||
let voiceType = $modalvoicetype.val();
|
||||
let path = $('#soundbankmodal #modalpath').val();
|
||||
if (!description || description.length === 0) {
|
||||
alert("Description is required");
|
||||
return;
|
||||
}
|
||||
if (!tag || tag.length === 0) {
|
||||
alert("Tag is required");
|
||||
return;
|
||||
}
|
||||
if (!category || category.length === 0) {
|
||||
alert("Category is required");
|
||||
return;
|
||||
}
|
||||
if (!language || language.length === 0) {
|
||||
alert("Language is required");
|
||||
return;
|
||||
}
|
||||
if (!voiceType || voiceType.length === 0) {
|
||||
alert("Voice Type is required");
|
||||
return;
|
||||
}
|
||||
if (!path || path.length === 0) {
|
||||
alert("Path is required");
|
||||
return;
|
||||
}
|
||||
$modal.modal('hide');
|
||||
/**
|
||||
* @type {SoundBank}
|
||||
*/
|
||||
let nsb = {
|
||||
Description: description,
|
||||
TAG: tag,
|
||||
Category: category,
|
||||
Language: language,
|
||||
VoiceType: voiceType,
|
||||
Path: path
|
||||
}
|
||||
fetchAPI(APIURL + "Add", "POST", {}, nsb, (okdata) => {
|
||||
reloadSoundBank(APIURL);
|
||||
alert("Success add soundbank : " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error add soundbank : " + errdata.message);
|
||||
});
|
||||
});
|
||||
// event on Click close button
|
||||
$modal.off('click.soundbankclose').on('click.soundbankclose', '#soundbankclose', function () {
|
||||
@@ -236,27 +326,82 @@ $(document).ready(function () {
|
||||
/** @type {SoundBank} */
|
||||
let sb = {
|
||||
index: cells.eq(0).text(),
|
||||
description: cells.eq(1).text(),
|
||||
tag: cells.eq(2).text(),
|
||||
category: cells.eq(3).text(),
|
||||
language: cells.eq(4).text(),
|
||||
voiceType: cells.eq(5).text(),
|
||||
path: cells.eq(6).text()
|
||||
Description: cells.eq(1).text(),
|
||||
TAG: cells.eq(2).text(),
|
||||
Category: cells.eq(3).text(),
|
||||
Language: cells.eq(4).text(),
|
||||
VoiceType: cells.eq(5).text(),
|
||||
Path: cells.eq(6).text()
|
||||
}
|
||||
if (confirm(`Are you sure to edit soundbank [${sb.index}] Description=${sb.description} Tag=${sb.tag}?`)) {
|
||||
if (confirm(`Are you sure to edit soundbank [${sb.index}] Description=${sb.Description} Tag=${sb.TAG}?`)) {
|
||||
$modal.modal('show');
|
||||
$modal.off('hidden.bs.modal').on('hidden.bs.modal', function () {
|
||||
clearSoundbankModal();
|
||||
$modalindex.val(sb.index).prop('disabled', true);
|
||||
$modaldescription.val(sb.Description);
|
||||
$modaltag.val(sb.TAG);
|
||||
$modalcategory.val(sb.Category);
|
||||
$modallanguage.val(sb.Language);
|
||||
$modalvoicetype.val(sb.VoiceType);
|
||||
$('#modalpath').val(sb.Path).trigger('change');
|
||||
|
||||
// event on Click save button
|
||||
|
||||
SetupEventForCategoryLanguageVoiceType();
|
||||
// event on Click save button
|
||||
$modal.off('click.soundbanksave').on('click.soundbanksave', '#soundbanksave', function () {
|
||||
//TODO Add soundbank save process here
|
||||
let description = $modaldescription.val().trim();
|
||||
let tag = $modaltag.val().trim();
|
||||
let category = $modalcategory.val();
|
||||
let language = $modallanguage.val();
|
||||
let voiceType = $modalvoicetype.val();
|
||||
let path = $('#soundbankmodal #modalpath').val();
|
||||
if (!description || description.length === 0) {
|
||||
alert("Description is required");
|
||||
return;
|
||||
}
|
||||
if (!tag || tag.length === 0) {
|
||||
alert("Tag is required");
|
||||
return;
|
||||
}
|
||||
if (!category || category.length === 0) {
|
||||
alert("Category is required");
|
||||
return;
|
||||
}
|
||||
if (!language || language.length === 0) {
|
||||
alert("Language is required");
|
||||
return;
|
||||
}
|
||||
if (!voiceType || voiceType.length === 0) {
|
||||
alert("Voice Type is required");
|
||||
return;
|
||||
}
|
||||
if (!path || path.length === 0) {
|
||||
alert("Path is required");
|
||||
return;
|
||||
}
|
||||
if (description === sb.Description && tag === sb.TAG && category === sb.Category && language === sb.Language && voiceType === sb.VoiceType && path === sb.Path) {
|
||||
alert("No changes detected");
|
||||
return;
|
||||
}
|
||||
sb.Description = description;
|
||||
sb.TAG = tag;
|
||||
sb.Category = category;
|
||||
sb.Language = language;
|
||||
sb.VoiceType = voiceType;
|
||||
sb.Path = path;
|
||||
fetchAPI(APIURL + "UpdateByIndex/" + sb.index, "PUT", {}, sb, (okdata) => {
|
||||
reloadSoundBank(APIURL);
|
||||
alert("Success update soundbank : " + okdata.message);
|
||||
}, (errdata) => {
|
||||
alert("Error update soundbank : " + errdata.message);
|
||||
});
|
||||
$modal.modal('hide');
|
||||
|
||||
});
|
||||
// event on Click close button
|
||||
$modal.off('click.soundbankclose').on('click.soundbankclose', '#soundbankclose', function () {
|
||||
$modal.modal('hide');
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user