TypeScript dom.addClass函数代码示例

	protected create(parent: HTMLElement): void {
		this.titleContainer = parent;
		this.titleContainer.draggable = true;

		//Container listeners
		this.registerContainerListeners();

		// Gesture Support
		Gesture.addTarget(this.titleContainer);

		const labelContainer = document.createElement('div');
		addClass(labelContainer, 'label-container');
		this.titleContainer.appendChild(labelContainer);

		// Editor Label
		this.editorLabel = this._register(this.instantiationService.createInstance(ResourceLabel, labelContainer, void 0));
		this._register(this.editorLabel.onClick(e => this.onTitleLabelClick(e)));

		// Breadcrumbs
		this.createBreadcrumbsControl(labelContainer, { showFileIcons: false, showSymbolIcons: true, showDecorationColors: false, breadcrumbsBackground: editorBackground });
		toggleClass(this.titleContainer, 'breadcrumbs', Boolean(this.breadcrumbsControl));
		this.toDispose.push({ dispose: () => removeClass(this.titleContainer, 'breadcrumbs') }); // import to remove because the container is a shared dom node

		// Right Actions Container
		const actionsContainer = document.createElement('div');
		addClass(actionsContainer, 'title-actions');
		this.titleContainer.appendChild(actionsContainer);

		// Editor actions toolbar
		this.createEditorActionsToolBar(actionsContainer);
	}

	protected create(parent: HTMLElement): void {
		this.titleContainer = parent;
		this.titleContainer.draggable = true;

		//Container listeners
		this.registerContainerListeners();

		// Gesture Support
		Gesture.addTarget(this.titleContainer);

		const labelContainer = document.createElement('div');
		addClass(labelContainer, 'label-container');
		this.titleContainer.appendChild(labelContainer);

		// Editor Label
		this.editorLabel = this._register(this.instantiationService.createInstance(ResourceLabel, labelContainer, void 0));
		this._register(this.editorLabel.onClick(e => this.onTitleLabelClick(e)));

		// Breadcrumbs
		this.createBreadcrumbsControl(labelContainer, { showFileIcons: false, showSymbolIcons: true, showDecorationColors: false, extraClasses: ['no-tabs-breadcrumbs'] });

		// Right Actions Container
		const actionsContainer = document.createElement('div');
		addClass(actionsContainer, 'title-actions');
		this.titleContainer.appendChild(actionsContainer);

		// Editor actions toolbar
		this.createEditorActionsToolBar(actionsContainer);
	}

	private doSetWorked(value: number): ProgressBar {
		assert.ok(!isNaN(this.totalWork), 'Total work not set');

		this.workedVal = value;
		this.workedVal = Math.min(this.totalWork, this.workedVal);

		if (hasClass(this.element, css_infinite)) {
			removeClass(this.element, css_infinite);
		}

		if (hasClass(this.element, css_done)) {
			removeClass(this.element, css_done);
		}

		if (!hasClass(this.element, css_active)) {
			addClass(this.element, css_active);
		}

		if (!hasClass(this.element, css_discrete)) {
			addClass(this.element, css_discrete);
		}

		this.bit.style.width = 100 * (this.workedVal / this.totalWork) + '%';

		return this;
	}

	protected doRefresh(): void {
		const group = this.context;
		const editor = group && group.activeEditor;
		if (!editor) {
			this.editorLabel.clear();
			this.clearEditorActionsToolbar();

			return; // return early if we are being closed
		}

		const isPinned = group.isPinned(group.activeEditor);
		const isActive = this.stacks.isActive(group);

		// Activity state
		if (isActive) {
			DOM.addClass(this.titleContainer, 'active');
		} else {
			DOM.removeClass(this.titleContainer, 'active');
		}

		// Dirty state
		if (editor.isDirty()) {
			DOM.addClass(this.titleContainer, 'dirty');
		} else {
			DOM.removeClass(this.titleContainer, 'dirty');
		}

		// Editor Label
		const resource = toResource(editor, { supportSideBySide: true });
		const name = editor.getName() || '';

		const labelFormat = this.editorGroupService.getTabOptions().labelFormat;
		let description: string;
		if (labelFormat === 'default' && !isActive) {
			description = ''; // hide description when group is not active and style is 'default'
		} else {
			description = editor.getDescription(this.getVerbosity(labelFormat)) || '';
		}

		let title = editor.getTitle(Verbosity.LONG);
		if (description === title) {
			title = ''; // dont repeat what is already shown
		}

		this.editorLabel.setLabel({ name, description, resource }, { title, italic: !isPinned, extraClasses: ['title-label'] });
		if (isActive) {
			this.editorLabel.element.style.color = this.getColor(TAB_ACTIVE_FOREGROUND);
		} else {
			this.editorLabel.element.style.color = this.getColor(TAB_UNFOCUSED_ACTIVE_FOREGROUND);
		}

		// Update Editor Actions Toolbar
		this.updateEditorActionsToolbar();
	}

	private create(container: HTMLElement): void {
		this.element = document.createElement('div');
		addClass(this.element, css_progress_container);
		container.appendChild(this.element);

		this.bit = document.createElement('div');
		addClass(this.bit, css_progress_bit);
		this.element.appendChild(this.bit);

		this.applyStyles();
	}

		this.ifEditorIsActive(editor, () => {
			if (editor.isDirty()) {
				addClass(this.titleContainer, 'dirty');
			} else {
				removeClass(this.titleContainer, 'dirty');
			}
		});

	/**
	 * Releases the row for eventual reuse. The row's domNode
	 * will eventually be removed from its parent, given that
	 * it is not the currently scrolling row (for OS X ballistic
	 * scrolling).
	 */
	release(row: IRow): void {
		if (!row.domNode) {
			return;
		}

		var lastScrollTime = getLastScrollTime(row.domNode);

		if (!lastScrollTime) {
			removeFromParent(row.domNode);
			this.getTemplateCache(row.templateId).push(row);
			return;
		}

		if (this.scrollingRow) {
			var lastKnownScrollTime = getLastScrollTime(this.scrollingRow.domNode);

			if (lastKnownScrollTime > lastScrollTime) {
				removeFromParent(row.domNode);
				this.getTemplateCache(row.templateId).push(row);
				return;
			}

			if (this.scrollingRow.domNode.parentElement) {
				removeFromParent(this.scrollingRow.domNode);
				removeClass(this.scrollingRow.domNode, 'scrolling');
				this.getTemplateCache(this.scrollingRow.templateId).push(this.scrollingRow);
			}
		}

		this.scrollingRow = row;
		addClass(this.scrollingRow.domNode, 'scrolling');
	}

	public render(container: HTMLElement): void {
		dom.addClass(container, 'select-container');
		container.appendChild(this.selectElement);
		this.setOptions(this.options, this.selected);

		this.applyStyles();
	}

	/**
	 * Releases the row for eventual reuse. The row's domNode
	 * will eventually be removed from its parent, given that
	 * it is not the currently scrolling row (for OS X ballistic
	 * scrolling).
	 */
	release(row: IRow): void {
		if (!row) {
			return;
		}

		const lastScrollTime = getLastScrollTime(row.domNode);

		if (!lastScrollTime) {
			this.releaseRow(row);
			return;
		}

		if (this.scrollingRow) {
			const lastKnownScrollTime = getLastScrollTime(this.scrollingRow.domNode);

			if (lastKnownScrollTime > lastScrollTime) {
				this.releaseRow(row);
				return;
			}

			if (this.scrollingRow.domNode.parentElement) {
				this.releaseRow(this.scrollingRow);
			}
		}

		this.scrollingRow = row;
		addClass(this.scrollingRow.domNode, 'scrolling');
	}

	private doDone(delayed: boolean): ProgressBar {
		addClass(this.element, css_done);

		// let it grow to 100% width and hide afterwards
		if (!hasClass(this.element, css_infinite)) {
			this.bit.style.width = 'inherit';

			if (delayed) {
				setTimeout(200, () => this.off());
			} else {
				this.off();
			}
		}

		// let it fade out and hide afterwards
		else {
			this.bit.style.opacity = '0';
			if (delayed) {
				setTimeout(200, () => this.off());
			} else {
				this.off();
			}
		}

		return this;
	}