@yuebai008/cli
Version:
Command line interface for rapid qg-minigame development
1 lines • 7.17 kB
JavaScript
import*as Common from"../common/common.js";import{OverlayColorGenerator}from"./OverlayColorGenerator.js";export class OverlayPersistentHighlighter{#i;#t;#e;#o;#h;#s;#l;#r;#g;#n;#a;#d;#c;#H;constructor(i,t=!0){this.#i=i,this.#t=new Map,this.#e=new Map,this.#o=new Map,this.#h=new Map,this.#s=new Map,this.#l=new Map,this.#r=new OverlayColorGenerator,this.#g=new OverlayColorGenerator,this.#n=t,this.#a=Common.Settings.Settings.instance().moduleSetting("showGridLineLabels"),this.#a.addChangeListener(this.onSettingChange,this),this.#d=Common.Settings.Settings.instance().moduleSetting("extendGridLines"),this.#d.addChangeListener(this.onSettingChange,this),this.#c=Common.Settings.Settings.instance().moduleSetting("showGridAreas"),this.#c.addChangeListener(this.onSettingChange,this),this.#H=Common.Settings.Settings.instance().moduleSetting("showGridTrackSizes"),this.#H.addChangeListener(this.onSettingChange,this)}onSettingChange(){this.resetOverlay()}buildGridHighlightConfig(i){const t=this.colorOfGrid(i).asLegacyColor(),e=t.setAlpha(.1).asLegacyColor(),o=t.setAlpha(.3).asLegacyColor(),h=t.setAlpha(.8).asLegacyColor(),s=this.#d.get(),l="lineNumbers"===this.#a.get(),r=l,g="lineNames"===this.#a.get();return{rowGapColor:o.toProtocolRGBA(),rowHatchColor:h.toProtocolRGBA(),columnGapColor:o.toProtocolRGBA(),columnHatchColor:h.toProtocolRGBA(),gridBorderColor:t.toProtocolRGBA(),gridBorderDash:!1,rowLineColor:t.toProtocolRGBA(),columnLineColor:t.toProtocolRGBA(),rowLineDash:!0,columnLineDash:!0,showGridExtensionLines:s,showPositiveLineNumbers:l,showNegativeLineNumbers:r,showLineNames:g,showAreaNames:this.#c.get(),showTrackSizes:this.#H.get(),areaBorderColor:t.toProtocolRGBA(),gridBackgroundColor:e.toProtocolRGBA()}}buildFlexContainerHighlightConfig(i){const t=this.colorOfFlex(i).asLegacyColor();return{containerBorder:{color:t.toProtocolRGBA(),pattern:"dashed"},itemSeparator:{color:t.toProtocolRGBA(),pattern:"dotted"},lineSeparator:{color:t.toProtocolRGBA(),pattern:"dashed"},mainDistributedSpace:{hatchColor:t.toProtocolRGBA()},crossDistributedSpace:{hatchColor:t.toProtocolRGBA()}}}buildScrollSnapContainerHighlightConfig(i){return{snapAreaBorder:{color:Common.Color.PageHighlight.GridBorder.toProtocolRGBA(),pattern:"dashed"},snapportBorder:{color:Common.Color.PageHighlight.GridBorder.toProtocolRGBA()},scrollMarginColor:Common.Color.PageHighlight.Margin.toProtocolRGBA(),scrollPaddingColor:Common.Color.PageHighlight.Padding.toProtocolRGBA()}}highlightGridInOverlay(i){this.#t.set(i,this.buildGridHighlightConfig(i)),this.updateHighlightsInOverlay()}isGridHighlighted(i){return this.#t.has(i)}colorOfGrid(i){let t=this.#l.get(i);return t||(t=this.#r.next(),this.#l.set(i,t)),t}setColorOfGrid(i,t){this.#l.set(i,t)}hideGridInOverlay(i){this.#t.has(i)&&(this.#t.delete(i),this.updateHighlightsInOverlay())}highlightScrollSnapInOverlay(i){this.#e.set(i,this.buildScrollSnapContainerHighlightConfig(i)),this.updateHighlightsInOverlay()}isScrollSnapHighlighted(i){return this.#e.has(i)}hideScrollSnapInOverlay(i){this.#e.has(i)&&(this.#e.delete(i),this.updateHighlightsInOverlay())}highlightFlexInOverlay(i){this.#o.set(i,this.buildFlexContainerHighlightConfig(i)),this.updateHighlightsInOverlay()}isFlexHighlighted(i){return this.#o.has(i)}colorOfFlex(i){let t=this.#l.get(i);return t||(t=this.#g.next(),this.#l.set(i,t)),t}setColorOfFlex(i,t){this.#l.set(i,t)}hideFlexInOverlay(i){this.#o.has(i)&&(this.#o.delete(i),this.updateHighlightsInOverlay())}highlightContainerQueryInOverlay(i){this.#h.set(i,this.buildContainerQueryContainerHighlightConfig()),this.updateHighlightsInOverlay()}hideContainerQueryInOverlay(i){this.#h.has(i)&&(this.#h.delete(i),this.updateHighlightsInOverlay())}isContainerQueryHighlighted(i){return this.#h.has(i)}buildContainerQueryContainerHighlightConfig(){return{containerBorder:{color:Common.Color.PageHighlight.LayoutLine.toProtocolRGBA(),pattern:"dashed"},descendantBorder:{color:Common.Color.PageHighlight.LayoutLine.toProtocolRGBA(),pattern:"dashed"}}}highlightIsolatedElementInOverlay(i){this.#s.set(i,this.buildIsolationModeHighlightConfig()),this.updateHighlightsInOverlay()}hideIsolatedElementInOverlay(i){this.#s.has(i)&&(this.#s.delete(i),this.updateHighlightsInOverlay())}isIsolatedElementHighlighted(i){return this.#s.has(i)}buildIsolationModeHighlightConfig(){return{resizerColor:Common.Color.IsolationModeHighlight.Resizer.toProtocolRGBA(),resizerHandleColor:Common.Color.IsolationModeHighlight.ResizerHandle.toProtocolRGBA(),maskColor:Common.Color.IsolationModeHighlight.Mask.toProtocolRGBA()}}hideAllInOverlay(){this.#o.clear(),this.#t.clear(),this.#e.clear(),this.#h.clear(),this.#s.clear(),this.updateHighlightsInOverlay()}refreshHighlights(){const i=this.updateHighlightsForDeletedNodes(this.#t),t=this.updateHighlightsForDeletedNodes(this.#o),e=this.updateHighlightsForDeletedNodes(this.#e),o=this.updateHighlightsForDeletedNodes(this.#h),h=this.updateHighlightsForDeletedNodes(this.#s);(t||i||e||o||h)&&this.updateHighlightsInOverlay()}updateHighlightsForDeletedNodes(i){let t=!1;for(const e of i.keys())null===this.#i.getDOMModel().nodeForId(e)&&(i.delete(e),t=!0);return t}resetOverlay(){for(const i of this.#t.keys())this.#t.set(i,this.buildGridHighlightConfig(i));for(const i of this.#o.keys())this.#o.set(i,this.buildFlexContainerHighlightConfig(i));for(const i of this.#e.keys())this.#e.set(i,this.buildScrollSnapContainerHighlightConfig(i));for(const i of this.#h.keys())this.#h.set(i,this.buildContainerQueryContainerHighlightConfig());for(const i of this.#s.keys())this.#s.set(i,this.buildIsolationModeHighlightConfig());this.updateHighlightsInOverlay()}updateHighlightsInOverlay(){const i=this.#t.size>0||this.#o.size>0||this.#h.size>0||this.#s.size>0;this.#i.setShowViewportSizeOnResize(!i),this.updateGridHighlightsInOverlay(),this.updateFlexHighlightsInOverlay(),this.updateScrollSnapHighlightsInOverlay(),this.updateContainerQueryHighlightsInOverlay(),this.updateIsolatedElementHighlightsInOverlay()}updateGridHighlightsInOverlay(){const i=this.#i,t=[];for(const[i,e]of this.#t.entries())t.push({nodeId:i,gridHighlightConfig:e});i.target().overlayAgent().invoke_setShowGridOverlays({gridNodeHighlightConfigs:t})}updateFlexHighlightsInOverlay(){if(!this.#n)return;const i=this.#i,t=[];for(const[i,e]of this.#o.entries())t.push({nodeId:i,flexContainerHighlightConfig:e});i.target().overlayAgent().invoke_setShowFlexOverlays({flexNodeHighlightConfigs:t})}updateScrollSnapHighlightsInOverlay(){const i=this.#i,t=[];for(const[i,e]of this.#e.entries())t.push({nodeId:i,scrollSnapContainerHighlightConfig:e});i.target().overlayAgent().invoke_setShowScrollSnapOverlays({scrollSnapHighlightConfigs:t})}updateContainerQueryHighlightsInOverlay(){const i=this.#i,t=[];for(const[i,e]of this.#h.entries())t.push({nodeId:i,containerQueryContainerHighlightConfig:e});i.target().overlayAgent().invoke_setShowContainerQueryOverlays({containerQueryHighlightConfigs:t})}updateIsolatedElementHighlightsInOverlay(){const i=this.#i,t=[];for(const[i,e]of this.#s.entries())t.push({nodeId:i,isolationModeHighlightConfig:e});i.target().overlayAgent().invoke_setShowIsolatedElements({isolatedElementHighlightConfigs:t})}}