<div class="tenon_header">
	<div class="tenon_header_td_left">
		<span class="title"><?php
			$is_mobile = function_exists('isMobile') ? isMobile() : false;
			$is_logged_in = ($login ?? false) === true;
			
			if ($is_mobile) {
				$tenon_title_trim = $is_logged_in ? 25 : 50;
			} else {
				$tenon_title_trim = $is_logged_in ? 40 : 50;
			}
			
			$safe_tenon_title = htmlspecialchars($title ?? '', ENT_QUOTES, 'UTF-8');
			echo substr($safe_tenon_title, 0, $tenon_title_trim) . " ";
		?></span>
	</div>
	<div class="tenon_header_td_right">
		<?php if ($is_logged_in): 
			$safe_tenon = htmlspecialchars($tenon_id ?? '', ENT_QUOTES, 'UTF-8');
		?>
			<a href="tenons/<?= $safe_tenon ?>.txt" target="_blank"><img src="images/icons/file.png" class="tenon_list_button" alt="file"></a>
			<a href="index.php?e=<?= $safe_tenon ?>#edit"><img src="images/icons/edit.png" class="tenon_list_button" alt="edit"></a>
			<a href="back/tenon/delete_tenon.php?d=<?= $safe_tenon ?>" onclick="return confirm_delete()"><img src="images/icons/delete.png" class="tenon_list_button" alt="delete"></a>
		<?php endif; ?>
	</div>
</div>

<div class="tenon_table">
	<div class="tenon_td">
		<span class="text"><?php echo $tenon ?? ''; ?></span>
		<a name="panels"></a>
	</div>
</div>

<?php
	if (($login ?? false) === true) {
		if (isset($_GET['e'])) {
			include 'back/tenon/edit.php';
			echo "<div class='bump'></div>";
		}
	}
?>

<script>
$(".gallery").click(function(e){
    var img = $(e.target);
    var src = img.attr("src");
    window.open(src);
});
</script>

<script>
$(function() {
    $("#playlist div").on("click", function() {
        $("#video_player").attr({
            "src": $(this).attr("video_url"),
            "autoplay": "autoplay"
        });
    });
    $("#video_player").attr({
        "src": $("#playlist div").eq(0).attr("video_url")
    });
});
</script>

<script src="front/cb.min.js"></script>

<script>
document.querySelectorAll('pre').forEach(function (copyfunc) {
    var copybtn = document.createElement('button');
    copybtn.className = 'copy_button';
    copybtn.type = 'button';
    var s = copyfunc.innerText;
    copybtn.setAttribute('data-clipboard-text', s);
    copybtn.innerText = 'Copy';
    copyfunc.classList.add('preprint');
    copyfunc.appendChild(copybtn);         
});

var cb_logic = new ClipboardJS('.copy_button');
cb_logic.on('success', function(e) {
	console.info('Action:', e.action);
	console.info('Text:', e.text);
	console.info('Trigger:', e.trigger);
	e.trigger.textContent = 'Copied';
	e.clearSelection();
});

cb_logic.on('error', function(e) {
	console.error('Action:', e.action);
	console.error('Trigger:', e.trigger);
	e.trigger.textContent = 'Error';
	e.clearSelection();
});
</script>