<?php
/**
 * Workshop list — one combined list, past events badged, "show more" reveal.
 *
 * Renders the site's saved Kadence query (so the cards are the native design)
 * and adds only the chrome around it:
 *   - a "Past" badge on finished events, via the `workshop-status-past` class
 *     WordPress already puts on every card through post_class()
 *   - the list capped to a few items until "Show more" is pressed
 *
 * Ordering comes from the `_aisv_sort_key` meta written in workshop-status.php:
 * upcoming soonest-first, then past most-recent-first.
 *
 * Usage: [aisv_workshop_list]  (optional: initial="6" query="28571")
 *
 * @package kadence-child
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

/**
 * Render one of the site's saved Kadence queries by its post ID.
 *
 * @param int    $query_id kadence_query post ID.
 * @param string $uid      Unique id for this block instance.
 * @return string
 */
function aisv_render_kadence_query( $query_id, $uid ) {
	$query_id = (int) $query_id;
	if ( ! $query_id || 'kadence_query' !== get_post_type( $query_id ) ) {
		return '';
	}
	return (string) render_block(
		array(
			'blockName'    => 'kadence/query',
			'attrs'        => array( 'uniqueID' => $uid, 'id' => $query_id ),
			'innerBlocks'  => array(),
			'innerHTML'    => '',
			'innerContent' => array(),
		)
	);
}

/**
 * [aisv_workshop_list]
 */
function aisv_workshop_list_shortcode( $atts ) {
	$atts = shortcode_atts(
		array(
			'query'   => 28571,
			'initial' => 6,
			'badge'   => __( 'Past', 'kadence-child' ),
			'more'    => __( 'Show more', 'kadence-child' ),
			'less'    => __( 'Show less', 'kadence-child' ),
		),
		$atts,
		'aisv_workshop_list'
	);

	$initial = max( 1, (int) $atts['initial'] );
	$inst    = wp_unique_id( 'aisv-wl-' );
	$html    = aisv_render_kadence_query( $atts['query'], $inst . '-q' );

	if ( '' === trim( $html ) ) {
		return '';
	}

	// How many cards actually rendered — decides whether a button is needed at all.
	$total  = preg_match_all( '/<li[^>]*\bkb-query-item\b/', $html );
	$hidden = max( 0, $total - $initial );

	ob_start();
	?>
	<div class="aisv-wlist" id="<?php echo esc_attr( $inst ); ?>"
		data-expanded="0"
		data-initial="<?php echo esc_attr( $initial ); ?>"
		data-more="<?php echo esc_attr( $atts['more'] ); ?>"
		data-less="<?php echo esc_attr( $atts['less'] ); ?>"
		style="--aisv-initial:<?php echo (int) $initial; ?>;--aisv-badge:'<?php echo esc_attr( $atts['badge'] ); ?>'">
		<div class="aisv-wlist__items" id="<?php echo esc_attr( $inst ); ?>-items">
			<?php echo $html; // phpcs:ignore WordPress.Security.EscapeOutput ?>
		</div>
		<?php if ( $hidden > 0 ) : ?>
			<div class="aisv-wlist__actions">
				<button type="button" class="aisv-wlist__more"
					aria-expanded="false" aria-controls="<?php echo esc_attr( $inst ); ?>-items">
					<span class="aisv-wlist__more-text"><?php echo esc_html( $atts['more'] ); ?></span>
					<span class="aisv-wlist__more-count"><?php echo (int) $hidden; ?></span>
				</button>
			</div>
		<?php endif; ?>
	</div>
	<?php
	return (string) ob_get_clean();
}
add_shortcode( 'aisv_workshop_list', 'aisv_workshop_list_shortcode' );

/**
 * Chrome only. Cards beyond the initial count are hidden with CSS that is scoped
 * to a JS-marked container, so with JavaScript off the whole list stays readable.
 */
function aisv_workshop_list_assets() {
	$css = '
.aisv-wlist li.kb-query-item{position:relative}
.aisv-wlist li.kb-query-item.workshop-status-past::before{
 content:var(--aisv-badge,"Past");position:absolute;top:.85rem;left:.85rem;z-index:6;
 padding:.32em .75em;border-radius:999px;pointer-events:none;
 background:var(--global-palette3,#23263b);color:var(--global-palette9,#fff);
 font-size:.68rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;line-height:1.6;
 box-shadow:0 1px 6px rgba(0,0,0,.18)}
.aisv-wlist li.kb-query-item.workshop-status-past .kb-query-item-flip-back,
.aisv-wlist li.kb-query-item.workshop-status-past img{opacity:.92}
.aisv-wlist__actions{display:flex;justify-content:center;margin-top:2rem}
.aisv-wlist__more{display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;
 padding:.8rem 1.6rem;border-radius:999px;font:inherit;font-weight:600;line-height:1;
 color:var(--global-palette1,#1f2aa8);background:transparent;
 border:2px solid var(--global-palette1,#1f2aa8);
 transition:background .15s ease,color .15s ease}
.aisv-wlist__more:hover{background:var(--global-palette1,#1f2aa8);color:var(--global-palette9,#fff)}
.aisv-wlist__more:focus-visible{outline:2px solid var(--global-palette1,#1f2aa8);outline-offset:3px}
.aisv-wlist__more-count{display:inline-block;min-width:1.6em;padding:.15em .5em;border-radius:999px;
 background:var(--global-palette7,#eee);color:var(--global-palette4,#444);font-size:.78em;font-weight:700;text-align:center}
.aisv-wlist__more:hover .aisv-wlist__more-count{background:rgba(255,255,255,.22);color:inherit}
.aisv-wlist[data-expanded="1"] .aisv-wlist__more-count{display:none}
';
	$js = '
(function(){
  function init(root){
    var initial=parseInt(root.getAttribute("data-initial"),10)||6;
    var items=[].slice.call(root.querySelectorAll("li.kb-query-item"));
    var btn=root.querySelector(".aisv-wlist__more");
    // Hide the overflow in JS (not CSS nth-child) so the count is always exact.
    function apply(expanded){
      items.forEach(function(li,i){
        if(!expanded && i>=initial){ li.setAttribute("hidden",""); }
        else { li.removeAttribute("hidden"); }
      });
      root.setAttribute("data-expanded",expanded?"1":"0");
      if(btn){
        btn.setAttribute("aria-expanded",expanded?"true":"false");
        var t=btn.querySelector(".aisv-wlist__more-text");
        if(t){t.textContent=expanded?root.getAttribute("data-less"):root.getAttribute("data-more");}
      }
    }
    root.setAttribute("data-js","1");
    apply(false);
    if(btn){
      btn.addEventListener("click",function(){
        var expanded=root.getAttribute("data-expanded")==="1";
        apply(!expanded);
        if(expanded){ root.scrollIntoView({behavior:"smooth",block:"start"}); }
        else if(items[initial]){ var f=items[initial].querySelector("a"); if(f){f.focus({preventScroll:true});} }
      });
    }
  }
  function boot(){[].slice.call(document.querySelectorAll(".aisv-wlist")).forEach(init);}
  if(document.readyState!=="loading"){boot();}else{document.addEventListener("DOMContentLoaded",boot);}
})();
';
	wp_register_style( 'aisv-workshop-list', false, array(), '1.0.0' );
	wp_enqueue_style( 'aisv-workshop-list' );
	wp_add_inline_style( 'aisv-workshop-list', $css );

	wp_register_script( 'aisv-workshop-list', '', array(), '1.0.0', true );
	wp_enqueue_script( 'aisv-workshop-list' );
	wp_add_inline_script( 'aisv-workshop-list', $js );
}
add_action( 'wp_enqueue_scripts', 'aisv_workshop_list_assets' );
