<?php
	
	declare(strict_types=1);
	
	/**
	 * User: Daschmi (daschmi@daschmi.de)
	 * Date: 20.02.2020
	 * Time: 15:55
	 */ 
	
	namespace dywc;
	
?>

<style>

	.notice, div.error, div.updated { margin-left:0; }
	
</style>

<h1><?php echo __('Do You Want Cookies?', 'ds'); ?></h1>

<?php if (isset($_SESSION['ds_error'])) { foreach ($_SESSION['ds_error'] as $e) { ?>

	<div class="error notice">
		<p><?php echo htmlspecialchars($e); ?></p>
	</div>

<?php } unset($_SESSION['ds_error']); } ?>

<?php if (isset($_SESSION['ds_msg'])) { foreach ($_SESSION['ds_msg'] as $m) { ?>

	<div class="updated notice">
		<p><?php echo htmlspecialchars($m); ?></p>
	</div>

<?php } unset($_SESSION['ds_msg']); } ?>

<div id='json_editor'></div>

<br /><br />

<form method="post" action="<?php echo site_url(); ?>/wp-admin/options-general.php?page=dywc_settings&noheader=1">
	
	<textarea id="json" name="json" style="display:none;"><?php echo json_encode(self::$view['json']); ?></textarea>
	
	<button id="submit" name="submit" type="submit" class="button button-primary"><?php echo __('Speichern'); ?></button>
	<button onclick="if (!confirm('<?php echo __('Sind Sie sich sicher? Ihre bisherige Konfiguration wird verworfen.', 'ds'); ?>')) return false;" id="submit-reset" name="submit-reset" type="submit" class="button"><?php echo __('Zurücksetzen und Beispielkonfiguration laden'); ?></button>

</form>
	
<style>
	
	.card { width:calc(100% - 25px); min-width:auto; max-width:100%; padding:10px 15px; }
	.form-group { display:flex; align-items:center; justify-content:flex-start; margin-bottom:5px; min-height:36px; }
	.form-check { display:flex; flex-direction:row-reverse; align-items:center; justify-content:flex-start; }
	.form-check	input { margin-left:2px; }
	.form-group label { width:250px; flex-shrink:0; }
	.form-group input[type="text"] { width:100%; }
	.card-title { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
	.btn-group > button { margin:5px 0; }
	div[data-schematype="array"] { margin-bottom:15px; }
	.card .card { background-color:#DEDEDE; }
	.card .card .card { background-color:#FFFFFF; }
	.card .card .card card { background-color:#DEFFDE; }
	
</style>

<script>
	
	var json_editor = new JSONEditor(document.getElementById('json_editor'), {
		disable_collapse: true,
		disable_edit_json: true,
		disable_properties: true,
		collapsed: false,
		theme: 'bootstrap4',
		schema: {
			type: 'object',			
			title: '<?php echo __('Einstellungen', 'ds'); ?>',			
			properties: {
				cookie_version: {
					type: 'integer',
					title: '<?php echo __('Version des Cookies', 'ds'); ?>',
				},
				cookie_name: {
					type: 'string',
					title: '<?php echo __('Name des Cookies', 'ds'); ?>'
				},
				cookie_expire: {
					type: 'integer',
					title: '<?php echo __('Laufzeit des Cookies', 'ds'); ?>'
				},
				cookie_path: {
					type: 'string',
					title: '<?php echo __('Gültigkeitspfad des Cookies', 'ds'); ?>'
				},
				mode: {
					type: 'integer',
					enumSource: [{
						source: [
							{
								value: 1,
								title: 'Modus 1'
							}, {
								value: 2,
								title: 'Modus 2'
							}
						],
						title: '{{item.title}}',
						value: '{{item.value}}'
					}]
				},
				bglayer: {
					type: 'boolean',
					format: 'checkbox',
					title: '<?php echo __('Hintergrund abdunkeln', 'ds') ?>'
				},
				position: {
					type: 'string',
					title: 'Position',
					enumSource: [{
						source: [
							{ value: 'lt', title: 'links oben' }, 
							{ value: 'lm', title: 'mitte oben' },
							{ value: 'rt', title: 'rechts oben' },
							{ value: 'mt', title: 'links mitte' },
							{ value: 'mm', title: 'mitte mitte' },
							{ value: 'mt', title: 'rechts mitte' },
							{ value: 'bt', title: 'links unten' },
							{ value: 'bm', title: 'mitte unten' },
							{ value: 'bt', title: 'rechts unten' }
						],
						title: '{{item.title}}',
						value: '{{item.value}}'
					}]
				},
				id_bglayer: {
					type: 'string',
					title: '<?php echo __('ID des Hintergrundlayers', 'ds'); ?>'
				},
				id_cookielayer: {
					type: 'string',
					title: '<?php echo __('ID des Cookie Dialoglayers', 'ds'); ?>'
				},
				id_cookieinfo: {
					type: 'string',
					title: '<?php echo __('ID des Elements für die Datenschutzerklärung', 'ds'); ?>'
				},
				url_legalnotice: {
					type: 'string',
					title: '<?php echo __('URL der Datenschutzerklärung', 'ds'); ?>'
				},
				url_imprint: {
					type: 'string',
					title: '<?php echo __('URL des Impressums', 'ds'); ?>'
				},
				text_title: {
					type: 'string',
					title: '<?php echo __('Titel des Dialoges', 'ds'); ?>'
				},
				text_dialog: {
					type: 'string',
					title: '<?php echo __('Text im Dialog', 'ds'); ?>'
				},
				cookie_groups: {
					type: 'array',
					title: '<?php echo __('Cookie Gruppen', 'ds'); ?>',
					options: {
						//collapsed: true
					},
					items: {
						type: 'object',
						title: 'Cookie Grupppe',
						label: {
							type: 'string',
							title: '<?php echo __('Bezeichnung der Gruppe', 'ds'); ?>'
						},
						properties: {
							label: {
								type: 'string',
								title: '<?php echo __('Bezeichnung', 'ds'); ?>'
							},
							fixed: {
								type: 'boolean',
								format: 'checkbox',
								title: '<?php echo __('vorausgewählt und nicht abwählbar', 'ds') ?>'
							},
							info: {
								type: 'string', 
								title: '<?php echo __('Informationstext', 'ds') ?>'
							},							
							cookies: {
								type: 'array',
								title: '<?php echo __('Cookies', 'ds'); ?>',
								options: {
									//collapsed: true
								},
								items: {
									type: 'object',
									title: 'Cookie',
									properties: {
										label: {
											type: 'string',
											title: '<?php echo __('Bezeichnung des Cookies', 'ds'); ?>'
										},
										publisher: {
											type: 'string',
											title: '<?php echo __('Anbieter', 'ds'); ?>'
										},
										aim: {
											type: 'string',
											title: '<?php echo __('Grund der Erhebung', 'ds'); ?>'
										},
										name: {
											type: 'string',
											title: '<?php echo __('Name der Cookievariablen', 'ds'); ?>'
										},
										duration: {
											type: 'string',
											title: '<?php echo __('Gültigkeit des Cookies', 'ds'); ?>'
										}										
									}
								}
							},
							accept: {
								type: 'string',
								format: 'javascript',
								title: '<?php echo __('Cookie Opt-In Code'); ?>',
								options: {
									infoText: 'JavaScript Code, der ausgeführt wird wenn die Cookie Gruppe vom Nutzer akzeptiert wurde.'
								}
							},
							reject: {
								type: 'string',
								format: 'javascript',
								title: '<?php echo __('Cookie Opt-Out Code'); ?>',
								options: {
									infoText: 'JavaScript Code, der ausgeführt wird wenn die Cookie Gruppe vom Nutzer abgelehnt wurde und vorher aktiv war.'
								}
							}
						}
					}
				}
			}
		}
	});
	
	jQuery('.json-editor-btn-collapse').on('click', function () {
		
		jQuery(this).toggleClass('folding');
		
	});

	json_editor.setValue(<?php echo json_encode(self::$view['json']); ?>);
	 
	document.getElementById('submit').addEventListener('click',function() {

		document.getElementById('json').innerHTML = JSON.stringify(json_editor.getValue());
		
		return false;
		
	});
	
</script>
    