<?php
if (class_exists('WPBakeryShortCodesContainer')) {
    class WPBakeryShortCode_tek_masonrygallery_elem extends WPBakeryShortCodesContainer {
    }
}
if (class_exists('WPBakeryShortCode')) {
    class WPBakeryShortCode_tek_masonrygallery_elem_single extends WPBakeryShortCode {
    }
}
if (!class_exists('tek_masonrygallery_elem')) {
    class tek_masonrygallery_elem extends KEYDESIGN_ADDON_CLASS
    {
        function __construct() {
            add_action('init', array( $this, 'kd_featured_init' ));
            add_shortcode('tek_masonrygallery_elem', array( $this, 'kd_masonrygallery_container' ));
            add_shortcode('tek_masonrygallery_elem_single', array( $this, 'kd_masonrygallery_single' ));
        }

        // Element configuration in admin
        function kd_featured_init() {
            // Container element configuration
            if (function_exists('vc_map')) {
                vc_map(array(
                    "name" => esc_html__("Masonry gallery", "keydesign"),
                    "description" => esc_html__("Display a gallery with masonry effect.", "keydesign"),
                    "base" => "tek_masonrygallery_elem",
                    "class" => "",
                    "show_settings_on_create" => false,
                    "content_element" => true,
                    "as_parent" => array('only' => 'tek_masonrygallery_elem_single'),
                    "icon" => plugins_url('assets/element_icons/masonry-gallery.png', dirname(__FILE__)),
                    "category" => esc_html__("KeyDesign Elements", "keydesign"),
                    "js_view" => 'VcColumnView',
                    "params" => array(
                        array(
                            "type" => "dropdown",
                            "class" => "",
                            "heading" => esc_html__("CSS Animation", "keydesign"),
                            "param_name" => "css_animation",
                            "value" => array(
                                "None" => "",
                                "Fade In" => "kd-animated fadeIn",
                                "Fade In Down" => "kd-animated fadeInDown",
                                "Fade In Left" => "kd-animated fadeInLeft",
                                "Fade In Right" => "kd-animated fadeInRight",
                                "Fade In Up" => "kd-animated fadeInUp",
                                "Zoom In" => "kd-animated zoomIn",
                            ),
                            "save_always" => true,
                            "admin_label" => true,
                            "description" => esc_html__("Select type of animation for element to be animated when it enters the browsers viewport (Note: works only in modern browsers).", "keydesign"),
                        ),

                        array(
                            "type" => "dropdown",
                            "class" => "",
                            "heading" => esc_html__("Animation delay", "keydesign"),
                            "param_name" => "mg_animation_delay",
                            "value" => array(
                                "0 ms" => "",
                                "200 ms" => "200",
                                "400 ms" => "400",
                                "600 ms" => "600",
                                "800 ms" => "800",
                                "1 s" => "1000",
                            ),
                            "save_always" => true,
                            "admin_label" => true,
                            "dependency" =>	array(
                                "element" => "css_animation",
                                "value" => array("kd-animated fadeIn", "kd-animated fadeInDown", "kd-animated fadeInLeft", "kd-animated fadeInRight", "kd-animated fadeInUp", "kd-animated zoomIn")
                            ),
                            "description" => esc_html__("Enter animation delay in ms.", "keydesign"),
                        ),
                        array(
                            "type" => "textfield",
                            "class" => "",
                            "heading" => esc_html__("Extra class name", "keydesign"),
                            "param_name" => "mg_extra_class",
                            "value" => "",
                            "description" => esc_html__("If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your css file.", "keydesign")
                        ),
                    )
                ));
                // Shortcode configuration
                vc_map(array(
                    "name" => esc_html__("Gallery single image", "keydesign"),
                    "base" => "tek_masonrygallery_elem_single",
                    "content_element" => true,
                    "as_child" => array('only' => 'tek_masonrygallery_elem'),
                    "icon" => plugins_url('assets/element_icons/child-image.png', dirname(__FILE__)),
                    "params" => array(
                        array(
                            "type" => "dropdown",
                            "class" => "",
                            "heading" => esc_html__("Image source", "keydesign"),
                            "param_name" => "image_source",
                            "value" => array(
                                "Media library" => "media_library",
                                "External link" => "external_link",
                            ),
                            "description" => esc_html__("Select image source.", "keydesign"),
                            "save_always" => true,
                        ),
                        array(
                            "type" => "attach_image",
                            "class" => "",
                            "heading" => esc_html__("Image", "keydesign"),
                            "param_name" => "mg_image",
                            "value" => "",
                            "description" => esc_html__("Select or upload a image using the media library.", "keydesign"),
                            "dependency" =>	array(
                                "element" => "image_source",
                                "value" => array("media_library"),
                            ),
                        ),
                        array(
                            "type" => "textfield",
                            "class" => "",
                            "heading" => esc_html__("Image external source", "keydesign"),
                            "param_name" => "ext_image",
                            "value" => "",
                            "description" => esc_html__("Enter image external link.", "keydesign"),
                            "dependency" =>	array(
                                "element" => "image_source",
                                "value" => array("external_link"),
                            ),
                        ),

                        array(
                            "type" => "textfield",
                            "class" => "",
                            "heading" => esc_html__("Image size", "keydesign"),
                            "param_name" => "mg_thumb_size",
                            "value" => "",
                            "description" => esc_html__("Enter image size (Example: \"thumbnail\", \"medium\", \"large\", \"full\" or other sizes defined by theme). Alternatively enter size in pixels (Example: 800x800 (Width x Height)).", "keydesign"),
                            "dependency" =>	array(
                                "element" => "image_source",
                                "value" => array("media_library"),
                            ),
                        ),

                        array(
                            "type" =>	"dropdown",
                            "class" =>	"",
                            "heading" =>	esc_html__("Image masonry style","keydesign"),
                            "param_name" =>	"mg_size",
                            "value" =>	array(
                                    "Regular" => "mg-small",
                                    "Double size" => "mg-big",
                                ),
                            "save_always" => true
                        ),
                    )
                ));
            }
        }

        public function kd_masonrygallery_container($atts, $content = null) {

            // Include required JS and CSS files
	          wp_enqueue_script( 'masonry' );

            // Declare empty vars
            $output = $animation_delay = $wrapper_class = '';

            extract(shortcode_atts(array(
                'css_animation' => '',
                'mg_animation_delay' => '',
                'mg_extra_class' => '',
            ), $atts));

            // Animation delay
            if ($mg_animation_delay) {
                $animation_delay = 'data-animation-delay='.$mg_animation_delay;
            }

            $wrapper_class = implode(' ', array('mg-gallery', 'mg-container', 'row', $css_animation, $mg_extra_class));

            $output = '<div class="'.trim($wrapper_class).'" '.$animation_delay.'><div class="mg-sizer"></div>' . do_shortcode($content) . '</div>';
            return $output;
        }

        public function kd_masonrygallery_single($atts, $content = null) {

            // Declare empty vars
            $output = $image = $mg_single_size = $default_src = $size_fix = '';

            extract(shortcode_atts(array(
                'image_source' => '',
                'mg_image' => '',
                'ext_image' => '',
                'mg_thumb_size' => '',
                'mg_size' => '',
            ), $atts));

            if ( ! $mg_thumb_size ) {
        			$mg_thumb_size = 'full';
        		}

            $image  = wpb_getImageBySize($params = array(
                'post_id' => NULL,
                'attach_id' => $mg_image,
                'thumb_size' => $mg_thumb_size,
                'class' => ""
            ));

            $default_src = vc_asset_url( 'vc/no_image.png' );
            $ext_image = $ext_image ? esc_attr( $ext_image ) : $default_src;

            if ($image_source == 'external_link') {
              $src = $ext_image;
            } elseif ($image_source == 'media_library' && !$image) {
              $src = $default_src;
            } else {
              $link = wp_get_attachment_image_src( $mg_image, 'large' );
              $link = $link[0];
              $src = $link;
            }

            if ($image_source == 'external_link' && !$ext_image ) {
              $width = '900';
              $height = '800';
            } elseif ($image_source == 'media_library' && !$image) {
              $width = '900';
              $height = '800';
            } elseif ($image_source == 'external_link' && $ext_image != '') {
              list($width, $height) = getimagesize($src);
            } elseif ($image_source == 'media_library' && $image != '') {
              $size_fix = wp_get_attachment_image_src( $mg_image, 'large' );
              $width = $size_fix[1];
              $height = $size_fix[2];
            }

            if( $mg_size == 'mg-small' ) {
                $mg_single_size = 'small-masonry-img';
            }
            elseif ( $mg_size == 'mg-big' ) {
                $mg_single_size = 'big-masonry-img';
            }

            $output = '<div class="mg-single-img '.$mg_single_size.'"><a data-size="' . $width. 'x' .$height .'" href='. $src . '>';
              if ($image_source == 'external_link') {
                if (!$ext_image) {
                  $output .='<img src="'.$default_src.'" class="mg-img vc_img-placeholder" />';
                } else {
                  $output .='<img class="mg-img" src="'.$ext_image.'" width="'.$width.'" height="'.$height.'" />';
                }
              } else {
                if (!$image) {
                  $output .='<img src="'.$default_src.'" class="mg-img vc_img-placeholder" />';
                } else {
                  $output .= $image['thumbnail'];
                }
              }
            $output .= '</a></div>';


            return $output;
        }
    }
}
if (class_exists('tek_masonrygallery_elem')) {
    $tek_masonrygallery_elem = new tek_masonrygallery_elem;
}
?>