{% extends "base.jinja" %}
{% block main %}
	<form action="?" method="POST" onsubmit="showPacman()">
		<input type="hidden" class="csrf-token" name="csrf_token" value="{{ csrf_token() }}"/>
		<h1 id="title" class="settings-title">Settings</h1>
		{% from 'settings/components/settings_menu.jinja' import settings_menu %}
		{{ settings_menu('general', current_user) }}
		<div class="card" style="margin: 20px auto;">

			<h1>{{ _("Language") }}</h1>
			{% include "includes/language/language_select.jinja" %}<br/>
			<br><br>

			<h1>{{ _("Backup and Restore") }}</h1>
			<div class="tool-tip" style="float: right; margin-bottom: 5px;">
				<i class="tool-tip__icon">i</i>
				<p class="tool-tip__info">
					<span class="info">
						<span class="info__title">{{ _("Backing up Your Specter Data") }}<br><br></span>
						{{ _("It is recommended that you keep your backup files private, as sharing them will result in privacy leaks.") }}<br><br>
						{{ _("Backups are recommended to ensure that access to funds remain, even in the event that a multisig wallet is lost.") }}
					</span>
				</p>
			</div>
			{{ _("Specter Data Backup") }}:
			<div class="note">
			    {{ _("Warning: This backup does not include private seed of the hot wallets or, obviously, the private seed of your Hardwarewallets.") }}
			</div>
			<div class="row">
				<a href="{{ url_for('settings_endpoint.backup_file') }}" class="btn" style="width: 100%; margin-top: -5px;">{{ _("Download Specter backup files") }}</a>
			</div>
			<br>
			<div class="tool-tip" style="float: right; margin-bottom: 5px;">
				<i class="tool-tip__icon">i</i>
				<p class="tool-tip__info">
					<span class="info">
						<span class="info__title">{{ _("Restoring Specter from backup") }}<br><br></span>
						{{ _("Here you can restore your wallets and devices from an existing Specter backup.") }}<br>
						{{ _("Please make sure to unzip the backup file first, then select the extracted folder for upload.") }}<br>
						{{ _("Note: Loading devices/ wallets with names identical to existing ones may overwrite the existing ones.") }}
					</span>
				</p>
			</div>
			<span style="margin: auto 5px auto 0px;">{{ _("Load Specter backup") }}:</span><br><br>
			<div class="row">
				<input type="file" id="file" class="inputfile" webkitdirectory mozdirectory/>
				<input type="hidden" id="restorewallets" name="restorewallets"/>
				<input type="hidden" id="restoredevices" name="restoredevices"/>
				<label for="file" class="btn" style="margin-top: -5px;">
					{{ _("Choose backup folder") }}
				</label>
			</div>
			<span id="filesloaded"></span>
			<div class="row" style="margin-top: 5px;">
				<button onsubmit="showPacman()" type="submit" class="btn hidden" name="action" value="restore" id="restore" style="margin-bottom: 5px;">{{ _("Load Specter backup") }}</button>
			</div><br><br>

			<h1>{{ _("Miscellaneous") }} </h1>
			{{ _("Bitcoin unit to use") }} (BTC/sats):
			<select name="unit">
				<option value="btc" {% if unit!="sat" %} selected="selected"{% endif %}>BTC</option>
				<option value="sat" {% if unit=="sat" %} selected="selected"{% endif %}>sats</option>
			</select>
			<br><br>
			{{ _("Block explorer URL") }} ({{ specter.chain }}):<br>
			{% include "components/explorer_select.jinja" %}
			<div class="warning">
				<img src="{{ url_for('static', filename='img/info_sign.svg') }}" style="width: 20px;"/><br>
				{{ _("Specter does not use the block explorer to get any data whatsoever. This setting is only to allow opening transactions and addresses in a block explorer directly from Specter. All data Specter uses comes directly from your own connected full node.") }}
			</div>
			<br>
			{{ _("Fees estimation source") }}:<br>
			<label><input type="radio" class="inline" style="margin: 0 10px 0 20px;" name="fee_estimator" value="mempool" onclick="updateFeeEstimator()" {% if specter.fee_estimator=="mempool" %}checked{% endif %}>Mempool.space</label><br>
			<label><input type="radio" class="inline" style="margin: 0 10px 0 20px"  name="fee_estimator" value="bitcoin_core" onclick="updateFeeEstimator()" {% if specter.fee_estimator=="bitcoin_core" %}checked{% endif %}>Bitcoin Core</label><br>
			<label><input type="radio" class="inline" style="margin: 0 10px 0 20px;" name="fee_estimator" value="custom" onclick="updateFeeEstimator()" id="fee_estimator_custom_option" {% if specter.fee_estimator=="custom" %}checked{% endif %}>{{ _("Self hosted mempool.space") }}</label>
			<br>
			<input type="text" name="fee_estimator_custom_url" id="fee_estimator_custom_url" value="{{ fee_estimator_custom_url }}" class="hidden" placeholder="http://yourmempool.space/" style="margin-top: 15px;"/>			
			<br><br>
			{% if current_user.is_admin %}
			{{ _("Log Level") }}:
			<tool-tip title="Logging" style="float: right;">
				{{ _("Specter-Desktop created a Logfile in") }} <code>{{ config.SPECTER_LOGFILE}}</code>. {{ _("The Debug-Level will create a lot of data, so make sure to avoid that if you don't have a reason.") }}
			</tool-tip>
			<br>
			<select name="loglevel">
				<option value="WARN" {% if loglevel=="WARN" %} selected="selected"{% endif %}>WARN</option>
				<option value="INFO" {% if loglevel=="INFO" %} selected="selected"{% endif %}>INFO</option>
				<option value="DEBUG" {% if loglevel=="DEBUG" %} selected="selected"{% endif %}>DEBUG</option>
			</select>
			<br><br>
			{% endif %}

			{{ _("Validate Merkle Proofs") }}:
			<div class="note">
			    {{ _("Cannot enable when using a pruned bitcoin node") }}
			</div>
			<div class="row">
			    <label class="switch">
				<input type="checkbox" id="validatemerkleproof" name="validatemerkleproof" {% if validate_merkle_proofs %}checked{% endif %}>
				<span class="slider"></span>
			    </label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				<span class="note explorer-link" style="text-decoration: underline;" onclick="toggleHidden('merkle-info-details');">{{ _("What's this?") }}</span>
			</div>
			<div class="warning hidden" id="merkle-info-details">
				<img src="{{ url_for('static', filename='img/info_sign.svg') }}" style="width: 20px;"/><br>
				{{ _('Specter-Desktop validates <a href="https://github.com/bitcoin/bips/blob/master/bip-0037.mediawiki" target="_blank">BIP 37</a> Merkle Proofs from your full node <strong>guaranteeing</strong> that displayed as confirmed have been included in the specified block hash.') }}<br><br>
				{{ _("However, a compromised full node could return a fake block that was never mined into Bitcoin's blockchain! If you find the displayed block hash in other locations (other nodes, block explorers, etc) <strong>and you trust specter-desktop isn't lying to you</strong>, then you can be sure this transaction exists in their blockchain as well.") }}
			</div>
			<br>
			<div class="row">
				<button type="submit" class="btn" name="action" value="save">{{ _("Save") }}</button>
			</div>
		</div>
	</form>
{% endblock %}


{% block scripts %}
	<script type="text/javascript">
	function toggleHidden(elementId) {
		let el = document.getElementById(elementId);
		if (el.classList.contains("hidden")) {
			el.classList.remove('hidden');
		} else {
			el.classList.add('hidden');
		}
	}
	function updateFeeEstimator() {
			if (document.getElementById('fee_estimator_custom_option').checked) {
				document.getElementById('fee_estimator_custom_url').classList.remove('hidden');
			} else {
				document.getElementById('fee_estimator_custom_url').classList.add('hidden');
			}
		}
		document.addEventListener("DOMContentLoaded", function(){
			updateFeeEstimator();
			var el = document.getElementById("file");

			if (el != null) {
				el.addEventListener("change", (e) => {
					let wallets = []
					let devices = []
					files = e.currentTarget.files;
					if (e.currentTarget.files.length == 1 && e.currentTarget.files[0].type == 'application/zip') {
						showError(`{{ _("Cannot upload as ZIP file, please unzip the file and upload by selecting the extracted folder") }}`, 10000);
						return;
					}
					console.log(files);
					for(let i=0; i<files.length; i++){
						if (files[i].type == 'application/json'){
							let reader = new FileReader();
							reader.onload = function(e) {
								if (files[i].webkitRelativePath.indexOf('devices/') != -1) {
									console.log(files[i].name);
									devices.push(JSON.parse(reader.result));
									document.getElementById('restoredevices').value = JSON.stringify(devices);
									document.getElementById('filesloaded').innerHTML = `<br>Found ${devices.length} devices and ${wallets.length} wallets:`;
									document.getElementById('restore').style.display = 'block';
								} else if (files[i].webkitRelativePath.indexOf('wallets/') != -1) {
									console.log(files[i].name);
									wallets.push(JSON.parse(reader.result));
									document.getElementById('restorewallets').value = JSON.stringify(wallets);
									document.getElementById('filesloaded').innerHTML = `<br>Found ${devices.length} devices and ${wallets.length} wallets:`;
									document.getElementById('restore').style.display = 'block';
								}
							}
							reader.readAsText(files[i]);
						}
					}
				});
			}
		});

	{% include "includes/language/language_js.jinja" %}

	</script>
{% endblock %}
