Я работаю над программой, где мне нужно использовать медиа-фрагмент, чтобы удержать пользователя в определенном начальном и конечном временном интервале.И пользователь сможет установить время начала и время окончания.
const path = require("path");
const createFragment = (startEnd,location) => {
const fragmentEl = document.createElement("div");
fragmentEl.setAttribute("data-fragment", startEnd);
fragmentEl.classList.add("akara-media-fragment");
fragmentEl.style.left = `${location}px`;
akaraTimeIndicator.appendChild(fragmentEl);
if ( startEnd === "start" ) {
const reg = new RegExp(`${path.extname(video.src)}$`);
// how can i prevent the browser from reloading the video element, i want the fragment to work on the fly
video.src = video.src.replace(reg, `${path.extname(video.src)}#t=the time frame goes here`);
}
};
akaraTimeIndicator.addEventListener("contextmenu", evt => {
const { left , right } = akaraTimeIndicator.getBoundingClientRect();
const firstFragment = akaraTimeIndicator.querySelector("[data-fragment=start]");
const lastFragment = akaraTimeIndicator.querySelector("[data-fragment=end]");
// * 100 to get calculation
const XAxis = (evt.clientX / 1000) * 100;
if ( ! firstFragment ) {
createFragment("start", evt.clientX);
return;
}
const firstFrag = parseInt(firstFragment.style.left);
const lastFrag = lastFragment ? parseInt(lastFragment.style.left) : null;
if ( evt.clientX < firstFrag ) {
firstFragment.remove();
createFragment("start", evt.clientX);
return;
}
if ( lastFrag &&
(evt.clientX > lastFrag
|| evt.clientX < lastFrag
)
) {
lastFragment.remove();
createFragment("end", evt.clientX);
return;
}
if ( evt.clientX === firstFrag ) {
if ( lastFrag ) lastFragment.setAttribute("data-fragment", "start");
firstFragment.remove();
akara_emit.emit("akara::fragment:removed", "first");
return;
}
if ( lastFrag && ( evt.clientX === lastFrag ) ) {
lastFragment.remove();
akara_emit.emit("akara::fragment:remove", "last");
return;
}
createFragment("end", evt.clientX);
return;
});
Процесс настройки фрагмента мультимедиа немного сложнее, но главный вопрос: есть ливозможный способ установки фрагмента без перезагрузки браузером элемента HTMLMediaElement