328 lines
10 KiB
PHP
328 lines
10 KiB
PHP
<?php
|
|
|
|
namespace DgoraWcas;
|
|
|
|
// Exit if accessed directly
|
|
if ( ! defined( 'ABSPATH' ) ) {
|
|
exit;
|
|
}
|
|
|
|
class EmbeddingViaMenu {
|
|
const SEARCH_PLACEHOLDER = 'dgwt_wcas_search_box';
|
|
|
|
public function init() {
|
|
|
|
if ( is_admin() ) {
|
|
add_action( 'admin_head-nav-menus.php', array( $this, 'addNavMenuMetaBoxes' ) );
|
|
add_action( 'wp_nav_menu_item_custom_fields', array( $this, 'addNavMenuItemCustomFields' ), 10, 2 );
|
|
add_action( 'wp_update_nav_menu_item', array( $this, 'updateNavMenuItem' ), 10, 3 );
|
|
|
|
add_action( 'admin_head', array( $this, 'navMenuStyle' ) );
|
|
add_action( 'admin_footer', array( $this, 'navMenuScripts' ) );
|
|
|
|
} else {
|
|
|
|
add_filter( 'walker_nav_menu_start_el', array( $this, 'processMenuItem' ), 50, 2 );
|
|
add_filter( 'megamenu_walker_nav_menu_start_el', array( $this, 'processMenuItem' ), 50, 2 );
|
|
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Check if nav-menus screen is active
|
|
*
|
|
* @return bool
|
|
*/
|
|
private function isNavMenuScreen() {
|
|
$isNav = false;
|
|
$screen = get_current_screen();
|
|
|
|
if ( ! empty( $screen->id ) && ( $screen->id === 'nav-menus' ) ) {
|
|
$isNav = true;
|
|
}
|
|
|
|
return $isNav;
|
|
}
|
|
|
|
/**
|
|
* Add custom nav meta box.
|
|
*
|
|
* Adapted from http://www.johnmorrisonline.com/how-to-add-a-fully-functional-custom-meta-box-to-wordpress-navigation-menus/.
|
|
*
|
|
* @return void
|
|
*/
|
|
public function addNavMenuMetaBoxes() {
|
|
add_meta_box( 'dgwt_wcas_endpoints_nav_link', __( 'FiboSearch bar', 'ajax-search-for-woocommerce' ), array( $this, 'navMenuLinks' ), 'nav-menus', 'side',
|
|
'low' );
|
|
}
|
|
|
|
/**
|
|
* Add custom fields to own menu item
|
|
*/
|
|
public function addNavMenuItemCustomFields( $item_id, $item ) {
|
|
if ( $item->post_title !== self::SEARCH_PLACEHOLDER ) {
|
|
return;
|
|
}
|
|
$layout = get_post_meta( $item_id, '_menu_item_dgwt_wcas_layout', true );
|
|
if ( empty( $layout ) ) {
|
|
$layout = 'default';
|
|
}
|
|
$searchIconColor = get_post_meta( $item_id, '_menu_item_dgwt_wcas_search_icon_color', true );
|
|
?>
|
|
<p class="description description-wide dgwt-wcas-description">
|
|
<label for="edit-menu-item-dgwt-wcas-layout-<?php echo $item_id; ?>">
|
|
<?php _e( 'Layout', 'ajax-search-for-woocommerce' ); ?>
|
|
<select id="edit-menu-item-dgwt-wcas-layout-<?php echo $item_id; ?>" name="menu-item-dgwt-wcas-layout[<?php echo $item_id; ?>]" class="dgwt-wcas-layout-select">
|
|
<?php
|
|
foreach ( $this->getLayoutOptions() as $value => $name ) {
|
|
$selected = selected( $value, $layout, false );
|
|
printf( '<option %s value="%s">%s</option>', $selected, $value, $name );
|
|
}
|
|
?>
|
|
</select>
|
|
</label>
|
|
</p>
|
|
<p class="description description-wide dgwt-wcas-description">
|
|
<?php _e( 'Search icon color', 'ajax-search-for-woocommerce' ); ?><br/>
|
|
<input type="text" class="widefat wp-color-picker-field dwgt-wcas-color-picker"
|
|
name="menu-item-dgwt-wcas-search-icon-color[<?php echo $item_id; ?>]"
|
|
value="<?php echo esc_attr( $searchIconColor ); ?>"/>
|
|
</p>
|
|
<?php
|
|
}
|
|
|
|
/**
|
|
* Handle updates of custom fileds for own menu item
|
|
*
|
|
* @see wp_update_nav_menu_item()
|
|
*/
|
|
public function updateNavMenuItem( $menu_id, $menu_item_db_id, $args ) {
|
|
if ( ! isset( $args['menu-item-title'] ) || $args['menu-item-title'] !== self::SEARCH_PLACEHOLDER ) {
|
|
return;
|
|
}
|
|
|
|
$layout = isset( $_POST['menu-item-dgwt-wcas-layout'][ $menu_item_db_id ] ) ? sanitize_key( $_POST['menu-item-dgwt-wcas-layout'][ $menu_item_db_id ] ) : '';
|
|
update_post_meta( $menu_item_db_id, '_menu_item_dgwt_wcas_layout', $layout );
|
|
|
|
$searchIconColor = isset( $_POST['menu-item-dgwt-wcas-search-icon-color'][ $menu_item_db_id ] ) ? sanitize_hex_color( $_POST['menu-item-dgwt-wcas-search-icon-color'][ $menu_item_db_id ] ) : '';
|
|
update_post_meta( $menu_item_db_id, '_menu_item_dgwt_wcas_search_icon_color', $searchIconColor );
|
|
}
|
|
|
|
/**
|
|
* Modifies the menu item display on frontend.
|
|
*
|
|
* @param string $itemOutput
|
|
*
|
|
* @return string
|
|
*/
|
|
public function processMenuItem( $itemOutput, $item ) {
|
|
|
|
if (
|
|
! empty( $itemOutput )
|
|
&& is_string( $itemOutput )
|
|
&& strpos( $itemOutput, self::SEARCH_PLACEHOLDER ) !== false
|
|
) {
|
|
$args = '';
|
|
$style = '';
|
|
$layout = get_post_meta( $item->ID, '_menu_item_dgwt_wcas_layout', true );
|
|
if ( in_array( $layout, array( 'classic', 'icon', 'icon-flexible', 'icon-flexible-inv' ) ) ) {
|
|
$args .= 'layout="' . $layout . '" ';
|
|
}
|
|
$searchIconColor = get_post_meta( $item->ID, '_menu_item_dgwt_wcas_search_icon_color', true );
|
|
if ( in_array( $layout, array( 'icon', 'icon-flexible', 'icon-flexible-inv' ) ) && ! empty( $searchIconColor ) ) {
|
|
$args .= 'class="dgwt-wcas-menu-item-' . $item->ID . ' " ';
|
|
$style = sprintf( '<style>.dgwt-wcas-menu-item-%d .dgwt-wcas-ico-magnifier-handler path {fill: %s;}</style>', $item->ID, esc_attr( $searchIconColor ) );
|
|
}
|
|
$itemOutput = do_shortcode( sprintf( '[fibosearch %s]', $args ) ) . $style;
|
|
}
|
|
|
|
return $itemOutput;
|
|
}
|
|
|
|
/**
|
|
* Output menu links.
|
|
*
|
|
* @return void
|
|
*/
|
|
public function navMenuLinks() {
|
|
?>
|
|
<div id="posttype-dgwt-wcas-endpoints" class="posttypediv">
|
|
<p><?php _e( 'Add FiboSearch as a menu item.', 'ajax-search-for-woocommerce' ) ?></p>
|
|
<div id="tabs-panel-dgwt-wcas-endpoints" class="tabs-panel tabs-panel-active">
|
|
<ul id="dgwt-wcas-endpoints-checklist" class="categorychecklist form-no-clear">
|
|
<li>
|
|
<label class="menu-item-title">
|
|
<input type="checkbox" class="menu-item-checkbox" name="menu-item[-1][menu-item-object-id]"
|
|
value="-1"/> <?php echo __( 'FiboSearch bar', 'ajax-search-for-woocommerce' ); ?>
|
|
</label>
|
|
<input type="hidden" class="menu-item-type" name="menu-item[-1][menu-item-type]" value="custom"/>
|
|
<input type="hidden" class="menu-item-title" name="menu-item[-1][menu-item-title]" value="<?php echo self::SEARCH_PLACEHOLDER; ?>"/>
|
|
<input type="hidden" class="menu-item-classes" name="menu-item[-1][menu-item-classes]"/>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<p class="button-controls">
|
|
<span class="add-to-menu">
|
|
<button type="submit" class="button-secondary submit-add-to-menu right" value="<?php esc_attr_e( 'Add to menu', 'woocommerce' ); ?>"
|
|
name="add-post-type-menu-item" id="submit-posttype-dgwt-wcas-endpoints"><?php esc_html_e( 'Add to menu', 'woocommerce' ); ?></button>
|
|
<span class="spinner"></span>
|
|
</span>
|
|
</p>
|
|
</div>
|
|
<?php
|
|
}
|
|
|
|
public function getDescription() {
|
|
$html = '<div class="dgwt-wcas-admin-menu-item-desc js-dgwt-wcas-admin-menu-item-desc">';
|
|
$html .= '<img class="" src="' . DGWT_WCAS_URL . 'assets/img/logo-for-review.png" width="32" height="32" />';
|
|
$html .= '<span>' . __( 'FiboSearch bar will be displayed here.', 'ajax-search-for-woocommerce' ) . '</span>';
|
|
$html .= '</div>';
|
|
|
|
return $html;
|
|
}
|
|
|
|
public function getLayoutOptions() {
|
|
return array(
|
|
'default' => __( 'Default', 'ajax-search-for-woocommerce' ),
|
|
'classic' => __( 'Search bar', 'ajax-search-for-woocommerce' ),
|
|
'icon' => __( 'Search icon', 'ajax-search-for-woocommerce' ),
|
|
'icon-flexible' => __( 'Icon on mobile, search bar on desktop', 'ajax-search-for-woocommerce' ),
|
|
'icon-flexible-inv' => __( 'Icon on desktop, search bar on mobile', 'ajax-search-for-woocommerce' ),
|
|
);
|
|
}
|
|
|
|
public function navMenuStyle() {
|
|
|
|
if ( ! $this->isNavMenuScreen() ) {
|
|
return;
|
|
}
|
|
wp_enqueue_style( 'wp-color-picker' );
|
|
wp_enqueue_script( 'wp-color-picker' );
|
|
|
|
?>
|
|
<style>
|
|
.dgwt-wcas-admin-menu-item-desc {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: left;
|
|
align-items: center;
|
|
}
|
|
|
|
.dgwt-wcas-admin-menu-item-desc img {
|
|
display: block;
|
|
margin-right: 15px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.dgwt-wcas-description select {
|
|
width: 100%;
|
|
}
|
|
</style>
|
|
|
|
<?php
|
|
|
|
}
|
|
|
|
public function navMenuScripts() {
|
|
|
|
if ( ! $this->isNavMenuScreen() ) {
|
|
return;
|
|
}
|
|
|
|
?>
|
|
<script>
|
|
(function ($) {
|
|
|
|
function replaceLabels($menuItem) {
|
|
|
|
var $menuItems = $('#menu-to-edit .menu-item-title');
|
|
|
|
if ($menuItems.length > 0) {
|
|
|
|
$menuItems.each(function () {
|
|
if ($(this).text() === '<?php echo self::SEARCH_PLACEHOLDER; ?>') {
|
|
|
|
var $menuItem = $(this).closest('.menu-item');
|
|
|
|
$menuItem.find('.menu-item-title').text('FiboSearch bar');
|
|
$menuItem.find('.item-type').text('<?php _e( 'Search bar', 'ajax-search-for-woocommerce' ); ?>');
|
|
$menuItem.find('.menu-item-settings .edit-menu-item-title').closest('label').hide();
|
|
$menuItem.find('.field-url').hide();
|
|
|
|
|
|
if ($menuItem.find('.js-dgwt-wcas-admin-menu-item-desc').length == 0) {
|
|
$menuItem.find('.menu-item-settings').prepend('<?php echo $this->getDescription(); ?>');
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
function colorPickers() {
|
|
var $colorPickers = $('.dwgt-wcas-color-picker');
|
|
if ($colorPickers.length > 0) {
|
|
$colorPickers.wpColorPicker();
|
|
}
|
|
}
|
|
|
|
function toggleColorPicker(el) {
|
|
var layout = el.val();
|
|
if (layout === 'default' || layout === 'classic') {
|
|
el.closest('.dgwt-wcas-description').next().slideUp();
|
|
} else {
|
|
el.closest('.dgwt-wcas-description').next().slideDown();
|
|
}
|
|
}
|
|
|
|
function syncColorPickersWithSelects() {
|
|
var layoutSelects = $('.dgwt-wcas-layout-select');
|
|
if (layoutSelects.length > 0) {
|
|
layoutSelects.each(function (i, el) {
|
|
toggleColorPicker($(el));
|
|
});
|
|
}
|
|
}
|
|
|
|
$(document).ready(function () {
|
|
|
|
replaceLabels();
|
|
colorPickers()
|
|
syncColorPickersWithSelects();
|
|
|
|
});
|
|
|
|
$(document).on('change', '.dgwt-wcas-layout-select', function (e) {
|
|
toggleColorPicker($(this))
|
|
});
|
|
|
|
$(document).ajaxComplete(function (event, request, settings) {
|
|
|
|
if (
|
|
typeof settings != 'undefined'
|
|
&& typeof settings.data == 'string'
|
|
&& settings.data.indexOf('action=add-menu-item') !== -1
|
|
&& settings.data.indexOf('dgwt_wcas_search_box') !== -1
|
|
) {
|
|
replaceLabels();
|
|
colorPickers();
|
|
syncColorPickersWithSelects();
|
|
|
|
setTimeout(function () {
|
|
replaceLabels();
|
|
colorPickers();
|
|
syncColorPickersWithSelects();
|
|
}, 500)
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}(jQuery));
|
|
</script>
|
|
|
|
<?php
|
|
|
|
}
|
|
|
|
}
|