Mercurial Hosting > sceditor

<!DOCTYPE html>
<html>
	<head>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

		<title>SCEditor Demo</title>

		<link rel="stylesheet" href="/themes/default.css" id="theme-style" />

		<script src="/sceditor.js"></script>
		<script src="/icons/monocons.js"></script>
		<script src="/formats/bbcode.js"></script>

		<style>
			html {
				font-family: Arial, Helvetica, sans-serif;
				font-size: 13px;
			}
			form div {
				padding: .5em;
			}
			code:before {
				position: absolute;
				content: 'Code:';
				top: -1.35em;
				left: 0;
			}
			code {
				margin-top: 1.5em;
				position: relative;
				background: #eee;
				border: 1px solid #aaa;
				white-space: pre;
				padding: .25em;
				min-height: 1.25em;
			}
			code:before, code {
				display: block;
				text-align: left;
			}
		</style>
	</head>
	<body>
		<form action="" method="post">
			<div>
				<textarea id="example" style="height:300px;width:600px;">[center][size=3][b]BBCode SCEditor[/b][/size][/center]

Give it a try! :)

[color=#ff00]Red text! [/color][color=#3399ff]Blue?[/color]

[ul][li]A simple list[/li][li]list item 2[/li][/ul]

Just type [b]:[/b]) and it should be converted into :) as you type.</textarea>

			</div>

			<div>
				<label for="theme">Theme:</label>
				<select id="theme">
					<option value="default">Default</option>
					<option value="defaultdark">Default dark</option>
					<option value="modern">Modern</option>
					<option value="office-toolbar">Office Toolbar</option>
					<option value="office">Office</option>
					<option value="square">Square</option>
				</select>
			</div>
		</form>


		<script>
			var textarea = document.getElementById('example');
			sceditor.create(textarea, {
				format: 'bbcode',
			});


			var themeInput = document.getElementById('theme');
			themeInput.onchange = function() {
				var theme = '/themes/' + themeInput.value + '.css';

				document.getElementById('theme-style').href = theme;
			};
		</script>

		<p>SCEditor is licensed under the <a href="http://www.opensource.org/licenses/mit-license.php">MIT</a></p>
	</body>
</html>
author	Franklin Schmidt <fschmidt@gmail.com>
date	Sun, 07 Aug 2022 00:51:26 -0600
parents	9159df67520a
children	933a459aa182