tests/manual/many.html

	many.html revision e3897aaf02ecc29a0c916fa04106d1aead646e10
<!DOCTYPE html>
<html>
    <head>
        <!-- reset the default browser styles -->
        <style>

            /* Fix this - Shouldn't require body specificity */
            body .yui3-button-selected {
                background-color:#426FD9;
                color:white;
            }

        </style>

        <script src='/build/yui/yui-min.js'></script>

        <script>

            YUI.add('buttons', function(Y){

                var Buttons = function(config){

                    var buttons = [];

                    config.srcNodes.each(function(node){
                        var button = new Y.Button({
                            type: config.type,
                            srcNode: node
                        });
                        buttons.push(button);
                    });

                    return buttons;
                }

                Y.Buttons = Buttons;
            });

            YUI({
                debug: true,
                combo: false,
                filter: 'raw'
            }).use('button', 'buttons', 'button-group', function(Y){

                Y.one("#generator").on("click", function(){

                    var count, button, buttons = [];

                    count = Y.one('#count').get('value');

                    Y.one("#container").empty(true);

                    for(var i=0; i < count; i++) {
                        button = new Y.ButtonGenerator( {label: i} );
                        Y.one("#container").append(button.get('srcNode'));
                        buttons.push(button);
                    }

                    new Y.ButtonGroup({
                        buttons: buttons,
                        type: 'radio'
                    });
                });

            });
        </script>
    </head>

    <body class='yui3-skin-sam'>

        <h1>Buttonpalooza</h1>
        How many buttons would you like? <input type="text" value="100" id="count">
        <button id="generator" class="yui3-button">Make buttons!</button>
        <hr />
        <div id="container"></div>
    </body>
</html>