ILIAS\UI\examples\Button\Standard Namespace Reference

Functions
	base ()
	description: > Example for rendering a standard button. More...
	engaged ()
	description: > Example for rendering an engaged standard button More...
	unavailable_action ()
	description: > This example provides the given button with an unavailable action. More...
	with_glyph ()
	description: > This example provides buttons with a Glyph in (and as) the label. More...
	with_js_binding ()
	description: > Example for rendering a standard button with JS binding More...
	with_load_anim ()
	description: > In this example we create a button that ships with the on load animation on click. More...
	with_tooltip ()
	description: > Example for rendering a standard button with tooltips More...

Function Documentation

base()

ILIAS\UI\examples\Button\Standard\base

(

)

---

description: > Example for rendering a standard button.

expected output: > ILIAS shows a colored, active button with a title. Clicking the button opens the website www.ilias.de

in the same browser window.

Definition at line 33 of file base.php.

References $DIC, Vendor\Package\$f, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    return $renderer->render($f->button()->standard("Goto ILIAS", "http://www.ilias.de"));
}

engaged()

ILIAS\UI\examples\Button\Standard\engaged

(

)

---

description: > Example for rendering an engaged standard button

expected output: >

ILIAS shows a white, active button with a title. Clicking the button won't activate any actions.

Definition at line 32 of file engaged.php.

References $DIC, Vendor\Package\$f, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    $button = $f->button()->standard("Engaged Button", "#")
                                  ->withEngagedState(true);
    return $renderer->render($button);
}

unavailable_action()

ILIAS\UI\examples\Button\Standard\unavailable_action

(

)

---

description: > This example provides the given button with an unavailable action.

Note that the disabled attribute is set in the DOM. No action must be fired, even if done by keyboard.

expected output: >

ILIAS shows a inactive button with a title. Clicking the button won't activate any actions.

Definition at line 34 of file unavailable_action.php.

References $DIC, Vendor\Package\$f, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    $button = $f->button()->standard('Unavailable', '#')->withUnavailableAction();

    return $renderer->render([$button]);
}

with_glyph()

ILIAS\UI\examples\Button\Standard\with_glyph

(

)

---

description: > This example provides buttons with a Glyph in (and as) the label.

expected output: > ILIAS shows a button with the Search Gylph and in some cases a label in different states. Clicking the button

won't activate any actions.

Definition at line 33 of file with_glyph.php.

References $DIC, Vendor\Package\$f, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    $glyph = $f->symbol()->glyph()->search();
    $button = $f->button()->standard('search', '#')
        ->withSymbol($glyph);
    $button2 = $button->withLabel('')
        ->withAriaLabel('search');

    return $renderer->render([
        $button,
        $button->withEngagedState(true),
        $button->withUnavailableAction(true),
        $f->divider()->vertical(),
        $button2,
        $button2->withEngagedState(true),
        $button2->withUnavailableAction(true),

    ]);
}

with_js_binding()

ILIAS\UI\examples\Button\Standard\with_js_binding

(

)

---

description: > Example for rendering a standard button with JS binding

expected output: >

ILIAS shows an active button with a title. Clicking the button opens a dialog with a click-ID.

Definition at line 32 of file with_js_binding.php.

References $DIC, Vendor\Package\$f, $id, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    return $renderer->render(
        $f->button()->standard("Goto ILIAS", "#")
            ->withOnLoadCode(function ($id) {
                return
                    "$(\"#$id\").click(function() { alert(\"Clicked: $id\"); return false;});";
            })
    );
}

with_load_anim()

ILIAS\UI\examples\Button\Standard\with_load_anim

(

)

---

description: > In this example we create a button that ships with the on load animation on click.

note: > Note that the button will trigger a page-reload as soon as the work is done, no additional magic is needed. However, in Async scenario, one can make use of the il.UI.button interface containing the functions activateLoadingAnimation and deactivateLoadingAnimation as shown below.

expected output: > ILIAS shows an active button with a title. The color of the button will change after clicking the button and the word "Working" will appear, which is referencing to the loading status. After a while the button's content

will change to "Done".

Definition at line 41 of file with_load_anim.php.

References $DIC, Vendor\Package\$f, $id, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    return $renderer->render(
        //Create a button with the LoadingAnimation on click and some additional JS-Magic.
        $f->button()->standard("Do Something", "")
            ->withLoadingAnimationOnClick(true)
            ->withOnLoadCode(function ($id) {
                return " $('#$id').click(
                    function(e) {
                       $('#$id').html('Working...');
                       setInterval(
                            function(){
                                $('#$id').html('Done');
                                il.UI.button.deactivateLoadingAnimation('$id');
                            }
                            ,3000
                        );
                    });";
            })
    );
}

with_tooltip()

ILIAS\UI\examples\Button\Standard\with_tooltip

(

)

---

description: > Example for rendering a standard button with tooltips

expected output: > Hovering over the rendered button will show you a tooltip with the following

lines: "tooltip: ilias" and "tooltip: learning management system".

Definition at line 33 of file with_tooltip.php.

References $DIC, Vendor\Package\$f, and $renderer.

{
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();

    $button = $f->button()
        ->standard("Goto ILIAS", "http://www.ilias.de")
        ->withHelpTopics(
            ...$f->helpTopics("ilias", "learning management system")
        );

    return $renderer->render($button);
}