TYPO3 Core

Moved to http://bugs.typo3.org/view.php?id=17416

Patch set 1 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Example of use for extmgm:

TYPO3.Viewport.Panels.push({
    html:'<iframe width="100%" height="100%" src="mod.php?M=tools_em" frameborder="0"></iframe>',
    id  :'typo3-card-tools_em'
});

ideally the modules do not use iframes but real extjs panels ;)

adding js to the body should be done like it's done for the toolbars:

example in EXT:sitemgr:

EXT:sitemgr/ext_tables.php

if (TYPO3_MODE == 'BE') {
    $GLOBALS['TYPO3_CONF_VARS']['typo3/backend.php']['additionalBackendItems'][]
    = t3lib_extMgm::extPath($_EXTKEY).'Classes/ToolbarItems/CustomerSelector/Hook.php';
}

EXT:sitemgr/Classes/ToolbarItems/CustomerSelector/Hook.php

include_once(t3lib_extMgm::extPath('sitemgr').'Classes/ToolbarItems/CustomerSelector/Item.php');
$GLOBALS['TYPO3backend']->addToolbarItem('sitemgr', 'Tx_Sitemgr_ToolbarItems_CustomerSelector_Item');

EXT:sitemgr/Classes/ToolbarItems/CustomerSelector/Item.php

class Tx_Sitemgr_ToolbarItems_CustomerSelector_Item  implements backend_toolbarItem {
    //... add some functions and important the render function
}

Suggestion add an easy way (array) to add js files to the backend.

Regards
Kay

Patch set 2 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

To my understanding these cards stay opened (just hidden) in the browser, right? So could it actually be that we're putting much more load on the client this way? Or might it actually be able to reuse components this way because components can be shared between cards? But this would require them to use more than just <iframes> inside the cards, right?

It looks like cards get loaded as soon as the backend itself loads. Might it make sense to "lazy-load" cards cards (load their contents on first use; or maybe even delay instantiaing of cards)?

@Stefan,

the idea of the cardlayout is to be prepared for new be modules which are mainly developed with extjs.
These modules won't need an iframe with a additional instance of extjs, but can place their code directly in the be.
The modules can also register for events on the pagetree and it's possible to drag'n'drop elements from the pagetree to such modules ;)

The iframe is just an example as it would take some time to rewrite the extmgm (1-2 days) - i think (old one will be removed with that change though).

With a good code architecture modules can be written so, that they work either with the card layout or with the old fashioned iframe ;)
I will can examples lateron ;)

Hope that helps to understand the change ;)

Thanks in Advance
Kay

Patch set 3 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

@event

each card is allowed to register to any event of any extjs component ;)
This way it's possible to get the params from the tree instantly onclick.

@api:

ok i thought panels should not be added during runtime. But it can be usefull though.

Patch set 4 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 5 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 6 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 7 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 8 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 9 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 10 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 11 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 12 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 13 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 14 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 15 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 16 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

added some documentation ;)
http://wiki.typo3.org/Extension_Development,_native_ExtJS_Modules

Patch set 17 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 18 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

Patch set 19 of change I2bf206b7154c20575b0d2ce72150621b2dfbdb35 has been pushed to the review server.
It is available at http://review.typo3.org/3370

From Topic ML:typo3.v4:[TYPO3-dev] [TYPO3-v4] Change of Module switching behaviour in 4.6 (perhaps backport to 4.6) - Speedup Backend with Cardlayout

Hello guys,

based on 2 discussions started in February i pushed a patch to gerrit
[1] to speed up the switching of the backend a bit. This patch has a
small side effect: it changes the behaviour of the module menu.

You may also want to read the older articles about the cardlayout: [2][3]

First of all i will start with current master aka 4.5. be architecture.

> Currently there is a viewport which is like this one:
>
> +-----+-----+----------------+
> |                            |
> +-----+-----+----------------+
> |     |     |                |
> |  1  |  2  |       3        |
> |     |     |                |
> +-----+-----+----------------+
>
> The area 2 (pagetree, directory tree, ...) is hidden if the
> module doesn't need it - good.
>
> But any module in 3 is loaded as normal html page.
The idea of the patch is to modify field 3 to ensure, that modern extjs
based backend modules are not loaded again and again and again on every
module switch.
This modules can be imagined as: (em, recycler, powermail, sitemgr,
piwikintegration, ...) on

So how could this achieved:
Currently 3 is an so called iframepanel with a single iframe [7].
We change 3 to a normal panel, with layout:card [8], which first child
is the old style iframe panel.

Additionally we add an extra panel for each module (automatically).
These panels are rendered as cards.

So 3 consists of n different card-panel for every BE Module.

If you need to change from one card to another, there is no need to
reload the panel, as long as you do not change the page in the pagetree.

This way all the cards save their state if sensefull.

That means, that switching from listmodule back to pagemodule may show
you the previously edited form and not the overview page of the selected
page.

To keep it simple to reload the module, you may click on the modulemenu
again to force a reload.

Now back to the greatest positive effect:
ExtJS Modules are loaded with the Backend, that means, the may only need
time to reload their stores, but they won't need time to reload the
complete module. As more and more modules are done in extjs this should
be the way to go in my eyes.

You may also take a look in the issue on forge [4] or in gerrit [1].

From the Usability kind of View this patch changes the modulemenu from
beeing dumb buttons to something like intelligent tabs, which allow to
work faster, as useless loading is avoided.

Additionally to that change there is a small change that depends on that
change. A standardized way to style BE modules done with extjs [5], [6].

Regards
Kay

[1] https://review.typo3.org/#change,3370
[2] http://lists.typo3.org/pipermail/typo3-dev/2011-February/042621.html
[3] http://lists.typo3.org/pipermail/typo3-project-v4/2011-May/002236.html
[4] http://forge.typo3.org/issues/12664
[5] https://review.typo3.org/#change,3696
[6] http://forge.typo3.org/issues/28384
[7] -> see typo3/js/extjs/iframepanel.js
[8] http://dev.sencha.com/deploy/ext-3.4.0/docs/?class=Ext.layout.CardLayout
-- http://www.kay-strobach.de - Open Source Rocks TYPO3 .... inspiring people to share! Get involved: http://typo3.org