froala / KMSFroalaEditorBundle

Symfony bundle for Froala WYSIWYG HTML Rich Text Editor.
https://froala.com/wysiwyg-editor
105 stars 33 forks source link

Editor not display with toolbarinline option is true #107

Closed Sophikitis closed 4 years ago

Sophikitis commented 4 years ago

Hello,

So before I ask you all my questions, I use EasyAdmin.

My first problem, when I change the "toolbarInline" option to true in my "kms_froala_editor.yaml" file (fig1), the editor does not display (fig2) whereas if I change it to false, it displays but without the toolbar being displayed online. (fig3) Do you know where the problem may come from? fig1 : Capture d’écran 2019-11-08 à 18 29 27 fig2:

Capture d’écran 2019-11-08 à 18 29 46

fig3:

Capture d’écran 2019-11-08 à 18 28 49

Then, I wanted to know if it is possible when uploading images to take the id of the article as a parameter for example to define a different upload path for each article. For example, for the article with id 1, we will have an upload path: /upload/blog/1/

thank you for your help

sguionni commented 4 years ago

Hello, do you have any error in the console ? I don't use EasyAdmin but something can be in conflict.

sguionni commented 4 years ago

For you questions about image upload, you can find your answers in the official documentation. You can change the upload folder in your form builder.

Sophikitis commented 4 years ago

Hi, Thank you for your answer. I don't have any errors in the console, but from my research it seems that the "inline" option is only available for those who have a license. But in the end, it doesn't bother me because we can then configure the toolbar, so it's okay!

I don't go through formbuilder, in the easyadmin configuration file, I give it the type "froalaEditorType". (fig1)

Capture d’écran 2019-11-13 à 13 37 50

However, I use the "imageUploadUrl" options in the file "kms _froala_editor.yaml" which allows me to intercept when an image is uploaded through my BlogController. (Fig 2 & 3) . Capture d’écran 2019-11-13 à 13 43 09 Capture d’écran 2019-11-13 à 13 44 33

I also use "ImageUploadParams" which allows to add an additional parameter to the request.

And that's where I block it, because I can't dynamically recover the id of my article.

To be as clear as possible, here is the expected behavior for the index ( I have to change, I know :) ) function of my BlogController:

Capture d’écran 2019-11-13 à 13 49 18

sguionni commented 4 years ago

Hello, i'm sorry but i don't know how to use EasyAdmin. Parameters seems to be statics, and you need to change it dynamically (like form builder).

Sophikitis commented 4 years ago

It's okay, I managed to do what I wanted.

In the file easy_admin.yaml, I added the addition of a "custom controller" which is specific to the "articles" entity (in my case)

Capture d’écran 2019-11-28 à 17 25 38

In my controller I extend my class with EasyAdmin.

I overload the createEntityFormBuilder function which will return the form view in the editing and creation actions.

by getting the builder instance back, I can modify the form. In the example, I modify the "body" field by passing it the "FroalaEditorType" type and some options. In my case, it is the "imageUploadFolder" and "imageUploadPath" options that interest me. It is from fields that I will be able to define a predefined and unique route for each item I will create

Capture d’écran 2019-11-28 à 17 33 30

Finally I return the modified instance of $builder which will be used in the edit and new actions of easyAdmin.

As I defined "custom views" for the edit action and new I just have to extend in twig the template of the targeted action of easyAdmin.

For example, for the edit view: Capture d’écran 2019-11-28 à 17 42 32

Here is the result: Capture d’écran 2019-11-28 à 17 53 51

even if it's not perfect yet, it works perfectly.

Thank you for your help and for taking the time to answer :)