diff --git a/Public/New-HTMLStatusItem.ps1 b/Public/New-HTMLStatusItem.ps1 index 70e893d9..ebe2aa3c 100644 --- a/Public/New-HTMLStatusItem.ps1 +++ b/Public/New-HTMLStatusItem.ps1 @@ -1,44 +1,135 @@ function New-HTMLStatusItem { - [CmdletBinding()] + [CmdletBinding(DefaultParameterSetName = 'Statusimo')] param( [string] $ServiceName, [string] $ServiceStatus, - [ValidateSet('Dead', 'Bad', 'Good')]$Icon = 'Good', - [ValidateSet('0%', '10%', '30%', '70%', '100%')][string] $Percentage = '100%' + + [ValidateSet('Dead', 'Bad', 'Good')] + [Parameter(ParameterSetName = 'Statusimo')] + $Icon = 'Good', + + [ValidateSet('0%', '10%', '30%', '70%', '100%')] + [Parameter(ParameterSetName = 'Statusimo')] + [string] $Percentage = '100%', + + [string]$FontColor = '#5f6982', + + [parameter(ParameterSetName = 'FontAwesomeBrands')] + [parameter(ParameterSetName = 'FontAwesomeRegular')] + [parameter(ParameterSetName = "FontAwesomeSolid")] + [Parameter(ParameterSetName = 'Hex')] + [string]$BackgroundColor = '#0ef49b', + + # ICON BRANDS + [ArgumentCompleter( + { + param($CommandName, $ParameterName, $WordToComplete, $CommandAst, $FakeBoundParameters) + ($Global:HTMLIcons.FontAwesomeBrands.Keys) + } + )] + [ValidateScript( + { + $_ -in (($Global:HTMLIcons.FontAwesomeBrands.Keys)) + } + )] + [parameter(ParameterSetName = 'FontAwesomeBrands')] + [string] $IconBrands, + + # ICON REGULAR + [ArgumentCompleter( + { + param($CommandName, $ParameterName, $WordToComplete, $CommandAst, $FakeBoundParameters) + ($Global:HTMLIcons.FontAwesomeRegular.Keys) + } + )] + [ValidateScript( + { + $_ -in (($Global:HTMLIcons.FontAwesomeRegular.Keys)) + } + )] + [parameter(ParameterSetName = 'FontAwesomeRegular')] + [string] $IconRegular, + + # ICON SOLID + [ArgumentCompleter( + { + param($CommandName, $ParameterName, $WordToComplete, $CommandAst, $FakeBoundParameters) + ($Global:HTMLIcons.FontAwesomeSolid.Keys) + } + )] + [ValidateScript( + { + $_ -in (($Global:HTMLIcons.FontAwesomeSolid.Keys)) + } + )] + [parameter(ParameterSetName = 'FontAwesomeSolid')] + [string] $IconSolid, + + [Parameter(ParameterSetName = 'Hex')] + [ValidatePattern('^&#x[A-Fa-f0-9]{4,5}$')] + [string]$IconHex ) #$Script:HTMLSchema.Features.StatusButtonical = $true - if ($Icon -eq 'Dead') { - $IconType = 'performanceDead' - } elseif ($Icon -eq 'Bad') { - $IconType = 'performanceProblem' - } elseif ($Icon -eq 'Good') { - #$IconType = 'performance' + if ($PSCmdlet.ParameterSetName -eq 'Statusimo') { + Write-Warning 'This parameter set has been deprecated. It will be removed in a future release. Look to move to the other parameter sets with customization options.' + + if ($Percentage -eq '100%') { + $BackgroundColor = '#0ef49b' + } elseif ($Percentage -eq '70%') { + $BackgroundColor = '#d2dc69' + } elseif ($Percentage -eq '30%') { + $BackgroundColor = '#faa04b' + } elseif ($Percentage -eq '10%') { + $BackgroundColor = '#ff9035' + } elseif ($Percentage -eq '0%') { + $BackgroundColor = '#ff5a64' + } + + if ($Icon -eq 'Dead') { + $IconType = '☠' + } + elseif ($Icon -eq 'Bad') { + $IconType = '☹' + } + elseif ($Icon -eq 'Good') { + $IconType = '✔' + } } + elseif ($PSCmdlet.ParameterSetName -like 'FontAwesome*') { + $BackgroundColor = Convert-FromColor -Color $BackgroundColor - if ($Percentage -eq '100%') { - $Colors = 'background-color: #0ef49b;' - } elseif ($Percentage -eq '70%') { - $Colors = 'background-color: #d2dc69;' - } elseif ($Percentage -eq '30%') { - $Colors = 'background-color: #faa04b;' - } elseif ($Percentage -eq '10%') { - $Colors = 'background-color: #ff9035;' - } elseif ($Percentage -eq '0%') { - $Colors = 'background-color: #ff5a64;' + if ($IconBrands) { + $IconClass = "fab fa-$IconBrands" + } + elseif ($IconRegular) { + $IconClass = "far fa-$IconRegular" + } + elseif ($IconSolid) { + $IconClass = "fas fa-$IconSolid" + } + } + elseif ($PSCmdlet.ParameterSetName -eq 'Hex') { + $IconType = $IconHex } + $FontColor = Convert-FromColor -Color $FontColor - New-HTMLTag -Tag 'div' -Attributes @{ class = 'buttonical'; style = $Colors } -Value { + New-HTMLTag -Tag 'div' -Attributes @{ class = 'buttonical'; style = "background-color: $BackgroundColor" } -Value { New-HTMLTag -Tag 'div' -Attributes @{ class = 'label' } { - New-HTMLTag -Tag 'span' -Attributes @{ class = 'performance' } { + New-HTMLTag -Tag 'span' -Attributes @{ class = 'performance'; style = "color: $FontColor"} { $ServiceName } } New-HTMLTag -Tag 'div' -Attributes @{ class = 'middle' } New-HTMLTag -Tag 'div' -Attributes @{ class = 'status'} { New-HTMLTag -Tag 'input' -Attributes @{ name = Get-Random; type = 'radio'; value = 'other-item'; checked = 'true' } -SelfClosing - New-HTMLTag -Tag 'span' -Attributes @{ class = "performance $IconType" } { + New-HTMLTag -Tag 'span' -Attributes @{ class = "performance"; style = "color: $FontColor" } { $ServiceStatus + New-HtmlTag -Tag 'span' -Attributes @{ class = "icon $IconClass" } { + $IconType + } } } } -} \ No newline at end of file +} +Register-ArgumentCompleter -CommandName New-HTMLStatusItem -ParameterName FontColor -ScriptBlock { $Script:RGBColors.Keys } +Register-ArgumentCompleter -CommandName New-HTMLStatusItem -ParameterName BackgroundColor -ScriptBlock { $Script:RGBColors.Keys } \ No newline at end of file diff --git a/Resources/CSS/status.css b/Resources/CSS/status.css index 6a474762..f9c9f77d 100644 --- a/Resources/CSS/status.css +++ b/Resources/CSS/status.css @@ -17,13 +17,10 @@ box-shadow: 0 2px 4px -1px rgba(25, 25, 25, 0.2); } - .buttonical input { display: none; } - - .buttonical .label { display: table; float: left; @@ -61,31 +58,6 @@ display: table-cell; vertical-align: middle; font-weight: 300; - color: #fff; -} - -.buttonical .performance:after { - content: "\2714"; - margin-left: -10px; - display: inline-block; - -webkit-transform: scale(0); - transform: scale(0); -} - -.buttonical .performanceProblem:after { - content: "\2639"; - margin-left: -10px; - display: inline-block; - -webkit-transform: scale(0); - transform: scale(0); -} - -.buttonical .performanceDead:after { - content: "\2620"; - margin-left: -10px; - display: inline-block; - -webkit-transform: scale(0); - transform: scale(0); } .buttonical .first { @@ -96,12 +68,9 @@ border-radius: 0 40px 40px 0; } -.buttonical input:checked+.performance { - color: #5f6982; -} - -.buttonical input:checked+.performance:after { - margin-left: 12px; - -webkit-transform: scale(1.25); - transform: scale(1.25); +.buttonical .icon { + margin-left: 12px; + display: inline-block; + -webkit-transform: scale(1.35); + transform: scale(1.35); } \ No newline at end of file