blobject-fit.min.js

!function(){var positionsY=["top","center","bottom"],positionsX=["left","center","right"];function blobjectFitImage(){var images=document.querySelectorAll("img")||[];if(images.length){for(var i=0;i<images.length;i++){var image=images[i],imageFit=getComputedStyle(image).fontFamily||image.style.fontFamily||"";if(!image.classList.contains("blobject-fit--checked")&&!image.classList.contains("blobject-fit--image")){image.classList.add("blobject-fit--checked"),-1===imageFit.indexOf(";")&&(imageFit+=";");for(var imageProps=imageFit.split(";"),parent=image.parentNode,i2=0;i2<imageProps.length;i2++){var imageProp=imageProps[i2].replace(/[^a-zA-Z0-9:-]/g,"").toLowerCase();if(-1!==imageProp.indexOf(":")){var tmp=imageProp.split(":");if("object-fit"===tmp[0]&&-1!==["cover","contain"].indexOf(tmp[1])){var imageClass="blobject-fit_object-fit_"+tmp[1],src=image.currentSrc||image.src;parent.classList.add("blobject-fit"),parent.classList.add(imageClass),parent.style.backgroundImage="url("+src+")",image.setAttribute("data-blobject-fit-src",src),image.classList.add("blobject-fit--image")}else if("object-position"===tmp[0]){var position=!1;-1!==positionsY.indexOf(tmp[1])?position=tmp[1]+"-center":-1!==positionsX.indexOf(tmp[1])?position="center-"+tmp[1]:"topleft"===tmp[1]||"lefttop"===tmp[1]?position="top-left":"topcenter"===tmp[1]||"centertop"===tmp[1]?position="top-center":"topright"===tmp[1]||"righttop"===tmp[1]?position="top-right":"centerleft"===tmp[1]||"leftcenter"===tmp[1]?position="center-left":"centercenter"===tmp[1]?position="center-center":"centerright"===tmp[1]||"rightcenter"===tmp[1]?position="center-right":"bottomleft"===tmp[1]||"leftbottom"===tmp[1]?position="bottom-left":"bottomcenter"===tmp[1]||"centerbottom"===tmp[1]?position="bottom-center":"bottomright"!==tmp[1]&&"rightbottom"!==tmp[1]||(position="bottom-right"),position&&parent.classList.add("blobject-fit_object-position_"+position)}}}}}return!0}}function blobjectFitImagesResize(){var images=document.querySelectorAll(".blobject-fit--image")||[];if(images.length)for(var i=0;i<images.length;i++){var image=images[i],n_src=image.currentSrc||image.src,o_src=image.getAttribute("data-blobject-fit-src")||"",parent=image.parentNode;n_src!==o_src&&(parent.style.backgroundImage="url("+n_src+")",image.setAttribute("data-blobject-fit-src",n_src))}}function blobjectFitVideo(){var videos=document.querySelectorAll("video")||[];if(videos.length){for(var i=0;i<videos.length;i++){var video=videos[i],videoFit=getComputedStyle(video).fontFamily||video.style.fontFamily||"";if(!video.classList.contains("blobject-fit--checked")){video.classList.add("blobject-fit--checked"),-1===videoFit.indexOf(";")&&(videoFit+=";");for(var videoProps=videoFit.split(";"),i2=0;i2<videoProps.length;i2++){var videoProp=videoProps[i2].replace(/[^a-zA-Z0-9:-]/g,"").toLowerCase();if(-1!==videoProp.indexOf(":")){var tmp=videoProp.split(":");if("object-fit"===tmp[0]&&-1!==["cover","contain"].indexOf(tmp[1])){var vw=video.videoWidth||0,vh=video.videoHeight||0,parent=video.parentNode,parentPosition=getComputedStyle(parent).position||parent.style.position||"static";vw&&vh?(video.classList.add("blobject-fit--video"),video.classList.add("blobject-fit_object-fit_"+tmp[1]),video.setAttribute("data-width",vw),video.setAttribute("data-height",vh),parent.classList.add("blobject-fit--video--wrapper"),"static"===parentPosition&&parent.classList.add("blobject-fit--video--wrapper_relative"),blobjectFitVideoResize(video)):video.addEventListener("loadedmetadata",function(){vw=video.videoWidth||0,vh=video.videoHeight||0,vw&&vh&&(video.classList.add("blobject-fit--video"),video.classList.add("blobject-fit_object-fit_"+tmp[1]),video.setAttribute("data-width",vw),video.setAttribute("data-height",vh),parent.classList.add("blobject-fit--video--wrapper"),"static"===parentPosition&&parent.classList.add("blobject-fit--video--wrapper_relative"),blobjectFitVideoResize(video))},!1)}}}}}return!0}}function blobjectFitVideosResize(){var videos=document.querySelectorAll(".blobject-fit--video.blobject-fit_object-fit_cover")||[];if(videos.length)for(var i=0;i<videos.length;i++)blobjectFitVideoResize(videos[i])}function blobjectFitVideoResize(video){var vw=Number(video.getAttribute("data-width"))||0,vh=Number(video.getAttribute("data-height"))||0,parent=video.parentNode,pw=Number(parent.offsetWidth)||0,ph=Number(parent.offsetHeight)||0,nw=0,nh=0;0<vw&&0<vh&&(pw/vw>ph/vh?(nw=pw,nh=vh*(pw/vw),video.style.width=nw+"px",video.style.height=nh+"px"):(nh=ph,nw=vw*(ph/vh),video.style.width=nw+"px",video.style.height=nh+"px"))}document.addEventListener("DOMContentLoaded",function(){var style;"objectFit"in document.documentElement.style||((style=document.createElement("style")).textContent=".blobject-fit { background: transparent none scroll center center no-repeat; } .blobject-fit.blobject-fit_object-fit_cover { background-size: cover; } .blobject-fit.blobject-fit_object-fit_contain { background-size: contain; } .blobject-fit.blobject-fit_object-position_top-left { background-position: top left; }.blobject-fit.blobject-fit_object-position_top-center { background-position: top center; }.blobject-fit.blobject-fit_object-position_top-right { background-position: top right; }.blobject-fit.blobject-fit_object-position_center-left { background-position: center left; }.blobject-fit.blobject-fit_object-position_center-center { background-position: center center; }.blobject-fit.blobject-fit_object-position_center-right { background-position: center right; }.blobject-fit.blobject-fit_object-position_bottom-left { background-position: bottom left; }.blobject-fit.blobject-fit_object-position_bottom-center { background-position: bottom center; }.blobject-fit.blobject-fit_object-position_bottom-right { background-position: bottom right; }.blobject-fit--image { visibility: hidden; height: 0; width: 0; } .blobject-fit--video--wrapper { overflow: hidden; } .blobject-fit--video--wrapper_relative { position: relative; } .blobject-fit--video { position: absolute; } .blobject-fit--video.blobject-fit_object-fit_contain { top: 0; left: 0; width: 100%; height: 100%; } .blobject-fit--video.blobject-fit_object-fit_cover { top: 50%; left: 50%; transform: translate(-50%, -50%); } ",document.head.appendChild(style),blobjectFitImage(),blobjectFitVideo(),window.addEventListener("resize",blobjectFitVideosResize),("HTMLPictureElement"in window||"srcset"in document.createElement("img"))&&window.addEventListener("resize",blobjectFitImagesResize),setInterval(function(){blobjectFitImage(),blobjectFitVideo()},1e3))})}();