DragonBe/phpsyntax-highlighter.php

## phpsyntax-highlighter.php
<?php
declare(strict_types=1);

ini_set('highlight.comment', '#cc8800');
ini_set('highlight.default', '#6699cc');
ini_set('highlight.html','#000000');
ini_set('highlight.keyword', '#993333');
ini_set('highlight.string', '#66cc66');

$sourceCode = $previewCode = '';

if ([] !== $_POST && array_key_exists('source-code', $_POST)) {
    $sourceCode = $_POST['source-code'];
    if ('<?php' !== substr($sourceCode, 0, 5)) {
      $sourceCode = '<?php' . PHP_EOL . PHP_EOL . $sourceCode;
    }
    $previewCode = highlight_string($sourceCode, true);
    if (array_key_exists('type', $_POST) && 'ajax' === $_POST['type']) {
        header('Content-Type: text/plain');
        echo $previewCode;
        die;
    }
}
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF=8">
    <meta name="Content-Type" content="text/html; Charset=UTF-8">
    <title>Highlight PHP code</title>
    <style type="text/css">
      html {
         font-family: Helvetica, Arial, "Sans Serif";
      }
      pre {
         font-family: Consolas, monospace, "Courier New";
      }
      a.button {
        display: inline-block;
        padding-top: 0.5em;
        text-decoration: none;
      }
      .button {
        width: 120px;
        height: 30px;
        cursor: pointer;
        padding: 2px 5px;
        text-align: center;
        vertical-align: middle;
        background: black;
        color: white;
        border: 1px solid black;
        white-space: pre;
        margin-top: 0em;
        box-sizing: border-box;
        font-size: 11px;
        font-family: system-ui;
        font-weight: bold;
        align-items: flex-start;
      }
      .button:hover {
         border: 1px solid black;
         background: white;
         color: black;
      }
    </style>
  </head>
  <body>
    <form id="source-code-form" method="post" action="<?php echo $_SERVER['PHP_SELF'] ?>">
    <div class="form-group">
      <div class="form-label"><label for="source-code">Source code</label></div>
      <div class="form-element">
        <textarea id="source-code" name="source-code" rows="12" cols="89"><?php echo $sourceCode ?></textarea>
      </div>
    </div>
    <div class="form-group">
      <input type="submit" id="highlight-code" class="button" value="Highlight">
      <a href="<?php echo $_SERVER['PHP_SELF'] ?>" class="button" id="clear-code">Clear</a>
    </div>
    </form>
    <hr>
    <div id="preview" class="preview">
      <pre id="preview-code" class="preview-code"><?php echo $previewCode ?></pre>
    </div>
    <script type="application/javascript">
        document.getElementById("source-code-form").addEventListener("submit", function (event) {
            event.preventDefault();
            var data = document.getElementById("source-code").value;
            const xhttp = new XMLHttpRequest();

            xhttp.onload = function () {
                highlight(this);
            }
            xhttp.open("POST", "<?php echo $_SERVER['PHP_SELF'] ?>", false);
            xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xhttp.send("source-code=" + data + "&type=ajax");
        });
        document.getElementById("clear-code").addEventListener("click", function (event) {
            event.preventDefault();
            document.getElementById("preview-code").insertAdjacentHtml("afterbegin", "");
            document.getElementById("source-code").value = "";
        }

        function highlight(xhttp) {
            parseTemplate(xhttp.responseText);
        }

        function parseTemplate(htmlTpl) {
            var pre = document.createElement("pre");
            pre.setAttribute("id", "preview-code");
            pre.setAttribute("class", "preview-code");
            pre.insertAdjacentHTML("afterbegin", htmlTpl);
            var parent = document.getElementById("preview");
            var child = document.getElementById("preview-code");
            parent.replaceChild(pre, child);
        }
    </script>
  </body>
</html>
	<?php
	declare(strict_types=1);

	ini_set('highlight.comment', '#cc8800');
	ini_set('highlight.default', '#6699cc');
	ini_set('highlight.html','#000000');
	ini_set('highlight.keyword', '#993333');
	ini_set('highlight.string', '#66cc66');

	$sourceCode = $previewCode = '';

	if ([] !== $_POST && array_key_exists('source-code', $_POST)) {
	$sourceCode = $_POST['source-code'];
	if ('<?php' !== substr($sourceCode, 0, 5)) {
	$sourceCode = '<?php' . PHP_EOL . PHP_EOL . $sourceCode;
	}
	$previewCode = highlight_string($sourceCode, true);
	if (array_key_exists('type', $_POST) && 'ajax' === $_POST['type']) {
	header('Content-Type: text/plain');
	echo $previewCode;
	die;
	}
	}
	?>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF=8">
	<meta name="Content-Type" content="text/html; Charset=UTF-8">
	<title>Highlight PHP code</title>
	<style type="text/css">
	html {
	font-family: Helvetica, Arial, "Sans Serif";
	}
	pre {
	font-family: Consolas, monospace, "Courier New";
	}
	a.button {
	display: inline-block;
	padding-top: 0.5em;
	text-decoration: none;
	}
	.button {
	width: 120px;
	height: 30px;
	cursor: pointer;
	padding: 2px 5px;
	text-align: center;
	vertical-align: middle;
	background: black;
	color: white;
	border: 1px solid black;
	white-space: pre;
	margin-top: 0em;
	box-sizing: border-box;
	font-size: 11px;
	font-family: system-ui;
	font-weight: bold;
	align-items: flex-start;
	}
	.button:hover {
	border: 1px solid black;
	background: white;
	color: black;
	}
	</style>
	</head>
	<body>
	<form id="source-code-form" method="post" action="<?php echo $_SERVER['PHP_SELF'] ?>">
	<div class="form-group">
	<div class="form-label"><label for="source-code">Source code</label></div>
	<div class="form-element">
	<textarea id="source-code" name="source-code" rows="12" cols="89"><?php echo $sourceCode ?></textarea>
	</div>
	</div>
	<div class="form-group">
	<input type="submit" id="highlight-code" class="button" value="Highlight">
	<a href="<?php echo $_SERVER['PHP_SELF'] ?>" class="button" id="clear-code">Clear</a>
	</div>
	</form>
	<hr>
	<div id="preview" class="preview">
	<pre id="preview-code" class="preview-code"><?php echo $previewCode ?></pre>
	</div>
	<script type="application/javascript">
	document.getElementById("source-code-form").addEventListener("submit", function (event) {
	event.preventDefault();
	var data = document.getElementById("source-code").value;
	const xhttp = new XMLHttpRequest();

	xhttp.onload = function () {
	highlight(this);
	}
	xhttp.open("POST", "<?php echo $_SERVER['PHP_SELF'] ?>", false);
	xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhttp.send("source-code=" + data + "&type=ajax");
	});
	document.getElementById("clear-code").addEventListener("click", function (event) {
	event.preventDefault();
	document.getElementById("preview-code").insertAdjacentHtml("afterbegin", "");
	document.getElementById("source-code").value = "";
	}

	function highlight(xhttp) {
	parseTemplate(xhttp.responseText);
	}

	function parseTemplate(htmlTpl) {
	var pre = document.createElement("pre");
	pre.setAttribute("id", "preview-code");
	pre.setAttribute("class", "preview-code");
	pre.insertAdjacentHTML("afterbegin", htmlTpl);
	var parent = document.getElementById("preview");
	var child = document.getElementById("preview-code");
	parent.replaceChild(pre, child);
	}
	</script>
	</body>
	</html>