Update Dashboard Element before running script

Universal Dashboard
1

Hey all,

New to PSU and just trying to learn while building.

I am trying to make some form of loading indicator. I think I want to update an element with new text as the script progresses but the Set-UDElement / Sync-UDElement, etc don’t update until the script is completely finished.

Something kind of like this:

    #New-UDElement -Id "Test" -Tag 'div' -Endpoint {
    New-UDDynamic -Id "Test" -Content {
        
        if ($Phase1 = $True) {
            New-UDTypography "Doing something 1"  # Placeholder text for a loading gif
        }
        elseif ($Phase2 = $True) {
            New-UDTypography "Doing something 2"  # Placeholder text for a loading gif
        }

        # Init display of element
        $Phase1 = $True

    } -AutoRefresh -AutoRefreshInterval 1

# Phase1
< DO SOME STUFF >
$Phase1 = $false

# Phase 2
$Phase2 = $true
< DO SOME MORE STUFF >
$Phase2 = $false

Am I on the right track or is something like this even possible with PSU?

Thanks for any help!

2

Hey @Intee,

This is certainly possible and I would do it like this.

    $Session:Phase1 = $True

    New-UDDynamic -Id "Test" -Content {
        if ($Session:Phase1) {
            New-UDTypography "Doing something 1"  # Placeholder text for a loading gif
        }
        elseif ($Session:Phase2) {
            New-UDTypography "Doing something 2"  # Placeholder text for a loading gif
        } else {
            New-UDTypography "Done"  # Placeholder text for a loading gif
        }
    } 

    New-UDDynamic -Content {
        # Phase1
        Start-Sleep 5
        $Session:Phase1 = $false
        Sync-UDElement -Id "Test"

        # Phase 2
        $Session:Phase2 = $true
        Sync-UDElement -Id "Test"
        Start-Sleep 5
        $Session:Phase2 = $false
        Sync-UDElement -Id "Test"
    }
1 Like
3

Hey @adam,

Thanks for the reply! This worked a treat, not sure I ended doing ‘exactly’ what you suggested but I ended up with something like this.

Not sure if it’s the right way to go about it but it’s working - haha.

Thanks again!

Function Update-TaskList {
    param(
        $Trigger,
        $Label,
        $TaskIcon,
        [switch]$Nested
    )

    if ($Trigger -eq $true) {
        if (!$Nested) {
            New-UDListItem -Label $Label -AvatarType Icon -Icon (New-UDIcon -Icon $TaskIcon -Color 'Green')
        }
        else { New-UDListItem -Label $Label -AvatarType Icon -Icon (New-UDIcon -Icon $TaskIcon -Color 'Green') -Nested }
    }
    elseif ($Trigger -eq 'error') {
        if (!$Nested) {
            New-UDListItem -Label $Label -AvatarType Icon -Icon (New-UDIcon -Icon 'xmark' -Color 'Red')
        }
        else { New-UDListItem -Label $Label -AvatarType Icon -Icon (New-UDIcon -Icon 'xmark' -Color 'Red') -Nested }
    }
    else {
        if (!$Nested) {
            New-UDListItem -Label $Label -AvatarType Icon -Icon (New-UDIcon -Icon 'spinner' -spin)
        }
        else { New-UDListItem -Label $Label -AvatarType Icon -Icon (New-UDIcon -Icon 'spinner' -spin) -Nested }
    }
}

New-UDDashboard -Title "App" -Content {
    New-UDForm -SubmitText 'Submit' -ButtonVariant contained -Content { 
        <# BUTTON CONTENT #>
    } -OnSubmit {
        < # DO SOME STUFF AND SET TRIGGERS #>
        $Session:Trigger = $true
        Sync-UDElement -Id 'Tasks'
    }

    New-UDDynamic -Id "Tasks" -Content {
        New-UDGrid -Container -Content {
            New-UDGrid -Item -ExtraSmallSize 6 -Content {
                New-UDList -Children {
                    Update-TaskList -Trigger $Session:Trigger -Label "Task1" -TaskIcon 'iconName'
                }
            }                        
        }
    }
}