<!DOCTYPE html>
<html lang="en">
<head>
	{% include 'head.html' %}
	<link rel="stylesheet" href="{{ url_for('static', filename='css/interface.css') }}">
	<title>Tag - {{ tag['name'] }} | Tanabata File Manager</title>
</head>
<body data-bs-theme="dark">
	<header>
		<h1><img src="{{ url_for('static', filename='images/icon-tag.svg') }}" alt="Tag -" class="icon-header"> {{ tag['name'] }}</h1>
		<form id="object-edit">
			<div class="row">
				<div class="form-group col-md-10">
					<label for="name">Name</label>
					<input type="text" class="form-control" name="name" id="name" value="{{ tag['name'] }}" required>
				</div>
				<div class="form-group col-md-2">
					<label for="color">Color</label>
					<input type="color" class="form-control form-control-color" name="color" id="color" value="#{% if tag['color'] %}{{ tag['color'] }}{% else %}444455{% endif %}">
				</div>
			</div>
			<div class="form-group">
				<label for="notes">Notes</label>
				<textarea class="form-control" name="notes" id="notes" rows="3">{{ tag['notes'] }}</textarea>
			</div>
			<div class="form-group">
				<label for="category">Category</label>
				<select name="category_id" class="form-control" id="category">
					<option value="00000000-0000-0000-0000-000000000000"></option>
					{% for category in categories %}
					<option value="{{ category['id'] }}" {% if category['id'] == tag['category_id'] %}selected{% endif %}>{{ category['name'] }}</option>
					{% endfor %}
				</select>
			</div>
			<div class="form-check">
				<label for="is_private" class="form-check-label">Is private</label>
				<input type="checkbox" name="is_private" id="is_private" class="form-check-input" {% if tag['is_private'] %}checked{% endif %}>
			</div>
			<div class="form-group">
				<button type="submit" class="btn btn-primary">Save changes</button>
			</div>
		</form>
		<div class="parent-tags">
			<div class="tags-container tags-container-selected" id="parent-tags-selected">
				{% for tag in tags_all %}
				<div class="tag-preview" tag_id="{{ tag['id'] }}" style="{% if tag['color'] %}background-color: #{{ tag['color'] }};{% elif tag['category_color'] %}background-color: #{{ tag['category_color'] }};{% endif %}{% if tag not in parent_tags %}display: none;{% endif %}">{{ tag['name'] }}</div>
				{% endfor %}
			</div>
			<input type="text" class="form-control filtering" id="parent-tags-filter" placeholder="Filter tags...">
			<div class="tags-container" id="parent-tags-other">
				{% for tag in tags_all %}
				<div class="tag-preview" tag_id="{{ tag['id'] }}" style="{% if tag['color'] %}background-color: #{{ tag['color'] }};{% elif tag['category_color'] %}background-color: #{{ tag['category_color'] }};{% endif %}{% if tag in parent_tags %}display: none;{% endif %}">{{ tag['name'] }}</div>
				{% endfor %}
			</div>
		</div>
	</header>
	<div id="loader" style="display: none">
		<div class="loader-wrapper">
			<img src="{{ url_for('static', filename='images/loader.gif') }}" alt="Loading..." class="loader-img">
		</div>
	</div>
	<script src="{{ url_for('static', filename='js/interface.js') }}"></script>
	<script src="{{ url_for('static', filename='js/tag.js') }}"></script>
</body>
</html>