View source for Adding custom buttons to atkFckAttribute

{{Howto|Advanced|[[Jeroen van Sluijs]] <jeroenvs@ibuildings.nl>}}

This howto describes how to add custom buttons to the [[atkFckAttribute]] toolbar. When the button is pressed, a popup with a recordlist will be opened. Text from the selected record will be pasted in the WYSIWYG editor.

The following changes must be made: 

=== Fck Javascript ===
Create a javascript file '''fckplugin.js''' to register the related commands. This file can be placed in the ''/application_dir/fckplugins/Custom_button'' directory. Enter the following code:

 FCKCommands.RegisterCommand
 (
   'Custom_button',
   new FCKDialogCommand
   (
     "Custom_button",
     "Custom_button",
     FCKConfig.PluginsPath + "../../../../../dispatch.php?atknodetype=modulename.node&atkaction=selectfragment",
     900,400
   )
 );
 // Create the toolbar
 var oCustomButtonItem = new FCKToolbarButton('Custom_button',FCKLang['DlgCustomButtonTitle']);
 oCustomButtonItem.IconPath = FCKConfig.PluginsPath + "../../../../../fckplugins/Custom_button/Custom_button.gif";                                                       
 FCKToolbarItems.RegisterItem('Custom_button',oCustomButtonItem);

900,400 Represents the size of the popup dialog that will be opened.

=== Icon ===
Create your own '''Custom_button.gif''' icon and add it to the ''fckplugins/Custom_button'' directory.

=== Define action in node ===
Create the selectfragment action:
    function action_selectfragment()
    {
      $this->addFlag(NF_NO_ADD|NF_READONLY);
      $adminhandler = &parent::getHandler("admin");
      $adminhandler->action_admin();
    }

Define recordActions to create a 'select and paste' button (see [[Custom_(record)_actions]] as well):
    function recordActions($record, &$actions, &$mraactions)
    {
      if ($this->m_action === "selectfragment")
      {
        $actions["insert_text"]= session_url(dispatch_url($this->atknodetype(),
                                             "insert_text",
                                             array("text"=>$record["text"])));
      }
    }

The insert_text action creates the javascript and uses a renderBox to execute this javascript for inserting text into the fck-editor. This window will not be showed, since it is immediately closed:
    function action_insert_text()
    {      
      $javascript_with_text = 'var oEditor = window.parent.InnerDialogLoaded();
                               oEditor.FCK.InsertHtml("'.str_replace("\"","\\\"",$this->m_postvars['text']).'");
                               window.parent.close();';          
      $page = &$this->getPage();
      $ui = &$this->getUi();
      $output = $ui->renderBox(array("title"=>"Insert text",
                                     "content"=>"<script language='javascript'>$javascript_with_text</script>"));
      $this->addStyle("style.css");
      $page->addContent($this->renderActionPage("insert_text", $output));
    }

=== Fck config file ===
Add the following line to: ''atk\attributes\fck\fckconfig.js''

 FCKConfig.Plugins.Add('Custom_button',null,FCKConfig.PluginsPath + '../../../../../fckplugins/');

Now, you can add your 'Custom_button' to any toolbarset in ''fckconfig.js''.