JavaScript My story not work according to video and image in all browser with audio

[Amit]

<script>
class SlideStories {

constructor(id) {
this.slide = document.querySelector(`[data-slide="${id}"]`);
this.active = 0;
this.init();
}


activeSlide(index, stat) {

this.active = index;
const nodeList = this.items[index].nodeName;
this.items.forEach((item) => item.classList.remove('active'));
this.items[index].classList.add('active');
this.thumbItems.forEach((item) => item.classList.remove('active'));
this.thumbItems[index].classList.add('active');



if(nodeList == 'VIDEO'){
this.thumbItems.forEach((item) => item.classList.remove('imag'));
this.thumbItems.forEach((item) => item.classList.remove('vido'));
this.thumbItems[index].classList.add('vido');
//console.log($("video").hasClass('active'));
$('video.View_Img_Model.active').get(0).currentTime = 0;
// $("video.View_Img_Model.active").prop('muted', false);
// $('video.View_Img_Model.active').autoplay = true;
if($("video").hasClass('active')) {

//$("video.active").prop('muted', true);
// $(this.items[index]).prop('muted', false);
//$('video.active').autoplay = true;

if(index > 0){
if(stat == 'next'){

$("#myVideo"+(index-1)).prop('muted', true);

}
if(stat == 'prev'){

$("#myVideo"+(index+1)).prop('muted', true);



}

}
console.log("#myVideo"+index);
$("#myVideo"+index).prop('muted', false);
$("#myVideo"+index).get(0).play();
}
else {

$("video").prop('muted', true);
$('video').autoplay = false;
}

if($('.View_Img_Model').prop('id')=='your_id_name'){

}
else{

}


}
if(nodeList == 'IMG'){
this.thumbItems.forEach((item) => item.classList.remove('vido'));
this.thumbItems.forEach((item) => item.classList.remove('imag'));
this.thumbItems[index].classList.add('imag');
$("video").prop('muted', true);
$('video').autoplay = false;
}
this.autoSlide(index);
}

addNavigation() {
const nextBtn = this.slide.querySelector('.slide-next');
const prevBtn = this.slide.querySelector('.slide-prev');
nextBtn.addEventListener('click', this.next);
prevBtn.addEventListener('click', this.prev);
}
addThumbItems() {
this.items.forEach(() => (this.thumb.innerHTML += `<span></span>`));
this.thumbItems = Array.from(this.thumb.children);

}
autoSlide(index) {
clearTimeout(this.timeout);
const nodeList = this.items[index].nodeName;
var position = index;

if(nodeList == 'VIDEO'){

var vid = document.getElementById("myVideo"+ position);
// console.log(vid);
// console.log(position);
var vduration= vid.duration;
// console.log(vduration);
var ndu= vduration*1000;
// alert(ndu);
// console.log(ndu);

if(position=='0'){
this.timeout = setTimeout(this.next, 15000);

} else {
this.timeout = setTimeout(this.next, ndu);
}

}
if(nodeList == 'IMG'){
// alert(position);
if(position=='0'){
this.timeout = setTimeout(this.next, 400);
} else {
this.timeout = setTimeout(this.next, 5000);
}
// this.timeout = setTimeout(this.next, 5000);
}
}

init() {
this.next = this.next.bind(this);
this.prev = this.prev.bind(this);
this.items = this.slide.querySelectorAll('.slide-items > *');
this.thumb = this.slide.querySelector('.slide-thumb');
this.addThumbItems();
this.activeSlide(0,'next');
this.addNavigation();
}


prev() {

if (this.active > 0 ) {
this.activeSlide(this.active - 1,'prev');
} else {
this.activeSlide(this.items.length - 1,'prev');
}
}

next() {

if (this.active < this.items.length - 1) {
this.activeSlide(this.active + 1,'next');
} else if (this.active < this.items.length - 0){
//this.activeSlide(0);
// window.location.href= "http://stanrz.com/";

let userAgent = navigator.userAgent;
let browserName;


if(userAgent.match(/chrome|chromium|crios/i)){
browserName = "chrome";
window.location= "http://stanrz.com/";
}else if(userAgent.match(/firefox|fxios/i)){
browserName = "firefox";
window.location= "http://stanrz.com/";

} else if(userAgent.match(/safari/i)){
browserName = "safari";

}else if(userAgent.match(/opr\//i)){
browserName = "opera";
window.location= "http://stanrz.com/";
} else if(userAgent.match(/edg/i)){
browserName = "edge";
window.location= "http://stanrz.com/";
}else{
browserName="No browser detection";
}

if(userAgent.match(/chrome|chromium|crios/i)){
browserName = "chrome";
window.location= "http://stanrz.com/";
}

}
}

}
new SlideStories('slide');
</script>

 

[OldMan]

Please use the </> icon in the tool menu to paste code. Please redo this and paste a separate section for the html and another for the css.
And if you're using anything that is only on your computer place it on the web where we can get it and add it to the mix.