name = esc_html__( 'Fullwidth Portfolio', 'et_builder' ); $this->slug = 'et_pb_fullwidth_portfolio'; $this->fb_support = true; $this->fullwidth = true; // need to use global settings from the slider module $this->global_settings_slug = 'et_pb_portfolio'; $this->whitelisted_fields = array( 'title', 'fullwidth', 'include_categories', 'posts_number', 'show_title', 'show_date', 'background_layout', 'auto', 'auto_speed', 'hover_icon', 'hover_overlay_color', 'zoom_icon_color', 'admin_label', 'module_id', 'module_class', 'box_shadow_style_image', 'box_shadow_horizontal_image', 'box_shadow_vertical_image', 'box_shadow_blur_image', 'box_shadow_spread_image', 'box_shadow_color_image', 'box_shadow_position_image', ); $this->main_css_element = '%%order_class%%'; $this->options_toggles = array( 'general' => array( 'toggles' => array( 'main_content' => esc_html__( 'Content', 'et_builder' ), 'elements' => esc_html__( 'Elements', 'et_builder' ), ), ), 'advanced' => array( 'toggles' => array( 'layout' => esc_html__( 'Layout', 'et_builder' ), 'overlay' => esc_html__( 'Overlay', 'et_builder' ), 'rotation' => esc_html__( 'Rotation', 'et_builder' ), 'text' => array( 'title' => esc_html__( 'Text', 'et_builder' ), 'priority' => 49, ), 'image' => esc_html__( 'Image', 'et_builder' ), ), ), 'custom_css' => array( 'toggles' => array( 'animation' => array( 'title' => esc_html__( 'Animation', 'et_builder' ), 'priority' => 90, ), ), ), ); $this->advanced_options = array( 'fonts' => array( 'portfolio_header' => array( 'label' => esc_html__( 'Portfolio Title', 'et_builder' ), 'css' => array( 'main' => "{$this->main_css_element} .et_pb_portfolio_title", 'important' => 'all', ), 'header_level' => array( 'default' => 'h2', ), ), 'title' => array( 'label' => esc_html__( 'Portfolio Item Title', 'et_builder' ), 'css' => array( 'main' => "{$this->main_css_element} h3, {$this->main_css_element} h1.et_pb_module_header, {$this->main_css_element} h2.et_pb_module_header, {$this->main_css_element} h4.et_pb_module_header, {$this->main_css_element} h5.et_pb_module_header, {$this->main_css_element} h6.et_pb_module_header", 'important' => 'all', ), 'header_level' => array( 'default' => 'h3', ), ), 'caption' => array( 'label' => esc_html__( 'Meta', 'et_builder' ), 'css' => array( 'main' => "{$this->main_css_element} .post-meta, {$this->main_css_element} .post-meta a", 'text_align' => "{$this->main_css_element} .et_pb_portfolio_image p.post-meta", ), ), ), 'background' => array( 'settings' => array( 'color' => 'alpha', ), ), 'custom_margin_padding' => array(), 'max_width' => array(), 'text' => array( 'css' => array( 'text_orientation' => '%%order_class%% h2, %%order_class%% .et_pb_portfolio_image h3, %%order_class%% .et_pb_portfolio_image p, %%order_class%% .et_pb_portfolio_title, %%order_class%% .et_pb_portfolio_image .et_pb_module_header', ), ), 'filters' => array( 'css' => array( 'main' => '%%order_class%%', ), 'child_filters_target' => array( 'tab_slug' => 'advanced', 'toggle_slug' => 'image', ), ), 'image' => array( 'css' => array( 'main' => '%%order_class%% .et_pb_portfolio_image', ), ), ); $this->custom_css_options = array( 'portfolio_title' => array( 'label' => esc_html__( 'Portfolio Title', 'et_builder' ), 'selector' => '> h2', ), 'portfolio_item' => array( 'label' => esc_html__( 'Portfolio Item', 'et_builder' ), 'selector' => '.et_pb_portfolio_item', ), 'portfolio_overlay' => array( 'label' => esc_html__( 'Item Overlay', 'et_builder' ), 'selector' => 'span.et_overlay', ), 'portfolio_item_title' => array( 'label' => esc_html__( 'Item Title', 'et_builder' ), 'selector' => '.meta h3', ), 'portfolio_meta' => array( 'label' => esc_html__( 'Meta', 'et_builder' ), 'selector' => '.meta p', ), 'portfolio_arrows' => array( 'label' => esc_html__( 'Navigation Arrows', 'et_builder' ), 'selector' => '.et-pb-slider-arrows a', ), ); $this->fields_defaults = array( 'fullwidth' => array( 'on' ), 'show_title' => array( 'on' ), 'show_date' => array( 'on' ), 'background_layout' => array( 'light' ), 'auto' => array( 'off' ), 'auto_speed' => array( '7000' ), 'text_orientation' => array( 'center' ), ); } function get_fields() { $fields = array( 'title' => array( 'label' => esc_html__( 'Portfolio Title', 'et_builder' ), 'type' => 'text', 'option_category' => 'basic_option', 'description' => esc_html__( 'Title displayed above the portfolio.', 'et_builder' ), 'toggle_slug' => 'main_content', ), 'fullwidth' => array( 'label' => esc_html__( 'Layout', 'et_builder' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'on' => esc_html__( 'Carousel', 'et_builder' ), 'off' => esc_html__( 'Grid', 'et_builder' ), ), 'affects' => array( 'auto', ), 'tab_slug' => 'advanced', 'toggle_slug' => 'layout', 'description' => esc_html__( 'Choose your desired portfolio layout style.', 'et_builder' ), ), 'include_categories' => array( 'label' => esc_html__( 'Include Categories', 'et_builder' ), 'renderer' => 'et_builder_include_categories_option', 'option_category' => 'basic_option', 'description' => esc_html__( 'Select the categories that you would like to include in the feed.', 'et_builder' ), 'computed_affects' => array( '__projects', ), 'taxonomy_name' => 'project_category', 'toggle_slug' => 'main_content', ), 'posts_number' => array( 'label' => esc_html__( 'Posts Number', 'et_builder' ), 'type' => 'text', 'option_category' => 'configuration', 'description' => esc_html__( 'Control how many projects are displayed. Leave blank or use 0 to not limit the amount.', 'et_builder' ), 'computed_affects' => array( '__projects', ), 'toggle_slug' => 'main_content', ), 'show_title' => array( 'label' => esc_html__( 'Show Title', 'et_builder' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'et_builder' ), 'off' => esc_html__( 'No', 'et_builder' ), ), 'toggle_slug' => 'elements', 'description' => esc_html__( 'Turn project titles on or off.', 'et_builder' ), ), 'show_date' => array( 'label' => esc_html__( 'Show Date', 'et_builder' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'on' => esc_html__( 'Yes', 'et_builder' ), 'off' => esc_html__( 'No', 'et_builder' ), ), 'toggle_slug' => 'elements', 'description' => esc_html__( 'Turn the date display on or off.', 'et_builder' ), ), 'background_layout' => array( 'label' => esc_html__( 'Text Color', 'et_builder' ), 'type' => 'select', 'option_category' => 'color_option', 'options' => array( 'light' => esc_html__( 'Dark', 'et_builder' ), 'dark' => esc_html__( 'Light', 'et_builder' ), ), 'tab_slug' => 'advanced', 'toggle_slug' => 'text', 'description' => esc_html__( 'Here you can choose whether your text should be light or dark. If you are working with a dark background, then your text should be light. If your background is light, then your text should be set to dark.', 'et_builder' ), ), 'zoom_icon_color' => array( 'label' => esc_html__( 'Zoom Icon Color', 'et_builder' ), 'type' => 'color-alpha', 'custom_color' => true, 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', ), 'hover_overlay_color' => array( 'label' => esc_html__( 'Hover Overlay Color', 'et_builder' ), 'type' => 'color-alpha', 'custom_color' => true, 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', ), 'hover_icon' => array( 'label' => esc_html__( 'Hover Icon Picker', 'et_builder' ), 'type' => 'text', 'option_category' => 'configuration', 'class' => array( 'et-pb-font-icon' ), 'renderer' => 'et_pb_get_font_icon_list', 'renderer_with_field' => true, 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', ), 'disabled_on' => array( 'label' => esc_html__( 'Disable on', 'et_builder' ), 'type' => 'multiple_checkboxes', 'options' => array( 'phone' => esc_html__( 'Phone', 'et_builder' ), 'tablet' => esc_html__( 'Tablet', 'et_builder' ), 'desktop' => esc_html__( 'Desktop', 'et_builder' ), ), 'additional_att' => 'disable_on', 'option_category' => 'configuration', 'description' => esc_html__( 'This will disable the module on selected devices', 'et_builder' ), 'tab_slug' => 'custom_css', 'toggle_slug' => 'visibility', ), 'admin_label' => array( 'label' => esc_html__( 'Admin Label', 'et_builder' ), 'type' => 'text', 'description' => esc_html__( 'This will change the label of the module in the builder for easy identification.', 'et_builder' ), 'toggle_slug' => 'admin_label', ), 'module_id' => array( 'label' => esc_html__( 'CSS ID', 'et_builder' ), 'type' => 'text', 'option_category' => 'configuration', 'tab_slug' => 'custom_css', 'toggle_slug' => 'classes', 'option_class' => 'et_pb_custom_css_regular', ), 'module_class' => array( 'label' => esc_html__( 'CSS Class', 'et_builder' ), 'type' => 'text', 'option_category' => 'configuration', 'tab_slug' => 'custom_css', 'toggle_slug' => 'classes', 'option_class' => 'et_pb_custom_css_regular', ), '__projects' => array( 'type' => 'computed', 'computed_callback' => array( 'ET_Builder_Module_Fullwidth_Portfolio', 'get_portfolio_item' ), 'computed_depends_on' => array( 'posts_number', 'include_categories', ), ), ); $fields = array_merge( $fields, ET_Builder_Module_Fields_Factory::get( 'BoxShadow' )->get_fields( array( 'suffix' => '_image', 'label' => esc_html__( 'Image Box Shadow', 'et_builder' ), 'option_category' => 'layout', 'tab_slug' => 'advanced', 'toggle_slug' => 'image', ) ) ); return $fields; } /** * Get portfolio objects for portfolio module * * @param array arguments that affect et_pb_portfolio query * @param array passed conditional tag for update process * @param array passed current page params * @return array portfolio item data */ static function get_portfolio_item( $args = array(), $conditional_tags = array(), $current_page = array() ) { $defaults = array( 'posts_number' => '', 'include_categories' => '', ); $args = wp_parse_args( $args, $defaults ); $query_args = array( 'post_type' => 'project', 'post_status' => 'publish', ); if ( is_numeric( $args['posts_number'] ) && $args['posts_number'] > 0 ) { $query_args['posts_per_page'] = $args['posts_number']; } else { $query_args['nopaging'] = true; } if ( '' !== $args['include_categories'] ) { $query_args['tax_query'] = array( array( 'taxonomy' => 'project_category', 'field' => 'id', 'terms' => explode( ',', $args['include_categories'] ), 'operator' => 'IN' ) ); } // Get portfolio query $query = new WP_Query( $query_args ); // Format portfolio output, add supplementary data $width = (int) apply_filters( 'et_pb_portfolio_image_width', 510 ); $height = (int) apply_filters( 'et_pb_portfolio_image_height', 382 ); if( $query->post_count > 0 ) { $post_index = 0; while ( $query->have_posts() ) { $query->the_post(); // Get thumbnail $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), array( $width, $height ) ); if ( isset( $thumbnail[2] ) && isset( $thumbnail[1] ) ) { $orientation = ( $thumbnail[2] > $thumbnail[1] ) ? 'portrait' : 'landscape'; } else { $orientation = false; } // Append value to query post $query->posts[ $post_index ]->post_permalink = get_permalink(); $query->posts[ $post_index ]->post_thumbnail = isset( $thumbnail[0] ) ? $thumbnail[0] : false; $query->posts[ $post_index ]->post_thumbnail_orientation = $orientation; $query->posts[ $post_index ]->post_date_readable = get_the_date(); $query->posts[ $post_index ]->post_class_name = get_post_class( 'et_pb_portfolio_item et_pb_grid_item ' ); $post_index++; } } else if ( wp_doing_ajax() ) { // This is for the VB $posts = '
'; $posts .= self::get_no_results_template(); $posts .= '
'; $query = array( 'posts' => $posts ); } wp_reset_postdata(); return $query; } function shortcode_callback( $atts, $content = null, $function_name ) { $title = $this->shortcode_atts['title']; $module_id = $this->shortcode_atts['module_id']; $module_class = $this->shortcode_atts['module_class']; $fullwidth = $this->shortcode_atts['fullwidth']; $include_categories = $this->shortcode_atts['include_categories']; $posts_number = $this->shortcode_atts['posts_number']; $show_title = $this->shortcode_atts['show_title']; $show_date = $this->shortcode_atts['show_date']; $background_layout = $this->shortcode_atts['background_layout']; $auto = $this->shortcode_atts['auto']; $auto_speed = $this->shortcode_atts['auto_speed']; $zoom_icon_color = $this->shortcode_atts['zoom_icon_color']; $hover_overlay_color = $this->shortcode_atts['hover_overlay_color']; $hover_icon = $this->shortcode_atts['hover_icon']; $header_level = $this->shortcode_atts['title_level']; $portfolio_header = $this->shortcode_atts['portfolio_header_level']; $module_class = ET_Builder_Element::add_module_order_class( $module_class, $function_name ); $zoom_and_hover_selector = '.et_pb_fullwidth_portfolio%%order_class%% .et_pb_portfolio_image'; if ( '' !== $zoom_icon_color ) { ET_Builder_Element::set_style( $function_name, array( 'selector' => "{$zoom_and_hover_selector} .et_overlay:before", 'declaration' => sprintf( 'color: %1$s !important;', esc_html( $zoom_icon_color ) ), ) ); } if ( '' !== $hover_overlay_color ) { ET_Builder_Element::set_style( $function_name, array( 'selector' => "{$zoom_and_hover_selector} .et_overlay", 'declaration' => sprintf( 'background-color: %1$s; border-color: %1$s;', esc_html( $hover_overlay_color ) ), ) ); } $args = array(); if ( is_numeric( $posts_number ) && $posts_number > 0 ) { $args['posts_per_page'] = $posts_number; } else { $args['nopaging'] = true; } if ( '' !== $include_categories ) { $args['tax_query'] = array( array( 'taxonomy' => 'project_category', 'field' => 'id', 'terms' => explode( ',', $include_categories ), 'operator' => 'IN' ) ); } $projects = self::get_portfolio_item( array( 'posts_number' => $posts_number, 'include_categories' => $include_categories, ) ); ob_start(); if( $projects->post_count > 0 ) { while ( $projects->have_posts() ) { $projects->the_post(); ?>
> $thumb_width ) ? 'portrait' : 'landscape'; if ( '' !== $thumb_src ) : ?>
<?php echo esc_attr( get_the_title() ); ?>
'; $posts .= self::get_no_results_template(); $posts .= ''; } $video_background = $this->video_background(); $parallax_image_background = $this->get_parallax_image_background(); $class = " et_pb_module et_pb_bg_layout_{$background_layout}"; // Images: Add CSS Filters and Mix Blend Mode rules (if set) if ( isset( $this->advanced_options['image']['css'] ) ) { $module_class .= $this->generate_css_filters( $function_name, 'child_', self::$data_utils->array_get( $this->advanced_options['image']['css'], 'main', '%%order_class%%' ) ); } $portfolio_title = sprintf( '<%1$s class="et_pb_portfolio_title">%2$s', et_pb_process_header_level( $portfolio_header, 'h2' ), esc_html( $title ) ); $output = sprintf( ' %12$s %10$s %8$s
%2$s
', ( 'on' === $fullwidth ? 'et_pb_fullwidth_portfolio_carousel' : 'et_pb_fullwidth_portfolio_grid clearfix' ), $posts, esc_attr( $class ), ( '' !== $module_id ? sprintf( ' id="%1$s"', esc_attr( $module_id ) ) : '' ), ( '' !== $module_class ? sprintf( ' %1$s', esc_attr( $module_class ) ) : '' ), ( '' !== $auto && in_array( $auto, array('on', 'off') ) ? esc_attr( $auto ) : 'off' ), ( '' !== $auto_speed && is_numeric( $auto_speed ) ? esc_attr( $auto_speed ) : '7000' ), ( '' !== $title ? $portfolio_title : '' ), '' !== $video_background ? ' et_pb_section_video et_pb_preload' : '', $video_background, '' !== $parallax_image_background ? ' et_pb_section_parallax' : '', $parallax_image_background ); return $output; } public function process_box_shadow( $function_name ) { $boxShadow = ET_Builder_Module_Fields_Factory::get( 'BoxShadow' ); $selector = sprintf( '.%1$s .et_pb_portfolio_image', self::get_module_order_class( $function_name ) ); self::set_style( $function_name, $boxShadow->get_style( $selector, $this->shortcode_atts, array( 'suffix' => '_image' ) ) ); self::set_style( $function_name, $boxShadow->get_style( '.' . self::get_module_order_class( $function_name ), $this->shortcode_atts ) ); } protected function _add_additional_border_fields() { parent::_add_additional_border_fields(); $this->advanced_options["border"]['css'] = array( 'main' => array( 'border_radii' => "{$this->main_css_element}", 'border_styles' => "{$this->main_css_element}", ) ); $suffix = 'image'; $tab_slug = 'advanced'; $toggle_slug = 'image'; $this->_additional_fields_options = array_merge( $this->_additional_fields_options, ET_Builder_Module_Fields_Factory::get( 'Border' )->get_fields( array( 'suffix' => "_{$suffix}", 'label_prefix' => esc_html__( 'Image', 'et_builder' ), 'tab_slug' => $tab_slug, 'toggle_slug' => $toggle_slug, ) ) ); $this->advanced_options["border_{$suffix}"]["border_radii_{$suffix}"] = $this->_additional_fields_options["border_radii_{$suffix}"]; $this->advanced_options["border_{$suffix}"]["border_styles_{$suffix}"] = $this->_additional_fields_options["border_styles_{$suffix}"]; $this->advanced_options["border_{$suffix}"]['css'] = array( 'main' => array( 'border_radii' => "{$this->main_css_element} .et_pb_portfolio_image", 'border_styles' => "{$this->main_css_element} .et_pb_portfolio_image", ), ); } function process_advanced_border_options( $function_name ) { parent::process_advanced_border_options( $function_name ); $suffix = 'image'; /** * @var ET_Builder_Module_Field_Border $border_field */ $border_field = ET_Builder_Module_Fields_Factory::get( 'Border' ); $css_selector = ! empty( $this->advanced_options["border_{$suffix}"]['css']['main']['border_radii'] ) ? $this->advanced_options["border_{$suffix}"]['css']['main']['border_radii'] : $this->main_css_element; self::set_style( $function_name, array( 'selector' => $css_selector, 'declaration' => $border_field->get_radii_style( $this->shortcode_atts, $this->advanced_options, "_{$suffix}" ), 'priority' => $this->_style_priority, ) ); $css_selector = ! empty( $this->advanced_options["border_{$suffix}"]['css']['main']['border_styles'] ) ? $this->advanced_options["border_{$suffix}"]['css']['main']['border_styles'] : $this->main_css_element; self::set_style( $function_name, array( 'selector' => $css_selector, 'declaration' => $border_field->get_borders_style( $this->shortcode_atts, $this->advanced_options, "_{$suffix}" ), 'priority' => $this->_style_priority, ) ); } } new ET_Builder_Module_Fullwidth_Portfolio;