richtexteditor.lzx

<!---
      @topic Incubator
      @subtopic Rich Text Editor
  -->
<library>
<include href="../shadowbox.lzx"/>
<include href="../custombutton.lzx"/>
<include href="../baseedittext.lzx"/>
<include href="../lzcombobox.lzx"/>
<include href="../borderinput.lzx"/>
<include href="../textstyle.lzx"/>
    
<include href="richtexttoolbar.lzx"/>
<include href="richtexteditarea.lzx"/>
<include href="formatfontface.lzx"/>
<include href="formatfontcolor.lzx"/>
<include href="formatbtn.lzx"/>
<include href="linkdialog.lzx"/>

<!--- This is a complete, standalone rich text editor with toolbar. Just instantiate 
    it as a normal view and you'll have a rich text editor with toolbar controls for 
    bold, underline, italic, font color, font face, font name, hyperlink, remove 
    format. 
-->
<class name="richtexteditor" width="100%" x="0" height="100%">

    <method name="getText">
        return this.messagebody.txt.getHTMLText();
    </method>
    <method name="setText" args="txt">
        this.messagebody.txt.setHTMLText(txt);
    </method>
    
    <method name="getHTMLText">
        return this.messagebody.txt.getHTMLText();
    </method>
    <method name="setHTMLText" args="txt">
        this.messagebody.txt.setHTMLText(txt);
    </method>
    
    <handler name="oninit">
        //Fixes a reference in the rich-text editor to the Toolbar
        this.messagebody.txt.toolbar = this.toolbar;
    </handler>
    
    <!-- declare toolbar and include desired tools -->
    <richtexttoolbar name="toolbar" editor="$once{ parent.messagebody.txt }" height="30" width="${parent.width-5}" x="2" y="0" bgcolor="0xD4D7E5">
        
        <formatbtn name="boldbtn" format="bold" iconname="bold" icony="4" x="7" y="${(parent.height-this.height)/2}" width="20" options="ignorelayout" editor="$once{ parent.editor }" showrightedge="false" showleftedge="true" showrightborder="true" showleftborder="false" inactivetooltiptext="Bold" activetooltiptext="Remove bold"/>
        
        <formatbtn name="underlinebtn" format="underline" iconname="underline" options="ignorelayout" editor="$once{ parent.editor }" x="$once{parent.boldbtn.x + parent.boldbtn.width}" y="${(parent.height-this.height)/2}" width="20" inactivetooltiptext="Underline" activetooltiptext="Remove underline" showrightedge="false" showleftedge="false" showrightborder="true" showleftborder="true"/>
        
        <formatbtn name="italicbtn" format="italic" iconname="italic" icony="4" inactivetooltiptext="Italics" editor="$once{ parent.editor }" width="19" x="$once{parent.underlinebtn.x + parent.underlinebtn.width}" y="${(parent.height-this.height)/2}" options="ignorelayout" showrightedge="true" showleftedge="false" showrightborder="false" showleftborder="true" activetooltiptext="Remove italics"/>
        
        <view width="${parent.italicbtn.x + parent.italicbtn.width}"/> 
        
        <formatfontface name="fontfacecb" editor="$once{ parent.editor }" y="${(parent.height-this.height)/2}"/>
        <formatfontcolor name="fontcolorcb" y="${(parent.height-this.height)/2}"/>
        
        <formatbtn name="linkbtn" format="link" iconname="link" icony="3" y="${(parent.height-this.height)/2}" inactivetooltiptext="Create link" activetooltiptext="Remove link">
            <method name="doClick" args="ignore=null"> 
                parent.parent.linkpanel.show();
            </method>
        </formatbtn>
        
        <include href="formatremovebtn.lzx"/>
 
    </richtexttoolbar>
    
    <!-- include any RTE dialog panels -->
    <linkdialog name="linkpanel" editor="$once{ parent.messagebody.txt }"/>

    <!-- include a RTE text area -->
    <shadowbox name="messagebody" x="2" y="${parent.toolbar.height + parent.toolbar.y}" width="${parent.width-5}" height="${parent.height - this.y - 30}">
        <richtexteditarea name="txt" x="0" y="0" height="${parent.height}" width="${parent.width}" defaultfontname="Verdana" defaultfontsize="11" defaultfontcolor="0x336699" border="10">  
            <handler name="oncurrentformat" args="fmt">
                //Redirect the Event to the Toolbar
                parent.parent.toolbar.oncurrentformat.sendEvent(fmt);
            </handler>                                   
        </richtexteditarea>
    </shadowbox>
    
</class>
</library>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2007-2010 Laszlo Systems, Inc. All Rights Reserved.                    *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
<!-- @LZX_VERSION@                                                         -->

Cross References

Includes

Classes