Login   Register  
Icontem

File: test_html_editor.html

Recommend this page to a friend!
Stumble It! Stumble It! Bookmark in del.icio.us Bookmark in del.icio.us
  Classes of Manuel Lemos  >  HTML Template Editor  >  test_html_editor.html  >  Download  
File: test_html_editor.html
Role: Example script
Content type: text/plain
Description: Example page using the HTML editor
Class: HTML Template Editor
Visual HTML template editor
Author: By
Last change:
Date: 2010-08-24 12:35
Size: 2,444 bytes
 

Contents

Class file image Download 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head>
<title>Test for Manuel Lemos' HTML Editor JavaScript Object</title> 
<script type="text/javascript" src="html_editor.js"></script> 
<style type="text/css"> 
.editor { background-color: blue; font-family: "courier" }
</style> 
</head> 
<body onload="
if(document.getElementById('editor'))
{
	var e = new ML.HTMLEditor.Editor();
	e.debug = true;
	e.showToolbars = true;
	e.mode = 'visual';
	e.templateVariables = {
		'menu': {
			inline: false,
			preview: unescape('%3ca href=&quot;&quot;&gt;File%3c/a&gt; %3ca href=&quot;&quot;&gt;Edit%3c/a&gt; %3ca href=&quot;&quot;&gt;Tools%3c/a&gt; %3ca href=&quot;&quot;&gt;Help%3c/a&gt;'),
			title: 'Menu',
			alternatives: {
				'vertical': {
					preview: unescape('%3ca href=&quot;&quot;&gt;File%3c/a&gt;%3cbr /&gt;%3ca href=&quot;&quot;&gt;Edit%3c/a&gt;%3cbr /&gt;%3ca href=&quot;&quot;&gt;Tools%3c/a&gt;%3cbr /&gt;%3ca href=&quot;&quot;&gt;Help%3c/a&gt;'),
					title: 'Vertical menu'
				}
			}
		},
		'smiley': {
			inline: true,
			preview: ';-)',
			title: 'Smiley',
			alternatives: {
				'sad': {
					preview: ':-(', title: 'Sad'
				},
				'grin':
				{
					preview: ':D',
					title: 'Grin'
				},
				'shocked':
				{
					preview: ':O',
					title: 'Shocked'
				}
			}
		}
	};
	e.insertEditor('editor', {
		id: 'p_editor_textarea',
		name: 'editor',
		value: unescape('%3ch1&gt;Hello world!%3c/h1&gt;{menu sad}%3cp&gt;{smiley}%3c/p&gt;'),
		rows: '20',
		cols: '80',
		style: 'width: 800px; height: 600px; background-color: #ffffff; border-style: solid; border-width: 1px; margin: 0px; border-color:  #707070 #e0e0e0 #e0e0e0 #707070'
	});
}
"> 
<center><h1>Test for Manuel Lemos' HTML Editor JavaScript Object</h1></center> 
<form method="post" action="" name="html_editor_form" onsubmit="return false; var e = ML.HTMLEditor.HTMLEditors['p_editor_textarea']; e.synchronize();"> 
<div align="center"> 
<div id="editor"><noscript><textarea name="editor" rows="20" cols="80" id="p_editor_textarea" style="width: 800px; height: 600px; background-color: #ffffff; border-style: solid; border-width: 1px; margin: 0px; border-color:  #707070 #e0e0e0 #e0e0e0 #707070">&lt;h1&gt;Hello world!&lt;/h1&gt;{menu sad}&lt;p&gt;{smiley}&lt;/p&gt;</textarea></noscript></div><input type="submit" name="send" value="Submit" id="send" /></form> 
</body> 
</html>