 Installation&Using (ASP version)
- Copy directory 'class' on server. There must be access to this directory through an URL.
- Add code of the following form at the top of the file where you want RE to be used:
<%
dim class_path
class_path = "path to 'class' folder"
%<!-- #INCLUDE file="class/class.rich.asp" -->
Here, "path to 'class' folder" is string with path to directory 'class', where RE files is, e.g. "class/", if your script and this directory are in the same directory.
- Insert the following strings inside tag <HEAD>:
<link rel="StyleSheet" type="text/css" href="<% =class_path %>rich_files/rich<% =rich_prefix %>.css">
<script language="JavaScript" src="<% =class_path %>rich_files/rich<% =rich_prefix %>.js"></script>
<script language="JavaScript" src="<% =class_path %>rich_files/rich_xhtml.js"></script>
Note: if you do not use XHTML mode the last <script> tag could be omitted
- Code to create RE is of the form:
<%
dim editor
set editor = new rich
editor.initialize caption, name, value, width, height,_
files_path, files_url, page_mode, absolute_path
editor.draw 'or Response.write editor.get_rich
%>
Here
caption is a string appearing before RE in page (caption of editor),
name is name of the textarea element which is used to send editor's content through forms (must be unique if you create several editors),
value is string with initial content of the editor (can be empty),
width is width of the editor (can be in absolute values or in %s),
height is height of the editor (can be in absolute values or in %s),
files_path is string with path to top directory for remote and uploaded files from site root, eg '/files/upload/'!
files_url is string with url to top directory (directory $files_path) for remote and uploaded files,
page_mode - set it to 'true' to edit the whole pages, otherwise can be omitted,
absolute_path - set it to true to refer to files at server through absolute
paths (default), otherwise -- through relative (from site root) paths.
Note: initialize must be called before draw method call.
- Add 'save_in_textarea_all' function to onsubmit event handler, e.g:
<form action="" method="post" onsubmit="save_in_textarea_all();">
After the form submitted, content of the editor can be accessed in scripts via names set in variables name.
RE appears on page in the place, where method draw is called
The sessions API functions use session technique, so sessions should be available in your pages. Cookies should be switched on in client's browser as ASP sessions require cookies.
Function list
- set_avail_paths(paths) //set paths available for uploading, renaming, etc
Example: editor.set_avail_paths(array("/files/uploaded/", "/files/shared/"))
- set_total_size(size) //max available size (in bytes) of files uploaded
Example: editor.set_total_size(1024*1024)
- set_can_upload(can_upload) //enable or disable uploading
If can_upload is set to true then uploading will be enabled. Otherwise disabled
- set_max_size(max_size) //set max size (in bytes) of file available for uploading
Example: editor.set_max_size(1024)
- set_allow_override(allow_override) //set permission to override existing files
Set allow_override to true to allow overriding, otherwise set it to false
- set_avail_files(files) //set file extensions available for uploading and renaming
Example: editor.set_avail_files(array ("zip", "txt"));
- set_not_avail_files(files) //set file extensions not available for uploading and renaming
Example: editor.set_not_avail_files(array ("php", "pl"));
- set_can_create_dir(can_create); //set permissions to create folders
Action available if can_create set to true. Otherwise disabled
- set_can_rename_dir(can_rename) //set permissions to rename folders
Action available if can_rename set to true. Otherwise disabled
- set_can_delete_dir(can_delete) //set permissions to delete folders
Action available if can_delete set to true. Otherwise disabled
- set_can_rename_file(can_rename) //set permissions to rename files
Action available if can_rename set to true. Otherwise disabled
- set_can_delete_file(can_delete) //set permissions to delete files
Action available if can_delete set to true. Otherwise disabled
- set_default_settings() //erase all settings stored in session varibles (return to default settings)
To change settings to its default values defined in check_auth.inc.php call the appropriate functions with empty string as an arqument, eg. editor.set_allow_override("");
Simple mode
To handle RE Simple mode add a sring of the form
editor.simple_mode mode
before draw method call.
If mode is true or omitted, the simple mode is on, otherwise -- off.
Customization
To hide some buttons use the method
editor.hide_tb item, mode
before draw method call.
Here
item is a string defining a button (or a group of buttons) to be hidden/shown,
mode -- set it to true to hide buttons, defined by item, if set to false the item buttons are shown at RE toolbar.
Using the hide_tb function it is possible to hide some buttons of RE toolbar. Besides it, you can set up your own "simple mode" adding or deleting the function calls inside simple_mode function.
The possible values of item:
'fullscreen' -- fullscreen mode button;
'preview' -- preview button;
'find' -- find&replace button;
'clipboard' -- cut, copy and paste buttons;
'history' -- undo and redo buttons;
'text' -- bold, italic, underline, strikesrough, superscript and subscript buttons;
'align' -- align left, center, right and justify buttons;
'list' -- ordered and unordered list buttons;
'indent' -- indent and outdent buttons;
'hr' -- horizontal line buttons;
'remove_format' -- remove formatting button;
'table' -- create table, insert/delete row, insert/delete column buttons;
'adv_table' -- insert/delete cell, merge cells, split cell buttons (shown only if 'table' buttons are not hidden);
'paragraph' -- paragraph select;
'font' -- font select;
'style' -- stylesheet class select;
'size', -- font size select;
'color',-- forecolor and backcolor buttons;
'image' -- create image button;
'flash' -- create flash button;
'link' -- create hyperlink button;
'paste_word' -- paste text from MS Word button;
'switch_borders' -- show invisible table borders button;
'special_chars' -- insert special char button;
'form' -- form elements' buttons;
'snippets' -- insert custom html code button;
'page_properties' -- page properties button;
'help' -- help button.
Active mode
To handle RE Active mode add a sring of the form
editor.active_mode mode
before draw method call.
If mode is true the active mode is on, otherwise -- off.
XHTML mode
In XHTML mode editor generates source code in XHTML 1.0 format instead of common HTML.
To handle RE XHTML mode add a sring of the form
editor.xhtml_mode mode
before draw method call.
If mode is true the xhtml mode is on, otherwise -- off.
To change document language/charset settings use the following functions:
'set document language
editor.set_doc_lang lang
'set document charset
editor.set_doc_charset cs
Here
lang is a string specifying language of the document ('en' -- default), cs is charset of the document ('iso-8859-1' -- default)
Note: if the language/charset settings are not spesified, the current language of RE toolbar and charset of the corresponding language file is used
To set default stylesheet files use the following function:
editor.set_default_stylesheet style_path
before draw method call.
Here
style_path is a path to stylesheet file (or array of such paths) from the dir where script creating the editor is
Snippets
To define html snippets to be used in the editor use the following function:
editor.set_snippets snippets, group
before draw method call.
Here
snippets is a Scripting.Dictionary object of the form
dim re_dict
set re_dict = Server.CreateObject("Scripting.Dictionary")
re_dict.add "name of the snippet #1", "code of the snippet #1"
re_dict.add "name of the snippet #2", "code of the snippet #2"
group is name of a snippet group that these snippets should to be placed in
HTML tags are available inside html snippets
Language
To set the desired language use the following function:
editor.set_lang lang
before draw method call
Here
lang is code of the language
Supported languages (language codes):
- Dutch (nl)
- English (en) -- default
- French (fr)
- Hungarian (hu)
- Japanese (ja)
- German (de)
- Russian (ru)
- Turkish (tr)
To make borders visible by default call the function
editor.set_borders_visibility set_on
before draw method call
Here
set_on should be set to true to make borders visible by default
By default <br> tag is inserted on Enter Key press. To insert <p> tag use Shift-Enter instead.
To change this behaviour call function
editor.set_br_on_enter set_on
before draw method call
Here
set_on should be set to true to make RE handle Enter Key press as described above; otherwise Enter Key press inserts <p> tag and Shift-Enter inserts <br>
To specify your own list of fonts and font sizes use the following functions:
editor.set_font_list font_data
editor.set_font_size_list font_data
before draw method call
Here
font_data is name of font/font size (or array of such values)
Save button
To use a toolbar button to submit form with Rich Editor instead of clicking on form submit button the following code should be used:
'make the button visible
editor.hide_tb "save", false
'define reaction on the button click
editor.set_on_save_handler code
before draw method call
Here
code is code to be performed on the button click
E.g. to submit form with id "form_id" set code to string "document.getElementById('form_id').submit()"
Note: If you use the save button to submit form data, it is not necessary to add function save_in_textarea_all() to onsubmit form attribute
To make RE to use "Paste from Word" function instead of common Paste to clean all html code pasted the following function should be used:
editor.set_clean_paste set_on
before draw method call
Here
set_on should be set to true to make RE to clean all the code pasted
Often it is necessary to protect some parts of content being modifed. Eg we would like to show the whole html page to users but let them to modify some parts of it only so that page layout stays intact.
To define edtiable regions special tags compatable with Dreamweaver could be used:
<!-- #BeginEditable "comment here" -->
This content <strong>could be</strong> modified!
<!-- #EndEditable -->
There could be unlimited number of such regions. The tags themselves mustn't be modified except comments inside double quotes. There should not be opening/closing tags inside an editable region that have closing/opening tags outside it. So, the editable tags mustn't overlap with other thml or editable tags.
To tell RE to use Editable regions mode the following function could be used:
editor.set_editable_regions set_on
before draw method call
Here
set_on should be set to true or omitted to set Editable regions mode on
Note: The mode is supported in IE 5.5+, otherwise content loaded in RE is shown, but could not be modified by users
Javascript API
To get content of a editor from javascript use the following function:
var editor_content = get_rich(editor_name);
Here
editor_name is name of the desired editor. Eg. for first instance of the editor at the demo page this variable should be set to string 'rich_one'.
Javascript variable editor_content will be set to the content of the editor instance named 'rich_name'
To set new content to a editor from javascript use the following function:
var result = set_rich(editor_name, content);
Here
editor_name is name of the desired editor. Eg. for first instance of the editor at the demo page this variable should be set to string 'rich_one',
content is a variable specifying content to be set.
Javascript variable result is set to true if content was changed successfully and to false otherwise
|
