temps restant + video + download link + left click + show next frame done
This commit is contained in:
sorlinv
198
src/renderer/scripts/FfmpegPath.js
Normal file
198
src/renderer/scripts/FfmpegPath.js
Normal file
@@ -0,0 +1,198 @@
|
||||
const FfmpegPath = {
|
||||
str_current_path: null,
|
||||
is_found: false,
|
||||
obj_modal: null,
|
||||
|
||||
init: () => {
|
||||
FfmpegPath._create_badge();
|
||||
FfmpegPath._create_modal();
|
||||
FfmpegPath._bind_events();
|
||||
},
|
||||
|
||||
_create_badge: () => {
|
||||
let obj_nav_right = document.querySelector("nav .d-flex.gap-2");
|
||||
let obj_badge = document.createElement("button");
|
||||
obj_badge.id = "btn_ffmpeg_status";
|
||||
obj_badge.className = "btn btn-sm btn-outline-secondary";
|
||||
obj_badge.title = "Chemin FFmpeg";
|
||||
obj_badge.innerHTML = '<i class="mdi mdi-video-outline"></i>';
|
||||
obj_nav_right.insertBefore(obj_badge, obj_nav_right.firstChild);
|
||||
|
||||
obj_badge.addEventListener("click", () => {
|
||||
FfmpegPath._open_modal();
|
||||
});
|
||||
},
|
||||
|
||||
_create_modal: () => {
|
||||
let obj_modal_el = document.createElement("div");
|
||||
obj_modal_el.id = "modal_ffmpeg_path";
|
||||
obj_modal_el.className = "modal fade";
|
||||
obj_modal_el.tabIndex = -1;
|
||||
obj_modal_el.innerHTML =
|
||||
'<div class="modal-dialog modal-dialog-centered">' +
|
||||
'<div class="modal-content bg-dark text-light border-secondary">' +
|
||||
'<div class="modal-header border-secondary">' +
|
||||
'<h6 class="modal-title"><i class="mdi mdi-video-outline me-2"></i>Chemin FFmpeg</h6>' +
|
||||
'<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>' +
|
||||
'</div>' +
|
||||
'<div class="modal-body">' +
|
||||
'<p class="text-light-emphasis mb-2" style="font-size: 0.85rem;">' +
|
||||
'Selectionnez l\'executable FFmpeg sur votre machine.' +
|
||||
'</p>' +
|
||||
'<p class="mb-3" style="font-size: 0.8rem;">' +
|
||||
'<a href="https://ffmpeg.org/download.html" target="_blank" class="text-info">' +
|
||||
'<i class="mdi mdi-download me-1"></i>Telecharger FFmpeg' +
|
||||
'</a>' +
|
||||
'</p>' +
|
||||
'<div class="input-group input-group-sm mb-3">' +
|
||||
'<input type="text" id="input_ffmpeg_path" class="form-control bg-dark text-light border-secondary" placeholder="Aucun chemin configure" readonly>' +
|
||||
'<button id="btn_browse_ffmpeg" class="btn btn-outline-primary" type="button">' +
|
||||
'<i class="mdi mdi-folder-search-outline"></i> Parcourir' +
|
||||
'</button>' +
|
||||
'</div>' +
|
||||
'<div class="d-flex justify-content-between align-items-center">' +
|
||||
'<button id="btn_detect_ffmpeg" class="btn btn-sm btn-outline-secondary">' +
|
||||
'<i class="mdi mdi-magnify me-1"></i>Detecter automatiquement' +
|
||||
'</button>' +
|
||||
'<span id="label_ffmpeg_status" class="badge bg-danger">' +
|
||||
'<i class="mdi mdi-close-circle me-1"></i>Non trouve' +
|
||||
'</span>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
'<div class="modal-footer border-secondary">' +
|
||||
'<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Annuler</button>' +
|
||||
'<button id="btn_validate_ffmpeg" type="button" class="btn btn-sm btn-primary" disabled>' +
|
||||
'<i class="mdi mdi-check me-1"></i>Valider' +
|
||||
'</button>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
|
||||
document.body.appendChild(obj_modal_el);
|
||||
FfmpegPath.obj_modal = new bootstrap.Modal(obj_modal_el);
|
||||
},
|
||||
|
||||
_bind_events: () => {
|
||||
let obj_btn_browse = document.getElementById("btn_browse_ffmpeg");
|
||||
obj_btn_browse.addEventListener("click", () => {
|
||||
FfmpegPath._browse();
|
||||
});
|
||||
|
||||
let obj_btn_detect = document.getElementById("btn_detect_ffmpeg");
|
||||
obj_btn_detect.addEventListener("click", () => {
|
||||
FfmpegPath._detect();
|
||||
});
|
||||
|
||||
let obj_btn_validate = document.getElementById("btn_validate_ffmpeg");
|
||||
obj_btn_validate.addEventListener("click", () => {
|
||||
FfmpegPath._validate();
|
||||
});
|
||||
|
||||
window.api.on_ffmpeg_path_status((obj_data) => {
|
||||
FfmpegPath.str_current_path = obj_data.str_path;
|
||||
FfmpegPath.is_found = obj_data.is_found;
|
||||
FfmpegPath._update_badge();
|
||||
});
|
||||
},
|
||||
|
||||
_open_modal: () => {
|
||||
let obj_input = document.getElementById("input_ffmpeg_path");
|
||||
obj_input.value = FfmpegPath.is_found ? FfmpegPath.str_current_path : "";
|
||||
FfmpegPath._update_modal_status(FfmpegPath.is_found, FfmpegPath.str_current_path);
|
||||
FfmpegPath.obj_modal.show();
|
||||
|
||||
if (!FfmpegPath.is_found) {
|
||||
FfmpegPath._detect();
|
||||
}
|
||||
},
|
||||
|
||||
_browse: () => {
|
||||
window.api.select_ffmpeg_exe()
|
||||
.then((str_path) => {
|
||||
if (!str_path) {
|
||||
return;
|
||||
}
|
||||
let obj_input = document.getElementById("input_ffmpeg_path");
|
||||
obj_input.value = str_path;
|
||||
FfmpegPath._update_modal_status(true, str_path);
|
||||
})
|
||||
.catch((obj_err) => {
|
||||
ConsoleLog.add("Erreur selection FFmpeg : " + obj_err.message);
|
||||
});
|
||||
},
|
||||
|
||||
_detect: () => {
|
||||
let obj_btn = document.getElementById("btn_detect_ffmpeg");
|
||||
obj_btn.disabled = true;
|
||||
obj_btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1"></span>Detection...';
|
||||
|
||||
window.api.get_ffmpeg_path()
|
||||
.then((obj_data) => {
|
||||
obj_btn.disabled = false;
|
||||
obj_btn.innerHTML = '<i class="mdi mdi-magnify me-1"></i>Detecter automatiquement';
|
||||
|
||||
if (obj_data.is_found) {
|
||||
let obj_input = document.getElementById("input_ffmpeg_path");
|
||||
obj_input.value = obj_data.str_path;
|
||||
FfmpegPath._update_modal_status(true, obj_data.str_path);
|
||||
} else {
|
||||
FfmpegPath._update_modal_status(false, null);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
obj_btn.disabled = false;
|
||||
obj_btn.innerHTML = '<i class="mdi mdi-magnify me-1"></i>Detecter automatiquement';
|
||||
FfmpegPath._update_modal_status(false, null);
|
||||
});
|
||||
},
|
||||
|
||||
_validate: () => {
|
||||
let str_path = document.getElementById("input_ffmpeg_path").value;
|
||||
if (!str_path) {
|
||||
return;
|
||||
}
|
||||
|
||||
window.api.set_ffmpeg_path(str_path)
|
||||
.then((obj_result) => {
|
||||
if (obj_result.is_success) {
|
||||
FfmpegPath.str_current_path = obj_result.str_path;
|
||||
FfmpegPath.is_found = true;
|
||||
FfmpegPath._update_badge();
|
||||
FfmpegPath.obj_modal.hide();
|
||||
ConsoleLog.add("Chemin FFmpeg configure : " + obj_result.str_path);
|
||||
} else {
|
||||
FfmpegPath._update_modal_status(false, null);
|
||||
ConsoleLog.add("Chemin FFmpeg invalide : " + (obj_result.str_error || ""));
|
||||
}
|
||||
})
|
||||
.catch((obj_err) => {
|
||||
ConsoleLog.add("Erreur configuration FFmpeg : " + obj_err.message);
|
||||
});
|
||||
},
|
||||
|
||||
_update_badge: () => {
|
||||
let obj_badge = document.getElementById("btn_ffmpeg_status");
|
||||
if (FfmpegPath.is_found) {
|
||||
obj_badge.className = "btn btn-sm btn-outline-success";
|
||||
obj_badge.title = "FFmpeg : " + FfmpegPath.str_current_path;
|
||||
} else {
|
||||
obj_badge.className = "btn btn-sm btn-outline-danger";
|
||||
obj_badge.title = "FFmpeg non trouve";
|
||||
}
|
||||
},
|
||||
|
||||
_update_modal_status: (is_valid, str_path) => {
|
||||
let obj_label = document.getElementById("label_ffmpeg_status");
|
||||
let obj_btn_validate = document.getElementById("btn_validate_ffmpeg");
|
||||
|
||||
if (is_valid && str_path) {
|
||||
obj_label.className = "badge bg-success";
|
||||
obj_label.innerHTML = '<i class="mdi mdi-check-circle me-1"></i>Trouve';
|
||||
obj_btn_validate.disabled = false;
|
||||
} else {
|
||||
obj_label.className = "badge bg-danger";
|
||||
obj_label.innerHTML = '<i class="mdi mdi-close-circle me-1"></i>Non trouve';
|
||||
obj_btn_validate.disabled = true;
|
||||
}
|
||||
},
|
||||
};
|
||||
Reference in New Issue
Block a user