View Helper Container

The code for this file can be found here.

The container class acts as the main engine behind the view helper. It also allows us to insert a placeholder into the view/layout that will auto load all the required javascript includes. I have build mine with the php compressor active but the principles are the same should you not want to use it.

To start with you will need to create a container file relative to your TinyMce.php file. I use “TinyMce/Container.php”.

First thing we need to do is create the appropriate class and populate some variables that will contain our default values.

class MyLibrary_View_Helper_TinyMce_Container
{

    protected $_enabled = false;

    protected $_isXhtml = false;

    protected $_localPath = '/scripts/tinymce/';

    protected $_plugins = array('style', 'layer', 'table', 'save',
                                                 'advhr', 'advimage', 'advlink', 'emotions',
                                                 'iespell', 'insertdatetime', 'preview', 'media',
                                                 'searchreplace', 'print', 'contextmenu', 'paste',
                                                 'directionality', 'fullscreen', 'noneditable', 'visualchars',
                                                 'nonbreaking', 'xhtmlxtras', 'imagemanager', 'filemanager','template');

    protected $_themes = array('simple', 'advanced');

    protected $_languages = array('en');

    protected $_defaultEditor = array('mode'                => 'textareas',
                                                                          'theme'               => "simple",
                                                                          'selector'    => "tinyMceEditor",
                                                                          'css'                 => ""
                                                                         );

    protected $_editors = false;

    protected $_templates;

    /**
     * View Instance
     *
     * @var Zend_View_Interface
     */
    public $view = null;
}

If your familiar with TinyMce a lot of this will seem familiar and easy enough to configure.

Next you will need to create and populate some methods. most of these ones shoud be very straight forward and are mainly dedicated getters and setters.

public function __construct()
    {
        $this->_templates = $this->_buildTemplates();
    }

    public function setView(Zend_View_Interface $view)
    {
        $this->view = $view;
    }

    public function enable()
    {
        $this->_enabled = true;
        return $this;
    }

    public function disable()
    {
        $this->_enabled = false;
        return $this;
    }

    public function isEnabled()
    {
        return $this->_enabled;
    }

    public function setLocalPath($path)
    {
        $this->_localPath = (string) $path;
        return $this;
    }

    public function getLocalPath()
    {
        return $this->_localPath;
    }

    public function useLocalPath()
    {
        return (null === $this->_localPath) ? false : true;
    }

    public function setEditorOptions($config)
    {
        $this->addEditorOptions($config);
    }

Now we try and tackle the more interesting methods.

setCompressorOptions() allows us to set/override specific options for use in TinyMce.

    public function setCompressorOptions($location = '/scripts/tinymce/', array $plugins = null, array $themes = null, array $languages = null)
    {
        if (is_dir($_SERVER['DOCUMENT_ROOT'].$location)) {
                        $this->_localPath = $location;
        } else {
                throw new Exception('Could not verify the location of Tiny MCE Javascript components');
        }

        if ($plugins) {
                $this->_plugins = $plugins;
        }
        if ($themes) {
                $this->_themes = $themes;
        }
        if ($languages) {
                $this->_languages = $languages;
        }
    }

addEditorOptions() builds the relevant options for the editor. In order to handle multiple editable areas on a page it checks the “selector” that has been passed in and stores it by the selector. This ensures that you are not getting duplicate code trying to load.

public function addEditorOptions($config)
    {
        if ($config instanceof Zend_Config) {
                $config = $config->toArray();
        }
        // check for existsing css selector and overwrite
        if (isset($config['editor_selector'])) {
                $this->_editors[$config['editor_selector']] = $config;
        } else {
                $this->_editors['no_selector'] = $config;
        }

    }

I extended my version of the helper to also allow me to specify prebuilt templates. This is accessed and built through the _buildTemplates() method. As you will see I use a Zend_Db_Table object to get the templates that are to be used. This basically builds the required javascript string for loading templates. In order for this to work as intended I used long notation for it and required the following fields

  1. “name”: nameof teh template to display
  2. “filename”: name of the file to use (remember to change the path to your own location, orinclud ethe path in your field)
  3. “description”: a description of the template
protected function _buildTemplates()
        {
                $table = new content_templates();
                $rows = $table->fetchTemplates();

                if (count($rows) > 0) {

                        $templates = array();

                        while ($row = $rows->current()) {
                                $templates[] = '{
                                        title : "'.$row->name.'",
                                        src : "/files/pageTemplates/'.$row->filename.'",
                                        description : "'.$row->description.'"
                                }';
                                $rows->next();
                        }

                        return ', template_templates : [' . PHP_EOL . join(', ', $templates) . ' ] ';
                }

                return '';
        }

We now get to the magic methods that will generate the javascript output we need

First we start with _renderCompressor(). This will build the relevant javascript for the compressor to initialise from all the values that we have passed in.

protected function _renderCompressor()
    {
        $plugins = join(',',$this->_plugins);
        $themes = join(',',$this->_themes);
        $languages = join(',',$this->_languages);

        $compressor =  "
        
                ";
        return $compressor;
    }

Next we have a double hit with _renderInit() and _renderEditor().

_renderInit() is a wrapper function that builds the init for each editor specified by selector

_renderEditor actually builds the javascript string to output.

protected function _renderInit()
        {
                $init = '';
                return $init;
        }    

        protected function _renderEditor($config = null)
        {
                $editor = '
                        tinyMCE.init({' . PHP_EOL;

                if (isset($config['mode'])) {
                        $editor .= ' mode: "'.$config['mode'].'" ' . PHP_EOL ;
                        unset($config['mode']);

                        if (!isset($config['plugins'])) {
                                $editor .= ', plugins: "'.join(',',$this->_plugins).'" '. PHP_EOL;
                        }

                        foreach($config AS $key => $value) {
                                if (is_array($value)) {
                                        $value = join(', ',$value);
                                }
                                switch ($key) {
                                        default:
                                                $editor .= ', '.$key.': "'.$value.'" '.PHP_EOL;
                                                break;
                                }
                        }
                }

                $editor .= $this->_templates;

                $editor .= '
                        });'. PHP_EOL;
                return $editor;
        }

And to tie it all together we use a __toString(). As we will eventually use this as an object in out view/layout the ultimate idea is to just echo out the helper in the same manner as other static helpers that have been implemented by the Zend team.

public function __toString()
    {
        if (!$this->isEnabled()) {
            return '';
        }

        $html  = $this->_renderCompressor() . PHP_EOL
               . $this->_renderInit() . PHP_EOL;
        return $html;
    }

Thats the hard work done. Now you can make use of the helper at any point by registering the view helper and then echoing it out. bear in mind that you will need to make sure that you set the right parameters if you access it directly from the view.

Now we can move onto the Form Element