Announcement

Do not use the forums to submit bug reports, feature requests or patches, submit a New Ticket instead.

#1 2005-12-03 11:30:34

jive
Xinha Community Member
Registered: 2005-12-03
Posts: 14

Creating a Custom Button

Can Somebody post some clear, step-by-step instructions on how to create and add a custom button to the Xinha toolbar.

I checked the documentation and the forums and I see nothing regarding this...

Offline

#2 2005-12-07 06:04:31

Ecco
Xinha Community Member
From: Netherlands
Registered: 2005-03-08
Posts: 48
Website

Re: Creating a Custom Button

Here, this is what I do. I found this on this forum.

I added an upload-popup. ("Bestanden uploaden" means to upload files.) Just before the line "HTMLArea.startEditors(xinha_editors);" I put :

xinha_config.URIs["upload"] = '/xinha/plugins/Linker/upload.php';

cfg.btnList["upload"] =
[ "bestanden uploaden", "/xinha/images/save.gif", true, function(e) { xinha_editors.myTextArea._popupDialog(xinha_config.URIs["upload"], null, null); } ];

cfg.toolbar.push(["upload"]);

Offline

#3 2005-12-07 12:53:29

jive
Xinha Community Member
Registered: 2005-12-03
Posts: 14

Re: Creating a Custom Button

I don't have that line: "HTMLArea.startEditors(xinha_editors);" anywhere..... I checked both my config file and the htmlarea.js file.... are you using an older version?

Offline

#4 2005-12-09 07:05:31

ray
Xinha Administrator
From: Germany
Registered: 2005-03-23
Posts: 521
Website

Re: Creating a Custom Button

There´s a function for this in Xinha

/** Helper function: register a new button with the configuration.  It can be
 * called with all 5 arguments, or with only one (first one).  When called with
 * only one argument it must be an object with the following properties: id,
 * tooltip, image, textMode, action.  Examples:
 *
 * 1. config.registerButton("my-hilite", "Hilite text", "my-hilite.gif", false, function(editor) {...});
 * 2. config.registerButton({
 *      id       : "my-hilite",      // the ID of your button
 *      tooltip  : "Hilite text",    // the tooltip
 *      image    : "my-hilite.gif",  // image to be displayed in the toolbar
 *      textMode : false,            // disabled in text mode
 *      action   : function(editor) { // called when the button is clicked
 *                   editor.surroundHTML('<span class="hilite">', '</span>');
 *                 },
 *      context  : "p"               // will be disabled if outside a <p> element
 *    });
 */

I used it like this for making a "save"-button:

xinha_config.registerButton("save_submit", "Speichern", [_editor_url+"images/ed_buttons_main.gif",9,1], false, function() {document.getElementById("editor_form").onsubmit();document.getElementById("editor_form").submit()});
    
    xinha_config.toolbar =
     [
        ["save_submit",  ....

Offline

#5 2005-12-09 07:16:55

ray
Xinha Administrator
From: Germany
Registered: 2005-03-23
Posts: 521
Website

Re: Creating a Custom Button

If you still have questions, maybe you can tell us what your button should do

Offline

#6 2006-01-19 20:02:36

jive
Xinha Community Member
Registered: 2005-12-03
Posts: 14

Re: Creating a Custom Button

Ray, Thank you for your response so far. What I am trying to do is this:

I am creating a upload module for users to upload word and pdf files into a folder. The file is named and added to the folder on upload and the name and path to the file is added into the database. The custom button  will be a "pdf" or "word" icon. When the user hilights some text in the editor and then clicks this new button a pop up (similar to the "insert web link") pop up is displayed that has a dropdown box of all of the uploaded files. When a file is selected, the highlighted text then links to the file allowing for download.

I hope I was clear in explaining.

Jonas

Offline

#7 2006-01-20 14:38:13

ray
Xinha Administrator
From: Germany
Registered: 2005-03-23
Posts: 521
Website

Re: Creating a Custom Button

oh, looks like creating the button is the least of your tasks smile  I suggest you grab one of the simpler plugins (one that has a popup) and tweak it to do what you need

Offline

#8 2006-01-20 16:51:54

jive
Xinha Community Member
Registered: 2005-12-03
Posts: 14

Re: Creating a Custom Button

Actually it should be just a matter of duplicating the "add web link" button and renaming it to say "pdf" or "word" and then in place of the url text box is instead a dropdown box that lists the uploaded files..., selecting one of the files will make the text a link to that file...

Offline

#9 2006-01-21 07:21:24

ray
Xinha Administrator
From: Germany
Registered: 2005-03-23
Posts: 521
Website

Re: Creating a Custom Button

The "Insert Web Link" button calls the function HTMLArea.prototype._createLink where the the popup is hardcoded. So to use another popup you either have to duplicate this function or hack it.
Why don´t you use the exquisit Linker plugin? you can configure that to show the contents of a give directory.

Offline

#10 2006-01-21 14:11:27

jive
Xinha Community Member
Registered: 2005-12-03
Posts: 14

Re: Creating a Custom Button

actually the linker plugin looks perfect. I'm having problem installing it though... Can you give me clear instructions how to install it?

Offline

Board footer

Powered by FluxBB