<?php
/**
 * Theme Builder shell (layout only; UI is driven by ep-theme-builder.js).
 *
 * @package ElementPack
 */

defined( 'ABSPATH' ) || exit;

use ElementPack\Includes\Builder\Meta;

$tb_cap = get_post_type_object( Meta::POST_TYPE );
if ( ! $tb_cap || ! current_user_can( $tb_cap->cap->edit_posts ) ) {
	return;
}

$table_list_url = admin_url( 'edit.php?post_type=' . Meta::POST_TYPE . '&bdt_tb_list=1' );
$ep_logo_src = add_query_arg( 'ver', (string) BDTEP_VER, BDTEP_URL . 'assets/images/logo.svg' );
?>
<div id="bdt-ep-theme-builder" class="bdt-tb-app" aria-label="<?php echo esc_attr__( 'Theme Builder', 'bdthemes-element-pack' ); ?>">
	<header class="bdt-tb-header">
		<div class="bdt-tb-header__brand">
			<img
				class="bdt-tb-header__logo"
				src="<?php echo esc_url( $ep_logo_src ); ?>"
				width="28"
				height="28"
				alt=""
				decoding="async"
				aria-hidden="true"
			/>
			<span class="bdt-tb-header__title"><?php esc_html_e( 'Theme Builder', 'bdthemes-element-pack' ); ?></span>
		</div>
		<div class="bdt-tb-header__actions">
			<a href="<?php echo esc_url( 'https://bdthemes.com/all-knowledge-base-of-element-pack/' ); ?>" class="bdt-tb-icon-btn" target="_blank" rel="noopener noreferrer" title="<?php esc_attr_e( 'Help', 'bdthemes-element-pack' ); ?>">
				<span class="dashicons dashicons-editor-help"></span>
			</a>
			<span class="bdt-tb-header__sep" aria-hidden="true"></span>
			<a href="<?php echo esc_url( admin_url( 'admin.php?page=element_pack_options' ) ); ?>" class="bdt-tb-icon-btn" title="<?php esc_attr_e( 'Close', 'bdthemes-element-pack' ); ?>">
				<span class="dashicons dashicons-no-alt"></span>
			</a>
		</div>
	</header>

	<div class="bdt-tb-layout">
		<aside class="bdt-tb-sidebar" id="bdt-tb-sidebar" aria-label="<?php esc_attr_e( 'Site parts', 'bdthemes-element-pack' ); ?>"></aside>

		<div class="bdt-tb-main">
			<section id="bdt-tb-panel-grid" class="bdt-tb-panel bdt-tb-panel--grid">
				<div class="bdt-tb-panel__head">
					<h1 class="bdt-tb-panel__title" id="bdt-tb-main-title"></h1>
					<button type="button" class="bdt-tb-add-new-btn" id="bdt-tb-add-new">
						<span class="bdt-tb-add-new-btn__circle" aria-hidden="true">
							<span class="dashicons dashicons-plus-alt2"></span>
						</span>
						<span class="bdt-tb-add-new-btn__text" id="bdt-tb-add-new-label"></span>
					</button>
				</div>
				<hr class="bdt-tb-sep" />
				<div id="bdt-tb-template-grid" class="bdt-tb-template-grid"></div>
			</section>

			<section id="bdt-tb-panel-add-new" class="bdt-tb-panel bdt-tb-panel--add-new" hidden>
				<button type="button" class="bdt-tb-back" id="bdt-tb-add-new-back"></button>
				<div class="bdt-tb-add-new__head">
					<h1 class="bdt-tb-panel__title bdt-tb-add-new__title" id="bdt-tb-add-new-heading"></h1>
				</div>
				<div id="bdt-tb-add-new-grid" class="bdt-tb-add-new-grid" role="list"></div>
			</section>

			<section id="bdt-tb-panel-conditions" class="bdt-tb-panel bdt-tb-panel--conditions" hidden>
				<button type="button" class="bdt-tb-back" id="bdt-tb-conditions-back"></button>
				<div class="bdt-tb-conditions__hero">
					<div class="bdt-tb-conditions__illu" aria-hidden="true">
						<i class="eicon-theme-builder"></i>
					</div>
					<h1 class="bdt-tb-conditions__title" id="bdt-tb-conditions-title"></h1>
					<p class="bdt-tb-conditions__desc" id="bdt-tb-conditions-desc"></p>
				</div>
				<div id="bdt-tb-conditions-rows" class="bdt-tb-conditions-rows"></div>
				<button type="button" class="bdt-tb-btn bdt-tb-btn--secondary" id="bdt-tb-add-condition"></button>
			</section>

			<footer class="bdt-tb-footer">
				<a href="<?php echo esc_url( $table_list_url ); ?>" class="bdt-tb-footer__link"><?php esc_html_e( 'Switch to table view', 'bdthemes-element-pack' ); ?></a>
				<div class="bdt-tb-footer__conditions" id="bdt-tb-footer-conditions" hidden>
					<button type="button" class="bdt-tb-btn bdt-tb-btn--primary" id="bdt-tb-save-conditions"></button>
				</div>
			</footer>
		</div>
	</div>

	<div id="bdt-tb-license-popover-root" class="bdt-tb-license-popover-root" hidden aria-hidden="true">
		<div class="bdt-tb-license-popover__backdrop" data-bdt-tb-license-dismiss="1" tabindex="-1"></div>
		<div
			id="bdt-tb-license-popover"
			class="bdt-tb-license-popover"
			role="dialog"
			aria-modal="false"
			aria-labelledby="bdt-tb-license-popover-title"
			aria-describedby="bdt-tb-license-popover-desc"
		>
			<div class="bdt-tb-license-popover__card">
				<div class="bdt-tb-license-popover__head">
					<span class="bdt-tb-license-popover__lock" aria-hidden="true">
						<span class="dashicons dashicons-lock"></span>
					</span>
					<h3 id="bdt-tb-license-popover-title" class="bdt-tb-license-popover__title"></h3>
				</div>
				<p id="bdt-tb-license-popover-desc" class="bdt-tb-license-popover__desc"></p>
				<div class="bdt-tb-license-popover__actions">
					<a href="#" class="bdt-tb-license-popover__btn bdt-tb-license-popover__btn--primary" id="bdt-tb-license-popover-license"></a>
					<a href="#" class="bdt-tb-license-popover__btn bdt-tb-license-popover__btn--outline" id="bdt-tb-license-popover-pricing" target="_blank" rel="noopener noreferrer"></a>
					<button type="button" class="bdt-tb-license-popover__btn bdt-tb-license-popover__btn--ghost" id="bdt-tb-license-popover-dismiss"></button>
				</div>
			</div>
		</div>
	</div>

	<div id="bdt-tb-modal-overlay" class="bdt-tb-modal-overlay" hidden>
		<div class="bdt-tb-modal-backdrop" data-bdt-tb-modal-close tabindex="-1"></div>
		<div class="bdt-tb-modal-center">
			<div id="bdt-tb-dialog-rename" class="bdt-tb-dialog bdt-tb-dialog--form" role="dialog" aria-modal="true" aria-labelledby="bdt-tb-rename-heading" hidden>
				<h2 id="bdt-tb-rename-heading" class="bdt-tb-dialog__title"></h2>
				<div class="bdt-tb-dialog__body">
					<label class="screen-reader-text" for="bdt-tb-rename-input"><?php esc_html_e( 'Template title', 'bdthemes-element-pack' ); ?></label>
					<input type="text" id="bdt-tb-rename-input" class="bdt-tb-dialog__input" autocomplete="off" />
				</div>
				<div class="bdt-tb-dialog__footer">
					<button type="button" class="bdt-tb-dialog__foot-btn" id="bdt-tb-rename-cancel" data-bdt-tb-modal-close></button>
					<button type="button" class="bdt-tb-dialog__foot-btn bdt-tb-dialog__foot-btn--accent" id="bdt-tb-rename-save"></button>
				</div>
			</div>
			<div id="bdt-tb-dialog-trash" class="bdt-tb-dialog bdt-tb-dialog--confirm" role="dialog" aria-modal="true" aria-labelledby="bdt-tb-trash-heading" hidden>
				<h2 id="bdt-tb-trash-heading" class="bdt-tb-dialog__title"></h2>
				<p id="bdt-tb-trash-message" class="bdt-tb-dialog__message"></p>
				<div class="bdt-tb-dialog__footer">
					<button type="button" class="bdt-tb-dialog__foot-btn" id="bdt-tb-trash-cancel" data-bdt-tb-modal-close></button>
					<button type="button" class="bdt-tb-dialog__foot-btn bdt-tb-dialog__foot-btn--danger" id="bdt-tb-trash-confirm"></button>
				</div>
			</div>
		</div>
	</div>
</div>
