Hi, We also made several sub-classes of Magritte classes and / or components. This causes a lot of problems because when we upgraded Magritte it was difficult. It also shows that Magritte (the core classes) cannot change much because the impact will be high for most users of Magritte. This makes us think that Magritte is not easy to use or customise. And it also appears as if all the custom changes are not being generalised into the framework. Perhaps us users of Magritte should stand back and discuss our changes and issues more so that we can improve it? I suppose we need some magritte champion(s) to take it somewhere. To get more flexibility with Magritte styling we are using CSS and classes more in stead of rendering in a different way. Often one can get away with adding a CSS class and changing the style sheet. This is a bit fluffy, but it there's a lot of stuff to talk about here. In principle, are you sharing my frustration with Magritte? Cheers Otto On Sat, Mar 18, 2017 at 7:40 PM, Mariano Martinez Peck <marianopeck@gmail.com> wrote:
Hi Asbath,
Some answers below. But a general comment is that the typical case to customize magritte is by subclassing and then somehow use your own subclasses instead of magritte ones.
On Fri, Mar 17, 2017 at 3:54 AM, Asbath Sama biyalou <asamabiyalou@yahoo.com> wrote:
Hello.
I am using Magritte to generate reports for a pharo class. I want to customize generated components in order to have a better design.
My class is Match
Object subclass: #Match instanceVariableNames: 'date_match hour_match status actions stadium comments teams goals1 goals2 competition' classVariableNames: '' category: MyProject-Entity'
Descriptions for some variables.
Stadium is also a Class.
Match>>descriptionStadium <magritteDescription> ^ MASingleOptionDescription new label: 'Stadium'; priority: 305; accessor: #stadium; options: Team allStadiumsName; componentClass: TBSMagritteSelectListComponent; beRequired; yourself
Match>>descriptionTeams <magritteDescription> ^ MAMultipleOptionDescription new label: 'Teams'; priority: 805; accessor: #teams; options: Team allTeamsName; componentClass: MAMultiselectListComponent; yourself
The generated component in the form is not very pretty. I want to have multiple checkbox.
In my case, I have customized ALL the components I use for Magritte. That is, I have my own Fa version (Fa is my package prefix). So I have FaMAMultiselectListComponent subclass of MAMultiselectListComponent. I have FaTBSMagritteSelectListComponent, subclass of TBSMagritteSelectListComponent , etc... so basically, you subclass and override the parent methods you want. Most common methods you need to override are renderEditorOn: html or renderViewerOn: html etc...but that depends on WHAT you want to change and in WHICH component. Note they are all subclasses of MADescriptionComponent.
You can also set your own properties in the magritte so that you can read them at your component level. For example, above I could say:
Match>>descriptionTeams <magritteDescription> ^ MAMultipleOptionDescription new label: 'Teams'; priority: 805; accessor: #teams; options: Team allTeamsName; propertyAt: 'showInMultipleCheckboxs' put: true; componentClass: FaMAMultiselectListComponent; yourself
Then in the rendering code of your subclass FaMAMultiselectListComponent you can do:
(self magritteDescription propertyAt: 'showInMultipleCheckboxs') ifTrue: [ self renderAsMultiCheckboxsOn: html... ] ifFalse: [ ... ]
Of course, you can even define the accessors for #showInMultipleCheckboxs as extension methods in MADescription
To avoid having to define FaMAMultiselectListComponent for each MAMultipleOptionDescription .. well, there are many ways. But I guess that is for a later topic. Ask me if you want this.
Match>>descriptionStatus <magritteDescription> ^ MASingleOptionDescription new label: 'Status'; priority: 505; accessor: #status; options: #('Pas en cours' 'En Cours' 'Mi-temps' 'Terminé'); componentClass: TBSMagritteSelectListComponent; yourself
For the report I use the class SEMatchReport
TBSMagritteReport subclass: #SEMatchReport instanceVariableNames: 'report' classVariableNames: '' category: 'MyProject-Components'
SEMatchReport class>>from | report matchs commandColumn | matchs := Match selectAll. report:= self rows: matchs description: (self filteredDescriptionsFrom: matchs anyOne).
commandColumn := MACommandColumn new.
(SEMatchReport new session isSimpleAdmin) ifTrue: [ report addColumn: (commandColumn addCommandOn: report selector: #editMatch: text: 'Modifier'; yourself; addCommandOn: report selector: #addAction: text: 'Ajouter une action'; yourself ) ] ifFalse: [ report addColumn: (commandColumn addCommandOn: report selector: #editMatch: text: 'Modifier'; yourself; addCommandOn: report selector: #deleteMatch: text: 'Supprimer'; yourself; addCommandOn: report selector: #addAction: text: 'Ajouter une action'; yourself ) ].
^ report
I want to put some bootstrapp icons near commandColumn actions. like pencil or delete on 'Supprimer'.
To do this, again, subclass MACommandColumn, override renderCellContent:on: and use your particular subclass.
SEMatchReport class>>filteredDescriptionsFrom: aMatch ^ aMatch magritteDescription select: [ :each | #(date_match hour_match stadium goals1 goals2 teams) includes: each accessor selector ]
I notice that on the generated report on column stadium we have aStadium. We don't have the value (the name). I don't know how to mention it in the filtered descriptions.
That's weird. I don't know.
Change the color of lines in the report, etc. All that things.
In this case I don't use the magritte row/even css classes.
In my case, I have a subclass of MAReport (I guess you can subclass from the Bootstrap one) and changed the table rendering to use:
table beHover; beBordered; beCondensed; beStriped;
etc... so I let colors to Bootstrap / CSS.
Cheers,
Sorry for the bad english.
Thanks.
Asbath
-- Mariano http://marianopeck.wordpress.com