highlight cmd i onboarding (#105)

* WIP: Walkthrough changes (microsoft#236) * Added walkthrough progress * Added progress for walkthrough * Added todo * enable editorInsets for inline chat (microsoft#253) * Fix .gitmodules * Update code.sh * update submodule to latest tip (microsoft#260) * fix: microsoft#262 prioritize pearai commands (microsoft#264) * fix: microsoft#262 prioritize pearai commands * fix: update priority order and change test case default chord * fix: use keymode.shift * Fixed code version * feat: docs and newchat shortcut on titlebar (microsoft#266) * feat: docs and newchat shortcut on titlebar * typo * Update README.md (microsoft#276) * Shortcut change to resize chat on the app side (microsoft#279) * Shortcut change to resize chat on the app side * Removed test related console log * Updated splitEditor shortcut * update icon and watermark (microsoft#278) * watermarks update * add shortcuts to watermark * titlebar icon change * fix walkthrough * Added product (microsoft#285) Co-authored-by: Nathan A <[email protected]> * set quality:stable (microsoft#267) * update MacOS example in CONTRIBUTING.md file: Packaging step 3 - integrate the submodule (microsoft#228) * update MacOS example in CONTRIBUTING.md file: Packaging step 3 - integrate the submodule * fix constants CAP * PearAI main app welcome page gif fixed (microsoft#286) * Update media paths for welcome page GIFs and GIF themselves. * upload two gifs first * upload one gif first * push again * Fixed walk through (microsoft#288) * Added imports for gif * Added png * Added typo fix * Added png --------- Co-authored-by: Nathan A <[email protected]> * Added to readme (microsoft#295) Co-authored-by: Nathan A <[email protected]> * add hacker theme to pearai (microsoft#300) * Update README.md * Set default theme to PearAI Dark/Light (microsoft#322) * Set default theme to PearAI Dark/Light * Undo not needed solarized file changes * Added auto-updating working client-side (microsoft#340) * Added updating working * Removed configs --------- Co-authored-by: Nathan A <[email protected]> Co-authored-by: Nathan A <[email protected]> * Updated wording (microsoft#341) * Added updating working * Removed configs * Added pearAI online services * Added pearAI online services --------- Co-authored-by: Nathan A <[email protected]> Co-authored-by: Nathan A <[email protected]> * Setup Environment with Space in Path (microsoft#335) * Added v1.1.0 (microsoft#344) Co-authored-by: Nathan A <[email protected]> * Bumped to v1.2.0 * Update README.md * patch-wsl (add vscode commit) (microsoft#348) * Update README.md * If you are looking for commit history, read this please * Updated to v1.3.0 * add pear version in about * Update CONTRIBUTING.md update packaging guide * Update CONTRIBUTING.md update packaging info * Update CONTRIBUTING.md * Git submodule commit update (#66) * Bumped to v1.4.0 * PearAI Overlay (#67) * PearAI Overlay * Uncomment layout * Remove comment * Prevent overlay open on every startup + background default color * Fix overlay bug * Border radius * Bumped to v1.4.1 * Fix overlay popping up for half a second at startup (#77) * Console logs for debugging trace of overlay startup * Revert "Console logs for debugging trace of overlay startup" This reverts commit 70fa3bc. * Fix overlay appearing for half a second on startup * Bumped versions (#80) Co-authored-by: nang-dev <[email protected]> * Handle overlay integration shortcuts (#84) * feat: new window watermark (#87) * Added darken and click outside overlay. todo for not closing * Added min for the auxbar (#94) Co-authored-by: nang-dev <[email protected]> * feat: overlay-lock (#92) * Added remove release notes (#96) Co-authored-by: nang-dev <[email protected]> * remove unused vars (#97) * Bumped to v1.4.4 * Default close sidebar for new window (#98) * Add highlight of quickinput during cmd+i step * clean up * package.json * remove transition --------- Co-authored-by: Nang <[email protected]> Co-authored-by: Himanshu <[email protected]> Co-authored-by: Duke Pan <[email protected]> Co-authored-by: Maximiliano Farfan <[email protected]> Co-authored-by: Nathan A <[email protected]> Co-authored-by: Brian <[email protected]> Co-authored-by: Andrew Hopkins <[email protected]> Co-authored-by: Nathan A <[email protected]> Co-authored-by: Ashvin Nihalani <[email protected]> Co-authored-by: nang-dev <[email protected]>
trypear · Jan 4, 2025 · 554c798 · 554c798
1 parent 312c22f
commit 554c798
Show file tree

Hide file tree

Showing 2 changed files with 151 additions and 0 deletions.
diff --git a/src/vs/workbench/browser/parts/overlay/onboardingShadow/shadowOverlayService.ts b/src/vs/workbench/browser/parts/overlay/onboardingShadow/shadowOverlayService.ts
@@ -0,0 +1,94 @@
+import { createDecorator } from 'vs/platform/instantiation/common/instantiation';
+import { registerSingleton, InstantiationType } from 'vs/platform/instantiation/common/extensions';
+import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
+import { CommandsRegistry } from 'vs/platform/commands/common/commands';
+
+export const IShadowOverlayService = createDecorator<IShadowOverlayService>('shadowOverlayService');
+
+export interface IShadowOverlayService extends IDisposable {
+    readonly _serviceBrand: undefined;
+
+    highlight(elements: string[]): void;
+	restoreStyles(elements: string[]): void;
+}
+
+
+export class ShadowOverlayService extends Disposable implements IShadowOverlayService {
+    declare readonly _serviceBrand: undefined;
+	private highlightedElements: Map<string, {
+        position: string;
+        zIndex: string;
+        isolation: string;
+        pointerEvents: string;
+        backgroundColor: string;
+        boxShadow: string;
+    }> = new Map();
+
+    constructor(
+    ) {
+		super();
+		this.registerCommands();
+	}
+
+	private registerCommands(): void {
+		CommandsRegistry.registerCommand('pearai.highlightElements', (accessor, ...args) => {
+
+			const selectors = args[0] as string[];  // array of CSS selectors
+			this.highlight(selectors);
+		});
+
+		CommandsRegistry.registerCommand('pearai.removeHighlight', (accessor, ...args) => {
+			const selectors = args[0] as string[];  // array of CSS selectors
+			 // Convert selectors to elements
+			this.restoreStyles(selectors);
+		});
+	}
+
+	restoreStyles(selectors: string[]): void {
+		selectors.forEach(selector => {
+			const originalStyles = this.highlightedElements.get(selector);
+
+			const element = document.querySelector(selector) as HTMLElement
+
+			if (originalStyles) {
+				element.style.position = originalStyles.position;
+				element.style.zIndex = originalStyles.zIndex;
+				element.style.isolation = originalStyles.isolation;
+				element.style.pointerEvents = originalStyles.pointerEvents;
+				element.style.backgroundColor = originalStyles.backgroundColor;
+				element.style.boxShadow = originalStyles.boxShadow;
+
+				// Remove this element from the tracked elements
+				this.highlightedElements.delete(selector);
+			}
+		});
+	}
+
+	highlight(selectors: string[]): void {
+        selectors.forEach(selector => {
+            if (selector) {
+				const element = document.querySelector(selector) as HTMLElement
+
+				// save original styles
+				if (!this.highlightedElements.has(selector)) {
+                    this.highlightedElements.set(selector, {
+                        position: element.style.position,
+                        zIndex: element.style.zIndex,
+                        isolation: element.style.isolation,
+                        pointerEvents: element.style.pointerEvents,
+                        backgroundColor: element.style.backgroundColor,
+                        boxShadow: element.style.boxShadow,
+                    });
+                }
+                element.style.position = 'absolute';
+                element.style.zIndex = '3000';
+				element.style.isolation = 'isolate';
+				element.style.pointerEvents = 'auto';
+				element.style.backgroundColor = 'transparent';
+            	element.style.boxShadow = '0 0 0 9999px rgba(0, 0, 0, 0.6)';
+            }
+        });
+    }
+}
+
+registerSingleton(IShadowOverlayService, ShadowOverlayService, InstantiationType.Eager,);
diff --git a/src/vs/workbench/browser/workbench.ts b/src/vs/workbench/browser/workbench.ts
@@ -3,6 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+<<<<<<< HEAD
 import './style.js';
 import { runWhenWindowIdle } from '../../base/browser/dom.js';
 import { Event, Emitter, setGlobalLeakWarningThreshold } from '../../base/common/event.js';
@@ -50,6 +51,57 @@ import { setProgressAcccessibilitySignalScheduler } from '../../base/browser/ui/
 import { AccessibleViewRegistry } from '../../platform/accessibility/browser/accessibleViewRegistry.js';
 import { NotificationAccessibleView } from './parts/notifications/notificationAccessibleView.js';
 import { IPearOverlayService } from '../../parts/overlay/pearOverlayService';
+=======
+import 'vs/workbench/browser/style';
+import { localize } from 'vs/nls';
+import { runWhenWindowIdle } from 'vs/base/browser/dom';
+import { Event, Emitter, setGlobalLeakWarningThreshold } from 'vs/base/common/event';
+import { RunOnceScheduler, timeout } from 'vs/base/common/async';
+import { isFirefox, isSafari, isChrome } from 'vs/base/browser/browser';
+import { mark } from 'vs/base/common/performance';
+import { onUnexpectedError, setUnexpectedErrorHandler } from 'vs/base/common/errors';
+import { Registry } from 'vs/platform/registry/common/platform';
+import { isWindows, isLinux, isWeb, isNative, isMacintosh } from 'vs/base/common/platform';
+import { IWorkbenchContributionsRegistry, Extensions as WorkbenchExtensions } from 'vs/workbench/common/contributions';
+import { IEditorFactoryRegistry, EditorExtensions } from 'vs/workbench/common/editor';
+import { getSingletonServiceDescriptors } from 'vs/platform/instantiation/common/extensions';
+import { Position, Parts, IWorkbenchLayoutService, positionToString } from 'vs/workbench/services/layout/browser/layoutService';
+import { IStorageService, WillSaveStateReason, StorageScope, StorageTarget } from 'vs/platform/storage/common/storage';
+import { IConfigurationChangeEvent, IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
+import { LifecyclePhase, ILifecycleService, WillShutdownEvent } from 'vs/workbench/services/lifecycle/common/lifecycle';
+import { INotificationService } from 'vs/platform/notification/common/notification';
+import { NotificationService } from 'vs/workbench/services/notification/common/notificationService';
+import { NotificationsCenter } from 'vs/workbench/browser/parts/notifications/notificationsCenter';
+import { NotificationsAlerts } from 'vs/workbench/browser/parts/notifications/notificationsAlerts';
+import { NotificationsStatus } from 'vs/workbench/browser/parts/notifications/notificationsStatus';
+import { NotificationsTelemetry } from 'vs/workbench/browser/parts/notifications/notificationsTelemetry';
+import { registerNotificationCommands } from 'vs/workbench/browser/parts/notifications/notificationsCommands';
+import { NotificationsToasts } from 'vs/workbench/browser/parts/notifications/notificationsToasts';
+import { setARIAContainer } from 'vs/base/browser/ui/aria/aria';
+import { FontMeasurements } from 'vs/editor/browser/config/fontMeasurements';
+import { BareFontInfo } from 'vs/editor/common/config/fontInfo';
+import { ILogService } from 'vs/platform/log/common/log';
+import { toErrorMessage } from 'vs/base/common/errorMessage';
+import { WorkbenchContextKeysHandler } from 'vs/workbench/browser/contextkeys';
+import { coalesce } from 'vs/base/common/arrays';
+import { InstantiationService } from 'vs/platform/instantiation/common/instantiationService';
+import { Layout } from 'vs/workbench/browser/layout';
+import { IHostService } from 'vs/workbench/services/host/browser/host';
+import { IDialogService } from 'vs/platform/dialogs/common/dialogs';
+import { mainWindow } from 'vs/base/browser/window';
+import { PixelRatio } from 'vs/base/browser/pixelRatio';
+import { IHoverService, WorkbenchHoverDelegate } from 'vs/platform/hover/browser/hover';
+import { setHoverDelegateFactory } from 'vs/base/browser/ui/hover/hoverDelegateFactory';
+import { setBaseLayerHoverDelegate } from 'vs/base/browser/ui/hover/hoverDelegate2';
+import { AccessibilityProgressSignalScheduler } from 'vs/platform/accessibilitySignal/browser/progressAccessibilitySignalScheduler';
+import { setProgressAcccessibilitySignalScheduler } from 'vs/base/browser/ui/progressbar/progressAccessibilitySignal';
+import { AccessibleViewRegistry } from 'vs/platform/accessibility/browser/accessibleViewRegistry';
+import { NotificationAccessibleView } from 'vs/workbench/browser/parts/notifications/notificationAccessibleView';
+import { IPearOverlayService } from 'vs/workbench/browser/parts/overlay/pearOverlayService';
+import { IShadowOverlayService } from 'vs/workbench/browser/parts/overlay/onboardingShadow/shadowOverlayService';
+>>>>>>> 80f8c8e0b8f (highlight cmd i onboarding (#105))
 
 export interface IWorkbenchOptions {
 
@@ -353,6 +405,11 @@ export class Workbench extends Layout {
 				});
 			}
 
+			// instantiate highlighting
+			instantiationService.invokeFunction(accessor => {
+				accessor.get(IShadowOverlayService);
+			});
+
 			mark(`code/willCreatePart/${id}`);
 			this.getPart(id).create(partContainer, options);
 			mark(`code/didCreatePart/${id}`);