<?php 
$this->layout(
	'admin/layout/main',
	['title' => 'Tags', 'env' => $env]
); 
?>
<div id="main">
	<div class="h3">Tags</div>
	<div class="container-fluid pt-5">
		<div class="row">
			<div class="col-md-4">
				<div class="fw-bold"><?= $header ?></div>
				<div id="message" class="text-center text-danger"></div>
				<div class="pt-3">
					<form method="Post">
						<input type="hidden"
							name="id_tag"
							id="id_tag"
							value="<?= $id_tag ?>"
							>
						<div class="form-group pb-2">
		                    <label for="title" class="h4">Tag Name</label>
		                    <input id="tagName" type="text" name="tag_name" value="<?= $tag_name ?>" class="form-control" required />
		                </div>
	                    <div class="form-group pb-2">
	                        <label for="tagUrl" class="h4">Tag URL</label>
	                        <input id="tagUrl" type="text" name="tag_url" value="<?= $tag_url ?>" class="form-control" required />
	                    </div>
	                    <div class="pt-4">
		                    <div id="tagSubmit" class="btn btn-primary form-control">
		                    	<?= $action ?> tag
		                    </div>
		                </div>
					</form>
					<?php if (isset($_GET['id'])) : ?>
						<div class="pt-2">
							<div id="tagDelete"
								class="btn btn-danger form-control"
								data-id="<?= $_GET['id'] ?>">
				                    	delete tag
				            </div>
				        </div>
						<div class="pt-2">
							<div id="tagCancel" class="btn btn-secondary form-control">
				                    	cancel
				            </div>
				        </div>
				    <?php endif; ?>
				</div>
			</div>
			<div class="col-md-8">
				<table class="table_list table table-striped">
				<thead>
					<tr>
						<th>ID.</th>
						<th>Name</th>
						<th>Url Name</th>
					</tr>
				</thead>
				<?php if (is_array($tags)) : ?>
					<?php foreach ($tags as $tag) : ?>
						<tr>
							<td>
								<div>
									<?= $tag['id_tag'] ?>
								</div>
							</td>
							<td>
								<a href="?id=<?= $tag['id_tag'] ?>">
									<?= $tag['tag_name'] ?>
								</a>
							</td>
							<td><?= $tag['tag_url'] ?></td>
						</tr>
					<?php endforeach; ?>
				<?php endif; ?>
				</table>
			</div>
			
		</td>
	</div>
</div>
<script>
	 $('#tagName').on('focusout', function(){
            var title = $('#tagName').val();
            $.ajax({
                type    : 'POST',
                url     : '/<?= $env['ADMIN'] ?>/post/url-name',
                data    : {
                    'title' : title
                },
                success : function(response) {
                    console.log('response' + response);
                    $('#tagUrl').val(response);
                }

            });
        });
	$('#tagCancel').on('click', function(){
		window.location.href = '/work/tags';
	});

	$('#tagDelete').on('click', function(){
		var id_tag	= $(this).data('id');
	   
	    $.ajax({
	    	type	: 'POST',
	    	url		: '/<?= $env['ADMIN'] ?>/tag/delete',
	    	data	: {
	            'id_tag' : id_tag
	        },
	    	success	: function(response) {
	            window.location.href = '/work/tags';
	    	}

	    });

	});

	$('#tagSubmit').on('click', function(){
		var id_tag	= $('#id_tag').val();
	    var tag_name = $('#tagName').val();
	    var tag_url = $('#tagUrl').val();
	   
		if (tag_name.length > 1) {
		    console.debug('tag: ' + tag_name);

		    $.ajax({
		    	type	: 'POST',
		    	url		: '/<?= $env['ADMIN'] ?>/tag/process',
		    	data	: {
		            'id_tag' : id_tag,
		            'tag_name' : tag_name,
		            'tag_url' : tag_url
		        },
		    	success	: function(response) {
		            window.location.href = '/work/tags';
		    	}

		    });
		} else {
			$('#message').html('Yo need to add a name');
		}
	});
</script>