skyline-sppowershell

3.0.7

public/Add-SkylineCSSLinkCustomAction.ps1

Function Add-SkylineCSSLinkCustomAction 
{
    <#
    .SYNOPSIS
    Adds a script block custom action which loads the specified CSS url on the page
     
    .DESCRIPTION
    Adds a script block custom action which loads the specified CSS url on the page
     
    .EXAMPLE
    Add bootstrap CSS to every page in the site collection
     
    Add-SkylineCSSLinkCustomAction -Name "BootstrapCss" -Url "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
 
    .PARAMETER Name
    Name of the CSS link custom action
 
    .PARAMETER Url
    Absolute path of of the CSS Link
 
    Example: "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
 
    .PARAMETER Sequence
    A sequence number that defines the order on the page, defaults to 100
 
    .PARAMETER Scope
    The scope of the script to add to. Either Web or Site, defaults to Site
 
    .PARAMETER HideBodyOnLoad
    Optionally hide <body> tag via opacity:0 while the css url is being loaded to prevent jarring user experience
 
    .PARAMETER Web
    The web to apply the command to. Omit this parameter to use the current web.
 
    #>

    [cmdletbinding()]   
    param(
        [parameter(Mandatory = $True)]
        [string]$Name = '',
        [parameter(Mandatory = $True)]
        [string]$Url = '',
        [parameter(Mandatory = $False)]
        [int]$Sequence = 100,
        [parameter(Mandatory = $False)]
        [ValidateSet('Site', 'Web')]
        [string]$Scope = 'Site',
        [parameter(Mandatory = $False)]
        [switch]$HideBodyOnLoad,
        [Microsoft.SharePoint.Client.Web]$Web
    )
    
    Process
    {
        Write-Debug ( "Running $($MyInvocation.MyCommand).`n" + "PSBoundParameters:`n$($PSBoundParameters | Format-List | Out-String)")
        
        $ScriptBlockStr = @"
        (function() {
            var head = document.querySelector('head');
            var styleTag = document.createElement('style');
 
            var linkTag = document.createElement('link');
            linkTag.rel = 'stylesheet'; linkTag.href = '$($Url)'; linkTag.type = 'text/css';
 
            head.appendChild(styleTag);
            head.appendChild(linkTag);
        })();
"@
        $ScriptBlockStrHideBodyOnLoad = @"
        (function() {
            var head = document.querySelector('head');
            var styleTag = document.createElement('style');
            styleTag.appendChild(document.createTextNode('body { opacity: 0 }'));
     
            var linkTag = document.createElement('link');
            linkTag.rel = 'stylesheet'; linkTag.href = '$($Url)'; linkTag.type = 'text/css';
            linkTag.addEventListener('load', function() {
                head.removeChild(styleTag);
            });
            head.appendChild(styleTag);
            head.appendChild(linkTag);
        })();
"@

        Try
        {   
            $PSBoundParameters.Remove("Url") | Out-Null
            $PSBoundParameters.Remove("HideBodyOnLoad") | Out-Null

            if ($HideBodyOnLoad) 
            {
                Add-PnPJavaScriptBlock -Script $ScriptBlockStrHideBodyOnLoad @PSBoundParameters
            }
            else 
            {
                Add-PnPJavaScriptBlock -Script $ScriptBlockStr @PSBoundParameters                
            }
        }
        Catch
        {
            Throw $_
        }
    }
}