@yuebai008/cli/dist/cli-server/client/front_end/panels/settings/SettingsScreen.js

Command line interface for rapid qg-minigame development

import*as Common from"../../core/common/common.js";import*as Host from"../../core/host/host.js";import*as i18n from"../../core/i18n/i18n.js";import*as Root from"../../core/root/root.js";import*as IconButton from"../../ui/components/icon_button/icon_button.js";import*as Components from"../../ui/legacy/components/utils/utils.js";import*as UI from"../../ui/legacy/legacy.js";import{PanelUtils}from"../utils/utils.js";import*as PanelComponents from"./components/components.js";import settingsScreenStyles from"./settingsScreen.css.js";const UIStrings={settings:"Settings",shortcuts:"Shortcuts",preferences:"Preferences",restoreDefaultsAndReload:"Restore defaults and reload",experiments:"Experiments",theseExperimentsCouldBeUnstable:"These experiments could be unstable or unreliable and may require you to restart DevTools.",theseExperimentsAreParticularly:"These experiments are particularly unstable. Enable at your own risk.",warning:"WARNING:",oneOrMoreSettingsHaveChanged:"One or more settings have changed which requires a reload to take effect.",filterExperimentsLabel:"Filter",noResults:"No experiments match the filter",learnMore:"Learn more",sendFeedback:"Send feedback"},str_=i18n.i18n.registerUIStrings("panels/settings/SettingsScreen.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);let settingsScreenInstance,genericSettingsTabInstance,experimentsSettingsTabInstance,actionDelegateInstance,revealerInstance;export class SettingsScreen extends UI.Widget.VBox{tabbedLocation;keybindsTab;reportTabOnReveal;constructor(){super(!0),this.contentElement.classList.add("settings-window-main"),this.contentElement.classList.add("vbox");const e=document.createElement("div"),t=UI.Utils.createShadowRootWithCoreStyles(e,{cssFile:[settingsScreenStyles],delegatesFocus:void 0}).createChild("div","settings-window-title");UI.ARIAUtils.markAsHeading(t,1),t.textContent=i18nString(UIStrings.settings),this.tabbedLocation=UI.ViewManager.ViewManager.instance().createTabbedLocation((()=>SettingsScreen.revealSettingsScreen()),"settings-view");const n=this.tabbedLocation.tabbedPane();n.registerCSSFiles([settingsScreenStyles]),n.leftToolbar().appendToolbarItem(new UI.Toolbar.ToolbarItem(e)),n.setShrinkableTabs(!1),n.makeVerticalTabLayout();const s=UI.ViewManager.ViewManager.instance().view("keybinds");s&&s.widget().then((e=>{this.keybindsTab=e})),n.show(this.contentElement),n.selectTab("preferences"),n.addEventListener(UI.TabbedPane.Events.TabInvoked,this.tabInvoked,this),this.reportTabOnReveal=!1}static instance(e={forceNew:null}){const{forceNew:t}=e;return settingsScreenInstance&&!t||(settingsScreenInstance=new SettingsScreen),settingsScreenInstance}static revealSettingsScreen(){const e=SettingsScreen.instance();if(e.isShowing())return e;e.reportTabOnReveal=!0;const t=new UI.Dialog.Dialog;return t.contentElement.tabIndex=-1,t.addCloseButton(),t.setOutsideClickCallback((()=>{})),t.setPointerEventsBehavior("PierceGlassPane"),t.setOutsideTabIndexBehavior(UI.Dialog.OutsideTabIndexBehavior.PreserveMainViewTabIndex),e.show(t.contentElement),t.setEscapeKeyCallback(e.onEscapeKeyPressed.bind(e)),t.setMarginBehavior("NoMargin"),t.show(),e}static async showSettingsScreen(e={name:void 0,focusTabHeader:void 0}){const{name:t,focusTabHeader:n}=e,s=SettingsScreen.revealSettingsScreen();s.selectTab(t||"preferences");const i=s.tabbedLocation.tabbedPane();await i.waitForTabElementUpdate(),n?i.focusSelectedTabHeader():i.focus()}resolveLocation(e){return this.tabbedLocation}selectTab(e){this.tabbedLocation.tabbedPane().selectTab(e,!0)}tabInvoked(e){const t=e.data;if(!t.isUserGesture)return;const n=t.prevTabId,s=t.tabId;!this.reportTabOnReveal&&n&&n===s||(this.reportTabOnReveal=!1,this.reportSettingsPanelShown(s))}reportSettingsPanelShown(e){e!==i18nString(UIStrings.shortcuts)?Host.userMetrics.settingsPanelShown(e):Host.userMetrics.settingsPanelShown("shortcuts")}onEscapeKeyPressed(e){"keybinds"===this.tabbedLocation.tabbedPane().selectedTabId&&this.keybindsTab&&this.keybindsTab.onEscapeKeyPressed(e)}wasShown(){super.wasShown(),this.registerCSSFiles([settingsScreenStyles])}}class SettingsTab extends UI.Widget.VBox{containerElement;constructor(e,t){super(),this.element.classList.add("settings-tab-container"),t&&(this.element.id=t);const n=this.element.createChild("header");UI.UIUtils.createTextChild(n.createChild("h1"),e),this.containerElement=this.element.createChild("div","settings-container-wrapper").createChild("div","settings-tab settings-content settings-container")}appendSection(e){const t=this.containerElement.createChild("div","settings-block");if(e){UI.ARIAUtils.markAsGroup(t);const n=t.createChild("div","settings-section-title");n.textContent=e,UI.ARIAUtils.markAsHeading(n,2),UI.ARIAUtils.setLabel(t,e)}return t}}export class GenericSettingsTab extends SettingsTab{syncSection=new PanelComponents.SyncSection.SyncSection;settingToControl=new Map;constructor(){super(i18nString(UIStrings.preferences),"preferences-tab-content");const e=[Common.Settings.SettingCategory.NONE,Common.Settings.SettingCategory.APPEARANCE,Common.Settings.SettingCategory.SOURCES,Common.Settings.SettingCategory.ELEMENTS,Common.Settings.SettingCategory.NETWORK,Common.Settings.SettingCategory.PERFORMANCE,Common.Settings.SettingCategory.MEMORY,Common.Settings.SettingCategory.CONSOLE,Common.Settings.SettingCategory.EXTENSIONS,Common.Settings.SettingCategory.PERSISTENCE,Common.Settings.SettingCategory.DEBUGGER,Common.Settings.SettingCategory.GLOBAL,Common.Settings.SettingCategory.SYNC],t=Common.Settings.getRegisteredSettings().sort(((e,t)=>e.order&&t.order?e.order-t.order:e.order?-1:t.order?1:0));for(const n of e){const e=t.filter((e=>e.category===n&&GenericSettingsTab.isSettingVisible(e)));this.createSectionElement(n,e)}this.appendSection().appendChild(UI.UIUtils.createTextButton(i18nString(UIStrings.restoreDefaultsAndReload),(function(){Common.Settings.Settings.instance().clearAll(),Components.Reload.reload()})))}static instance(e={forceNew:null}){const{forceNew:t}=e;return genericSettingsTabInstance&&!t||(genericSettingsTabInstance=new GenericSettingsTab),genericSettingsTabInstance}static isSettingVisible(e){const t=e.titleMac&&e.titleMac(),n=e.title&&e.title();return Boolean((t||n)&&e.category)}wasShown(){super.wasShown(),this.updateSyncSection()}updateSyncSection(){Host.InspectorFrontendHost.InspectorFrontendHostInstance.getSyncInformation((e=>{this.syncSection.data={syncInfo:e,syncSetting:Common.Settings.moduleSetting("sync_preferences")}}))}createExtensionSection(e){const t=Common.Settings.SettingCategory.EXTENSIONS,n=Components.Linkifier.LinkHandlerSettingUI.instance().settingElement();if(n){this.createStandardSectionElement(t,e).appendChild(n)}}createSectionElement(e,t){e===Common.Settings.SettingCategory.EXTENSIONS?this.createExtensionSection(t):e===Common.Settings.SettingCategory.SYNC&&t.length>0?this.containerElement.appendChild(this.syncSection):t.length>0&&this.createStandardSectionElement(e,t)}createStandardSectionElement(e,t){const n=Common.Settings.getLocalizedSettingsCategory(e),s=this.appendSection(n);for(const e of t){const t=Common.Settings.Settings.instance().moduleSetting(e.settingName),n=UI.SettingsUI.createControlForSetting(t);n&&(this.settingToControl.set(t,n),s.appendChild(n))}return s}highlightObject(e){if(e instanceof Common.Settings.Setting){const t=this.settingToControl.get(e);t&&PanelUtils.highlightElement(t)}}}export class ExperimentsSettingsTab extends SettingsTab{#e;#t;#n;experimentToControl=new Map;constructor(){super(i18nString(UIStrings.experiments),"experiments-tab-content");const e=this.appendSection();e.classList.add("experiments-filter");const t=e.createChild("label");t.textContent=i18nString(UIStrings.filterExperimentsLabel),this.#n=UI.UIUtils.createInput("","text"),UI.ARIAUtils.bindLabelToControl(t,this.#n),e.appendChild(this.#n),this.#n.addEventListener("input",(()=>this.renderExperiments(this.#n.value.toLowerCase())),!1),this.setFilter("")}renderExperiments(e){this.experimentToControl.clear(),this.#e&&this.#e.remove(),this.#t&&this.#t.remove();const t=Root.Runtime.experiments.allConfigurableExperiments().sort(),n=t.filter((t=>t.unstable&&t.title.toLowerCase().includes(e))),s=t.filter((t=>!t.unstable&&t.title.toLowerCase().includes(e)));if(s.length){this.#e=this.appendSection();const e=i18nString(UIStrings.theseExperimentsCouldBeUnstable);this.#e.appendChild(this.createExperimentsWarningSubsection(e));for(const e of s)this.#e.appendChild(this.createExperimentCheckbox(e))}if(n.length){this.#t=this.appendSection();const e=i18nString(UIStrings.theseExperimentsAreParticularly);this.#t.appendChild(this.createExperimentsWarningSubsection(e));for(const e of n)this.#t.appendChild(this.createExperimentCheckbox(e))}if(!s.length&&!n.length){this.#e=this.appendSection();this.#e.createChild("span").textContent=i18nString(UIStrings.noResults)}}static instance(e={forceNew:null}){const{forceNew:t}=e;return experimentsSettingsTabInstance&&!t||(experimentsSettingsTabInstance=new ExperimentsSettingsTab),experimentsSettingsTabInstance}createExperimentsWarningSubsection(e){const t=document.createElement("div");t.createChild("span","settings-experiments-warning-subsection-warning").textContent=i18nString(UIStrings.warning),UI.UIUtils.createTextChild(t," ");return t.createChild("span","settings-experiments-warning-subsection-message").textContent=e,t}createExperimentCheckbox(e){const t=UI.UIUtils.CheckboxLabel.create(e.title,e.isEnabled());t.classList.add("experiment-label");const n=t.checkboxElement;n.name=e.name,n.addEventListener("click",(function(){e.setEnabled(n.checked),Host.userMetrics.experimentChanged(e.name,e.isEnabled()),UI.InspectorView.InspectorView.instance().displayReloadRequiredWarning(i18nString(UIStrings.oneOrMoreSettingsHaveChanged))}),!1);const s=document.createElement("p");if(this.experimentToControl.set(e,s),s.classList.add("settings-experiment"),e.unstable&&!e.isEnabled()&&s.classList.add("settings-experiment-unstable"),s.appendChild(t),e.docLink){const t=UI.XLink.XLink.create(e.docLink);t.textContent="",t.setAttribute("aria-label",i18nString(UIStrings.learnMore));const n=new IconButton.Icon.Icon;n.data={iconName:"help",color:"var(--icon-default)",width:"16px",height:"16px"},n.classList.add("link-icon"),t.prepend(n),s.appendChild(t)}if(e.feedbackLink){const t=UI.XLink.XLink.create(e.feedbackLink);t.textContent=i18nString(UIStrings.sendFeedback),t.classList.add("feedback-link"),s.appendChild(t)}return s}highlightObject(e){if(e instanceof Root.Runtime.Experiment){const t=this.experimentToControl.get(e);t&&PanelUtils.highlightElement(t)}}setFilter(e){this.#n.value=e,this.#n.dispatchEvent(new Event("input",{bubbles:!0,cancelable:!0}))}}export class ActionDelegate{static instance(e={forceNew:null}){const{forceNew:t}=e;return actionDelegateInstance&&!t||(actionDelegateInstance=new ActionDelegate),actionDelegateInstance}handleAction(e,t){switch(t){case"settings.show":return SettingsScreen.showSettingsScreen({focusTabHeader:!0}),!0;case"settings.documentation":return Host.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab(UI.UIUtils.addReferrerToURL("https://developer.chrome.com/docs/devtools/")),!0;case"settings.shortcuts":return SettingsScreen.showSettingsScreen({name:"keybinds",focusTabHeader:!0}),!0}return!1}}export class Revealer{static instance(e={forceNew:!1}){const{forceNew:t}=e;return revealerInstance&&!t||(revealerInstance=new Revealer),revealerInstance}reveal(e){if(e instanceof Root.Runtime.Experiment)return Host.InspectorFrontendHost.InspectorFrontendHostInstance.bringToFront(),SettingsScreen.showSettingsScreen({name:"experiments"}).then((()=>ExperimentsSettingsTab.instance().highlightObject(e))),Promise.resolve();console.assert(e instanceof Common.Settings.Setting);const t=e;for(const n of Common.Settings.getRegisteredSettings())if(GenericSettingsTab.isSettingVisible(n)&&n.settingName===t.name)return Host.InspectorFrontendHost.InspectorFrontendHostInstance.bringToFront(),SettingsScreen.showSettingsScreen().then((()=>GenericSettingsTab.instance().highlightObject(e))),Promise.resolve();for(const n of UI.ViewManager.getRegisteredViewExtensions()){const s=n.viewId();if("settings-view"!==n.location())continue;const i=n.settings();if(i&&-1!==i.indexOf(t.name))return Host.InspectorFrontendHost.InspectorFrontendHostInstance.bringToFront(),SettingsScreen.showSettingsScreen({name:s}).then((async()=>{const t=await n.widget();t instanceof SettingsTab&&t.highlightObject(e)})),Promise.resolve()}return Promise.reject()}}