<?php

function gtm_render_block_mega_menu( $attributes, $content, $block ) {
	$wrapper_attributes = get_block_wrapper_attributes( ['class' => ''] );
	$inner_html         = '';

	$inner_html .= '<div class="wp-block-gtm-mega-menu__container" role="menubar">';

	foreach ( $block->inner_blocks as $inner_block ) {
		$inner_html .= $inner_block->render();
	}

	$inner_html .= '</div>';

	return sprintf(
		'<nav %1$s>%2$s</nav>',
		$wrapper_attributes,
		$inner_html
	);
}

/**
 * Registers the `gtm/mega-menu` block on the server.
 */
function gtm_register_block_mega_menu() {
	gtm_register_block_type( 'mega-menu', [
		'render_callback' => 'gtm_render_block_mega_menu',
	] );
}

add_action( 'init', 'gtm_register_block_mega_menu', 20 );

add_filter( 'gtm.BlockStyleCompiler.gtm/mega-menu', 'gtm_compile_block_css_mega_menu', 10, 3 );
function gtm_compile_block_css_mega_menu( $output, $attributes, $blockName ) {
	$block_style = ['classes' => [], 'style' => []];

	$block_style['classes'][] = 'gtm-block';

	if ( $attributes['topLevelMenuJustify'] ) {
		$block_style['classes'][] = "gtm-has-top-level-menu-justify-{$attributes['topLevelMenuJustify']}";
	}

	// Fixed class for extendability
	$block_style['classes'][] = 'gtm-has-flow-horizontal';

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-gap", gtm_css_parseSpacingValue( $attributes['topLevelGap'] ) );

	/* Top-level Link appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-link-radius", gtm_css_parseBorderRadiusValue( $attributes['topLevelLinkRadius'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-link-padding", gtm_css_parseResponsiveBoxProps( $attributes['topLevelLinkPadding'] ) );

	/* Top-level Icon appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-icon-size", $attributes['topLevelIconSize'] );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-icon-spacing", gtm_css_parseSpacingValue( $attributes['topLevelIconSpacing'] ) );

	/* Top-level Label appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-label-typography", gtm_css_parseTypographyProps( $attributes['topLevelLabelTypography'] ) );

	/* Top-level Description appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-description-spacing", gtm_css_parseSpacingValue( $attributes['topLevelDescriptionSpacing'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-description-typography", gtm_css_parseTypographyProps( $attributes['topLevelDescriptionTypography'] ) );

	/* Top-level Colors */

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-icon-color", gtm_css_parseColorValue( $attributes['topLevelIconColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-label-color", gtm_css_parseColorValue( $attributes['topLevelLabelColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-description-color", gtm_css_parseColorValue( $attributes['topLevelDescriptionColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-link-bg", gtm_css_parseColorValue( $attributes['topLevelLinkBg'] ) );

	/* Top-level Hover colors */

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-icon-hover-color", gtm_css_parseColorValue( $attributes['topLevelIconHoverColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-label-hover-color", gtm_css_parseColorValue( $attributes['topLevelLabelHoverColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-description-hover-color", gtm_css_parseColorValue( $attributes['topLevelDescriptionHoverColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-top-level-link-hover-bg", gtm_css_parseColorValue( $attributes['topLevelLinkHoverBg'] ) );

	/* Sub-level Link appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-link-radius", gtm_css_parseBorderRadiusValue( $attributes['subLevelLinkRadius'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-link-padding", gtm_css_parseResponsiveBoxProps( $attributes['subLevelLinkPadding'] ) );

	/* Sub-level Icon appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-icon-size", $attributes['subLevelIconSize'] );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-icon-spacing", gtm_css_parseSpacingValue( $attributes['subLevelIconSpacing'] ) );

	/* Sub-level Label appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-label-typography", gtm_css_parseTypographyProps( $attributes['subLevelLabelTypography'] ) );

	/* Sub-level Description appearance */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-description-spacing", gtm_css_parseSpacingValue( $attributes['subLevelDescriptionSpacing'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-description-typography", gtm_css_parseTypographyProps( $attributes['subLevelDescriptionTypography'] ) );

	/* Sub-level Colors */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-icon-color", gtm_css_parseColorValue( $attributes['subLevelIconColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-label-color", gtm_css_parseColorValue( $attributes['subLevelLabelColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-description-color", gtm_css_parseColorValue( $attributes['subLevelDescriptionColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-link-bg", gtm_css_parseColorValue( $attributes['subLevelLinkBg'] ) );

	/* Sub-level Hover colors */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-icon-hover-color", gtm_css_parseColorValue( $attributes['subLevelIconHoverColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-label-hover-color", gtm_css_parseColorValue( $attributes['subLevelLabelHoverColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-description-hover-color", gtm_css_parseColorValue( $attributes['subLevelDescriptionHoverColor'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-link-hover-bg", gtm_css_parseColorValue( $attributes['subLevelLinkHoverBg'] ) );

	/* Sub-menu */

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-menu-width", $attributes['subLevelMenuWidth'] );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-menu-radius", gtm_css_parseBorderRadiusValue( $attributes['subLevelMenuRadius'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-menu-padding", gtm_css_parseResponsiveBoxProps( $attributes['subLevelMenuPadding'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-menu-shadow", gtm_css_parseShadowValue( $attributes['subLevelMenuShadow'] ) );

	gtm_css_compileCssVar( $block_style, "mega-menu-sub-level-menu-bg", gtm_css_parseColorValue( $attributes['subLevelMenuBg'] ) );

	// Apply to output
	$block_style['style'] = ['{{BLOCK}}' => $block_style['style']];

	return [
		'classes' => array_merge( $output['classes'], $block_style['classes'] ),
		'style'   => array_replace_recursive( $output['style'], $block_style['style'] ),
	];
}