106 lines
4.3 KiB
HTML
106 lines
4.3 KiB
HTML
<script type="text/javascript">
|
|
const paramsDiv = document.getElementById("model-params");
|
|
const modelSelect = document.getElementById("model");
|
|
|
|
function renderParams(model) {
|
|
let html = "";
|
|
|
|
if (model === "Semi-Supervised_SVM") {
|
|
html = `
|
|
<div class="six columns">
|
|
<label for="C">Penalty parameter (C):</label>
|
|
<input style="width: 100%;" type="number" step="0.01" id="C" name="C1" value="{{ C or 1.0 }}">
|
|
</div>
|
|
`;
|
|
} else if (model === "Semi-Supervised_SVM_Unconstrained") {
|
|
html = `
|
|
<div class="six columns">
|
|
<label for="C">Penalty parameter (C):</label>
|
|
<input style="width: 100%;" type="number" step="0.01" id="C" name="C1" value="{{ C or 1.0 }}">
|
|
</div>
|
|
`;
|
|
} else if (model === "Newton_Universum_Twin_SVM") {
|
|
html = `
|
|
<div class="two columns"><label for="C1">C1:</label><input style="width:100%;" type="number" step="0.01" id="C1" name="C1" value="{{ C1 or 1.0 }}"></div>
|
|
<div class="two columns"><label for="C2">C2:</label><input style="width:100%;" type="number" step="0.01" id="C2" name="C2" value="{{ C2 or 1.0 }}"></div>
|
|
<div class="two columns"><label for="C3">C3:</label><input style="width:100%;" type="number" step="0.01" id="C3" name="C3" value="{{ C3 or 1.0 }}"></div>
|
|
<div class="two columns"><label for="C4">C4:</label><input style="width:100%;" type="number" step="0.01" id="C4" name="C4" value="{{ C4 or 1.0 }}"></div>
|
|
<div class="two columns"><label for="C5">C5:</label><input style="width:100%;" type="number" step="0.01" id="C5" name="C5" value="{{ C5 or 1.0 }}"></div>
|
|
<div class="two columns"><label for="C6">C6:</label><input style="width:100%;" type="number" step="0.01" id="C6" name="C6" value="{{ C6 or 1.0 }}"></div>
|
|
`;
|
|
} else if (model === "Least-Square_Twin_SVM") {
|
|
html = `
|
|
<div class="six columns"><label for="C1">C1:</label><input style="width:100%;" type="number" step="0.01" id="C1" name="C1" value="{{ C1 or 0.1 }}"></div>
|
|
<div class="six columns"><label for="C2">C2:</label><input style="width:100%;" type="number" step="0.01" id="C2" name="C2" value="{{ C2 or 1.0 }}"></div>
|
|
`;
|
|
} else if (model === "Twin_SVM") {
|
|
html = `
|
|
<div class="six columns"><label for="C1">C1:</label><input style="width:100%;" type="number" step="0.01" id="C1" name="C1" value="{{ C1 or 0.1 }}"></div>
|
|
<div class="six columns"><label for="C2">C2:</label><input style="width:100%;" type="number" step="0.01" id="C2" name="C2" value="{{ C2 or 1.0 }}"></div>
|
|
`;
|
|
}
|
|
|
|
paramsDiv.innerHTML = html;
|
|
}
|
|
|
|
if(modelSelect){
|
|
|
|
// Run on page load with selected value
|
|
renderParams(modelSelect.value);
|
|
// Update dynamically when model changes
|
|
modelSelect.addEventListener("change", (e) => {
|
|
renderParams(e.target.value);
|
|
});
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const select = document.getElementById('select-image');
|
|
const preview = document.getElementById('preview');
|
|
|
|
if (!select || !preview) {
|
|
console.warn('Select or preview element not found.');
|
|
return;
|
|
}
|
|
|
|
function updatePreview() {
|
|
const opt = select.options[select.selectedIndex];
|
|
const src = opt && opt.dataset && opt.dataset.img ? opt.dataset.img : '';
|
|
preview.src = src;
|
|
console.log('Preview set to:', src);
|
|
}
|
|
|
|
// Ensure there's a selected index (fallback to first option)
|
|
if (select.selectedIndex === -1 && select.options.length > 0) {
|
|
select.selectedIndex = 0;
|
|
}
|
|
|
|
// initial set
|
|
updatePreview();
|
|
|
|
// update when user changes selection
|
|
select.addEventListener('change', updatePreview);
|
|
|
|
// optional: handle broken image
|
|
preview.addEventListener('error', function() {
|
|
console.warn('Failed to load preview image:', preview.src);
|
|
// preview.src = '/static/img/placeholder.png'; // uncomment if you have a placeholder
|
|
});
|
|
});
|
|
|
|
// document.addEventListener('DOMContentLoaded', function() {
|
|
// const select = document.getElementById('select-image');
|
|
// const preview = document.getElementById('preview');
|
|
|
|
// if (!select || !preview) return;
|
|
|
|
// function updatePreview() {
|
|
// const opt = select.options[select.selectedIndex];
|
|
// preview.src = opt.dataset.img;
|
|
// }
|
|
|
|
// select.addEventListener('change', updatePreview);
|
|
// });
|
|
|
|
|
|
</script>
|