172 lines
5.6 KiB
PHP
172 lines
5.6 KiB
PHP
<?php
|
|
/**
|
|
* Gutenberg Block Class
|
|
*
|
|
* Handles the Instagram Gallery Gutenberg block.
|
|
*
|
|
* @package Instagram_Gallery_Sync_Pro
|
|
*/
|
|
|
|
// Prevent direct access
|
|
if (!defined('ABSPATH')) {
|
|
exit;
|
|
}
|
|
|
|
/**
|
|
* Class IGSP_Gutenberg_Block
|
|
*/
|
|
class IGSP_Gutenberg_Block
|
|
{
|
|
|
|
/**
|
|
* Initialize block
|
|
*
|
|
* @return void
|
|
*/
|
|
public function init()
|
|
{
|
|
add_action('init', array($this, 'register_block'));
|
|
add_action('enqueue_block_editor_assets', array($this, 'enqueue_editor_assets'));
|
|
}
|
|
|
|
/**
|
|
* Register block
|
|
*
|
|
* @return void
|
|
*/
|
|
public function register_block()
|
|
{
|
|
if (!function_exists('register_block_type')) {
|
|
return;
|
|
}
|
|
|
|
register_block_type('igsp/instagram-gallery', array(
|
|
'editor_script' => 'igsp-block-editor',
|
|
'editor_style' => 'igsp-block-editor-style',
|
|
'render_callback' => array($this, 'render_block'),
|
|
'attributes' => $this->get_block_attributes(),
|
|
));
|
|
}
|
|
|
|
/**
|
|
* Get block attributes
|
|
*
|
|
* @return array
|
|
*/
|
|
private function get_block_attributes()
|
|
{
|
|
return array(
|
|
'layout' => array(
|
|
'type' => 'string',
|
|
'default' => get_option('igsp_layout_type', 'grid'),
|
|
),
|
|
'columns' => array(
|
|
'type' => 'number',
|
|
'default' => get_option('igsp_columns_desktop', 3),
|
|
),
|
|
'spacing' => array(
|
|
'type' => 'number',
|
|
'default' => get_option('igsp_spacing', 10),
|
|
),
|
|
'limit' => array(
|
|
'type' => 'number',
|
|
'default' => get_option('igsp_display_limit', 12),
|
|
),
|
|
'order' => array(
|
|
'type' => 'string',
|
|
'default' => get_option('igsp_order', 'newest'),
|
|
),
|
|
'lightbox' => array(
|
|
'type' => 'boolean',
|
|
'default' => get_option('igsp_lightbox', 'yes') === 'yes',
|
|
),
|
|
'captions' => array(
|
|
'type' => 'boolean',
|
|
'default' => get_option('igsp_show_caption', 'no') === 'yes',
|
|
),
|
|
'className' => array(
|
|
'type' => 'string',
|
|
'default' => '',
|
|
),
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Enqueue editor assets
|
|
*
|
|
* @return void
|
|
*/
|
|
public function enqueue_editor_assets()
|
|
{
|
|
// Editor script
|
|
wp_enqueue_script(
|
|
'igsp-block-editor',
|
|
IGSP_PLUGIN_URL . 'public/js/block-editor.js',
|
|
array('wp-blocks', 'wp-element', 'wp-editor', 'wp-components', 'wp-i18n', 'wp-server-side-render'),
|
|
IGSP_VERSION
|
|
);
|
|
|
|
// Editor style
|
|
wp_enqueue_style(
|
|
'igsp-block-editor-style',
|
|
IGSP_PLUGIN_URL . 'public/css/block-editor.css',
|
|
array(),
|
|
IGSP_VERSION
|
|
);
|
|
|
|
// Localize
|
|
wp_localize_script('igsp-block-editor', 'igspBlock', array(
|
|
'pluginUrl' => IGSP_PLUGIN_URL,
|
|
'defaultLayout' => get_option('igsp_layout_type', 'grid'),
|
|
'layouts' => array(
|
|
array('value' => 'grid', 'label' => __('Grid', 'instagram-gallery-sync-pro')),
|
|
array('value' => 'masonry', 'label' => __('Masonry', 'instagram-gallery-sync-pro')),
|
|
array('value' => 'slider', 'label' => __('Slider', 'instagram-gallery-sync-pro')),
|
|
array('value' => 'justified', 'label' => __('Justified', 'instagram-gallery-sync-pro')),
|
|
array('value' => 'list', 'label' => __('List', 'instagram-gallery-sync-pro')),
|
|
),
|
|
'orders' => array(
|
|
array('value' => 'newest', 'label' => __('Newest First', 'instagram-gallery-sync-pro')),
|
|
array('value' => 'oldest', 'label' => __('Oldest First', 'instagram-gallery-sync-pro')),
|
|
array('value' => 'random', 'label' => __('Random', 'instagram-gallery-sync-pro')),
|
|
),
|
|
'strings' => array(
|
|
'title' => __('Instagram Gallery', 'instagram-gallery-sync-pro'),
|
|
'description' => __('Display your Instagram photos in a beautiful gallery.', 'instagram-gallery-sync-pro'),
|
|
'layout' => __('Layout', 'instagram-gallery-sync-pro'),
|
|
'columns' => __('Columns', 'instagram-gallery-sync-pro'),
|
|
'spacing' => __('Spacing', 'instagram-gallery-sync-pro'),
|
|
'limit' => __('Number of Images', 'instagram-gallery-sync-pro'),
|
|
'order' => __('Order', 'instagram-gallery-sync-pro'),
|
|
'lightbox' => __('Enable Lightbox', 'instagram-gallery-sync-pro'),
|
|
'captions' => __('Show Captions', 'instagram-gallery-sync-pro'),
|
|
),
|
|
));
|
|
}
|
|
|
|
/**
|
|
* Render block
|
|
*
|
|
* @param array $attributes Block attributes
|
|
* @return string
|
|
*/
|
|
public function render_block($attributes)
|
|
{
|
|
// Convert block attributes to shortcode attributes
|
|
$atts = array(
|
|
'layout' => $attributes['layout'] ?? 'grid',
|
|
'columns' => $attributes['columns'] ?? 3,
|
|
'spacing' => $attributes['spacing'] ?? 10,
|
|
'limit' => $attributes['limit'] ?? 12,
|
|
'order' => $attributes['order'] ?? 'newest',
|
|
'lightbox' => $attributes['lightbox'] ? 'yes' : 'no',
|
|
'captions' => $attributes['captions'] ? 'yes' : 'no',
|
|
'class' => $attributes['className'] ?? '',
|
|
);
|
|
|
|
// Use shortcode handler for rendering
|
|
$shortcode = new IGSP_Shortcode();
|
|
return $shortcode->render($atts);
|
|
}
|
|
}
|