3

OOUI is supposed to be a library that allows to rapidly create front-end web applications that operate consistently across a multitude of browsers.

I'd like to create a toolbar consisting of multiple groups (here just: a-group) and I am struggling filtering tools by their groups, or more precisely, filtering references to tool instances given their group name.

var toolFactory = new OO.ui.ToolFactory(),
    toolGroupFactory = new OO.ui.ToolGroupFactory(),
    toolbar = new OO.ui.Toolbar( toolFactory, toolGroupFactory, { actions: true } );

function doSthOnToolsByGroup( groupName ) {
    // Get a string[] consisting of tool names
    var tools = toolFactory.getTools( [ { group: groupName } ] );
    tools.forEach( function( toolName ) {
        // Now I'd like to get a reference to the
        // tool, instead I am getting a static reference
        // to the constructor
        var tool = toolFactory.lookup( toolName );
        // can't call 'setActive' on tool,
        // although tool.prototype.setActive is defined
    } );
}


function ATool() {
     ATool.parent.apply( this, arguments );
}
OO.inheritClass( ATool, OO.ui.Tool );

$.extend( ATool.static, {
    name: 'a-tool-name',
    icon: 'some-icon',
    title: 'the title',
    group: 'a-group'
} );

ATool.prototype.onSelect = function () {
     doSthOnToolsByGroup( 'a-group' );
};

toolFactory.register( ATool );

// The same for BTool, just BTool belonging to 'a-group'
// ...

toolbar.setup( ... );
// append toolbar to DOM
toolbar.initialize();
toolbar.emit( 'updateState' );
// and now click a toolbar button to trigger `doSthOnToolsByGroup`
Volker E.
  • 5,911
  • 11
  • 47
  • 64
Rainer Rillke
  • 1,281
  • 12
  • 24
  • `ToolFactory`, as its name suggests, probably only contains this kind of static tool references. The Toolbar instance, however should contain Tool instances after being either `.setup()` or `.initialize()`d. – Rainer Rillke Oct 04 '15 at 11:01

0 Answers0