FacetVertical.prototype._update = function()

in lib/@uncharted.software/stories-facets/src/components/facet/facetVertical.js [464:534]


FacetVertical.prototype._update = function() {
	var spec = this._spec;
	var selectedCount = spec.selected && spec.selected.count;
	var selectionSegments = spec.selected && spec.selected.segments || [];
	var isSelectionWithNoSegments = selectedCount >= 0 && selectionSegments.length === 0;
	var facetCount = isSelectionWithNoSegments ? selectedCount : spec.count;
	var barForegroundWidth = ((facetCount / spec.total) * 100) + '%';
	var newLabelHTML = spec.displayValue || spec.label || spec.value;
	var countLabel = (spec.selected && spec.selected.countLabel) || spec.countLabel || spec.count.toString();

	/* icon */ // TODO: Only update if the current icon is not the same as the icon in the spec.
	this._iconContainer.empty();
	this._iconContainer.append($(facetVertical_icon(this._spec)));
	this._icon = this._iconContainer.children('i');
	this._iconColor = this._spec.icon && this._spec.icon.color ? this._spec.icon.color : null;

	/* bar background */
	this._barBackground.css('width', ((spec.count / spec.total) * 100) + '%');

	/* bar foreground */
	if (selectedCount >= 0) {
		if (!this._barForeground.hasClass(SELECTED_CLASS)) {
			this._barForeground.removeAttr('style');
			if (selectionSegments.length === 0 && selectedCount > 0) {
				this._barForeground.addClass(SELECTED_CLASS);
			}
		}
		this._barForeground.css('width', barForegroundWidth);
	} else {
		if (this._iconColor && !spec.segments) {
			this._barForeground.css('box-shadow', 'inset 0 0 0 1000px ' + this._iconColor);
		}
		this._barForeground.removeClass(SELECTED_CLASS);
		this._barForeground.css('width', barForegroundWidth);
	}

	/* bar segments */
	this._barForeground.children().each(function (index, child) {
		var segment = selectionSegments[index] || spec.segments[index];
		var segmentCount = isSelectionWithNoSegments ? 0 : segment.count;
		$(child).toggleClass('zero-width', segmentCount === 0);
		$(child).css({
			'width': ((segmentCount / spec.count) * 100) + '%',
			'box-shadow': 'inset 0 0 0 1000px ' + segment.color
		});
	});

	/* label */
	if (this._label.html() !== newLabelHTML) {
		this._label.html(newLabelHTML);
	}

	/* count label */
	if (this._labelCount.html() !== countLabel) {
		this._labelCount.html(countLabel);
	}

	/* links */ // TODO: Only update if the current icon is not the same as the icon in the spec.
	this._linksContainer.empty();
	this._linksContainer.append(facetVertical_links(this._spec));

	/* search */ // TODO: Only update if the current icon is not the same as the icon in the spec.
	this._searchContainer.empty();
	this._searchContainer.append(facetVertical_search(this._spec));
	if (!this._searchContainer.children().length) {
		this._searchContainer.empty();
	}

	/* sparkline */
	this._updateSparkline();
};