Login  Register

Re: Asking for a feature here

Posted by Pedro on Jun 05, 2013; 9:06pm
URL: https://support.nabble.com/Colors-in-new-posts-tp7584692p7584701.html

Take a look at this code:
<macro name="editor_color_button">
    <n.put_in_head.>
        <script type="text/javascript">
            var colorTable = "<n.javascript_string_encode.compress.color_table/>";
Nabble.color2 = function(cod,name) {
    var textarea = Nabble.get(textareaID);
    var s = this.getSelection(textarea);
    if( s != "" || (s=prompt("Enter text to make "+name+":","")) != null ) {
        this.setSelection( textarea, "<span style ='color: "+cod+" ;'>" + s + "</span>" );
    }
    textarea.focus();
};

var colorsLoaded = false;
Nabble.openColors = function() {
    Nabble.closeWindows();
    var $colors = $('#color-dropdown');
    if (!colorsLoaded) {
        $colors.html(colorTable);
        colorsLoaded = true;
    }
    $colors.show();
};
        </script>
    </n.put_in_head.>   
    <td class="has-dropdown">
        <div id="color-dropdown" class="editor-dropdown medium-border-color light-bg-color drop-shadow" style="margin-left:1em"></div>
        <button type="button" onclick="Nabble.openColors()" class="toolbar" title="[t]Add colors to your text.[/t]">
            <img src="http://cdn1.iconfinder.com/data/icons/SUPERVISTA/graphics/png/400/palette.png" border="0"  style="vertical-align:middle; hight: 20px; width:20px"/>
            <img src="/images/more.png" width="10" height="10"/>
        </button>
        <n.tooltip use_title="true"/>
    </td>
</macro>

<macro name="color_table">
     <n.comment.>
        You can edit the table below if you want to customize the list of colors.
        Use the 'color_span' command. Example:
        <n.color_span name="red" cod="#F00"/>
    </n.comment.>
    
    <!--Table of colors -->
    <table style="text-align:center">
        <tr>
            <td><n.color_span name="red" cod="#F00"/></td>
            <td><n.color_span name="blue" cod="#0000cd"/></td>
        </tr>
        <tr>
            <td><n.color_span name="green" cod="#008000"/></td>
            <td><n.color_span name="yellow" cod="#FF0"/></td>
        </tr>
    </table>
</macro>
<!--Making the showing of the options -->
<macro name="color_span" parameters="name,cod">
    <a href="javascript:Nabble.color2('[n.cod/]','[n.name/]')" style='text-decoration: none'>
        <span style="color:[n.cod/]"><n.name/></span>
    </a>
</macro> 
Put it on any file you want, then override the editor_toolbar macro to add the button:
            <tr>
                <n.editor_quote_button original_text="[n.original_text/]"/>
                <n.editor_insert_image_button/>
                <n.editor_bold_button/>
                <n.editor_color_button/>
                <n.editor_italic_button/>
                <n.editor_link_button/>
                <n.editor_smiley_button/>               
                <n.editor_more_options_button/>
            </tr>
My test forum.