<?php
/**
 * Welcome Page Class
 */

// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) ) exit;

/**
 * Activation Hook
 */
function meridian_one_on_activation() {
	set_transient( '_meridian_one_activation_redirect', true, 60 );
} add_action( 'after_switch_theme', 'meridian_one_on_activation' );

/**
 * Meridian_One_Welcome Class
 *
 * @since 1.0
 */
class Meridian_One_Welcome {

	/**
	 * Get things started
	 *
	 * @since 1.0
	 */
	public function __construct() {
		add_action( 'admin_menu', array( $this, 'admin_menus') );
		add_action( 'admin_head', array( $this, 'admin_head' ) );
		add_action( 'admin_init', array( $this, 'welcome'    ) );
	}

	/**
	 * Register dashboard pages
	 *
	 * @since 1.0
	 */
	public function admin_menus() {

		// Getting Started Page
		add_theme_page(
			esc_html__( 'Getting started with Meridian One', 'meridian-one' ),
			esc_html__( 'Theme Welcome', 'meridian-one' ),
			'manage_options',
			'meridian-one-getting-started',
			array( $this, 'getting_started_screen' )
		);

	}

	/**
	 * Hide dashboard pages and add some CSS
	 *
	 * @since 1.0
	 */
	public function admin_head() {
		
		?>
		<style type="text/css" media="screen">
		/*<![CDATA[*/

		.mt-welcome .feature-section {
			margin-bottom: 0;
			padding-bottom: 0;
		}

		.about-wrap .feature-section p {
			margin-left: 0;
		}

		.mt-welcome * {
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}

		.mt-welcome .changelog h3 {
			margin-bottom: 5px;
		}

		.mt-welcome-form,
		.mt-plugins {
			width: 100%;
			border: 1px solid #e5e5e5;
			border-left: 4px solid #46b450;
			-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.04);
			box-shadow: 0 1px 1px rgba(0,0,0,.04);
			background: #fff;
			padding: 20px;
		}

			.mt-importer p,
			.mt-welcome-form p,
			.mt-plugins p {
				font-size: 13px;
				line-height: 1.5;
				margin: 0 !important;
				margin-bottom: 10px !important;
			}

			.mt-welcome .changelog {
				float: left;
				width: 50%;
				padding-right: 50px;
			}

			.mt-welcome .changelog.changelog-1-3 {
				float: left;
				width: 33.33%;
				padding-right: 50px;
			}

				.mt-welcome-form-errors {
					font-size: 12px;
					border: 1px dashed #d24d4d; 
					padding: 10px;
					margin-bottom: 15px;
				}

					.mt-welcome-form-errors ul {
						margin: 0;
					}

				.mt-welcome-form-success {
					font-size: 12px;
					border: 1px dashed #4dd282; 
					padding: 10px;
				}

				.mt-welcome-form-row {
					margin-bottom: 15px;
				}

					.mt-welcome-form-row input[type="text"],
					.mt-welcome-form-row input[type="email"] {
						width: 100%;
					}

			.mt-welcome-upsell {
				border: 2px dashed #0085ba;
				padding: 20px;
			}

				.mt-welcome-upsell ul {
					list-style-type: disc;
					list-style-position: inside;
					margin-left: 10px;
					font-size: 14px;
				}

			.free-vs-pro {
				margin-top: 40px;
			}

				.free-vs-pro-table {
					width: 100%;
				}

					.free-vs-pro-table thead {

					}

						.free-vs-pro-table thead th {
							padding-bottom: 20px;
						}

					.free-vs-pro-table tbody {

					}

						.free-vs-pro-table tbody td {
							border-top: 1px solid #ccc;
						}

						.free-vs-pro-table tbody td:nth-child(2),
						.free-vs-pro-table tbody td:nth-child(3) {
							text-align: center;
						}

						.free-vs-pro-table tbody tr:last-child td {
							padding-top: 20px;
						}

							.free-vs-pro-table h3 {
								font-size: 16px !important;
								font-weight: bold;
								margin-bottom: 15px !important;
							}

							.free-vs-pro-table .dashicons-before:before {
								font-size: 24px;
								width: 24px;
								height: 24px;
							}

							.free-vs-pro-table .dashicons-yes {
								color: green;
							}

							.free-vs-pro-table .dashicons-no-alt {
								color: red;
							}

		/*]]>*/
		</style>
		<?php
	}

	/**
	 * Navigation
	 *
	 * @since 1.0
	 */
	public function tabs() {

		$selected = isset( $_GET['tab'] ) ? $_GET['tab'] : 'meridian-one-getting-started';
		?>
		<h2 class="nav-tab-wrapper">
			<a class="nav-tab <?php echo $selected == 'meridian-one-getting-started' ? 'nav-tab-active' : ''; ?>" href="<?php echo esc_url( admin_url( add_query_arg( array( 'page' => 'meridian-one-getting-started' ), 'themes.php' ) ) ); ?>">
				<?php esc_html_e( 'Welcome', 'meridian-one' ); ?>
			</a>
			<a class="nav-tab <?php echo $selected == 'free-vs-pro' ? 'nav-tab-active' : ''; ?>" href="<?php echo esc_url( admin_url( add_query_arg( array( 'page' => 'meridian-one-getting-started', 'tab' => 'free-vs-pro' ), 'themes.php' ) ) ); ?>">
				<?php esc_html_e( 'Free vs PLUS', 'meridian-one' ); ?>
			</a>
		</h2>
		<?php

	}

	/**
	 * Getting started page
	 *
	 * @since 1.0
	 */
	public function getting_started_screen() {

		$selected = isset( $_GET['tab'] ) ? $_GET['tab'] : 'meridian-one-getting-started';		
		$theme = wp_get_theme();
		$theme_ver = $theme->get( 'Version' );
		?>

		<div class="wrap about-wrap mt-welcome">

			<h1><?php printf( esc_html__( 'Welcome to Meridian One %s', 'meridian-one' ), $theme_ver ); ?></h1>

			<div class="about-text"><?php esc_html_e( 'Thank you for using Meridian One! We hope you will enjoy it and build awesome stuff with it.', 'meridian-one' ); ?></div>

			<?php $this->tabs(); ?>
	
			<?php if ( $selected == 'meridian-one-getting-started' ) : ?>

				<div class="changelog">

					<h3><?php esc_html_e( 'Plugins', 'meridian-one' ); ?></h3>

					<p><?php esc_html_e( 'This theme requires some plugins for full functionality. The first step should be installing those plugins.', 'meridian-one' ); ?></p>

					<div class="mt-plugins">
						<?php do_action( 'meridian_one_plugins' ); ?>
					</div><!-- .mt-plugins -->

				</div>

				<div class="changelog">

					<h3><?php esc_html_e( 'Demo Importer', 'meridian-one' );?></h3>

					<div class="feature-section">

						<p><?php esc_html_e( 'The importer will import the content you\'ve seen on the demo. It is not required, you can manually create the content if you want.', 'meridian-one' ); ?></p>

						<?php meridian_one_importer_display(); ?>

					</div><!-- .feature-section -->

				</div><!-- .changelog -->

				<div class="changelog clear">

					<h3><?php esc_html_e( 'Documentation & Changelog', 'meridian-one' );?></h3>

					<div class="feature-section">

						<p><?php esc_html_e( 'Usage documentation and changelogs can be found at', 'meridian-one' ); ?> <a target="_blank" href="http://docs.meridianthemes.net/category/118-meridian-one">docs.meridianthemes.net</a></p>					

					</div><!-- .feature-section -->

				</div><!-- .changelog -->

			<?php elseif ( $selected == 'free-vs-pro' ) : ?>

				<div class="free-vs-pro">

					<table class="free-vs-pro-table">
						<thead>
							<tr>
								<th></th>
								<th><?php esc_html_e( 'Free', 'meridian-one' ); ?></th>
								<th><?php esc_html_e( 'PLUS', 'meridian-one' ); ?></th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Mobile Friendly', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Fully responsive layout, works on all devices.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'WooCommerce Compatible', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Build an online store.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'WooCommerce Restyled', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Improved looks of WooCommerce pages and elements.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Reorder Homepage Sections', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Ability to change the order of the homepage sections.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Homepage Slider Section', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Images slider section with call to actions buttons.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Homepage Portfolio Section', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Showcase your projects on the homepage.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Homepage Pricing Section', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Show a pricing table on the homepage.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Styling Options', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Ability to change the colors and typography for the theme.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Change Footer Copyright', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'Option in the Customizer to change the footer copyright text.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td>
									<h3><?php esc_html_e( 'Priority Support', 'meridian-one' ); ?></h3>
									<p><?php esc_html_e( 'If you run into any issues or have any questions we\'ll sort them out.', 'meridian-one' ); ?></p>
								</td>
								<td><span class="dashicons-before dashicons-no-alt"></span></td>
								<td><span class="dashicons-before dashicons-yes"></span></td>
							</tr>
							<tr>
								<td></td>
								<td colspan="2"><a href="https://meridianthemes.net/themes/meridian-one-plus/" target="_blank" class="button button-primary button-hero"><?php esc_html_e( 'Upgrade to PLUS', 'meridian-one' ); ?></a></td>
							</tr>
						</tbody>
					</table>

				</div><!-- .changelog -->

			<?php endif; ?>

		</div>
			
		<?php

	}

	/**
	 * Redirect the user to the welcome screen
	 *
	 * @since 1.0
	 */
	public function welcome() {

		// Bail if no activation redirect
		if ( ! get_transient( '_meridian_one_activation_redirect' ) )
			return;

		// Delete the redirect transient
		delete_transient( '_meridian_one_activation_redirect' );

		// Bail if activating from network, or bulk
		if ( is_network_admin() || isset( $_GET['activate-multi'] ) )
			return;

		wp_safe_redirect( esc_url( admin_url( 'themes.php?page=meridian-one-getting-started' ) ) ); exit;

	}

}

new Meridian_One_Welcome();
