2.9.0 New-UDImageCarousel issue

Universal Dashboard Universal Dashboard Help
1

Hi All,

There seems to be a problem with the New-UDImageCarousel for version 2.9.0. It doesn’t take the Styling @{} parameter anymore. Here is my sample code.

$Colors = @{
BackgroundColor = “#252525”
FontColor = “#FFFFFF”
}
$Theme = New-UDTheme -Name “Test” -Definition @{
“.ud-navbar” = @{
BackgroundColor = “#006A4D”
FontColor = “#FFFFF”
}
“.ud-footer” = @{
display = “none”
}
}

$apjpjpasswordgraph = New-UDEndpointSchedule -Every 3 -Second
$apjpjpasswordgraphpoints = New-UDEndpoint -Schedule $apjpjpasswordgraph -Endpoint {
$Cache:Folder = Publish-UDFolder -Path “.\Image” -RequestPath “/Image”
}

$EDT = New-UDDashboard -Title ‘TEST’ -BackgroundColor “#000000” -FontColor “#FFFFFF” -Theme $Theme -Content {
Slide1= @{ BackgroundSize = 'contain' BackgroundRepeat = 'no-repeat' BackgroundPosition = 'center' BackgoundImage = 'Image/1.PNG' } New-UDImageCarousel -FullScreen -Interval 5000 -Indicators -items { New-UDImageCarouselItem @Slide1 } } Get-UDDashboard | where{_.Port -eq 1002} | Stop-UDDashboard

Start-UDDashboard -Port 1002 -PublishedFolder $Cache:Folder -Dashboard $EDT -AutoReload -Force -Endpoint $apjpjpasswordgraphpoints
start http://localhost:1002/home

Error:

PS C:\Users\Christian.Jardiolin\Desktop\To do\Dashboard Remodel\MessageBoard> C:\Users\Christian.Jardiolin\Desktop\To do\Dashboard Remodel\MessageBoard\dashboard.ps1
New-UDDashboard : Exception calling “Invoke” with “0” argument(s): “A parameter cannot be found that matches parameter name ‘BackgroundPosition’.”
At C:\Users\Christian.Jardiolin\Desktop\To do\Dashboard Remodel\MessageBoard\dashboard.ps1:20 char:8

  • $EDT = New-UDDashboard -Title ‘TEST’ -BackgroundColor “#000000” -Font …
  •    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    • CategoryInfo : SyntaxError: (UniversalDashboard.Models.Dashboard:Dashboard) [New-UDDashboard], CmdletInvocationException
    • FullyQualifiedErrorId : UniversalDashboard.Cmdlets.NewDashboardCommand

Name Port Running DashboardService

Dashboard0 1002 True UniversalDashboard.Services.DashboardService

2

you can set all the styling in the -Style parameter no need for specific parameters

so insted Slide1= @{ BackgroundSize = 'contain' BackgroundRepeat = 'no-repeat' BackgroundPosition = 'center' BackgoundImage = 'Image/1.PNG' }

do

-Style @{ BackgroundSize = 'contain' BackgroundRepeat = 'no-repeat' BackgroundPosition = 'center' BackgoundImage = 'Image/1.PNG' }

3

the react javascript code take only the style parameter as you can see

import React from 'react';
import { Slider, Slide } from "react-materialize";

const UDImageCarousel = ({ items, ...props }) => {

    return <Slider {...props}>
        {
            items.map(
                item => <Slide
                    style={{ ...item.style }}
                    image={
                        <a href={item.url}>
                            <img alt="" src={item.imageSource} />
                        </a>
                    }
                />
            )
        }
    </Slider>
}

export default UDImageCarousel
4

Hi AlonGvili,

Thank you so much for this one!

Regards,
Christian

1 Like
5

Hi Alon,

Apologies in this one but it still doesn’t work. This is my new code. Though it doesn’t throw any errors now but it doesn’t show the image

$Colors = @{
BackgroundColor = “#252525”
FontColor = “#FFFFFF”
}
$Theme = New-UDTheme -Name “Test” -Definition @{
“.ud-navbar” = @{
BackgroundColor = “#006A4D”
FontColor = “#FFFFF”
}
“.ud-footer” = @{
display = “none”
}
}
$Folder = Publish-UDFolder -Path “C:\Users\Christian.Jardiolin\Desktop\To do\Dashboard Remodel\MessageBoard\Image” -RequestPath “/Image”

$EDT = New-UDDashboard -Title ‘TEST’ -BackgroundColor “#000000” -FontColor “#FFFFFF” -Theme Theme -Content { New-UDImageCarousel -Height 1080 -Interval 5000 -Indicators -items { New-UDImageCarouselItem -Style @{BackgroundImage = "Image/1.PNG"} } } Get-UDDashboard | where{_.Port -eq 1002} | Stop-UDDashboard

Start-UDDashboard -Port 1002 -PublishedFolder $Folder -Dashboard $EDT -AutoReload -Force
start http://localhost:1002/home

#Get-UDDashboard | where{$_.Port -eq 1002} | Stop-UDDashboard
#Start-UDDashboard -Port 1002 -Dashboard $EDT -Endpoint @($AgentsSchedule4,$uspassqueueSchedule1,$usmainqueueSchedule1,$USPASSgraphpoints,$USMAINgraphpoints)
#Start-UDDashboard -Dashboard $EDT -PublishedFolder $Folder -AutoReload -Wait

image
image1899×940 5.03 KB