Logic Abstraction

The API of yFiles for HTML is designed to make extensive use of logic encapsulation and abstraction. Where you can’t find a property to set for object composition, there is a good chance that you can derive from the class and override a protected method to change behavior of the default implementation.

If you find that you want to subclass a certain API member or implement an interface of the API, be sure to read the introduction to the class framework.

An example of this is the use of the factory method pattern in yFiles for HTML. In situations where a property should not be changed at all after construction of the object overriding the factory method provides a means of using a different implementation. One example is the UndoEngine of the DefaultGraph which can only be customized by the createUndoEngine factory method.

In most cases, however, this pattern is provided in addition to object composition, where changing a property is rather uncommon. Also, you might want to initialize the object to the correct value instead of setting the property after construction to avoid irritating behavior when changing the value.

Although setting the property value would be sufficient in most cases overriding the factory method has some advantages:

• Lazy initialization of the property’s value: the value is only initialized when it is really needed
• Proper initialization order (e.g. GraphEditorInputMode’s sub modes which are not allowed to be changed after GraphEditorInputMode has been installed)

In these cases, it is beneficial to favor inheritance over object composition and a factory method is provided in addition to the property.

An example are the sub input modes of GraphEditorInputMode, e.g. the marqueeSelectionInputMode property. Upon first access of the property, the createMarqueeSelectionInputMode factory method is called, which is implemented in yFiles for HTML as follows:

/**
 * @returns {!MarqueeSelectionInputMode}
 */
function createMarqueeSelectionInputMode() {
  const mode = new MarqueeSelectionInputMode()
  mode.priority = 50
  return mode
}function createMarqueeSelectionInputMode(): MarqueeSelectionInputMode {
  const mode = new MarqueeSelectionInputMode()
  mode.priority = 50
  return mode
}