Added youtube lightbox.

core/basic/zaso-icon-widgets/tpl/default.php

@@ -5,7 +5,6 @@
  * @package Zen Addons for SiteOrigin Page Builder
  * @since 1.0.4
  */
-$allow
 ?>
 
 <div <?php echo zaso_format_field_extra_id( $instance['extra_id'] ); ?> class="zaso-icon <?php echo $instance['extra_class']; ?>">

core/basic/zaso-youtube-lightbox-widgets/styles/style.scss

@@ -0,0 +1,21 @@
+.zaso-youtube-lightbox {
+  margin: 0;
+  padding: 0;
+  position: relative;
+
+  a {
+    position: relative;
+  }
+
+  &__playbutton {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    -ms-transform: translate(-50%, -50%);
+    transform: translate(-50%, -50%); 
+  }
+}
+
+.lity {
+  z-index: 999999;
+}

core/basic/zaso-youtube-lightbox-widgets/tpl/default.php

@@ -0,0 +1,35 @@
+<?php
+/**
+ * [ZASO] YouTube Lightbox Template
+ *
+ * @package Zen Addons for SiteOrigin Page Builder
+ * @since 1.0.6
+ */
+$build_url = esc_url( $instance['video_url'] );
+if( $instance['video_rel'] ) {
+    $build_url .= '&rel=' . sanitize_text_field( $instance['video_rel'] );
+}
+
+if( $instance['video_showinfo'] ) {
+    $build_url .= '&showinfo=' . sanitize_text_field( $instance['video_showinfo'] );
+}
+
+$video_thumb = wp_get_attachment_image_src( $instance['video_thumb'], 'full' )[0];
+$video_play_button = wp_get_attachment_image_src( $instance['video_play_button'], 'full' );
+?>
+
+<div <?php echo zaso_format_field_extra_id( $instance['extra_id'] ); ?> class="zaso-youtube-lightbox <?php echo $instance['extra_class']; ?>">
+    <div class="zaso-youtube-lightbox__inner">
+        <a href="<?php echo $build_url; ?>" data-lity>
+            <?php if ( $video_thumb ) : ?>
+                <img src="<?php echo $video_thumb; ?>" alt="<?php echo $instance['video_url']; ?>" />
+            <?php else : ?>
+                <?php echo $instance['video_url']; ?>
+            <?php endif; ?>
+
+            <?php if ( $video_play_button && $video_thumb ) : ?>
+                <div class="zaso-youtube-lightbox__playbutton" style="background: url(<?php echo $video_play_button[0]; ?>) no-repeat center center; display: inline-block; width: <?php echo $video_play_button[1]; ?>px; height: <?php echo $video_play_button[2]; ?>px;"></div>
+            <?php endif; ?>
+        </a>
+    </div>
+</div>

core/basic/zaso-youtube-lightbox-widgets/zaso-youtube-lightbox-widgets.php

@@ -0,0 +1,132 @@
+<?php
+/**
+ * Widget Name: ZASO - YouTube Lightbox
+ * Widget ID: zen-addons-siteorigin-youtube-lightbox
+ * Description: Pop-up lightbox for YouTube videos.
+ * Author: DopeThemes
+ * Author URI: https://www.dopethemes.com/
+ */
+
+if( ! class_exists( 'Zen_Addons_SiteOrigin_Youtube_Lightbox_Widget' ) ) :
+
+
+class Zen_Addons_SiteOrigin_Youtube_Lightbox_Widget extends SiteOrigin_Widget {
+
+	function __construct() {
+
+		// ZASO field array
+		$zaso_youtube_lightbox_field_array = array(
+			'video_url' => array(
+				'type'  => 'text',
+				'label' => __( 'YouTube Video URL' , 'zaso' ),
+				'description' => __( 'Insert URL, example: https://www.youtube.com/watch?v=dQw4w9WgXcQ', 'zaso' ),
+			),
+			'video_rel' => array(
+                'type' => 'select',
+                'label' => __( 'Show Related Videos', 'zaso' ),
+                'options' => array(
+					'0' => __( 'No', 'zaso' ),
+					'1' => __( 'Yes', 'zaso' )
+				)
+			),
+			'video_showinfo' => array(
+                'type' => 'select',
+                'label' => __( 'Show Info', 'zaso' ),
+                'options' => array(
+					'0' => __( 'No', 'zaso' ),
+					'1' => __( 'Yes', 'zaso' )
+				)
+			),
+			'video_play_button' => array(
+				'type'  => 'media',
+				'label' => __( 'Video Play Button Image', 'zaso' ),
+				'library' => 'image',
+				'fallback' => true
+			),
+			'video_thumb' => array(
+				'type'  => 'media',
+				'label' => __( 'Video Thumbnail', 'zaso' ),
+				'library' => 'image',
+				'fallback' => true
+			),
+			'extra_id' => array(
+				'type'  => 'text',
+				'label' => __( 'Extra ID', 'zaso' ),
+				'description'	=> __( 'Add an extra ID.', 'zaso' ),
+			),
+			'extra_class' => array(
+				'type'  => 'text',
+				'label' => __( 'Extra Class', 'zaso' ),
+				'description' => __( 'Add an extra class for styling overrides.', 'zaso' ),
+			),
+		);
+
+		// add filter
+		$zaso_youtube_lightbox_fields = apply_filters( 'zaso_youtube_lightbox_fields', $zaso_youtube_lightbox_field_array );
+
+		parent::__construct(
+			'zen-addons-siteorigin-youtube-lightbox',
+			__( 'ZASO - YouTube Lightbox', 'zaso' ),
+			array(
+				'description'   => __( 'Pop-up lightbox for YouTube videos.', 'zaso' ),
+				'help'          => 'https://www.dopethemes.com/',
+				'panels_groups' => array( 'zaso-plugin-widgets' )
+			),
+			array(),
+			$zaso_youtube_lightbox_fields,
+			ZASO_WIDGET_BASIC_DIR
+		);
+
+	}
+
+	function get_less_variables( $instance ) {
+
+		return apply_filters( 'zaso_youtube_lightbox_less_variables', array(
+			//'video_width' => $instance['video_width'],
+			//'video_height' => $instance['video_height']
+		));
+
+	}
+
+	function initialize() {
+
+		$this->register_frontend_styles(
+			array(
+				array(
+					'lity',
+					'https://cdn.jsdelivr.net/npm/[email protected]/dist/lity.min.css',
+					array(),
+					ZASO_VERSION
+				)
+			)
+		);
+
+		$this->register_frontend_styles(
+			array(
+				array(
+					'zen-addons-siteorigin-youtube-lightbox',
+					ZASO_WIDGET_BASIC_DIR . basename( dirname( __FILE__ ) ) . '/styles/style.css',
+					array( 'lity' ),
+					ZASO_VERSION
+				)
+			)
+		);
+
+		$this->register_frontend_scripts(
+			array(
+				array(
+					'lity',
+					'https://cdn.jsdelivr.net/npm/[email protected]/dist/lity.min.js',
+					array( 'jquery' ),
+					ZASO_VERSION
+				)
+			)
+		);
+
+	}
+
+}
+siteorigin_widget_register( 'zen-addons-siteorigin-youtube-lightbox', __FILE__, 'Zen_Addons_SiteOrigin_Youtube_Lightbox_Widget' );
+
+
+endif;

readme.md

@@ -21,6 +21,7 @@ The Zen Addons for SiteOrigin Page Builder gives you a collection of widgets tha
 * Alert Box, create contextual feedback and flexible alert messages.
 * Icon, set single icon on popular iconic font or upload your custom icon.
 * Video, add video from YouTube, Vimeo or another provider.
+* YouTube Video Lightbox, pop-up lightbox for YouTube videos.
 * Widgetized, get widget sidebar.
 
 **Other Features**
@@ -49,6 +50,7 @@ To enable our ZASO widgets, please activate it on `'Plugins > SiteOrigin Widgets
 ## Changelog ##
 
 ### 1.0.6 ###
+* New: Added new widget 'YouTube Video Lightbox'
 * Tweak: Accordion minor improvements
 
 ### 1.0.5 ###
@@ -79,8 +81,8 @@ To enable our ZASO widgets, please activate it on `'Plugins > SiteOrigin Widgets
 
 ## Upgrade Notice ##
 
-### 1.0.5 ###
-Added new widget - Widgetized.
+### 1.0.6 ###
+Added new widget - YouTube Video Lightbox.
 
 ## Translations ##
 

readme.txt

@@ -20,8 +20,10 @@ The Zen Addons for SiteOrigin Page Builder gives you a collection of widgets tha
 * Alert Box, create contextual feedback and flexible alert messages.
 * Icon, set single icon on popular iconic font or upload your custom icon.
 * Video, add video from YouTube, Vimeo or another provider.
+* YouTube Video Lightbox, pop-up lightbox for YouTube videos.
 * Widgetized, get widget sidebar.
 
+
 = Other Features =
 * Neatly structured semantic HTML
 * Highly accessible widgets with best ARIA practices
@@ -48,6 +50,7 @@ To enable our ZASO widgets, please activate it on 'Plugins > SiteOrigin Widgets'
 == Changelog ==
 
 = 1.0.6 =
+* New: Added new widget 'YouTube Video Lightbox'
 * Tweak: Accordion minor improvements
 
 = 1.0.5 =
@@ -78,6 +81,9 @@ To enable our ZASO widgets, please activate it on 'Plugins > SiteOrigin Widgets'
 
 == Upgrade Notice ==
 
+= 1.0.6 =
+Added new widget - YouTube Video Lightbox.
+
 = 1.0.5 =
 Added new widget - Widgetized.