Merge pull request #8 from johnkrovitch/bugfix/change-form-type

Bugfix/change form type

assets/js/components/helpers/OptionsHelper.js

@@ -0,0 +1,28 @@
+export default class OptionsHelper {
+    static initializeOptions(defaults, options) {
+        if (!options) {
+            options = {};
+        }
+        return Object.assign(defaults, options);
+    }
+
+    static getDOMElement(selector) {
+        let element = document.querySelector(selector);
+
+        if (!element) {
+            throw new Error('No DOM Element with selector "' + selector + '" has been found');
+        }
+
+        return element;
+    }
+
+    static getDOMNodeList(selector) {
+        let elements = document.querySelectorAll(selector);
+
+        if (!elements.length) {
+            throw new Error('No DOM Element with selector "' + selector + '" has been found');
+        }
+
+        return elements;
+    }
+}

assets/js/components/media/form/MediaEmbeddedForm.js

@@ -0,0 +1,46 @@
+import OptionsHelper from "../../helpers/OptionsHelper";
+import MediaGallery from "../../gallery/MediaGallery";
+
+export default class MediaEmbeddedForm {
+    constructor(options) {
+        this.options = OptionsHelper.initializeOptions({
+            selector: '.media-embed-form',
+        }, options);
+        this.element = OptionsHelper.getDOMElement(this.options.selector);
+    }
+
+    bind() {
+        // Bind media radio buttons to display and hide form parts according to the selected value.
+        let choices = this.element.querySelectorAll('.media-choice');
+
+        choices.forEach((choice) => {
+            choice.addEventListener('change', (event) => {
+                this.displayFormParts(event.target.value);
+            });
+        });
+    }
+
+    displayFormParts (value) {
+        this
+            .element
+            .querySelectorAll('.media-choice-item')
+            .forEach((element) => {
+                if (element.dataset.src === value) {
+                    element.classList.remove('hidden');
+
+                    if (value === 'choose_from_collection') {
+                        this.createMediaGallery();
+                    }
+                } else {
+                    element.classList.add('hidden');
+                }
+            })
+        ;
+    }
+
+    createMediaGallery() {
+        this.gallery = new MediaGallery();
+        this.gallery.bind();
+        this.gallery.load();
+    }
+};

assets/js/components/upload/modal/UploadModalForm.js

@@ -53,7 +53,6 @@ export default class UploadModalForm {
      * Display form parts according to the selected value.
      */
     displayFormParts (value) {
-
         this
             .element
             .querySelectorAll('.media-choice-item')

assets/js/media.js

@@ -3,6 +3,8 @@ import '../scss/media.scss';
 import MediaGallery from "./components/gallery/MediaGallery";
 import UploadModal from "./components/upload/modal/UploadModal";
 import GalleryModal from "./components/gallery/modal/GalleryModal";
+import MediaEmbeddedForm from "./components/media/form/MediaEmbeddedForm";
+//import MediaTabs from "./components/tabs/MediaTabs";
 
 const Events = {
     UPLOAD_MODAL_SHOW: 'jk_media.upload-modal.show',
@@ -32,3 +34,10 @@ document.addEventListener(Events.GALLERY_MODAL_SHOW, (event) => {
     modal.bind();
     modal.load();
 });
+
+let form = new MediaEmbeddedForm();
+form.bind();
+
+// let tabs = new MediaTabs();
+// tabs.bind();
+

composer.json

@@ -12,7 +12,7 @@
     "minimum-stability": "stable",
     "require": {
         "php": "^7.2",
-        "johnkrovitch/orm-pack": "^0.2",
+        "johnkrovitch/orm-pack": "^1.0",
         "lag/string-utils": "^1.2",
         "liip/imagine-bundle": "^2.2",
         "symfony/form": "^3.0|^4.0",

etc/make/tests.mk

@@ -27,5 +27,5 @@ php-cs-fixer.ci:
 
 # PHPStan
 phpstan.run:
-	bin/phpstan analyse --level=1 src tests
+	bin/phpstan analyse --level=2 src tests
 

phpstan.neon

@@ -0,0 +1,4 @@
+# phpstan.neon
+parameters:
+    excludes_analyse:
+        - 'src/DependencyInjection/Configuration.php'

src/Entity/MediaInterface.php

@@ -2,6 +2,8 @@
 
 namespace JK\MediaBundle\Entity;
 
+use DateTime;
+
 interface MediaInterface
 {
     const TYPE_ARTICLE_THUMBNAIL = 'article_thumbnail';
@@ -40,4 +42,26 @@ public function getSize(): int;
      * Return the Media description.
      */
     public function getDescription(): string;
+
+    public function setId(?int $id): void;
+
+    public function setName(string $name): void;
+
+    public function setDescription(string $description): void;
+
+    public function setFileName(string $fileName): void;
+
+    public function setFileType(string $fileType): void;
+
+    public function setType(string $type): void;
+
+    public function setSize(int $size): void;
+
+    public function getCreatedAt(): DateTime;
+
+    public function setCreatedAt(DateTime $createdAt): void;
+
+    public function getUpdatedAt(): DateTime;
+
+    public function setUpdatedAt(DateTime $updatedAt): void;
 }

src/Form/Type/MediaEmbedType.php

@@ -0,0 +1,56 @@
+<?php
+
+namespace JK\MediaBundle\Form\Type;
+
+use JK\MediaBundle\Validation\Constraints\UploadTypeConstraint;
+use Symfony\Component\Form\AbstractType;
+use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
+use Symfony\Component\Form\Extension\Core\Type\FileType;
+use Symfony\Component\Form\Extension\Core\Type\HiddenType;
+use Symfony\Component\Form\FormBuilderInterface;
+use Symfony\Component\OptionsResolver\OptionsResolver;
+
+class MediaEmbedType extends AbstractType
+{
+    public function buildForm(FormBuilderInterface $builder, array $options)
+    {
+        $builder
+            ->add('media', HiddenType::class, [
+                'attr' => [
+                    'class' => 'cms-media-id-container',
+                ],
+            ])
+            ->add('uploadType', ChoiceType::class, [
+                'choices' => MediaType::getUploadChoices(),
+                'expanded' => true,
+                'attr' => [
+                    'class' => 'cms-media-choice',
+                ],
+            ])
+            ->add('upload', FileType::class, [
+                'attr' => [
+                    'class' => MediaType::UPLOAD_FROM_COMPUTER,
+                ],
+                'label' => false,
+                'help' => 'media.form.upload_help',
+                'required' => false,
+            ])
+            ->add('gallery', GalleryType::class)
+        ;
+    }
+
+    public function configureOptions(OptionsResolver $resolver)
+    {
+        $resolver
+            ->setDefaults([
+                'attr' => [
+                    'class' => 'media-embed-form',
+                ],
+                'constraints' => [
+                    new UploadTypeConstraint(),
+                ],
+                'label' => false,
+            ])
+        ;
+    }
+}

src/Form/Type/MediaType.php

@@ -75,12 +75,12 @@ public function configureOptions(OptionsResolver $resolver)
         $resolver
             ->setDefaults([
                 'attr' => [
-                    'cms-media-form',
+                    'class' => 'media-embed-form cms-media-form',
                 ],
                 'by_reference' => true,
                 'data_class' => Media::class,
-                'label' => 'cms.article.thumbnail',
-                'help' => 'cms.article.thumbnail_help',
+                'label' => 'media.form.label',
+                'help' => 'media.form.help',
             ]);
     }
 }

src/Form/Type/UploadModalType.php

@@ -27,12 +27,9 @@ public function buildForm(FormBuilderInterface $builder, array $options)
                     'class' => MediaType::UPLOAD_FROM_COMPUTER,
                 ],
                 'label' => false,
-                //'end_point' => 'article_content',
                 'required' => false,
-                //'media_target' => 'modal-media-hidden-target',
-            ])
-            ->add('gallery', HiddenType::class, [
             ])
+            ->add('gallery', HiddenType::class)
         ;
     }
 

src/Resources/translations/messages.fr.yaml

@@ -18,3 +18,10 @@ media:
         upload_from_computer:  Uploader un fichier de l'ordinateur
         upload_from_url: Télécharger depuis une url
         choose_from_collection: Choisir dans la gallerie
+
+    form:
+        label: Media
+        help: Télécharger un fichier depuis votre ordinateur ou depuis la gallerie
+        upload_help: Télécharger un fichier de votre ordinateur
+        thumbnail: Minitature de l'article
+        thumbnail_help: Minitature affichée sur la page d'accueil ou dans les catégories