Redesign administrator template to Joomlatools UI

[tomjanssens]

Redesign the administrator template to Joomlatools UI.

Core hacks

Core hacks, check if we can find another way around them so they can be reverted:

• a31e086
• 110c329
• 694373d

Bugs:

• Some views can't sort on ordering column for drag and drop ordering. For example see plugins view
• Find @TODO in the code for all other bugs

Testing:

• RTL testing

Improvements:

• Add better dropdown script (checking wether to drop to: top, right, bottom or left)
• Let filters display current setting
• Let filters show how many are active on mobile (the red dot)
• Create a small toggle button for the toolbar so you get to see all labels on mobile instead of just icons?
• Do not show toolbar when it's empty (debug users for example)
• Group fields in item views using form-block styling? (see menu items)

Features:

• Add handy quicklinks etc. to sidebars
• Analytics / imgix etc. dashboard items?
• MCE editor from TEXTman as editor? / TEXTman as default editor?
• Put whole UI in 8 pixel grid (should be done in Kodekit UI)
• Onboarding on all views

To KUI:

• Autofocus (select2 open) first item in filter dropdown for faster selection
• Bounce scroll edges iOs (utilities/setup.scss) to CSS

[robinpoort]

@allanpilarca Came up with a rather simple solution already built-in select2. Can you give it a quick test?

[robinpoort]

@allanpilarca Also added a fix for the ordering. And improved the top menu (hovering to other items while the first one is opened is now supported)

[allanpilarca]

@robinpoort there are only 2 notices displaying in menu items page. The $assoc and $prefix variable. You can see the errors by setting in your box to display all the errors.
box php:ini error_reporting E_ALL

The fix in sorting and custom module position is now working. Nice work sir! :)

[robinpoort]

@allanpilarca They should be gone as well now :)

@johanjanssens this should be good to merge now I think?

[allanpilarca]

hi @robinpoort

Does this ticket only support design/layouts for joomlatools-platform core? or does this also need to support the design/layouts for com:content and other joomlatools-platform extensions? I tried checking com:content and found some styling that still needs to style.

[robinpoort]

@allanpilarca I think we put styling for other components on pause for the moment. We'll have to wait and see what @johanjanssens thinks of this. As far as I know, other components have not been fully styled yet. So if they need to be, it'll take some additional work.

[johanjanssens]

This is a betwixed and between situation right now, we want to use the template for scicasts, but they are still using com_content in the admin, at the same time we are trying to move them completely into the frontend using TEXTman.

@robinpoort How much effort would there to make the template work with com_content in admin?

[robinpoort]

@johanjanssens Probably a day or so with testing if we're only talking about the list and form view for com_content. But I might run into problems so it might also be a few days..

[johanjanssens]

@robinpoort Can you give this a go then? Would be nice if we can wrap up this work. Spend quite some time into this already.

[robinpoort]

@johanjanssens @allanpilarca

Another big round of improvements!

• Added Kodekit UI v1.0.0
• Added styling for com_content, com_categories and com_tags
• Improved styling for several other components
• Improvements in form fields for several views
• Fixed as much @todos as possible
• Small mobile view improvements

I am not very sure about if the following files are being used:

• web/administrator/templates/elysio/html/com_categories/categories/modal.php
• web/administrator/templates/elysio/html/com_categories/category/modal.php
• web/administrator/templates/elysio/html/com_categories/category/modal_options.php
• web/administrator/templates/elysio/html/com_menus/items/default_batch_body.php
• web/administrator/templates/elysio/html/com_menus/items/default_batch_footer.php
• web/administrator/templates/elysio/html/com_modules/modules/modal.php

Ofcourse these can be removed and everything still works because they are overrides. So I'm actually wondering if these files are being used:

• app/administrator/components/com_categories/views/categories/tmpl/modal.php
• app/administrator/components/com_categories/views/category/tmpl/modal.php
• app/administrator/components/com_categories/views/category/tmpl/modal_options.php
• app/administrator/components/com_menus/views/items/tmpl/default_batch_body.php
• app/administrator/components/com_menus/views/items/tmpl/default_batch_footer.php
• app/administrator/components/com_modules/views/modules/tmpl/modal.php

If they are being used, can one of you let me know how I'm able to view them inside the administrator? Which links should I click to get those views? It's impossible for me to style them otherwise :)

Other than those views, can you test and see if everything works as expected? Thanks!

[johanjanssens]

@robinpoort I think these modal views are used for the batch modal in categories, menus and modules? Could that be?

[johanjanssens]

@allanpilarca Can you do testing?

[allanpilarca]

hi @robinpoort

Nice work with the template :) found some small issues:

1. The modal displayed when clicking the "Created by" field in article form in publishing tab.(This happens in every "Created by" field) - https://joomlatools-platform.dev/administrator/index.php?option=com_content&view=article&layout=edit

2. Found this Notice : Undefined property: TagsViewTags::$sidebar in /var/www/joomlatools-platform/web/administrator/templates/elysio/html/com_tags/tags/default.php on line 34 - https://joomlatools-platform.dev/administrator/index.php?option=com_tags

3. The "Select categories" field in "Layout" tab when creating a "Featured Articles" menu - https://joomlatools-platform.dev/administrator/index.php?option=com_menus&view=item&layout=edit

4. Logo not displayed

I cant find an exact link that currently used this layouts in platform

• app/administrator/components/com_categories/views/categories/tmpl/modal.php (This is used to display a modal that will list categories and allow user to select from it)
• app/administrator/components/com_categories/views/category/tmpl/modal.php (In joomla 3.7.5 when creating a menu pointing to category blog view the user can select a category and allows the user to edit the category directly from this page through a modal displaying the category form.)

I think these files are not used since its code is already in app/administrator/components/com_menus/views/items/tmpl/default_batch.php

• app/administrator/components/com_menus/views/items/tmpl/default_batch_body.php
• app/administrator/components/com_menus/views/items/tmpl/default_batch_footer.php

This file is used in displaying a list of modules using the editor-xtd module button plugin, we didnt include it the platform so we no longer need this override

• app/administrator/components/com_modules/views/modules/tmpl/modal.php

[robinpoort]

Hi Allan,

Thanks for testing!

1. Fixed!
2. I'm not having the error myself, any idea on how to solve the issue? Or an idea on how I can get that error as well? :)
3. Fixed! There might be more of them, if you ever encounter one let me know (or add to web/administrator/templates/elysio/scripts/main.js:9)
4. Can you check your "Elysio" template settings? Both fields should be empty or point to a valid logo:
   

• app/administrator/components/com_categories/views/categories/tmpl/modal.php removed this file from the template. So it will grab the Joomla default one if ever used.
• app/administrator/components/com_categories/views/category/tmpl/modal.php removed this since the platform is forked from Joomla 3.3
• app/administrator/components/com_menus/views/items/tmpl/default_batch_body.php what I thought already, removed
• app/administrator/components/com_menus/views/items/tmpl/default_batch_footer.php what I thought already, removed
• app/administrator/components/com_modules/views/modules/tmpl/modal.php removed

@allanpilarca There's some other default_batch_body.php and default_batch_footer.phpfiles that might not be in use. The reason I didn't mention these before is because there's some extra PHP code in them and I can't be sure wether it's doing anything. But if you could check if they can be removed that'd be great!

@johanjanssens it might be wise to remove those unused files from the platform itself as well? If they're not being used they can go right?

[johanjanssens]

@robinpoort whatever isn't used can be removed indeed. I think we originally took a copy of the existing template, so there might be files in there that are not needed @allanpilarca Can you double check?

[allanpilarca]

@robinpoort

2. I added some changes to fix the notification displayed. You can also check the error notification by setting this to your box box php:ini error_reporting E_ALL

3. I confirmed that's the reason causing not to display the logo correctly, when installing the template it includes a default value but the image does not exists. I removed it in the installation script and keep it empty.

@johanjanssens

Upon double checking i found out that the default_batch_body.php and default_batch_footer.php files are still used in app/administrator/components/com_menus/views/items/tmpl/default.php line-255 but in the template override of default.php we used the default_batch.php when displaying the modal for batch updates.

So we cant remove those files because its still being used.

I also found an error when trying to do a batch operation, will create a separate ticket for it.

[johanjanssens]

Thanks, good work @allanpilarca We don't need a logo in the administrator, keep it simple.

[robinpoort]

Thanks @allanpilarca ! Double-check; there's nothing I have to do for this anymore right?

[allanpilarca]

@robinpoort seems the template is done. :)

[robinpoort]

👍

[johanjanssens]

Excellent work, @allanpilarca can you merge it and close it. One more down.