/// <summary>
/// </summary>
/// Updates the control's DOM by adding or removing the specified extra class
/// name to/from its element.
/// <param name="control">Control to be updated.</param>
/// <param name="className">CSS class name to add or remove.</param>
/// <param name="enable">Whether to add or remove the class name.</param>
public void enableExtraClassName(
goog.ui.Control control, string className, bool enable)
{
// The base class implementation is trivial; subclasses should override as
// needed.
this.enableClassName(control, className, enable);
}
/// <summary>
/// </summary>
/// Overrides {@link goog.ui.ControlRenderer#createDom} by adding extra markup
/// and stying to the menu item's element if it is selectable or checkable.
/// <param name="item">Menu item to render.</param>
/// <returns>Root element for the item.</returns>
public override HTMLElement createDom(goog.ui.Control item)
{
var element = item.getDomHelper().createDom(
goog.dom.TagName.DIV, this.getClassNames(item).Join(" "),
this.createContent(item.getContent(), item.getDomHelper()));
this.setEnableCheckBoxStructure(
(MenuItem)item, element, item.isSupportedState(goog.ui.Component.State.SELECTED) ||
item.isSupportedState(goog.ui.Component.State.CHECKED));
return(element);
}
/// <summary>
/// Returns the palette items arranged in a table wrapped in a DIV, with the
/// renderer's own CSS class and additional state-specific classes applied to
/// it.
/// </summary>
/// <param name="palette">goog.ui.Palette to render.</param>
/// <returns>Root element for the palette.</returns>
public override HTMLElement createDom(goog.ui.Control palette)
{
var classNames = this.getClassNames(palette);
var element = palette.getDomHelper().createDom(
goog.dom.TagName.DIV, classNames != null ? classNames.Join(" ") : null,
this.createGrid(
palette.getContent(), ((Palette)palette).getSize(),
palette.getDomHelper()));
goog.a11y.aria.setRole(element, goog.a11y.aria.Role.GRID);
return(element);
}
/// <summary>
/// </summary>
/// Overrides {@link goog.ui.ControlRenderer#decorate} by initializing the
/// menu item to checkable based on whether the element to be decorated has
/// extra stying indicating that it should be.
/// <param name="item">Menu item instance to decorate the element.</param>
/// <param name="element">Element to decorate.</param>
/// <returns>Decorated element.</returns>
public override HTMLElement decorate(goog.ui.Control item, HTMLElement element)
{
goog.asserts.assert(element != null);
if (!this.hasContentStructure(element))
{
element.AppendChild(
this.createContent(new ControlContent(element.ChildNodes), item.getDomHelper()));
}
if (goog.dom.classlist.contains(element, le.getCssName("goog-option")))
{
((goog.ui.MenuItem)item).setCheckable(true);
this.setCheckable((goog.ui.MenuItem)item, element, true);
}
return(base.decorate(item, element));
}
/// <summary>
/// Initializes the control's DOM by configuring properties that can only be set
/// after the DOM has entered the document. This implementation sets up BiDi
/// and keyboard focus. Called from {@link goog.ui.Control#enterDocument}.
/// </summary>
/// <param name="control">Control whose DOM is to be initialized</param>
/// as it enters the document.
public void initializeDom(goog.ui.Control control)
{
// Initialize render direction (BiDi). We optimize the left-to-right render
// direction by assuming that elements are left-to-right by default, and only
// updating their styling if they are explicitly set to right-to-left.
if (control.isRightToLeft())
{
this.setRightToLeft(control.getElement(), true);
}
// Initialize keyboard focusability (tab index). We assume that components
// aren't focusable by default (i.e have no tab index), and only touch the
// DOM if the component is focusable, enabled, and visible, and therefore
// needs a tab index.
if (control.isEnabled())
{
this.setFocusable(control, control.isVisible());
}
}
/// <summary>
/// Default implementation of {@code decorate} for {@link goog.ui.Control}s.
/// Initializes the control's ID, content, and state based on the ID of the
/// element, its child nodes, and its CSS classes, respectively. Returns the
/// element.
/// </summary>
/// <param name="control">Control instance to decorate the element.</param>
/// <param name="element">Element to decorate.</param>
/// <returns>Decorated element.</returns>
public virtual HTMLElement decorate(goog.ui.Control control, HTMLElement element)
{
// Set the control's ID to the decorated element's DOM ID, if any.
if (element.Id != null)
{
control.setId(element.Id);
}
// Set the control's content to the decorated element's content.
var contentElem = this.getContentElement(element);
if (contentElem != null && contentElem.FirstChild != null)
{
control.setContentInternal(
contentElem.FirstChild.NextSibling != null ?
new ControlContent(contentElem.ChildNodes) :
new ControlContent(contentElem.FirstChild));
}
else
{
control.setContentInternal(null);
}
// Initialize the control's state based on the decorated element's CSS class.
// This implementation is optimized to minimize object allocations, string
// comparisons, and DOM access.
var state = (Component.State) 0x00;
var rendererClassName = this.getCssClass();
var structuralClassName = this.getStructuralCssClass();
var hasRendererClassName = false;
var hasStructuralClassName = false;
var hasCombinedClassName = false;
var classNames = goog.dom.classlist.get(element);
classNames.ForEach((className) => {
if (!hasRendererClassName && className == rendererClassName)
{
hasRendererClassName = true;
if (structuralClassName == rendererClassName)
{
hasStructuralClassName = true;
}
}
else if (!hasStructuralClassName && className == structuralClassName)
{
hasStructuralClassName = true;
}
else
{
state |= this.getStateFromClass(className);
}
if (this.getStateFromClass(className) == goog.ui.Component.State.DISABLED)
{
goog.asserts.assertElement(contentElem);
if (goog.dom.isFocusableTabIndex(contentElem))
{
goog.dom.setFocusableTabIndex(contentElem, false);
}
}
});
control.setStateInternal(state);
// Make sure the element has the renderer's CSS classes applied, as well as
// any extra class names set on the control.
if (!hasRendererClassName)
{
classNames.Push(rendererClassName);
if (structuralClassName == rendererClassName)
{
hasStructuralClassName = true;
}
}
if (!hasStructuralClassName)
{
classNames.Push(structuralClassName);
}
var extraClassNames = control.getExtraClassNames();
if (extraClassNames != null)
{
classNames.PushRange(extraClassNames);
}
// For IE6, rewrite all classes on the decorated element if any combined
// classes apply.
if (goog.userAgent.IE && !goog.userAgent.isVersionOrHigher("7"))
{
var combinedClasses = this.getAppliedCombinedClassNames_(classNames);
if (combinedClasses.Length > 0)
{
classNames.PushRange(combinedClasses);
hasCombinedClassName = true;
}
}
// Only write to the DOM if new class names had to be added to the element.
if (!hasRendererClassName || !hasStructuralClassName || extraClassNames != null ||
hasCombinedClassName)
{
goog.dom.classlist.set(element, classNames.Join(" "));
}
return(element);
}
/// <summary>
/// Overrides {@link goog.ui.ControlRenderer#decorate} to be a no-op, since
/// palettes don't support the decorate flow (for now).
/// </summary>
/// <param name="palette">Ignored.</param>
/// <param name="element"> Ignored.</param>
/// <returns>Always null.</returns>
public override HTMLElement decorate(goog.ui.Control palette, HTMLElement element)
{
return(null);
}
