MediaWiki:Gadget-calculator-search.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

/**
 * @author Chris Rishel
 */
( function() {
    mw.calculators.initializeSearch = function() {
        var $searchContainer = $( '#calculator-search' );

        if( !$searchContainer.length ) {
            return;
        }

        var searchLabel = 'Search';
        searchLabel += $searchContainer.attr( 'data-title' ) ? ' ' + $searchContainer.attr( 'data-title' ) : '';
        searchLabel += ': ';

        var searchLabelAttributes = {
            for: 'calculator-search-input'
        };

        var $searchLabel = $( '<label>', searchLabelAttributes ).html( searchLabel );

        var searchInputAttributes = {
            id: 'calculator-search-input',
            class: 'form-control form-control-sm',
            type: 'text',
            autocomplete: 'off'
        };

        var $searchInput = $( '<input>', searchInputAttributes )
            .on( 'input', function() {
                console.log( $( this ).val() );
            } );

        $searchContainer
            .append( $( '<div>', {
                class: 'form-group row'
            } )
                .append(
                    $searchLabel, $searchInput ) );
    };

    mw.calculators.initializeSearch();
}() );