ILIAS\UI\examples\Toast\Container Namespace Reference

Functions
	base ()
	with_multiple_toasts ()
	with_toast ()

Function Documentation

base()

ILIAS\UI\examples\Toast\Container\base

(

)

---

description: > Example for rendering a toast container.

expected output: >

ILIAS shows a blue button wich will not activate any actions.

Definition at line 32 of file base.php.

               : string
{
    global $DIC;
    $tc = $DIC->ui()->factory()->toast()->container();
 
    $toasts = [];
 
    $toasts = base64_encode($DIC->ui()->renderer()->renderAsync($toasts));
    $button = $DIC->ui()->factory()->button()->standard($DIC->language()->txt('show'), '');
    $button = $button->withAdditionalOnLoadCode(function ($id) use ($toasts) {
        return "$id.addEventListener('click', () => {
            $id.parentNode.querySelector('.il-toast-container').innerHTML = atob('$toasts');
            $id.parentNode.querySelector('.il-toast-container').querySelectorAll('script').forEach(element => {
                let newScript = document.createElement('script');
                newScript.innerHTML = element.innerHTML;
                element.parentNode.appendChild(newScript);
            })
        });";
    });
 
    return $DIC->ui()->renderer()->render([$button,$tc]);
}

References ILIAS\UI\examples\Layout\Page\Mail\$DIC, and $id.

with_multiple_toasts()

ILIAS\UI\examples\Toast\Container\with_multiple_toasts

(

)

---

description: > Example for rendring a toast container with multiple toasts.

expected output: > ILIAS shows a blue button. Clicking that button opens three different messages in the right top edge which

disappear after a few seconds.

Definition at line 33 of file with_multiple_toasts.php.

                               : string
{
    global $DIC;
    $tc = $DIC->ui()->factory()->toast()->container();
 
    $toasts = [
        $DIC->ui()->factory()->toast()->standard(
            'Example 1',
            $DIC->ui()->factory()->symbol()->icon()->standard('mail', 'Test')
        ),
        $DIC->ui()->factory()->toast()->standard(
            'Example 2',
            $DIC->ui()->factory()->symbol()->icon()->standard('mail', 'Test')
        ),
        $DIC->ui()->factory()->toast()->standard(
            'Example 3',
            $DIC->ui()->factory()->symbol()->icon()->standard('mail', 'Test')
        )
    ];
 
    $toasts = base64_encode($DIC->ui()->renderer()->renderAsync($toasts));
    $button = $DIC->ui()->factory()->button()->standard($DIC->language()->txt('show'), '');
    $button = $button->withAdditionalOnLoadCode(function ($id) use ($toasts) {
        return "$id.addEventListener('click', () => {
            $id.parentNode.querySelector('.il-toast-container').innerHTML = atob('$toasts');
            $id.parentNode.querySelector('.il-toast-container').querySelectorAll('script').forEach(element => {
                let newScript = document.createElement('script');
                newScript.innerHTML = element.innerHTML;
                element.parentNode.appendChild(newScript);
            })
        });";
    });
 
    return $DIC->ui()->renderer()->render([$button,$tc]);
}

References $DIC, and $id.

with_toast()

ILIAS\UI\examples\Toast\Container\with_toast

(

)

---

expected output: > ILIAS shows a blue button. If you click said button a message "Example" appears in the right top edge which

disappears after a few seconds.

Definition at line 30 of file with_toast.php.

                     : string
{
    global $DIC;
    $tc = $DIC->ui()->factory()->toast()->container();
 
    $toasts = [
        $DIC->ui()->factory()->toast()->standard(
            'Example',
            $DIC->ui()->factory()->symbol()->icon()->standard('info', 'Test')
        )
    ];
 
    $toasts = base64_encode($DIC->ui()->renderer()->renderAsync($toasts));
    $button = $DIC->ui()->factory()->button()->standard($DIC->language()->txt('show'), '');
    $button = $button->withAdditionalOnLoadCode(function ($id) use ($toasts) {
        return "$id.addEventListener('click', () => {
            $id.parentNode.querySelector('.il-toast-container').innerHTML = atob('$toasts');
            $id.parentNode.querySelector('.il-toast-container').querySelectorAll('script').forEach(element => {
                let newScript = document.createElement('script');
                newScript.innerHTML = element.innerHTML;
                element.parentNode.appendChild(newScript);
            })
        });";
    });
 
    return $DIC->ui()->renderer()->render([$button,$tc]);
}

References $DIC, and $id.