Archives/convergencelabs_monaco-collab-ext
1
0
Fork 0
mirror of https://github.com/convergencelabs/monaco-collab-ext.git synced 2024-10-27 20:34:17 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'master' into show-tooltip-on-hover

Browse Source
This commit is contained in:
Alec LaLonde 2022-09-19 20:40:14 -06:00 committed by GitHub
commit 6edfb6253d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/ts/RemoteCursorManager.ts
View File

@ -24,7 +24,12 @@ export interface IRemoteCursorManagerOptions {
editor: monaco.editor.ICodeEditor;
/**
* Determines if tooltips will be shown when the cursor is moved or hovered.
* An additional class name for the cursor element, to tweak the default style
*/
className?: string;
/**
* Determines if tooltips will be shown when the cursor is moved.
*/
tooltips?: boolean;
@ -38,6 +43,11 @@ export interface IRemoteCursorManagerOptions {
* Show the tooltip when the cursor is hovered
*/
showTooltipOnHover?: boolean;
/**
* An additional class name for the tooltip element, to tweak the default style
*/
tooltipClassName?: string;
}
/**
@ -121,11 +131,13 @@ export class RemoteCursorManager {
const cursorWidget = new RemoteCursorWidget(
this._options.editor,
widgetId,
this._options.className,
color,
label,
this._options.tooltips,
tooltipDurationMs,
this._options.showTooltipOnHover,
this._options.tooltipClassName,
() => this.removeCursor(id));
this._cursorWidgets.set(id, cursorWidget);

12
src/ts/RemoteCursorWidget.ts
View File

@ -51,11 +51,13 @@ export class RemoteCursorWidget implements editor.IContentWidget, IDisposable {
constructor(codeEditor: editor.ICodeEditor,
widgetId: string,
className: string | undefined,
color: string,
label: string,
tooltipEnabled: boolean,
tooltipDuration: number,
showTooltipOnHover: boolean,
tooltipClassName: string | undefined,
onDisposed: OnDisposed) {
this._editor = codeEditor;
this._tooltipDuration = tooltipDuration;
@ -65,16 +67,16 @@ export class RemoteCursorWidget implements editor.IContentWidget, IDisposable {
// Create the main node for the cursor element.
const {lineHeight} = getConfiguration(this._editor);
this._domNode = document.createElement("div");
this._domNode.className = "monaco-remote-cursor";
this._domNode.className = classNames('monaco-remote-cursor', className)
this._domNode.style.background = color;
this._domNode.style.height = `${lineHeight}px`;
// Create the tooltip element if the tooltip is enabled.
if (tooltipEnabled) {
this._tooltipNode = document.createElement("div");
this._tooltipNode.className = "monaco-remote-cursor-tooltip";
this._tooltipNode.className = classNames('monaco-remote-cursor-tooltip', tooltipClassName)
this._tooltipNode.style.background = color;
this._tooltipNode.innerHTML = label;
this._tooltipNode.innerText = label;
this._domNode.appendChild(this._tooltipNode);
// we only need to listen to scroll positions to update the
@ -252,3 +254,7 @@ export class RemoteCursorWidget implements editor.IContentWidget, IDisposable {
}
}
}
function classNames(...names: (string|undefined|null)[]) {
return names.filter(className => className != null && className.length > 0).join(' ')
}