src/third_party/specimenTools/lib/widgets/FeatureDisplay.js
/**
     * FeatureDisplay creates small cards demoing OpenType-Features found
     * in the font.
     *
     * Because of our very diverse needs to show different features, the
     * setup of this widget has become a bit more complex than I like it
     * to be. Thus this may be a good candidate for a complete rewrite.
     *
     *
     *
     * FeatureDisplay searches its host element for elements that have the CSS-class
     * `{bluePrintNodeClass}`. These blueprint nodes will be cloned and
     * augmented for each feature that is feasible to demo.
     * The cloned and augmented feature-cards will be inserted at the place
     * where the bluprint-node is located.
     * Since the bluprint-node is never removed, it should be set to
     * `style="display:none"`.
     * If more than one blueprint nodes are found, all are treated as described above.
     * If no blueprint node is found, a basic blueprint-node is generated
     * and appended to the host container.
     *
     * TODO: more specific docs!
     *
     * A blueprint node should contain nodes for different kinds of content,
     * currently: {itemContentTextClass}, {itemContentStackedClass}
     *
     * Each of these content nodes can be use zero or more times and will
     * be appended as a child to {itemContentContainerClass} or inserted
     * into {itemContentContainerClass} where a specially crafted
     * HTML-Comment "<!-- content -->" is located.
     *
     * The amount and content of content nodes is configurable via {feaureItemsSetup}
     * at the moment, the best would be to check out real world examples
     * of this configuration.
     *
     * TODO: more documentation is needed here.
     *
     * If the option {useDefaultFeatureItems} is set to true, features with
     * a default demo content will be displayed. If it is set to "complement"
     * the default demo content will only be displayed if the feature is not
     * used in any of the {feaureItemsSetup} configuration.
     */
FeatureDisplay creates small cards demoing OpenType-Features found
in the font.

Because of our very diverse needs to show different features, the
setup of this widget has become a bit more complex than I like it
to be. Thus this may be a good candidate for a complete rewrite.



FeatureDisplay searches its host element for elements that have the CSS-class
`{bluePrintNodeClass}`. These blueprint nodes will be cloned and
augmented for each feature that is feasible to demo.
The cloned and augmented feature-cards will be inserted at the place
where the bluprint-node is located.
Since the bluprint-node is never removed, it should be set to
`style="display:none"`.
If more than one blueprint nodes are found, all are treated as described above.
If no blueprint node is found, a basic blueprint-node is generated
and appended to the host container.

more specific docs!

A blueprint node should contain nodes for different kinds of content,
currently: {itemContentTextClass}, {itemContentStackedClass}

Each of these content nodes can be use zero or more times and will
be appended as a child to {itemContentContainerClass} or inserted
into {itemContentContainerClass} where a specially crafted
HTML-Comment "" is located.

The amount and content of content nodes is configurable via {feaureItemsSetup}
at the moment, the best would be to check out real world examples
of this configuration.

more documentation is needed here.

If the option {useDefaultFeatureItems} is set to true, features with
a default demo content will be displayed. If it is set to "complement"
the default demo content will only be displayed if the feature is not
used in any of the {feaureItemsSetup} configuration.
FeatureDisplay creates small cards demoing OpenType - Features found in the font . Because of our very diverse needs to show different features the setup of this widget has become a bit more complex than I like it to be . Thus this may be a good candidate for a complete rewrite . FeatureDisplay searches its host element for elements that have the CSS - class ` { bluePrintNodeClass } ` . These blueprint nodes will be cloned and augmented for each feature that is feasible to demo . The cloned and augmented feature - cards will be inserted at the place where the bluprint - node is located . Since the bluprint - node is never removed it should be set to ` style = " display : none " ` . If more than one blueprint nodes are found all are treated as described above . If no blueprint node is found a basic blueprint - node is generated and appended to the host container . more specific docs! A blueprint node should contain nodes for different kinds of content currently : { itemContentTextClass } { itemContentStackedClass } Each of these content nodes can be use zero or more times and will be appended as a child to { itemContentContainerClass } or inserted into { itemContentContainerClass } where a specially crafted HTML - Comment " " is located . The amount and content of content nodes is configurable via { feaureItemsSetup } at the moment the best would be to check out real world examples of this configuration . more documentation is needed here . If the option { useDefaultFeatureItems } is set to true features with a default demo content will be displayed . If it is set to " complement " the default demo content will only be displayed if the feature is not used in any of the { feaureItemsSetup } configuration .
function FeatureDisplay(container, pubSub, fontsData, webFontProvider, options) {
        Parent.call(this, options);
        this._container = container;
        this._pubSub = pubSub;
        this._fontsData = fontsData;
        this._webFontProvider = webFontProvider;
        this._pubSub.subscribe('activateFont'
                                     , this._onActivateFont.bind(this));
        this._contentElements = [];
        this._itemParentContainer = null;
        this._bluePrintNodes = this._getBluePrintNodes(
                                this._options.bluePrintNodeClass, true);
        this._feaureItemsSetup = this._options.feaureItemsSetup
                    ? this._prepareFeatureItems(this._options.feaureItemsSetup)
                    : []
                    ;
        this._defaultFeaureItemsCache = Object.create(null);
    }
function FeatureDisplay ( container , pubSub , fontsData , webFontProvider , options ) { Parent . call ( this , options ) ; this . _container = container ; this . _pubSub = pubSub ; this . _fontsData = fontsData ; this . _webFontProvider = webFontProvider ; this . _pubSub . subscribe ( 'activateFont' , this . _onActivateFont . bind ( this ) ) ; this . _contentElements = [ ] ; this . _itemParentContainer = null ; this . _bluePrintNodes = this . _getBluePrintNodes ( this . _options . bluePrintNodeClass , true ) ; this . _feaureItemsSetup = this . _options . feaureItemsSetup ? this . _prepareFeatureItems ( this . _options . feaureItemsSetup ) : [ ] ; this . _defaultFeaureItemsCache = Object . create ( null ) ; }
FeatureDisplay creates small cards demoing OpenType-Features found
 in the font.
FeatureDisplay creates small cards demoing OpenType - Features found in the font .