Mce Media Bundle Laravel Package

Getting Started

Minimal Setup

1. Installation:

   composer require elao/mce-media-bundle
   

   Add to bundles.php (Symfony 2.x/3.x):

   Elao\MceMediaBundle\ElaoMceMediaBundle::class => ['all' => true],
   

2. Configuration: Add to config/packages/elao_mce_media.yaml (Symfony 4.x+):

   elao_mce_media:
       file_manager_url: '%env(resolve:ELAO_FILE_MANAGER_URL)%'
       image_manager_url: '%env(resolve:ELAO_IMAGE_MANAGER_URL)%'
       tinymce_api_url: '%env(resolve:TINYMCE_API_URL)%'
   

3. First Use Case: Integrate with TinyMCE in a Twig template:

   {{ tinymce_widget(form.field_name, {
       'plugins': 'filemanager,imagemanager',
       'filemanager_browser_callback': 'filemanager_browser_callback',
       'imagemanager_browser_callback': 'imagemanager_browser_callback'
   }) }}
   

Implementation Patterns

Core Workflow

1. TinyMCE Configuration: Extend default TinyMCE settings via tinymce.yaml:

   tinymce:
       selector: 'textarea.richtext'
       plugins: 'filemanager,imagemanager'
       filemanager_browser_callback: 'filemanager_browser_callback'
       external_filemanager_path: '/path/to/filemanager'
   

2. Dynamic Plugin Loading: Use Symfony’s event system to inject media managers dynamically:

   // src/EventListener/MceMediaListener.php
   public function onKernelRequest(GetResponseEvent $event) {
       $request = $event->getRequest();
       if ($request->isXmlHttpRequest() && $request->get('_route') === 'elao_mce_media') {
           $tinymce = $this->tinymceManager->getTinyMCE();
           $tinymce->addPlugin('filemanager', $this->getFileManagerPlugin());
       }
   }
   

3. Asset Integration: Override default assets by publishing the bundle’s resources:

   php bin/console assets:install public
   php bin/console assets:debug
   

4. Form Integration: Use ElaoMceMediaType for forms:

   use Elao\MceMediaBundle\Form\Type\ElaoMceMediaType;
   
   $builder->add('content', ElaoMceMediaType::class, [
       'tinymce' => [
           'plugins' => 'filemanager,imagemanager',
           'filemanager_browser_callback' => 'filemanager_browser_callback',
       ],
   ]);
   

Gotchas and Tips

Common Pitfalls

1. Deprecated Bundle:

   • Last updated in 2014; test thoroughly with modern TinyMCE (v4+).
   • Replace tinymce_widget with tinymce_editor if using Symfony 4+.

2. Configuration Overrides:

   • Bundle uses elao_mce_media namespace; conflicts may arise with other tinymce configs.
   • Fix: Merge configs explicitly:

     # config/packages/tinymce.yaml
     tinymce:
         selector: 'textarea.richtext'
         plugins: ['%tinymce.plugins%', 'filemanager', 'imagemanager']
     

3. CSRF Issues:

   • File/Image uploads may fail due to missing CSRF tokens.
   • Workaround: Extend the bundle’s MediaController to add CSRF protection:

     public function uploadAction(Request $request) {
         $request->request->add(['_token' => $this->csrfTokenManager->getToken('upload')->getValue()]);
         // ... rest of the logic
     }
     

4. Asset Paths:

   • Hardcoded paths in JS/CSS may break in Symfony 4’s asset system.
   • Fix: Override templates via twig.config.paths:

     twig:
         paths:
             '%elao_mce_media%/Resources/views': 'templates/elao_mce_media'
     

Pro Tips

1. Custom File Browsers: Extend the bundle’s MediaBrowser class to add custom logic:

   class CustomMediaBrowser extends \Elao\MceMediaBundle\MediaBrowser {
       public function getFiles() {
           // Add custom filtering logic
           return parent::getFiles();
       }
   }
   

   Register as a service:

   services:
       elao_mce_media.media_browser:
           class: App\CustomMediaBrowser
           tags: ['elao_mce_media.media_browser']
   

2. Debugging Uploads: Enable verbose logging for uploads:

   monolog:
       handlers:
           elao_mce_media:
               type: stream
               path: '%kernel.logs_dir%/elao_mce_media.log'
               level: debug
   

3. Legacy Compatibility: For Symfony 2.x, use elao_mce_media.twig.extension to override Twig functions:

   // app/config/config.php
   'twig' => [
       'globals' => [
           'tinymce_widget' => $app['elao_mce_media.twig.extension']->getTinymceWidgetFunction(),
       ],
   ],
   

4. Performance: Lazy-load media managers to reduce memory usage:

   // src/Service/MediaManager.php
   public function getFileManager() {
       if (!$this->fileManager) {
           $this->fileManager = new FileManager($this->client);
       }
       return $this->fileManager;
   }