How to integrate the Fork CMS MediaLibrary Module into a custom Fork CMS Module?

The example below shows you how easy it is to add a MediaGroup for images to your custom module. You can also look at the MediaGalleries module, because in that module the mediaGroup has been integrated as well.

Overview:

Integration in Backend
Integration in Frontend

Integration in Backend

In your Entity

use Backend\Modules\MediaLibrary\Domain\MediaGroup\MediaGroup;

/**
 * @var MediaGroup
 *
 * @ORM\OneToOne(
 *      targetEntity="Backend\Modules\MediaLibrary\Domain\MediaGroup\MediaGroup",
 *      cascade={"persist"},
 *      orphanRemoval=true
 * )
 * @ORM\JoinColumn(
 *      name="mediaGroupId",
 *      referencedColumnName="id",
 *      onDelete="cascade"
 * )
 */
private $mediaGroup;

You can choose whatever variable name you like ($mediaGroup). Just remember to use that variable name all across the following code then.

public function getMediaGroup(): MediaGroup
{
    return $this->mediaGroup;
}

You will also need to add set $this->mediaGroup = $mediaGroup in your constructor (and create) and update method.

In your Form

Symfony FormType class:

use Backend\Modules\MediaLibrary\Domain\MediaGroup\MediaGroupType;

$builder->add(
    'mediaGroup',
    MediaGroupType::class,
    [
        'label' => 'lbl.MediaConnected', // Or 'Screenshots', 'Trailers', 'Preview images', ...
        'constraints' => [new Valid()],
        'minimum_items' => 1, // optional
        'maximum_items' => 5, // optional
    ]
);

As you can see, the label can be anything you want.

Or if you only want a single media item to be connected you can use the SingleMediaGroupType

use Backend\Modules\MediaLibrary\Domain\MediaGroup\SingleMediaGroupType;

$builder->add(
    'mediaGroup',
    SingleMediaGroupType::class,
    [
        'label' => 'lbl.MediaConnected', // Or 'Screenshots', 'Trailers', 'Preview images', ...
        'constraints' => [new Valid()],
    ]
);

This will set the options minimum_items and maximum_items to 1 and add the constraint to enforce it. These options are also available on the MediaGroupType if you would want a different range. To help the end user there is also some client side validation that will indicate when more items need to be connected or too many items are connected.

In your Create Command class

use Backend\Modules\MediaLibrary\Domain\MediaGroup\MediaGroup;
use Backend\Modules\MediaLibrary\Domain\MediaGroup\Type as MediaGroupType;

/**
 * @var MediaGroup
 */
public $mediaGroup;

In your __construct()

$this->mediaGroup = MediaGroup::create(MediaGroupType::fromString('image'));

Possible MediaGroupType values are; "all", "audio", "file", "image", "image-file", "image-movie", "movie". Which defines which MediaItem files are allowed in this MediaGroup.

In your Create Command Handler class

Just pass the media group entity to your custom entity constructor.


[View example](https://github.com/forkcms/forkcms/blob/master/src/Backend/Modules/MediaGalleries/Actions/MediaGalleryAdd.php): `/src/Backend/Modules/MediaGalleries/Actions/MediaGalleryAdd.php`

### In your Update Command class

```php
use Backend\Modules\MediaLibrary\Domain\MediaGroup\MediaGroup;
use Backend\Modules\MediaLibrary\Domain\MediaGroup\Type as MediaGroupType;

/**
 * @var MediaGroup
 */
public $mediaGroup;

In your __construct()

$this->mediaGroup = $customEntity->getMediaGroup();

OR if you are integrating mediaGroup in an existing module, use the following:

$this->mediaGroup = $customEntity->getMediaGroup();

if (!$this->mediaGroup instanceof MediaGroup) {
    // Note: I'm using 'image' in this example, use what you want, ...
    $this->mediaGroup = MediaGroup::create(MediaGroupType::fromString('image'));
}

In your Add and Edit template

This will result in:

{{ form_widget(form.mediaGroup) }}

Example: src/Backend/Modules/MediaGalleries/Layout/Templates/Add.html.twig and src/Backend/Modules/MediaGalleries/Layout/Templates/Edit.html.twig

Integration in Frontend

Option 1: in your Twig template

You can use the provided media_library_widget TwigFunction.

{# Slider widget #}
{{ media_library_widget('Slider', blogArticle.mediaGroup.id) }}

Possible values in the core are: 'Slider', 'Lightbox', 'Listing', 'OneImage', 'OneRandomImage'. But you can easily create your own by just duplicating one of these files.

Option 2: in your PHP class

// Blog detail action
class Detail
{
    public function loadData()
    {
        $this->blogArticle = new BlogArticle();
    }

    public function parse()
    {
        $this->tpl->assign(
            'imagesWidget',
            // We can create widget for the MediaGroup id
            $this->get('media_library.helper.frontend')->parseWidget(
                'Slider',
                $this->blogArticle->getMediaGroup()->getId(),
                'MyCustomOptionalTitle'
            )
        );
    }
}

Note: You can optionally give in a fourth parameter $module (default $module = "Media"), so you can create a Media widget in your own Custom module.

View example: src/Frontend/Modules/MediaGalleries/Widgets/Gallery.php

Fork CMS Documentation