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

// add_action('admin_init', 'flexyconsent_settings_projectSettingsPage');
// function flexyconsent_settings_projectSettingsPage()
// {
// 	global $flexyconsentSettings;
// 	$pageNameMain = 'projectSettingsPage';
// 	$pageName = flexyconsent_getPageName($pageNameMain);
// 	$sectionName = flexyconsent_getSectionName($pageNameMain);
// }

function flexyconsent_projectSettingsPage()
{
	$pageNameMain = 'projectSettingsPage'; ?>
	<div class="container py-3 flexyconsent-project-settings">
		<div class="row w-100">
			<div class="col-12 text-center">
				<?php flexyconsent_get_top_section(); ?>
			</div>
			<div class="col-12">
				<form action='options.php' method='post' id="<?php echo esc_attr($pageNameMain); ?>" class="d-table mx-auto my-3">
					<?php
					settings_fields($pageNameMain);
					do_settings_sections($pageNameMain);
					$whitelist_tags = array('br' => array());
					?>
					<h3 class="mb-3"><?php esc_html_e("Website Settings", "flexyconsent"); ?></h3>

					<div id="status_section" class="mb-5">
						<h5><?php esc_html_e('Status', 'flexyconsent'); ?>: <span id="status_text" class="fw-light"></span></h5>
						<div class="form-check mt-2">
							<input type="checkbox" class="form-check-input" id="consent_enabled">
							<label class="form-check-label" for="consent_enabled"><?php esc_html_e('Enable Consent Management', 'flexyconsent'); ?></label>
						</div>
					</div>

					<div id="other_settings" class="collapse show">
						<div class="mb-5">
							<h5><?php esc_html_e('Domains', 'flexyconsent'); ?></h5>
							<label for="domains" class="form-label">
								<?php esc_html_e('FlexyConsent only works on domains listed here. Please enter only root domains without "www" or "https://', 'flexyconsent'); ?>
							</label>
							<textarea class="form-control" name="domains" id="domains" rows="5" placeholder="<?php echo esc_attr(str_replace(['[line1]', '[line2]', '[line3]'], ["\nexample1.com", "\nexample2.com", "\nexample3.com"], __('Enter one domain per line [line1][line2][line3]', 'flexyconsent'))); ?>"></textarea>
						</div>

						<div class="mb-5">
							<h5><?php esc_html_e('Cookie Policy', 'flexyconsent'); ?></h5>
							<label for="cookie_policy" class="form-label">
								<?php esc_html_e('Add your cookie policy link here. This link will be shown to users when they click on "Cookie Policy" button in the consent banner.', 'flexyconsent'); ?>
							</label>
							<input type="text" class="form-control" id="cookie_policy" placeholder="<?php esc_attr_e('Enter a URL', 'flexyconsent'); ?>">
						</div>

						<div class="mb-5">
							<h5><?php esc_html_e('Privacy Policy', 'flexyconsent'); ?></h5>
							<label for="privacy_policy" class="form-label">
								<?php esc_html_e('Add your privacy policy link here. This link will be shown to users when they click on "Privacy Policy" button in the consent banner.', 'flexyconsent'); ?>
							</label>
							<input type="text" class="form-control" id="privacy_policy" placeholder="<?php esc_attr_e('Enter a URL', 'flexyconsent'); ?>">
						</div>

						<div class="mb-5">
							<h5><?php esc_html_e('Language', 'flexyconsent'); ?></h5>
							<div class="form-check">
								<label for="select_language" class="form-label mb-0"><?php esc_html_e('Default consent management language for website visitors', 'flexyconsent'); ?></label>
								<select id="select_language" class="form-select" aria-label="Select language"></select>
							</div>

							<div class="form-check">
								<input type="checkbox" class="form-check-input" id="use_client_info_for_language">
								<label class="form-check-label" for="use_client_info_for_language"><?php esc_html_e('Change display language using client location and browser language', 'flexyconsent'); ?></label>
							</div>
						</div>

						<div class="mb-5">
							<div class="d-flex">
								<h5><?php esc_html_e('IAB TCF (Advertising)', 'flexyconsent'); ?></h5>
								<span data-bs-toggle="tooltip" data-bs-placement="top" title='<?php esc_attr_e('This setting allows you to show the IAB Transparency and Consent Framework message beyond GDPR-regulated countries, helping you maintain compliance and maximize ad revenue in other key markets.', 'flexyconsent'); ?>'>
									<i class="fa-solid fa-circle-info ms-1 text-primary"></i>
								</span>
							</div>
							
							<span><?php echo wp_kses(__('The consent message containing IAB TCF vendors and purposes will be shown to visitors from the selected regions.<br>Recommended if your website displays ads.', 'flexyconsent'), $whitelist_tags); ?></span>
							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="advertising_eu">
								<label class="form-check-label" for="advertising_eu"><?php esc_html_e('European Union / European Economic Area / United Kingdom', 'flexyconsent'); ?></label>
							</div>
							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="advertising_us">
								<label class="form-check-label" for="advertising_us"><?php esc_html_e('United States of America', 'flexyconsent'); ?></label>
							</div>
							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="advertising_ca">
								<label class="form-check-label" for="advertising_ca"><?php esc_html_e('Canada', 'flexyconsent'); ?></label>
							</div>
							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="advertising_others">
								<label class="form-check-label" for="advertising_others"><?php esc_html_e('Others', 'flexyconsent'); ?></label>
							</div>
						</div>

						<div class="mb-5">
							<h5>Google Consent Mode</h5>
							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="google_consent_mode">
								<label class="form-check-label" for="google_consent_mode"><?php esc_html_e('Enable Google Consent Mode v2', 'flexyconsent'); ?></label>
							</div>
							<div id="gcm_settings" class="ms-4 mt-2 collapse">
								<span class="fw-bold"><?php esc_html_e('Manage Privacy Settings', 'flexyconsent'); ?></span>
								<div class="form-check">
									<!-- <label class="form-check-label" for="gcm_url_passthrough">Enable URL passthrough</label> -->
									<label class="form-check-label" for="gcm_url_passthrough"><?php esc_html_e('Enable URL Passthrough', 'flexyconsent'); ?></label>
									<input type="checkbox" class="form-check-input" id="gcm_url_passthrough">
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('Enable URL passthrough to allow Google Analytics to track URL parameters across pages during navigation.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>

								</div>
								<div class="form-check">
									<label class="form-check-label" for="gcm_ads_data_redaction"><?php esc_html_e('Enable Ads Data Redaction', 'flexyconsent'); ?></label>
									<input type="checkbox" class="form-check-input" id="gcm_ads_data_redaction">
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('Ads Data Redaction redacts sensitive information related to ads, enhancing user privacy.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>
								</div>
								<div class="form-check">
									<label class="form-check-label" for="gcm_google_signals"><?php esc_html_e('Allow Google Signals', 'flexyconsent'); ?></label>
									<input type="checkbox" class="form-check-input" id="gcm_google_signals">
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('Google Signals includes cross-device reporting, remarketing, and other data collection for signed-in users.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>
								</div>
								<div class="form-check">
									<label class="form-check-label" for="gcm_ad_personalization_signals"><?php esc_html_e('Allow Ad Personalization Signals', 'flexyconsent'); ?></label>
									<input type="checkbox" class="form-check-input" id="gcm_ad_personalization_signals">
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('Ad personalization signals allow Google to use collected data to personalize ads. Disable this to stop personalized ads.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>
								</div>
								<div class="form-check">
									<label class="form-check-label" for="gcm_restricted_data_processing"><?php esc_html_e('Enable Restricted Data Processing', 'flexyconsent'); ?></label>
									<input type="checkbox" class="form-check-input" id="gcm_restricted_data_processing" />
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('Restricted Data Processing limits the use of personal data for advertising and analytics to comply with privacy regulations, such as CCPA. When enabled, personalized ads will be restricted, and only certain data will be used for measurement and analytics.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>
								</div>
								<div class="my-2">
									<label for="gcm_send_page_view" class="form-label"><?php esc_html_e('Send Page View', 'flexyconsent'); ?></label>
									<select type="text" class="form-control d-inline w-auto mx-2 fs-6" id="gcm_send_page_view">
										<option value="true"><?php esc_html_e('Send', 'flexyconsent'); ?></option>
										<option value="false"><?php esc_html_e('Visitor selection', 'flexyconsent'); ?></option>
									</select>
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('Control whether Google Analytics automatically sends page view events or visitor will select them.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>
								</div>
								<div class="my-2">
									<label for="gcm_wait_for_update" class="form-label"><?php esc_html_e('Wait for update', 'flexyconsent'); ?></label>
									<input type="number" class="form-control d-inline mx-2" id="gcm_wait_for_update" placeholder="0" />
									<span class="fw-light">ms</span>
									<span data-bs-toggle="tooltip" data-bs-placement="top" title="<?php esc_attr_e('The wait for update setting defines how long Google Consent Mode should wait (in milliseconds) before updating the consent state. It helps ensure that consent choices are processed before tracking begins.', 'flexyconsent'); ?>" class="text-primary">
										<i class="fa-solid fa-circle-info ms-1"></i>
									</span>
								</div>
							</div>
						</div>

						<div class="mb-5">
							<h5><?php esc_html_e('Additional Settings', 'flexyconsent'); ?></h5>
							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="auto_blocker">
								<label class="form-check-label" for="auto_blocker"><?php esc_html_e('Enable auto blocker', 'flexyconsent'); ?></label>
							</div>
						</div>

						<div class="mb-5">
							<h5><?php esc_html_e('Privacy Trigger', 'flexyconsent'); ?></h5>

							<div class="form-check mt-2">
								<input type="checkbox" class="form-check-input" id="privacy_button">
								<label class="form-check-label" for="privacy_button"><?php esc_html_e('Display privacy button', 'flexyconsent'); ?></label>
							</div>

							<div class="mt-2">
								<div id="trigger_customization" class="mt-2" role="button">
									<span><?php esc_html_e('Privacy Trigger Customization (Optional)', 'flexyconsent'); ?></span>
									<span><i class="fa-solid fa-angle-right"></i></span>
								</div>
								<div class="mt-2 collapse" style="background-color: rgb(239,239,239)">
									<div class="p-3">
										<div class="text-muted mb-1"><?php esc_html_e('You can copy the code below and use it in the footer of your page (Optional)', 'flexyconsent'); ?></div>
										
										<div class="d-flex mb-3">
											<span class="align-middle" style="width: 80px;line-height: 2;">Link</span>
											<div id="privacy_link_code" class="code-text">&lt;a href="javascript:void(0)" class="btn-fc-adjust-pref"&gt;Manage Privacy Settings&lt;/a&gt;</div>
										</div>
										<div class="d-flex">
											<span class="align-middle" style="width: 80px;line-height: 2;">Button</span>
											<div id="privacy_button_code" class="code-text">&lt;button class="btn-fc-adjust-pref"&gt;Manage Privacy Settings&lt;/button&gt;</div>
										</div>
										<div class="text-muted mt-4 mb-1"><?php esc_html_e('Also you can add code similar to the one below to your page (Optional)', 'flexyconsent'); ?></div>
										<div class="code-text">
											&lt;script&gt;
											<br>&emsp;&emsp;var element1 = document.getElementById('show_privacy_element1');
											<br>&emsp;&emsp;var element2 = document.querySelector('#show_privacy_element2');
											<br>&emsp;&emsp;window.ConsentOptions = {
											<br>&emsp;&emsp;&emsp;&emsp;privacyOptionsSelectors: [ '#btn_id', '.btn-class', element1, element2 ]
											<br>&emsp;&emsp;};
											<br>&lt;/script&gt;
										</div>
									</div>
								</div>
							</div>
						</div>

						<div id="layout_properties_section" class="mb-5">
								<h5><?php esc_html_e('Layout Properties', 'flexyconsent'); ?></h5>

								<div class="row">
									<div class="col-sm-4">
										<div class="form-check mb-3">
											<input type="checkbox" class="form-check-input" id="layout_properties_enabled">
											<label for="layout_properties_enabled" class="form-check-label">
												<?php esc_html_e('Enable customization', 'flexyconsent'); ?>
											</label>
										</div>

										<div id="layout_properties_expandable">
											<div class="mb-3">
												<label for="font_family" class="form-label"><?php esc_html_e('Font family', 'flexyconsent'); ?></label>
												<select id="font_family" class="form-select">
													<option value=""><?php esc_html_e('Use system font family', 'flexyconsent'); ?></option>
													<option value="Arial">Arial</option>
													<option value="Verdana">Verdana</option>
													<option value="Tahoma">Tahoma</option>
													<option value="Trebuchet MS">Trebuchet MS</option>
													<option value="Times New Roman">Times New Roman</option>
													<option value="Georgia">Georgia</option>
													<option value="Garamond">Garamond</option>
													<option value="Courier New">Courier New</option>
													<option value="Brush Script MT">Brush Script MT</option>
												</select>
											</div>
											<div class="mb-3">
												<label for="font_size" class="form-label"><?php esc_html_e('Font size', 'flexyconsent'); ?></label>
												<input type="text" class="form-control" id="font_size" placeholder="Default: 16px" value="">
											</div>
											<div class="mb-3">
												<div class="d-flex">
													<label for="custom_css" class="form-label"><?php esc_html_e('Custom CSS', 'flexyconsent'); ?></label>
													<span data-bs-toggle="tooltip" data-bs-placement="top" title='<?php esc_attr_e('Warning: This is an advanced feature designed for users familiar with CSS. If you are not experienced with CSS, please leave this field empty.', 'flexyconsent'); ?>'>
														<i class="fa-solid fa-circle-exclamation ms-2 text-warning"></i>
													</span>
												</div>
												<textarea id="custom_css" class="form-control" rows="10" placeholder="<?php esc_html_e('Enter CSS code', 'flexyconsent'); ?>"></textarea>
											</div>
											<div class="mb-3">
												<label for="custom_logo" class="form-label"><?php esc_html_e('Custom logo', 'flexyconsent'); ?></label>
												<input type="text" class="form-control" id="custom_logo" placeholder="<?php esc_html_e('Enter a URL', 'flexyconsent'); ?>">
											</div>
										</div>
									</div>

									<div class="col-sm-8 pe-0">
										<iframe id="preview_frame" width="100%" height="750" class="border"></iframe>
									</div>
								</div>
							</div>
					</div>

					<div class="d-flex justify-content-between">
						<a class="button button-back" href="<?php echo esc_url(flexyconsent_generateGoPage('dashboardPage')); ?>"><?php esc_html_e('Cancel', 'flexyconsent'); ?></a>
						<input type="submit" name="submit" id="submit" class="button button-primary" value="<?php esc_html_e('Save', 'flexyconsent'); ?>">
					</div>
				</form>
			</div>
			<div class="col-12 text-center">
				<?php flexyconsent_get_bottom_section(); ?>
			</div>
		</div>
	</div>

<?php
}
