TypeScript editorBrowser.IRenderingContext类代码示例

	private _renderWholeLineDecorations(ctx:IRenderingContext, decorations:editorCommon.IModelDecoration[], output: IRenderResult): void {
		let lineHeight = String(this._context.configuration.editor.lineHeight);

		for (let i = 0, lenI = decorations.length; i < lenI; i++) {
			let d = decorations[i];

			if (!d.options.isWholeLine) {
				continue;
			}

			let decorationOutput = [
				'<div class="cdr ',
				d.options.className,
				'" style="left:0;width:100%;height:',
				lineHeight,
				'px;"></div>'
			].join('');

			let startLineNumber = d.range.startLineNumber;
			let endLineNumber = d.range.endLineNumber;
			for (let j = startLineNumber; j <= endLineNumber; j++) {
				if (!ctx.lineIsVisible(j)) {
					continue;
				}

				let strLineNumber = String(j);
				if (output.hasOwnProperty(strLineNumber)) {
					output[strLineNumber].push(decorationOutput);
				} else {
					output[strLineNumber] = [decorationOutput];
				}
			}
		}
	}

	public prepareRender(ctx:IRenderingContext): void {
		var visibleRange = ctx.visibleRangeForPosition(this._position);
		if (visibleRange) {
			this._positionTop = visibleRange.top;
			this._positionLeft = visibleRange.left;
			this._isInViewport = true;
		} else {
			this._isInViewport = false;
		}
	}

	protected _getDecorations(ctx:IRenderingContext): DecorationToRender[] {
		let decorations = ctx.getDecorationsInViewport();
		let r:DecorationToRender[] = [];
		for (let i = 0, len = decorations.length; i < len; i++) {
			let d = decorations[i];
			if (d.options.linesDecorationsClassName) {
				r.push(new DecorationToRender(d.range.startLineNumber, d.range.endLineNumber, d.options.linesDecorationsClassName));
			}
		}
		return r;
	}

	private _prepareRenderWidgetAtExactPosition(position:editorCommon.IEditorPosition, ctx:IRenderingContext): IMyWidgetRenderData {
		let visibleRange = ctx.visibleRangeForPosition(position);

		if (!visibleRange) {
			return null;
		}

		return {
			top: visibleRange.top,
			left: visibleRange.left
		};
	}

	private _layoutBoxInPage(position: editorCommon.IEditorPosition, domNode: HTMLElement, ctx: IRenderingContext): IBoxLayoutResult {
		let visibleRange = ctx.visibleRangeForPosition(position);

		if (!visibleRange) {
			return null;
		}

		let left0 = visibleRange.left - ctx.viewportLeft;

		let width = domNode.clientWidth,
			height = domNode.clientHeight;

		if (left0 + width < 0 || left0 > this._contentWidth) {
			return null;
		}

		let aboveTop = visibleRange.top - height,
			belowTop = visibleRange.top + this._context.configuration.editor.lineHeight,
			left = left0 + this._contentLeft;

		let domNodePosition = dom.getDomNodePosition(this._viewDomNode);
		let absoluteAboveTop = domNodePosition.top + aboveTop - document.body.scrollTop - document.documentElement.scrollTop,
			absoluteBelowTop = domNodePosition.top + belowTop - document.body.scrollTop - document.documentElement.scrollTop,
			absoluteLeft = domNodePosition.left + left - document.body.scrollLeft - document.documentElement.scrollLeft;

		let INNER_WIDTH = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth,
			INNER_HEIGHT = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

		// Leave some clearance to the bottom
		let BOTTOM_PADDING = 22;

		let fitsAbove = (absoluteAboveTop >= 0),
			fitsBelow = (absoluteBelowTop + height <= INNER_HEIGHT - BOTTOM_PADDING);

		if (absoluteLeft + width + 20 > INNER_WIDTH) {
			let delta = absoluteLeft - (INNER_WIDTH - width - 20);
			absoluteLeft -= delta;
			left -= delta;
		}
		if (absoluteLeft < 0) {
			let delta = absoluteLeft;
			absoluteLeft -= delta;
			left -= delta;
		}

		return {
			aboveTop: aboveTop,
			fitsAbove: fitsAbove,
			belowTop: belowTop,
			fitsBelow: fitsBelow,
			left: left
		};
	}

	public prepareRender(ctx:IRenderingContext): void {
		if (!this.shouldRender()) {
			throw new Error('I did not ask to render!');
		}

		let decorations = ctx.getDecorationsInViewport();

		// Keep only decorations with `className`
		decorations = decorations.filter(d => !!d.options.className);

		// Sort decorations for consistent render output
		decorations = decorations.sort((a, b) => {
			if (a.options.className < b.options.className) {
				return -1;
			}
			if (a.options.className > b.options.className) {
				return 1;
			}

			if (a.range.startLineNumber === b.range.startLineNumber) {
				if (a.range.startColumn === b.range.startColumn) {
					if (a.range.endLineNumber === b.range.endLineNumber) {
						return a.range.endColumn - b.range.endColumn;
					}
					return a.range.endLineNumber - b.range.endLineNumber;
				}
				return a.range.startColumn - b.range.startColumn;
			}
			return a.range.startLineNumber - b.range.startLineNumber;
		});

		let visibleStartLineNumber = ctx.visibleRange.startLineNumber;
		let visibleEndLineNumber = ctx.visibleRange.endLineNumber;
		let output: string[] = [];
		for (let lineNumber = visibleStartLineNumber; lineNumber <= visibleEndLineNumber; lineNumber++) {
			let lineIndex = lineNumber - visibleStartLineNumber;
			output[lineIndex] = '';
		}

		// Render first whole line decorations and then regular decorations
		this._renderWholeLineDecorations(ctx, decorations, output);
		this._renderNormalDecorations(ctx, decorations, output);
		this._renderResult = output;
	}

	private _layoutBoxInViewport(position:editorCommon.IEditorPosition, domNode:HTMLElement, ctx:IRenderingContext): IBoxLayoutResult {

		let visibleRange = ctx.visibleRangeForPosition(position);

		if (!visibleRange) {
			return null;
		}

		let width = domNode.clientWidth;
		let height = domNode.clientHeight;

		// Our visible box is split horizontally by the current line => 2 boxes

		// a) the box above the line
		let aboveLineTop = visibleRange.top;
		let heightAboveLine = aboveLineTop;

		// b) the box under the line
		let underLineTop = visibleRange.top + this._context.configuration.editor.lineHeight;
		let heightUnderLine = ctx.viewportHeight - underLineTop;

		let aboveTop = aboveLineTop - height;
		let fitsAbove = (heightAboveLine >= height);
		let belowTop = underLineTop;
		let fitsBelow = (heightUnderLine >= height);

		// And its left
		let actualLeft = visibleRange.left;
		if (actualLeft + width > ctx.viewportLeft + ctx.viewportWidth) {
			actualLeft = ctx.viewportLeft + ctx.viewportWidth - width;
		}
		if (actualLeft < ctx.viewportLeft) {
			actualLeft = ctx.viewportLeft;
		}

		return {
			aboveTop: aboveTop,
			fitsAbove: fitsAbove,
			belowTop: belowTop,
			fitsBelow: fitsBelow,
			left: actualLeft
		};
	}

	private _renderNormalDecorations(ctx:IRenderingContext, decorations:editorCommon.IModelDecoration[], output: IRenderResult): void {
		let lineHeight = String(this._context.configuration.editor.lineHeight);

		for (let i = 0, lenI = decorations.length; i < lenI; i++) {
			let d = decorations[i];

			if (d.options.isWholeLine) {
				continue;
			}
			let linesVisibleRanges = ctx.linesVisibleRangesForRange(d.range, false);
			if (!linesVisibleRanges) {
				continue;
			}

			let className = d.options.className;
			for (let j = 0, lenJ = linesVisibleRanges.length; j < lenJ; j++) {
				let lineVisibleRanges = linesVisibleRanges[j];

				let strLineNumber = String(lineVisibleRanges.lineNumber);
				let lineOutput: string[];
				if (output.hasOwnProperty(strLineNumber)) {
					lineOutput = output[strLineNumber];
				} else {
					lineOutput = [];
					output[strLineNumber] = lineOutput;
				}

				for (let k = 0, lenK = lineVisibleRanges.ranges.length; k < lenK; k++) {
					let visibleRange = lineVisibleRanges.ranges[k];

					lineOutput.push('<div class="cdr ');
					lineOutput.push(className);
					lineOutput.push('" style="left:');
					lineOutput.push(String(visibleRange.left));
					lineOutput.push('px;width:');
					lineOutput.push(String(visibleRange.width));
					lineOutput.push('px;height:');
					lineOutput.push(lineHeight);
					lineOutput.push('px;"></div>');
				}
			}
		}
	}

	public shouldCallRender2(ctx:IRenderingContext): boolean {
		if (!this.shouldRender) {
			return false;
		}
		this.shouldRender = false;

		let decorations = ctx.getDecorationsInViewport();

		// Keep only decorations with `className`
		decorations = decorations.filter(d => !!d.options.className);

		// Sort decorations for consistent render output
		decorations = decorations.sort((a, b) => {
			if (a.options.className < b.options.className) {
				return -1;
			}
			if (a.options.className > b.options.className) {
				return 1;
			}

			if (a.range.startLineNumber === b.range.startLineNumber) {
				if (a.range.startColumn === b.range.startColumn) {
					if (a.range.endLineNumber === b.range.endLineNumber) {
						return a.range.endColumn - b.range.endColumn;
					}
					return a.range.endLineNumber - b.range.endLineNumber;
				}
				return a.range.startColumn - b.range.startColumn;
			}
			return a.range.startLineNumber - b.range.startLineNumber;
		});

		// Render first whole line decorations and then regular decorations
		let output: IRenderResult = {};
		this._renderWholeLineDecorations(ctx, decorations, output);
		this._renderNormalDecorations(ctx, decorations, output);
		this._renderResult = output;

		return true;
	}

		this._requestModificationFrame(() => {
			var visibleZones:{[id:string]:editorCommon.IViewWhitespaceViewportData;} = {},
				i:number,
				len:number,
				hasVisibleZone = false;

			for (i = 0, len = visibleWhitespaces.length; i < len; i++) {
				visibleZones[visibleWhitespaces[i].id.toString()] = visibleWhitespaces[i];
				hasVisibleZone = true;
			}

			var id:string,
				zone:IMyViewZone;

			for (id in this._zones) {
				if (this._zones.hasOwnProperty(id)) {
					zone = this._zones[id];

					if (visibleZones.hasOwnProperty(id)) {
						// zone is visible
						StyleMutator.setTop(zone.delegate.domNode, (visibleZones[id].verticalOffset - ctx.bigNumbersDelta));
						StyleMutator.setHeight(zone.delegate.domNode, visibleZones[id].height);
						if (!zone.isVisible) {
							StyleMutator.setDisplay(zone.delegate.domNode, 'block');
							zone.delegate.domNode.setAttribute('monaco-visible-view-zone', 'true');
							zone.isVisible = true;
						}
						this._safeCallOnDomNodeTop(zone.delegate, ctx.getScrolledTopFromAbsoluteTop(visibleZones[id].verticalOffset));
					} else {
						if (zone.isVisible) {
							StyleMutator.setDisplay(zone.delegate.domNode, 'none');
							zone.delegate.domNode.removeAttribute('monaco-visible-view-zone');
							zone.isVisible = false;
						}
						this._safeCallOnDomNodeTop(zone.delegate, ctx.getScrolledTopFromAbsoluteTop(-1000000));
					}
				}
			}

			if (hasVisibleZone) {
				StyleMutator.setWidth(this.domNode, ctx.scrollWidth);
			}
		});