mirror of
https://github.com/WordPress/WordPress.git
synced 2024-09-12 07:38:33 +02:00
This patch, somewhat small brings a lot to WordPress. This includes features like: - DataViews. - Customization tools like box shadow, background size and repeat. - UI improvements in the site editor. - Preferences sharing between the post and site editors. - Unified panels and editors between post and site editors. - Improved template mode in the post editor. - Iterations to multiple interactive blocks. - Preparing the blocks and UI for pattern overrides. - and a lot more. Props luisherranz, gziolo, isabel_brison, costdev, jonsurrell, peterwilsoncc, get_dave, antonvlasenko, desrosj. See #60315. Built from https://develop.svn.wordpress.org/trunk@57377 git-svn-id: http://core.svn.wordpress.org/trunk@56883 1a063a9b-81f0-0310-95a4-ce76da25c4cd
1 line
5.4 KiB
JavaScript
1 line
5.4 KiB
JavaScript
import*as t from"@wordpress/interactivity";var e={d:function(t,n){for(var i in n)e.o(n,i)&&!e.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:n[i]})},o:function(t,e){return Object.prototype.hasOwnProperty.call(t,e)}},n=(t=>{var n={};return e.d(n,t),n})({getContext:()=>t.getContext,getElement:()=>t.getElement,store:()=>t.store});const i=["a[href]","area[href]",'input:not([disabled]):not([type="hidden"]):not([aria-hidden])',"select:not([disabled]):not([aria-hidden])","textarea:not([disabled]):not([aria-hidden])","button:not([disabled]):not([aria-hidden])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex^="-"])'];let o,l=!1,a=0;function r(t){!l&&Date.now()-a>450&&window.scrollTo(t.scrollLeftReset,t.scrollTopReset)}const{state:d,actions:s,callbacks:g}=(0,n.store)("core/image",{state:{windowWidth:window.innerWidth,windowHeight:window.innerHeight,get roleAttribute(){return(0,n.getContext)().lightboxEnabled?"dialog":null},get ariaModal(){return(0,n.getContext)().lightboxEnabled?"true":null},get dialogLabel(){const t=(0,n.getContext)();return t.lightboxEnabled?t.dialogLabel:null},get lightboxObjectFit(){if((0,n.getContext)().initialized)return"cover"},get enlargedImgSrc(){const t=(0,n.getContext)();return t.initialized?t.imageUploadedSrc:"data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="}},actions:{showLightbox(t){const e=(0,n.getContext)();e.imageLoaded&&(e.initialized=!0,e.lastFocusedElement=window.document.activeElement,e.scrollDelta=0,e.pointerType=t.pointerType,e.lightboxEnabled=!0,c(e,e.imageRef),e.scrollTopReset=window.pageYOffset||document.documentElement.scrollTop,e.scrollLeftReset=window.pageXOffset||document.documentElement.scrollLeft,o=r.bind(null,e),window.addEventListener("scroll",o,!1))},hideLightbox(){const t=(0,n.getContext)();t.hideAnimationEnabled=!0,t.lightboxEnabled&&(setTimeout((function(){window.removeEventListener("scroll",o),t.lightboxTriggerRef.focus({preventScroll:!0})}),450),t.lightboxEnabled=!1)},handleKeydown(t){const e=(0,n.getContext)();e.lightboxEnabled&&("Tab"!==t.key&&9!==t.keyCode||(t.shiftKey&&window.document.activeElement===e.firstFocusableElement?(t.preventDefault(),e.lastFocusableElement.focus()):t.shiftKey||window.document.activeElement!==e.lastFocusableElement||(t.preventDefault(),e.firstFocusableElement.focus())),"Escape"!==t.key&&27!==t.keyCode||s.hideLightbox(t))},handleLoad(){const t=(0,n.getContext)(),{ref:e}=(0,n.getElement)();t.imageLoaded=!0,t.imageCurrentSrc=e.currentSrc,g.setButtonStyles()},handleTouchStart(){l=!0},handleTouchMove(t){(0,n.getContext)().lightboxEnabled&&t.preventDefault()},handleTouchEnd(){a=Date.now(),l=!1}},callbacks:{initOriginImage(){const t=(0,n.getContext)(),{ref:e}=(0,n.getElement)();t.imageRef=e,e.complete&&(t.imageLoaded=!0,t.imageCurrentSrc=e.currentSrc)},initTriggerButton(){const t=(0,n.getContext)(),{ref:e}=(0,n.getElement)();t.lightboxTriggerRef=e},initLightbox(){const t=(0,n.getContext)(),{ref:e}=(0,n.getElement)();if(t.lightboxEnabled){const n=e.querySelectorAll(i);t.firstFocusableElement=n[0],t.lastFocusableElement=n[n.length-1],e.focus()}},setButtonStyles(){const{ref:t}=(0,n.getElement)(),{naturalWidth:e,naturalHeight:i,offsetWidth:o,offsetHeight:l}=t;if(0===e||0===i)return;const a=t.parentElement,r=t.parentElement.clientWidth;let d=t.parentElement.clientHeight;const s=a.querySelector("figcaption");if(s){const t=window.getComputedStyle(s);["absolute","fixed"].includes(t.position)||(d=d-s.offsetHeight-parseFloat(t.marginTop)-parseFloat(t.marginBottom))}const g=d-l,c=r-o,h=(0,n.getContext)();if("contain"===h.scaleAttr){const t=e/i;if(t>=o/l){const e=o/t;h.imageButtonTop=(l-e)/2+g+16,h.imageButtonRight=c+16}else{const e=l*t;h.imageButtonTop=g+16,h.imageButtonRight=(o-e)/2+c+16}}else h.imageButtonTop=g+16,h.imageButtonRight=c+16},setStylesOnResize(){const t=(0,n.getContext)(),{ref:e}=(0,n.getElement)();t.lightboxEnabled&&(d.windowWidth||d.windowHeight)&&c(t,e)}}});function c(t,e){let{naturalWidth:n,naturalHeight:i,offsetWidth:o,offsetHeight:l}=e,{x:a,y:r}=e.getBoundingClientRect();const d=n/i;let s=o/l;if("contain"===t.scaleAttr)if(d>s){const t=o/d;r+=(l-t)/2,l=t}else{const t=l*d;a+=(o-t)/2,o=t}s=o/l;let g=parseFloat("none"!==t.targetWidth?t.targetWidth:n),c=parseFloat("none"!==t.targetHeight?t.targetHeight:i),h=g/c,u=g,m=c,w=g,b=c;if(d.toFixed(2)!==h.toFixed(2)){if(d>h){const t=g/d;c-t>g?(c=t,g=t*d):c=g/d}else{const t=c*d;g-t>c?(g=t,c=t/d):g=c*d}w=g,b=c,h=g/c,s>h?(u=g,m=u/s):(m=c,u=m*s)}(o>w||l>b)&&(w=o,b=l);let f=0;window.innerWidth>480?f=80:window.innerWidth>1920&&(f=160);const p=Math.min(window.innerWidth-f,w),x=Math.min(window.innerHeight-80,b);s>p/x?(w=p,b=w/s):(b=x,w=b*s);const E=o/w,C=g*(w/u),y=c*(b/m);let A=document.getElementById("wp-lightbox-styles");A||(A=document.createElement("style"),A.id="wp-lightbox-styles",document.head.appendChild(A)),A.innerHTML=`\n\t\t:root {\n\t\t\t--wp--lightbox-initial-top-position: ${r}px;\n\t\t\t--wp--lightbox-initial-left-position: ${a}px;\n\t\t\t--wp--lightbox-container-width: ${w+1}px;\n\t\t\t--wp--lightbox-container-height: ${b+1}px;\n\t\t\t--wp--lightbox-image-width: ${C}px;\n\t\t\t--wp--lightbox-image-height: ${y}px;\n\t\t\t--wp--lightbox-scale: ${E};\n\t\t\t--wp--lightbox-scrollbar-width: ${window.innerWidth-document.documentElement.clientWidth}px;\n\t\t}\n\t`}window.addEventListener("resize",function(t,e=50){let n;return()=>{clearTimeout(n),n=setTimeout((()=>{n=null,t()}),e)}}((()=>{d.windowWidth=window.innerWidth,d.windowHeight=window.innerHeight}))); |