<?php
if ( ! defined( 'ABSPATH' ) ) exit;

if ( ! get_option( '_wpcb_setup_run' ) ) {
	update_option( '_wpcb_setup_run', '1' );
}
?>
<div class="wpcb-page-welcome">
	<div class="wpcb-page-container">
		<div class="wpcb-page-header">
			<h1><?php esc_attr_e( 'WCB | WP Configurator Builder - Product Configurators Made Simple', 'wcb-configurator-builder' ); ?></h1>
			<p><?php esc_attr_e( 'We welcome you to our product configurator builder plugin for WordPress and WooCommerce. On this page you will find some quick links to help you get started.', 'wcb-configurator-builder' ); ?></p>
			<?php if ( ! wpcb_fs()->is_plan_or_trial( 'pro' ) ) : ?>
				<a href="<?php echo esc_url( wpcb_fs()->get_trial_url() ); ?>" class="wpcb-button">
					<?php esc_attr_e( 'Start 14-day free trial', 'wcb-configurator-builder' ); ?>
				</a>
			<?php endif; ?>
		</div>
		<div class="wpcb-page-actions">
			<div class="wpcb-page-action">
				<div class="wpcb-page-action-text">
					<h2><?php esc_attr_e( '1. Create fields', 'wcb-configurator-builder' ); ?></h2>
					<p><?php esc_attr_e( 'Create the field options and inputs to include in your configurator form.', 'wcb-configurator-builder' ); ?></p>
					<a href="<?php echo esc_url( admin_url( 'edit.php?post_type=wpcb_choice' ) ); ?>" class="wpcb-button wpcb-button-outline">
						<?php esc_attr_e( 'Add choices', 'wcb-configurator-builder' ); ?>
					</a>
					<a href="<?php echo esc_url( admin_url( 'edit.php?post_type=wpcb_input' ) ); ?>" class="wpcb-button wpcb-button-outline">
						<?php esc_attr_e( 'Add inputs', 'wcb-configurator-builder' ); ?>
					</a>
				</div>
				<div class="wpcb-page-action-image">
					<img src="<?php echo esc_url( WPCB_BASE_URL ); ?>/admin/img/choices.png" alt="Configuration choices" width="473" height="302">
				</div>
			</div>
			<div class="wpcb-page-action">
				<div class="wpcb-page-action-text">
					<h2><?php esc_attr_e( '2. Build the configuration form', 'wcb-configurator-builder' ); ?></h2>
					<p><?php esc_attr_e( 'Build the configuration form using the newly created options and inputs. Choose when to display the configurator form and you are good to go!', 'wcb-configurator-builder' ); ?></p>
					<a href="<?php echo esc_url( admin_url( 'edit.php?post_type=wpcb_configuration' ) ); ?>" class="wpcb-button wpcb-button-outline">
						<?php esc_attr_e( 'Add configurator form', 'wcb-configurator-builder' ); ?>
					</a>
				</div>
				<div class="wpcb-page-action-image">
					<img src="<?php echo esc_url( WPCB_BASE_URL ); ?>/admin/img/blocks.png" alt="Configuration blocks" width="473" height="302">
				</div>
			</div>
			<div class="wpcb-page-action">
				<div class="wpcb-page-action-text">
					<h2><?php esc_attr_e( '3. Upload visuals', 'wcb-configurator-builder' ); ?></h2>
					<p><?php esc_attr_e( 'Finally, link the visuals to the configuration options to create a stunning visual representation of the selected configuration', 'wcb-configurator-builder' ); ?></p>
					<a href="<?php echo esc_url( admin_url( 'edit.php?post_type=wpcb_visual' ) ); ?>" class="wpcb-button wpcb-button-outline">
						<?php esc_attr_e( 'Link visuals', 'wcb-configurator-builder' ); ?>
					</a>
				</div>
				<div class="wpcb-page-action-image">
					<img src="<?php echo esc_url( WPCB_BASE_URL ); ?>/admin/img/visuals.png" alt="Configuration visuals" width="473" height="302">
				</div>
			</div>
		</div>
		<div class="wpcb-page-links">
			<a href="https://www.youtube.com/watch?v=zEhOnDEhTWE" target="_blank" class="wpcb-page-link">
				<svg width="24" height="24" fill="#266DC0" viewBox="0 0 24 24"><path d="m20,3H4c-1.1,0-2,.9-2,2v14c0,1.1.9,2,2,2h16c1.1,0,2-.9,2-2V5c0-1.1-.9-2-2-2Zm-10.46,6l-2.67-4h2.6l2.67,4h-2.6Zm5,0l-2.67-4h2.6l2.67,4h-2.6ZM4,5h.46l2.67,4h-3.13v-4Zm0,14v-8h16v-2h-.46l-2.67-4h3.13v14s-16,0-16,0Z"></path><path d="M10 18 15 15 10 12 10 18z"></path></svg>
				<strong><?php esc_attr_e( 'Watch the video', 'wcb-configurator-builder' ); ?></strong>
				<p><?php esc_attr_e( 'Not sure how to start? Watch our getting started video on Youtube', 'wcb-configurator-builder' ); ?></p>
			</a>
			<a href="https://wpconfiguratorbuilder.com/docs/" target="_blank" class="wpcb-page-link">
				<svg width="24" height="24" fill="#266DC0" viewBox="0 0 24 24"><path d="M5 7h5v6H5zM5 15h10v2H5zM12 11h3v2h-3zM12 7h3v2h-3z"></path><path d="M21 18c0 .55-.45 1-1 1s-1-.45-1-1V5c0-1.1-.9-2-2-2H3c-1.1 0-2 .9-2 2v13c0 1.65 1.35 3 3 3h16c1.65 0 3-1.35 3-3V6h-2zM4 19c-.55 0-1-.45-1-1V5h14v13c0 .35.07.69.18 1z"></path></svg>
				<strong><?php esc_attr_e( 'Check our docs', 'wcb-configurator-builder' ); ?></strong>
				<p><?php esc_attr_e( 'Check out our documentation pages to see how it is done', 'wcb-configurator-builder' ); ?></p>
			</a>
			<a href="https://wpconfiguratorbuilder.com/faq/" target="_blank" class="wpcb-page-link">
				<svg width="24" height="24" fill="#266DC0" viewBox="0 0 24 24"><path d="M11 15H13V17H11z"></path><path d="m9.53,8.03c-.66.66-1.03,1.54-1.03,2.47h2c0-.4.16-.78.44-1.06.57-.57,1.55-.57,2.12,0,.28.28.44.66.44,1.06s-.16.78-.44,1.06-.66.44-1.06.44c-.55,0-1,.45-1,1v1h2v-.14c.55-.16,1.06-.46,1.47-.88.66-.66,1.03-1.54,1.03-2.47s-.36-1.81-1.03-2.47c-1.32-1.32-3.63-1.32-4.95,0Z"></path><path d="m12,2C6.49,2,2,6.49,2,12c0,2.12.68,4.19,1.93,5.9l-1.75,2.53c-.21.31-.24.7-.06,1.03.17.33.51.54.89.54h9c5.51,0,10-4.49,10-10S17.51,2,12,2Zm0,18h-7.09l1.09-1.57c.26-.37.23-.88-.06-1.22-1.25-1.45-1.93-3.3-1.93-5.21,0-4.41,3.59-8,8-8s8,3.59,8,8-3.59,8-8,8Z"></path></svg>
				<strong><?php esc_attr_e( 'Read the FAQ', 'wcb-configurator-builder' ); ?></strong>
				<p><?php esc_attr_e( 'Have questions? No worries, we have answers listed on our faq page', 'wcb-configurator-builder' ); ?></p>
			</a>
		</div>
	</div>
</div>