<?php
require_once '../lib/Kendo/Autoload.php';

$toolbar = new \Kendo\UI\ToolBar('toolbar');

$button1 = new \Kendo\UI\ToolBarItem();
$button1->type('button');
$button1->id('button1');
$button1->text('Button 1');
$button1->click('buttonClickHandler');

$button2 = new \Kendo\UI\ToolBarItem();
$button2->type('button');
$button2->id('button2');
$button2->text('Button 2');
$button2->click('buttonClickHandler');

$separator = new \Kendo\UI\ToolBarItem();
$separator->type('separator');

$toggle1 = new \Kendo\UI\ToolBarItem();
$toggle1->type('button');
$toggle1->id('toggle1');
$toggle1->text('Toggle 1');
$toggle1->togglable(true);
$toggle1->toggle('buttonToggleHandler');

$toggle2 = new \Kendo\UI\ToolBarItem();
$toggle2->type('button');
$toggle2->id('toggle2');
$toggle2->text('Toggle 2');
$toggle2->togglable(true);
$toggle2->toggle('buttonToggleHandler');

$splitButton = new \Kendo\UI\ToolBarItem();
$splitButton->type('splitButton');
$splitButton->id('mainButton');
$splitButton->text('Split Button');
$splitButton->click('splitButtonClickHandler');
$splitButton->addMenuButton(
    array("text" => "Action 1", "id" => "action1"),
    array("text" => "Action 2", "id" => "action2"),
    array("text" => "Action 3", "id" => "action3")
);

$buttonGroup = new \Kendo\UI\ToolBarItem();
$buttonGroup->type('buttonGroup');

$buttonGroupItem = new \Kendo\UI\ToolBarItemButton();
$buttonGroupItem->id('radio1');
$buttonGroupItem->text('Radio 1');
$buttonGroupItem->togglable(true);
$buttonGroupItem->toggle('buttonToggleHandler');

$buttonGroup->addButton($buttonGroupItem);

$buttonGroupItem->id('radio2');
$buttonGroupItem->text('Radio 2');
$buttonGroupItem->togglable(true);
$buttonGroupItem->toggle('buttonToggleHandler');

$buttonGroup->addButton($buttonGroupItem);

$buttonGroupItem->id('radio3');
$buttonGroupItem->text('Radio 3');
$buttonGroupItem->togglable(true);
$buttonGroupItem->toggle('buttonToggleHandler');

$buttonGroup->addButton($buttonGroupItem);

$overflowButton = new \Kendo\UI\ToolBarItem();
$overflowButton->type('button');
$overflowButton->id('overflowButton');
$overflowButton->text('Overflow Button');
$overflowButton->overflow("always");

$toolbar->addItem(
    $button1,
    $button2,
    $separator,
    $toggle1,
    $toggle2,
    $separator,
    $splitButton,
    $separator,
    $buttonGroup,
    $overflowButton
);

$toolbar->click('onClick');
$toolbar->toggle('onToggle');
$toolbar->overflowOpen('onOverflowOpen');
$toolbar->overflowClose('onOverflowClose');
$toolbar->open('onOpen');
$toolbar->close('onClose');

?>

<div id="example">

    <?php echo $toolbar->render(); ?>

    <div class="box wide">
        <h4>Console log</h4>
        <div class="console"></div>
    </div>

</div>

<script>
    function buttonClickHandler(e) {
        kendoConsole.log(e.target.text() + " 'click' event is fired.");
    }

    function buttonToggleHandler(e) {
        kendoConsole.log(e.target.text() + " 'toggle' event is fired.");
    }

    function splitButtonClickHandler(e) {
        kendoConsole.log("SplitButton event: " + e.id + " is clicked.");
    }

    function onClick(e) {
        kendoConsole.log("ToolBar 'click' event is fired for element with id: " + e.id);
    }

    function onToggle(e) {
        if(e.group == "radio") {
            kendoConsole.log("Toolbar 'toggle' event: " + e.id + " button is selected from group: " + e.group);
        } else {
            kendoConsole.log("ToolBar 'toggle' event: " + e.id + " button is changed");
        }
    }

    function onOverflowOpen(e) {
        kendoConsole.log("Overflow container open");
    }

    function onOverflowClose(e) {
        kendoConsole.log("Overflow container close");
    }

    function onOpen(e) {
        kendoConsole.log("SplitButton popup open");
    }

    function onClose(e) {
        kendoConsole.log("SplitButton popup close");
    }
</script>