I had a user request a control that would allow for the output of messages from a UDInput so they could see progress. This uses the Stack class so it writes new messages to the top, outputs them into a collection and then adds a scrollbar after it reaches 200px.
$Dashboard = New-UDDashboard -Title 'hey' -Content {
New-UDElement -Tag 'div' -Endpoint {
$Session:Elements = New-Object System.Collections.Stack
}
New-UDButton -Text "Add Item" -OnClick {
$Session:Elements.Push("[$(Get-Date)]")
Sync-UDElement -Id 'output'
}
New-UDButton -Text "Clear Items" -OnClick {
$Session:Elements.Clear()
Sync-UDElement -Id 'output'
}
New-UDElement -Id 'output' -Tag 'div' -Attributes @{
style = @{
height = "200px"
overflowY = "scroll"
}
} -Endpoint {
New-UDCollection -Content {
$Session:Elements | ForEach-Object {
New-UDCollectionItem -Content { $_ }
}
}
}
}
Start-UDDashboard -Dashboard $Dashboard -Port 10000 -FOrce