Handle tags on cards

[julbrs]

Manage tags on cards

Be able to assign tags.

Show tags in the card index page.

Actually we see a fixed list here: (Gospel Chant Religieux)

we want to manage tag info in a Nomenclature.

tasks:

• add tag on Nomenclature Entity model
• update the database
• add tag inside the admin view
• add tag on the index Nomenclature page

[analuspi]

Hello Julien,

I can easily identify the tags by inspecting the page online. But in the archives I'm having a hard time to manage and identify the content, because all the files are html.twig and they have a different infrastructure that I'm used to work. Should I use some application to convert them to pure html so I can edit and visualise in Chrome?

When I would be able to edit the tags in the cards, do you want me to edit manually (writing in the html) or find some way to generate them automatically with JS?

[julbrs]

Allo Ana,

in Symfony project we are generally using a templating system named twig (the templace extension is .html.twig). The documentation for twig is here. It allow to write html with special feature to work with data coming from symfony controllers.

So currently in show.html.twig you have:

        <div class="tags">
          <span class="tag">Gospel</span>
          <span class="tag">Chant</span>
          <span class="tag">Religieux</span>
        </div>

So the tags are hardcoded in the template. You will have to change it to something like:

<div class="tags">
  {% for tag in tags %}
  <span class="tag">{{tag.name}}</span>
  {% endfor %}
</div>

But for that you must define a variable tags that will be available at the template level inside the controller that is calling the template, so here.

Instead of passing only the nomenclature variable, you must put a second variable named tags. Or maybe you will have a property tags under nomenclature so you can use directly the nomenclature.tags inside the template...

It is really not possible to edit that as pure HTML inside Chrome as the HTML output must be dynamically created depending on the list of tags for the specific nomenclature.

When you say:

generate them automatically with JS?

Can you explain a bit more maybe you can help us more on this side !

THANKS !

On my side I have created a platform api project and it seems pretty interesting. I will update the repository here with a first idea and I will share that to you and Michael this end of week ! (it really separate frontend and backend, and we can reuse all backend feature already developed. we just have to work on a full frontend part, in ReactJS by default)

[analuspi]

Allô Julien,

Merci pour la reponse rapide.

generate them automatically with JS?

It was just a crazy idea that I had... Specially because I worked in the past with string manipulation and text mining. I used libraries to generate words synonyms and frequency word clouds from texts. I don't know if it is possible with JS (but i could do some research).

For now, I'm gonna start with React.

Bonne journée

[julbrs]

Yes I have checked your portfolio :)

All is possible with JS frontend backend you can do all, just your imagination is the limit 😄

Very interessed by the react part, I am still working on api-platform during my few lunch and night and i will share with you what I have tomorrow or Sunday. For the moment I've got quite the same look and feel, and I just want to add the nomenclature part to see how it look like.

With React you dont need anymore jquery so you can imagine load the nomenclature more 'naturally'.

[analuspi]

Allô Julien,

As far as I know I will need to code this with php? Or could I code with JQuery or ES6 and add in a script in show.html.twig?

Where's the content for the cards? Is there any material that describes all the cards and tags associated to each card? I will have to hardcode this in an array (or object) or is there any away to get them from a database?

Merci, Ana

[julbrs]

Allo I am late about my api-platform work sorry !

Regarding this task, good question about the content.

The classic way in Symfony is the following:

• data is located in the database. Entities stored in the database are represented in the Entity/ folder in the project. If you want to add a tags information on the Nomenclature entity then you can use the make:entity tool (https://symfony.com/doc/current/bundles/SymfonyMakerBundle/index.html)
• then it will be availble in the template as nomenclature.tags as you already provide the nomenclature variable in the controller.

Actually there is no way to do this task via JS because the data is not available in an API.

Some docs:

• add field to existing entity: https://symfony.com/doc/current/doctrine.html#migrations-adding-more-fields
• render a template in a controller: https://symfony.com/doc/current/controller.html#rendering-templates
• create template: https://symfony.com/doc/current/templates.html#creating-templates

It is really an MVC model

• Model is Entities
• View is the twig templates
• Controller is Controller

Let me know if it is better !

[analuspi]

Allo Julien, ça va?

I created the entity tags . I added just the property title , field string , field length 255 and no for nullable. Should I add another property? Should I create a migration?

The next step is to code the for each in show.html.twig , right? Then gitflow for you and the others?

Merci, Ana

[julbrs]

Then it will be probably needed to add a reference into Nomenclature of this tag like we have already done for other entities.

Then yes a migration !

Then modify the show.html.twig !

And you can start right now by putting your code in a specific branch. Follow this :

run git flow init to init the git flow setup

then git flow feature start add-tags-on-cards to start a feature on adding tags on cards (choose the name you want it will create a corresponding branch)

then do you first commit / push on the branch

git add .
git commit -m "first step on tags on cards"
git push

One day we need to put this in the README 😄

Once it is pushed we will be able to see / review it. The process is to create a PR on top of the branch this is the next step !

THANKS !

[analuspi]

Allo Julien,

I relationated Tags and Nomenclature and I did a migration, but I got some doubts in the type of relationship (I put OneToMany , I hope this would be fine). When I finished the issue I can write the gitflow step in the README (would you like to write the other steps as well?).

Have a nice weekend, Ana

[julbrs]

OK we can check that once the PR is created.

Yes if you can document the gitflow process it can be really helpful 🙏 you can include the edit of README.md inside the current branch for example.

Thanks !

[analuspi]

Allô Jullien, ça va bien? I have a few doubts left from our last conversation... How i test my code with PHP (with JS I use outputs in the console + alerts + debugging tool). Why we had to use git stash in order to do my first push in git flow?

Thanks Have a nice week, Ana

[julbrs]

Hello :)

testing code in PHP is ... just run it and see if it crash ! Symfony come with a good debug environment (the little bar at the bottom)and you have error message printed direclty in the browser :

if you want to print thing you can use var_dump($my_var) or print $my_var. Not very clean but work !

git stash was needed last time because you start developing on master branch. there is no way to create a feature branch from an existing modified work state. stashing is the best way here ! doc here

[analuspi]

Hello Julien, Thank you for your answers. I tried to erase the code from Tags entity (to add the modifications), but it seems to return a few errors in the Nomenclature.php file (syntax error, unexpected end of file, expecting function (T_FUNCTION) or const). So I'm going to do a git checkout and try to do the modifications using the entity maker.

[julbrs]

OK lol this is probably because the php file is broken somewhere :D we can check that tomorrow if you want ! see you !

[julbrs]

@analuspi Hello do you have closed the pull request associated ?

[analuspi]

Allô Julien, I deleted the branch (I shouldn't have submitted without testing). I found that the main error it was in php code from the twig template, but i was having problems to fix the name of the entity too (because I'm not used with php and Symfony). I will start to dedicated more time to the project after 20 octobre and I could create a new branch for tags.

[StaudenmannM]

We can use something like select2 but she should be able to add new tag