let side_bar=document.getElementById('side_bar') let width=side_bar.clientWidth side_bar.style.left=-(width)+'px' function animate({timing,draw,duration,on_done}){ start = performance.now(); requestAnimationFrame(function animate(time){ let timeFraction = (time - start) / duration; if (timeFraction>1) timeFraction = 1; let progress = timing(timeFraction) draw(progress); if(timeFraction<1){ requestAnimationFrame(animate) } else { if(typeof on_done === "function") on_done(); } }) } function open_sb(){ side_bar.style.opacity="1"; animate({ duration: 400, timing(timeFraction){ return Math.pow(timeFraction,2); }, draw(progress){ side_bar.style.left=(progress*width)-width+'px' } }); } function close_sb(){ animate({ duration: 800, timing(timeFraction){ return Math.pow(timeFraction, 2); }, draw(progress){ document.getElementById("side_bar").style.left=((1-progress)*width)-width+'px' }, on_done(){ side_bar.style.opacity="0"; } }); } fetch('assets/fetch-content-list.php?type=partial',{ cache:'no-cache' }) .then(response=>response.json()) .then(res=>{ let folder='assets/made_content/partial/' input_str='' for(i in res){ if(res[i][1].match(/.png|.PNG|.jpg|.JPG|.jpeg|.JPEG|.gif|.GIF/g)){ input_str+=`