<?php
$params[ 'ratio' ] = array(
    'type' => 'select',
    'options' => [
        '16:9' => '16:9',
        '4:3' => '4:3',
        '3:2' => '3:2',
        '2:1' => '2:1',
        '1:1' => '1:1',
        '2:3' => '2:3',
        '3:4' => '3:4',
        'custom' => 'Custom'
    ],
    'std' => '4:3',
    'title' => 'Tile Ratio',
    
    'section' => 'general',
    'section_title' => 'General',
);

$params[ 'ratio_custom' ] = array(
    'type' => 'text',
    'placeholder' => 'W:H',
    'title' => 'Custom ratio',
    'condition' => [
        'ratio[value]' => 'custom',
    ],
);

$params[ 'padding_mode' ] = array(
    'type' => 'switcher',
    'title' => 'Use padding mode?',
);

$params[ 'tile_padding' ] = array(
    'type' => 'size',
    'std_unit' => 'px',
    'std_size' => 10,
    'px_max' => 100,
    'px_min' => 0,
    'selectors' => [
        '{{WRAPPER}} .padding-mode .tile-content' => 'padding:{{SIZE}}{{UNIT}};',
    ],
    
    'title' => 'Tile padding',
    
    'condition' => [
        'padding_mode[value]' => 'yes',
    ],
);

$params[ 'background_color' ] = array(
    'type' => 'color',
    'title' => 'Tile background color',
    'selectors' => [
        '{{WRAPPER}} .bg-element' => 'background-color:{{VALUE}};',    
    ],
);

$params[ 'background_image' ] = array(
    'type' => 'media',
    'title' => 'Tile background image',
);

$params[ 'background_image_size' ] = array(
    'type' => 'image_size',
    'title' => 'Background image size',
    'std' => 'full',
    'name' => 'background_image',
);

$params[ 'overlay_bg' ] = array(
    'type' => 'color',
    'title' => 'Overlay color',
    'selectors' => [
        '{{WRAPPER}} .tile-overlay' => 'background:{{VALUE}};',    
    ],
);

$params[ 'overlay_hover_bg' ] = array(
    'type' => 'color',
    'title' => 'Overlay hover color',
    'selectors' => [
        '{{WRAPPER}} .el-tile:hover .tile-overlay' => 'background:{{VALUE}};',    
    ],
);

$params[ 'hover_effect' ] = array(
    'type' => 'select',
    'title' => 'Tile hover effect',
    'options' => [
        '' => 'None',
        'zoom' => 'Zoom',
        'shift' => 'Shift',
        'image' => 'Secondary Image',
    ],
    'std' => '',
);

$params[ 'hover_image' ] = array(
    'type' => 'media',
    'title' => 'Secondary ịmage',
    'condition' => [
        'hover_effect[value]' => 'image',
    ],
);

$params[ 'hover_image_size' ] = array(
    'type' => 'image_size',
    'name' => 'hover_image',
    'title' => 'Hover ịmage size',
    'condition' => [
        'hover_effect[value]' => 'image',
    ],
);

$params[ 'title' ] = array(
    'type' => 'textarea',
    'std' => 'Your tile title',
    'title' => 'Tile title',
);

$params[ 'subtitle' ] = array(
    'type' => 'textarea',
    'title' => 'Tile subtitle',
);

$params[ 'title_subtitle_spacing' ] = array(
    'type' => 'size',
    'title' => 'Title - subtitle spacing',
    
    'std_unit' => 'px',
    'std_size' => 5,
    'px_max' => 50,
    'px_min' => 0,
    'selectors' => [
        '{{WRAPPER}} .tile-title + .tile-subtitle' => 'margin-top:{{SIZE}}{{UNIT}};',
    ],
);

$params[ 'align' ] = array(
    'type' => 'align',
    'title' => 'Align',
    'std'   => 'center',
    'options' => [ 'left', 'center', 'right' ],
);

$params[ 'valign' ] = array(
    'type' => 'select',
    'title' => 'Vertical align',
    'std'   => 'middle',
    'options' => [
        'top' => 'Top',
        'middle' => 'Middle',
        'bottom' => 'Bottom',
    ],
);

$params[ 'title_color' ] = array(
    'type' => 'color',
    'title' => 'Title Color',
    'selectors' => [
        '{{WRAPPER}} .tile-title' => 'color:{{VALUE}};',    
    ],
);

$params[ 'title_typography' ] = array(
    'type' => 'typography',
    'title' => 'Title Typography',
    'selector' => '{{WRAPPER}} .tile-title',
);

$params[ 'subtitle_color' ] = array(
    'type' => 'color',
    'title' => 'Subtitle Color',
    'selectors' => [
        '{{WRAPPER}} .tile-subtitle' => 'color:{{VALUE}};',    
    ],
);

$params[ 'subtitle_typography' ] = array(
    'type' => 'typography',
    'title' => 'Subtitle Typography',
    'selector' => '{{WRAPPER}} .tile-subtitle',
);

$params[ 'link' ] = array(
    'type' => 'url',
    'title' => 'Tile link',
);