CSS-Prepare

 view release on metacpan or  search on metacpan

lib/CSS/Prepare/Plugin/Opacity.pm  view on Meta::CPAN

use CSS::Prepare::Property::Expansions;
use CSS::Prepare::Property::Values;

sub expand {
    my $self     = shift;
    my $property = shift;
    my $value    = shift;
    
    if ( '-cp-opacity' eq $property ) {
        my $ms_opacity    = $value * 100;
        my $ms_filter     = 'progid:DXImageTransform.Microsoft.'
                            . "Alpha(Opacity=${ms_opacity})";
        my $legacy_filter = "alpha(opacity=${ms_opacity})";
        
        return [
                {
                    property => 'opacity',
                    value    => $value,
                },
                {
                    property => '-ms-filter',

lib/CSS/Prepare/Plugin/Opacity.pm  view on Meta::CPAN

The meta-property C<-cp-opacity> will be expanded to provide opacity values
that are valid for browsers that understand CSS3 (C<opacity>) and versions
of Internet Explorer, using C<*filter> and C<-ms-filter>. For example, an
input of:

    #overlay { -cp-opacity: 0.5; }

will be output as:

    #overlay {
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
        opacity:    0.5;
        *filter:    alpha(opacity=50);
    }

t/02.cp-opacity.t  view on Meta::CPAN

    $css = <<CSS;
        div { -cp-opacity: 0.5; }
CSS
    @structure = (
            {
                original  => ' -cp-opacity: 0.5; ',
                errors    => [],
                selectors => [ 'div' ],
                block     => {
                    'opacity'    => '0.5',
                    '-ms-filter' => 'progid:DXImageTransform.Microsoft.'
                                    . 'Alpha(Opacity=50)',
                    '*filter'    => 'alpha(opacity=50)',
                },
            },
        );
    
    @parsed = $preparer_with->parse_string( $css );
    is_deeply( \@structure, \@parsed )
        or say "opacity was:\n" . Dumper \@parsed;
    

t/02.cp-opacity.t  view on Meta::CPAN

    @structure = (
            {
                original  => ' -cp-opacity: 1.1; ',
                errors    => [
                    {
                        error => "invalid opacity value: '1.1'",
                    },
                ],
                selectors => [ 'div' ],
                block     => {
                    '-ms-filter' => 'progid:DXImageTransform.Microsoft.'
                                    . 'Alpha(Opacity=110)',
                    '*filter'    => 'alpha(opacity=110)',
                },
            },
        );
    
    @parsed = $preparer_with->parse_string( $css );
    is_deeply( \@structure, \@parsed )
        or say "opacity was:\n" . Dumper \@parsed;
}

t/02.cp-opacity.t  view on Meta::CPAN

    @structure = (
            {
                original  => ' -cp-opacity: -0.1; ',
                errors    => [
                    {
                        error => "invalid opacity value: '-0.1'",
                    },
                ],
                selectors => [ 'div' ],
                block     => {
                    '-ms-filter' => 'progid:DXImageTransform.Microsoft.'
                                    . 'Alpha(Opacity=-10)',
                    '*filter'    => 'alpha(opacity=-10)',
                },
            },
        );
    
    @parsed = $preparer_with->parse_string( $css );
    is_deeply( \@structure, \@parsed )
        or say "opacity was:\n" . Dumper \@parsed;
}

t/02.hacks.t  view on Meta::CPAN

}
{
    @parsed = $preparer_without->parse_string( $css );
    is_deeply( \@structure, \@parsed )
        or say "zoom:1 hack was:\n" . Dumper \@parsed;
}

# parse filter (not allowed without IE hack)
{
    $css = <<CSS;
        div { _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344); }
CSS
    @structure = (
            {
                original  => ' _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344); ',
                selectors => [ 'div' ],
                errors    => [],
                block     => {
                    '_filter'  => 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344)',
                },
            },
        );

    @parsed = $preparer_with->parse_string( $css );
    is_deeply( \@structure, \@parsed )
        or say "_filter hack was:\n" . Dumper \@parsed;
}
{
    @structure = (
            {
                original  => ' _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344); ',
                selectors => [ 'div' ],
                errors    => [
                    {
                        error => q(invalid property: '_filter'),
                    },
                ],
                block     => {},
            },
        );

    @parsed = $preparer_without->parse_string( $css );
    is_deeply( \@structure, \@parsed )
        or say "filter hack was:\n" . Dumper \@parsed;
}
{
    $css = <<CSS;
        div { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344); }
CSS
    @structure = (
            {
                original  => ' filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344); ',
                selectors => [ 'div' ],
                errors    => [
                    {
                        error => q(invalid property: 'filter'),
                    },
                ],
                block     => {},
            },
        );

t/04.cp-opacity.t  view on Meta::CPAN

# opacity is expanded
{
    @structure = (
            {
                original  => ' -cp-opacity: 0.5; ',
                errors    => [],
                selectors => [ 'div' ],
                block     => {
                    'opacity'    => '0.5',
                    '-ms-filter' => 'progid:DXImageTransform.Microsoft.'
                                    . 'Alpha(Opacity=50)',
                    '*filter'    => 'alpha(opacity=50)',
                },
            },
        );
    $css = <<CSS;
div{-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);opacity:0.5;*filter:alpha(opacity=50);}
CSS

    $output = $preparer_concise->output_as_string( @structure );
    ok( $output eq $css )
        or say "overflow was:\n" . $output;
    
    $css = <<CSS;
div {
    -ms-filter:             progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
    opacity:                0.5;
    *filter:                alpha(opacity=50);
}
CSS
    $output = $preparer_pretty->output_as_string( @structure );
    ok( $output eq $css )
        or say "overflow was:\n" . $output;
}

t/04.hacks.t  view on Meta::CPAN

}
CSS
    $output = $preparer_with_pretty->output_as_string( @structure );
    ok( $output eq $css )
        or say "zoom:1 hack without hacks was:\n" . $output;
}

# filters
{
    $css = <<CSS;
div{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344);}
CSS
@structure = (
        {
            original  => ' filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344); ',
            selectors => [ 'div' ],
            errors    => [],
            block     => {
                'filter'  => 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344)',
            },
        },
    );

    $output = $preparer_with->output_as_string( @structure );
    ok( $output eq $css )
        or say "filter with hacks was:\n" . $output;
    $output = $preparer_without->output_as_string( @structure );
    ok( $output eq $css )
        or say "filter without hacks was:\n" . $output;
    
    $css = <<CSS;
div {
    filter:                 progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9999aa,endColorstr=#ff333344);
}
CSS
    $output = $preparer_with_pretty->output_as_string( @structure );
    ok( $output eq $css )
        or say "filter without hacks was:\n" . $output;
}

# verbatim comments
{
    $css = <<CSS;