<?php

/**
 * Provide a admin area view for the plugin
 *
 * This file is used to markup the admin-facing aspects of the plugin.
 *
 * @link       https://revivedesignstudios.com
 * @since      1.0.0
 *
 * @package    Rds_Bt50_Scorecard
 * @subpackage Rds_Bt50_Scorecard/admin/partials
 */
?>

<!-- This file should primarily consist of HTML with a little bit of PHP. -->
<div class="bt50-wrap">
	<h2><?php echo esc_html( get_admin_page_title() ); ?></h2>
	<p>Add the [bt50-scorecard] shortcode to a page in order to display the scorecard. The page should have a <i>full-width template that is 960px or wider.</i>

	<?php wp_nonce_field( 'wp_rest' ); ?>

	<form method="POST">
		<div hidden class="option">
			<label for="score_license_key">License Key</label>
			<input type="text" name="score_license_key" id="score_license_key" value="<?php echo $score_license_key; ?>">
		</div>

		<div class="option">
			<label for="score_bt50_api_key">BillTrack50 API Key</label>
			<small>Enter in your API key. Then, <b>click SAVE</b> to pull in your scorecards below. If you do not have an API key <a href="https://www.billtrack50.com/Contact" target="_blank">contact BillTrack50</a>.</small>
			<input type="text" name="score_bt50_api_key" id="score_bt50_api_key" value="<?php echo $score_bt50_api_key; ?>">
			<?php if ($bt50ConnectionValid): ?>
				<span>
					<img src="<?php echo $assetPath ?>green-check.png" width="20" height="20" />
				</span>
			<?php else: ?>
				<span>
					<img src="<?php echo $assetPath ?>black-doughnut.png" width="20" height="20" />
				</span>
			<?php endif; ?>
		</div>

		<?php if ($scorecards_loaded_successfully): ?>
		<div class="option">
			<label for="score_id">Select A BillTrack50 Scorecard</label>
			<small>Choose which of your BillTrack50 scorecards you'd like to display on your website.<br>
						 To update your scorecard, <a href="https://www.billtrack50.com/Login" target="_blank">log into BillTrack50</a>.</small>
			<select name="score_id" id="score_id">
				<?php foreach ($scorecards as $scorecard): ?>
					<option value="<?php echo $scorecard['ScorecardID'] ?>"
					<?php if ($scorecard['ScorecardID']== $score_id){ echo 'selected';} ?>>
						<?php echo $scorecard['ScorecardName'] ?>
					</option>
				<?php endforeach; ?>
			</select>
		</div>
		<?php endif; ?>

		<div class="option">
			<label for="score_header_img">Main Header Image</label>
			<small>Displays as the large background image above the scorecard (behind the Find Your Legislator by Address section.)<br>
						<br><i>Recommended size: 960x300px</i></small>
			<?php arthur_image_uploader( 'score_header_img' );?>
		</div>

		<div class="option">
			<label for="score_header">Scorecard Title</label>
			<small>This H1 heading text displays within the Main Header Image section.<br>
				We recommend matching this title to your WordPress page title.</small>
			<input type="text" name="score_header" id="score_header" value="<?php echo $score_header; ?>" />
		</div>

		<div class="option">
			<label for="score_membership">Members Only Option</label>
			<small>Restrict the number of viewable legislators to 3 unless a user is logged into WordPress.<br>
							Checked = this feature is turned on.<br>
							Unchecked = this feature is turned off.</small>
			<input type="checkbox" name="score_membership" id="score_membership" value="1" <?php checked( $score_membership, 1 )?>/>
		</div>

		<div class="option radio-option">
			<label for="score_type">Scoring Method</label>
			<input type="radio" id="normal" name="score_type" value="normal" <?php checked($score_blendedscore_enabled, false) ?> />
			<label for="normal">Normal</label>
			<input type="radio" id="blended" name="score_type" value="blended" <?php checked($score_blendedscore_enabled, true) ?>/>
			<label for="blended">Blended</label>
		</div>


		<input type="submit" value="Save" class="button button-primary button-large">

		<div id="bt50-scorecard-admin-app"></div>
	</form>

</div>

<?php

/**
 * Load scripts and style sheet for settings page
 */
// function arthur_load_scripts_admin() {
//
// }
// add_action( 'admin_enqueue_scripts', 'arthur_load_scripts_admin' );

/**
 * Image Uploader
 *
 * author: Arthur Gareginyan www.arthurgareginyan.com
 * Modified by Andy Warren - Original here: https://mycyberuniverse.com/integration-wordpress-media-uploader-plugin-options-page.html
 */
function arthur_image_uploader($optionName) {
	// WordPress library
	wp_enqueue_media();
	// Set variables
	$attachmentId = get_option($optionName);
	$default_image = 'https://www.placehold.it/115x115';

	if (empty($attachmentId)) {
		$src = $default_image;
		$value = '';
	} else {
		$image_attributes = wp_get_attachment_image_src($attachmentId, 'full');
		$src = $image_attributes[0];
		$value = $attachmentId;
	}

	// Print HTML field
	echo '
		<div class="upload" style="max-width:400px;">
			<img data-src="' . $default_image . '" src="' . $src . '" style="max-width:100%; height:auto;" />
			<div>
				<input type="hidden" name="' . $optionName . '" id="' . $optionName . '" value="' . $value . '" />
				<button type="button" class="upload_image_button button">' . __('Upload', 'igsosd') . '</button>
				<button type="button" class="remove_image_button button">&times;</button>
			</div>
		</div>
	';
}

/*********
Usage:

Call the function with arthur_image_uploader('igsosd_logo'); and replace the "igsosd_logo" with the name of the option field you're saving to

to retrieve the image in a template file use $igsosdLogo = get_option('igsosd_logo'); then display it with wp_get_attachment_url($igsosdLogo); while making sure to change igsosd_logo in the get_option() call to be what your field name is.

*********/

 ?>
