TYPO3 Core

<?php

/**

* backend post construct hook

* @author pekue

*

*/

class tx_filelist_backendhook {

/**

* adds a part of the extjs filelist module to the global

* framework if fal is loaded to be used in fal references

* tce forms upload dialog

* @param unknown_type $params

* @param TYPO3backend $parentObject

*/

function constructPostProcess($params, TYPO3backend $parentObject) {

/** @var t3lib_PageRenderer $pageRenderer */

$pageRenderer = $GLOBALS['TBE_TEMPLATE']->getPageRenderer();;

$pageRenderer->addJsFile('ajax.php?ajaxID=ExtDirect::getAPI&namespace=TYPO3.FILELIST', NULL, FALSE);

$pageRenderer->addJsFile(t3lib_extMgm::extRelPath('filelist').'res/js/FolderTree/FolderTree.js');

}

}

?>

++ typo3/sysext/filelist/classes/class.tx_filelist_dataprovider.php

<?php

class tx_filelist_DataProvider {

/** genereates a file tree

*

* @param object $parameter

* @return array

*/

public function getExtFileTree($parameter) {

$ext = array();

if($parameter->node === 'FILE_MOUNTS'){

$path = PATH_site . 'fileadmin';

}else{

$path = $parameter->node;

}

$fileArray = array();

$dirs = t3lib_div::get_dirs($path);

foreach ($dirs as $dir) {

$subDirs = t3lib_div::get_dirs($path . '/' . $dir);

if ($dir{0} !== '.') {

$fileArray[] = array(

'id' => $path . '/' . $dir,

'text' => htmlspecialchars($dir),

//'leaf' => count($subDirs) == 0,

'leaf' => false,

'qtip' => '',

'iconCls' => 't3-icon t3-icon-apps t3-icon-apps-filetree t3-icon-filetree-folder-temp'

);

}

}

return $fileArray;

}

public function getAllInPath($parameters){

$files = t3lib_div::getFilesInDir($parameters->path, '', FALSE, '', '');

$filesArray = array();

foreach ($files as $file) {

$pI = pathinfo($file);

$filesArray[] = array(

'file_name' => $file,

'file_size' => filesize($parameters->path.'/'.$file),

'file_mtime' => filemtime($parameters->path.'/'.$file),

'file_type' => $pI['extension']

);

}

return $filesArray;

fb($files);

$files = t3lib_file_Repository::getAllInPath($parameters->path);

}

}

?>

++ typo3/sysext/filelist/classes/class.tx_filelist_registry.php

<?php

final class tx_filelist_Registry {

public static function registerJsComponent($filename){

global $TYPO3_CONF_VARS;

if (substr($filename,0,4)=='EXT:') { // extension

list($extKey,$local) = explode('/',substr($filename,4),2);

$filename='';

if (strcmp($extKey,'') && t3lib_extMgm::isLoaded($extKey) && strcmp($local,'')) {

$filename = t3lib_extMgm::extRelPath($extKey).$local;

}

}

if($filename!=''){

$TYPO3_CONF_VARS['EXTCONF']['filelist']['jsComponents'][]=$filename;

}

}

public static function registerExtDirectNamespace($ns){

global $TYPO3_CONF_VARS;

$TYPO3_CONF_VARS['EXTCONF']['filelist']['extDirectNamespaces'][]=$ns;

}

}

?>

++ typo3/sysext/filelist/ext_autoload.php

<?php

return array(

'tx_filelist_registry' => t3lib_extMgm::extPath('filelist', 'classes/class.tx_filelist_registry.php'),

);

?>

++ typo3/sysext/filelist/ext_conf_template.txt

# cat=basic//; type=boolean; label=Enable alternative File List Module: When turned on and the File Abstraction Layer is enabled as well, the new ExtJs-based alternative for the filelist module will be shown. The module is in an alpha version state but distributed as a companion for FAL.

enableModExtJs = 0

++ typo3/sysext/filelist/ext_localconf.php

<?php

$extConf = unserialize($GLOBALS['TYPO3_CONF_VARS']['EXT']['extConf']['filelist']);

if(t3lib_extMgm::isLoaded('fal')){

$TYPO3_CONF_VARS['SC_OPTIONS']['ExtDirect']['TYPO3.FILELIST.ExtDirect'] = 'EXT:filelist/classes/class.tx_filelist_dataprovider.php:tx_filelist_DataProvider';

$TYPO3_CONF_VARS['SC_OPTIONS']['typo3/backend.php']['constructPostProcess'][] = 'EXT:filelist/classes/class.tx_filelist_backendhook.php:tx_filelist_backendhook->constructPostProcess';

}

if($extConf['enableModExtJs'] == 1 && t3lib_extMgm::isLoaded('fal')){

tx_filelist_Registry::registerExtDirectNamespace('TYPO3.FILELIST');

tx_filelist_Registry::registerJsComponent('EXT:filelist/res/js/DetailView/Bootstrap.js');

tx_filelist_Registry::registerJsComponent('EXT:filelist/res/js/DetailView/DetailView.js');

tx_filelist_Registry::registerJsComponent('EXT:filelist/res/js/FolderTree/Bootstrap.js');

tx_filelist_Registry::registerJsComponent('EXT:filelist/res/js/FolderTree/FolderTree.js');

tx_filelist_Registry::registerJsComponent('EXT:filelist/res/js/FileList/Bootstrap.js');

tx_filelist_Registry::registerJsComponent('EXT:filelist/res/js/FileList/FileList.js');

}

?>

++ typo3/sysext/filelist/ext_tables.php

$extConf = unserialize($GLOBALS['TYPO3_CONF_VARS']['EXT']['extConf']['filelist']);

if($extConf['enableModExtJs'] == 1 && t3lib_extMgm::isLoaded('fal')){

t3lib_extMgm::addModulePath('txfilelistMExtjs', t3lib_extMgm::extPath($_EXTKEY) . 'mod_extjs/');

t3lib_extMgm::addModule('txfilelistMExtjs', '', '', t3lib_extMgm::extPath($_EXTKEY) . 'mod_extjs/');

}

++ typo3/sysext/filelist/mod1/file_list.php

$this->doc->getPageRenderer()->loadExtJS();

$this->doc->getPageRenderer()->addExtOnReadyCode("

Ext.get(Ext.getDom('button-upload')).on('click',function(e){

e.stopEvent();

top.TYPO3.FileUploadWindow.showFilelistUploadDialog('" . $this->id . "');

});

");

++ typo3/sysext/filelist/mod_extjs/conf.php

<?php

// DO NOT REMOVE OR CHANGE THESE 2 LINES:

$MCONF['name'] = 'txfilelistMExtjs';

$MCONF['script'] = '_DISPATCH';

$MCONF['access'] = 'user,group';

$MLANG['default']['tabs_images']['tab'] = 'list.gif';

$MLANG['default']['ll_ref'] = 'LLL:EXT:filelist/mod_extjs/locallang_mod.xml';

?>

++ typo3/sysext/filelist/mod_extjs/index.php

<?php

/***************************************************************

* Copyright notice

*

* (c) 2010 <>

* All rights reserved

*

* This script is part of the TYPO3 project. The TYPO3 project is

* free software; you can redistribute it and/or modify

* it under the terms of the GNU General Public License as published by

* the Free Software Foundation; either version 2 of the License, or

* (at your option) any later version.

*

* The GNU General Public License can be found at

* http://www.gnu.org/copyleft/gpl.html.

*

* This script is distributed in the hope that it will be useful,

* but WITHOUT ANY WARRANTY; without even the implied warranty of

* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

* GNU General Public License for more details.

*

* This copyright notice MUST APPEAR in all copies of the script!

***************************************************************/

/**

* [CLASS/FUNCTION INDEX of SCRIPT]

*

* Hint: use extdeveval to insert/update function index above.

*/

$LANG->includeLLFile('EXT:filelist/mod_extjs/locallang.xml');

require_once(PATH_t3lib . 'class.t3lib_scbase.php');

$BE_USER->modAccess($MCONF,1); // This checks permissions and exits if the users has no permission for entry.

// DEFAULT initialization of a module [END]

/**

* Module 'ExtJS filelist' for the 'filelist' extension.

*

* @author Peter Kuehn <peter.kuehn@wmdb.de>

* @package TYPO3

* @subpackage core

*/

class tx_filelist_modextjs extends t3lib_SCbase {

/**

* Initializes the Module

* @return void

*/

function init() {

global $BE_USER,$LANG,$BACK_PATH,$TCA_DESCR,$TCA,$CLIENT,$TYPO3_CONF_VARS;

parent::init();

}

/**

* Main function of the module. Write the content to $this->content

* If you chose "web" as main module, you will need to consider the $this->id parameter which will contain the uid-number of the page clicked in the page tree

*

* @return [type] ...

*/

function main() {

global $BE_USER,$LANG,$BACK_PATH,$TCA_DESCR,$TCA,$CLIENT,$TYPO3_CONF_VARS;

// initialize doc

$this->doc = t3lib_div::makeInstance('noDoc');

$this->doc->backPath = $BACK_PATH;

$this->doc->getPageRenderer()->loadExtJS();

$this->addJsFile(t3lib_extMgm::extRelPath('filelist') .'res/js/Application.js');

$this->addJsFile(t3lib_extMgm::extRelPath('filelist') .'res/js/ComponentRegistry.js');

if(is_array($TYPO3_CONF_VARS['EXTCONF']['filelist']['extDirectNamespaces'])){

foreach ($TYPO3_CONF_VARS['EXTCONF']['filelist']['extDirectNamespaces'] as $nameSpace) {

$this->addJsFile($this->backPath . 'ajax.php?ajaxID=ExtDirect::getAPI&namespace='.$nameSpace);

}

$this->doc->getPageRenderer()->addExtDirectCode();

}

if(is_array($TYPO3_CONF_VARS['EXTCONF']['filelist']['jsComponents'])){

foreach ($TYPO3_CONF_VARS['EXTCONF']['filelist']['jsComponents'] as $filename) {

$this->addJsFile($filename);

}

}

//load components here!

$this->addJsFile(t3lib_extMgm::extRelPath('filelist') .'res/js/Ui/Bootstrap.js');

$this->addJsFile(t3lib_extMgm::extRelPath('filelist') .'res/js/Ui/Ui.js');

// Build the <body> for the module

$this->content = $this->doc->startPage($LANG->getLL('title'));

$this->content.=$this->doc->endPage();

echo $this->content;

}

private function addJsFile($fileName, $type = NULL, $compress = FALSE){

$this->doc->getPageRenderer()->addJsFile($fileName, $type, $compress);

}

}

if (defined('TYPO3_MODE') && $TYPO3_CONF_VARS[TYPO3_MODE]['XCLASS']['ext/filelist/mod_extjs/index.php']) {

include_once($TYPO3_CONF_VARS[TYPO3_MODE]['XCLASS']['ext/filelist/mod_extjs/index.php']);

}

// Make instance:

$SOBE = t3lib_div::makeInstance('tx_filelist_modextjs');

$SOBE->init();

// Include files?

foreach($SOBE->include_once as $INC_FILE) include_once($INC_FILE);

$SOBE->main();

?>

++ typo3/sysext/filelist/mod_extjs/locallang.xml

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>

<T3locallang>

<meta type="array">

<type>module</type>

<description>Language labels for module &quot;txfilelistMExtjs&quot;</description>

</meta>

<data type="array">

<languageKey index="default" type="array">

<label index="title">Filelist</label>

<label index="function1">Function #1</label>

<label index="function2">Function #2</label>

<label index="function3">Function #3</label>

</languageKey>

</data>

</T3locallang>

++ typo3/sysext/filelist/mod_extjs/locallang_mod.xml

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>

<T3locallang>

<meta type="array">

<type>module</type>

<description>Language labels for module &quot;txfilelistMExtjs&quot; - header, description</description>

</meta>

<data type="array">

<languageKey index="default" type="array">

<label index="mlang_tabs_tab">ExtJS Filelist</label>

<label index="mlang_labels_tabdescr">ExtJS Filelist</label>

<label index="mlang_labels_tablabel">ExtJS Filelist</label>

</languageKey>

</data>

</T3locallang>

++ typo3/sysext/filelist/mod_extjs/mod_template.html

<!-- ###FULLDOC### begin -->

<div class="typo3-fullDoc">

<!-- Page header with buttons, path details and csh -->

<div id="typo3-docheader">

<div id="typo3-docheader-row1">

<div class="buttonsleft">###BUTTONLIST_LEFT###</div>

<div class="buttonsright">###BUTTONLIST_RIGHT###</div>

</div>

<div id="typo3-docheader-row2">

<div class="docheader-row2-left"><div class="docheader-funcmenu">###FUNC_MENU###</div></div>

<div class="docheader-row2-right">###PAGEPATH######PAGEINFO###</div>

</div>

</div>

<!-- Content of module, for instance listing, info or editing -->

<div id="typo3-docbody">

<div id="typo3-inner-docbody">

###CONTENT###

</div>

</div>

</div>

<!-- ###FULLDOC### end -->

<!-- Grouping the icons on top -->

<!-- ###BUTTON_GROUP_WRAP### -->

<div class="buttongroup">###BUTTONS###</div>

<!-- ###BUTTON_GROUP_WRAP### -->

<!-- ###BUTTON_GROUPS_LEFT### -->

<!-- ###BUTTON_GROUP1### -->###SAVE###<!-- ###BUTTON_GROUP1### -->

<!-- ###BUTTON_GROUPS_LEFT### -->

<!-- ###BUTTON_GROUPS_RIGHT### -->

<!-- ###BUTTON_GROUP1### -->###SHORTCUT###<!-- ###BUTTON_GROUP1### -->

<!-- ###BUTTON_GROUPS_RIGHT### -->

++ typo3/sysext/filelist/res/js/Application.js

Ext.ns('TYPO3.Components.filelist');

TYPO3.Components.filelist = Ext.apply(new Ext.util.Observable, {

/**

* List of all bootstrap objects which have been registered

* @private

*/

bootstrappers: [],

/**

* Main bootstrap. This is called by Ext.onReady and calls all registered

* bootstraps.

*

* This method is called automatically.

*/

bootstrap: function() {

this._registerDummyConsoleLogIfNeeded();

Ext.util.Observable.capture(this, this._eventDisplayCallback, this);

this._initializeConfiguration();

this._invokeBootstrappers();

Ext.QuickTips.init();

this.fireEvent('TYPO3.Components.filelist.afterBootstrap');

},

/**

* Registers a new bootstrap class.

*/

registerBootstrap: function(bootstrap) {

this.bootstrappers.push(bootstrap);

},

/**

* If the console is deactivated, install a dummy function to prevent errors.

* @private

*/

_registerDummyConsoleLogIfNeeded: function() {

if (typeof window.console == 'undefined') {

window.console = {

log: function() {}

};

}

},

/**

* Initialize the configuration object in .Configuration

* @private

*/

_initializeConfiguration: function() {

},

/**

* Invoke the registered bootstrappers.

* @private

*/

_invokeBootstrappers: function() {

Ext.each(

this.bootstrappers,

function(bootstrapper) {

bootstrapper.initialize();

}

);

},

/**

* This method is called for each event going through this event bridge.

* @private

*/

_eventDisplayCallback: function() {

//console.log(arguments);

}

});

Ext.onReady(TYPO3.Components.filelist.bootstrap, TYPO3.Components.filelist);

++ typo3/sysext/filelist/res/js/ComponentRegistry.js

Ext.ns("TYPO3.Components.filelist");

TYPO3.Components.filelist.ComponentRegistry = Ext.apply(new Ext.util.Observable, {

items: {

'north':[],

'east':[],

'south':[],

'west':[],

'center':[]

},

registerComponent: function(config) {

TYPO3.Components.filelist.ComponentRegistry.items[config.region].push(config.component);

}

});

++ typo3/sysext/filelist/res/js/DetailView/Bootstrap.js

Ext.ns('TYPO3.Components.filelist.DetailView');

TYPO3.Components.filelist.DetailView.Bootstrap = Ext.apply(new Ext.util.Observable, {

initialize: function () {

TYPO3.Components.filelist.ComponentRegistry.registerComponent({

region:'east',

component: TYPO3.Components.filelist.DetailView

});

}

});

TYPO3.Components.filelist.registerBootstrap(TYPO3.Components.filelist.DetailView.Bootstrap);

++ typo3/sysext/filelist/res/js/DetailView/DetailView.js

Ext.ns('TYPO3.Components.filelist.Components');

TYPO3.Components.filelist.DetailView = Ext.extend(Ext.Panel, {

html:'Detailview Panel'

});

Ext.reg('TYPO3.Components.filelist.DetailView', TYPO3.Components.filelist.DetailView);

++ typo3/sysext/filelist/res/js/FileList/Bootstrap.js

Ext.ns('TYPO3.Components.filelist.FileList');

TYPO3.Components.filelist.FileList.Bootstrap = Ext.apply(new Ext.util.Observable, {

initialize: function () {

TYPO3.Components.filelist.ComponentRegistry.registerComponent({

region:'center',

component: TYPO3.Components.filelist.FileList

});

}

});

TYPO3.Components.filelist.registerBootstrap(TYPO3.Components.filelist.FileList.Bootstrap);

++ typo3/sysext/filelist/res/js/FileList/FileList.js

Ext.ns('TYPO3.Components.filelist.Components');

TYPO3.Components.filelist.FileList = Ext.extend(Ext.grid.EditorGridPanel, {

border:false,

enableDragDrop: true,

loadMask:true,

ddGroup:'TYPO3.Components.filelist.ddList2Tree',

initComponent: function(){

var proxy = new Ext.data.DirectProxy({

directFn: TYPO3.FILELIST.ExtDirect.getAllInPath,

paramsAsHash:true

});

this.contextMenu = new Ext.menu.Menu({

items: [{

text: 'Edit',

iconCls: 'edit'

}]

});

this.on('rowcontextmenu',function(node,i,e){

this.contextMenu.showAt(e.getXY());

e.stopEvent();

});

this.colModel = new Ext.grid.ColumnModel({

defaults:{

width:120,

sortable:true

},

columns:[

{id:'file_name', header: 'Filename', dataIndex:'file_name', editor: new Ext.form.TextField({allowBlank:false})},

{header: 'Type', dataIndex:'file_type'},

{header: 'Date', dataIndex:'file_mtime'},

{header: 'Size', dataIndex:'file_size'}

]

});

this.selModel = new Ext.grid.RowSelectionModel({});

this.view = new Ext.grid.GridView({

forceFit:true

});

this.store = new Ext.data.JsonStore({

storeId:'TYPO3.Components.filelist.FileList.Store',

autoDestroy:true,

proxy: proxy,

fields:['file_name','file_type','file_mtime','file_size']

});

TYPO3.Components.filelist.FileList.superclass.initComponent.call(this);

Ext.getCmp('TYPO3.Components.filelist.FolderTree').on('click',this.getAllInPathOnNodeClick,this);

Ext.getCmp('TYPO3.Components.filelist.FolderTree').on('beforenodedrop',this.onDragDropFilesToTree,this);

},

getAllInPathOnNodeClick: function(node){

this.store.load({params:{

path:node.id

}})

},

onDragDropFilesToTree: function(dropEvent){

var s = dropEvent.data.grid.getStore();

Ext.each(dropEvent.selections,function(record){

s.remove(record);

});

}

});

Ext.reg('TYPO3.Components.filelist.FileList', TYPO3.Components.filelist.FileList);

++ typo3/sysext/filelist/res/js/FolderTree/Bootstrap.js

Ext.ns('TYPO3.Components.filelist.FolderTree');

TYPO3.Components.filelist.FolderTree.Bootstrap = Ext.apply(new Ext.util.Observable, {

initialize: function () {

TYPO3.Components.filelist.ComponentRegistry.registerComponent({

region:'west',

component: TYPO3.Components.filelist.FolderTree

});

}

});

TYPO3.Components.filelist.registerBootstrap(TYPO3.Components.filelist.FolderTree.Bootstrap);

++ typo3/sysext/filelist/res/js/FolderTree/FolderTree.js

Ext.ns('TYPO3.Components','TYPO3.Components.filelist','TYPO3.Components.filelist.FolderTree');

TYPO3.Components.filelist.FolderTree = Ext.extend(Ext.Panel, {

initComponent: function(){

var fileTree = new Ext.tree.TreePanel ({

id: 'TYPO3.Components.filelist.FolderTree',

unstyled: true,

autoScroll: true,

containerScroll: true,

margins: '0 0 0 0',

cmargins: '0 0 0 0',

useArrows: true,

root: {

text: 'fileadmin/',

itemId: 'fileroot',

expanded: true,

id:'FILE_MOUNTS'

},

loader: {

directFn: TYPO3.FILELIST.ExtDirect.getExtFileTree,

paramsAsHash: true

},

enableDrop: true,

ddGroup:'TYPO3.Components.filelist.ddList2Tree',

listeners:{

nodedragover:{

fn:function(dE){

//disallows files dragged between nodes!

return dE.point === 'append';

}

}

}

});

TYPO3.Components.filelist.FolderTree.superclass.initComponent.call(this);

this.add(fileTree);

}

});

Ext.reg('TYPO3.Components.filelist.FolderTree', TYPO3.Components.filelist.FolderTree);

++ typo3/sysext/filelist/res/js/Ui/Bootstrap.js

Ext.ns("TYPO3.Components.filelist.Ui");

TYPO3.Components.filelist.Ui.Bootstrap = Ext.apply(new Ext.util.Observable, {

initialize: function () {

TYPO3.Components.filelist.on('TYPO3.Components.filelist.afterBootstrap',function(){

Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

new TYPO3.Components.filelist.Ui();

});

}

});

TYPO3.Components.filelist.registerBootstrap(TYPO3.Components.filelist.Ui.Bootstrap);

++ typo3/sysext/filelist/res/js/Ui/Ui.js

Ext.ns('TYPO3.Components.filelist');

TYPO3.Components.filelist.Ui = Ext.extend(Ext.Viewport, {

// privat

initComponent: function() {

var defaultRegionConf = {

north:{

id:'typo3-filelist-north-region-container',

stateful: true

},

east:{

region:'east',

id:'typo3-filelist-east-region-container',

width:200,

split:true,

collapsible:true,

frame:true,

stateful: true

},

south:{

region:'south',

id:'typo3-filelist-south-region-container',

stateful: true

},

west:{

region: 'west',

layout: 'fit',

id:'typo3-filelist-west-region-container',

width: 300,

minWidth: 20,

floatable: true,

animCollapse: false,

split: true,

collapsible: true,

collapseMode: 'mini',

hideCollapseTool: true,

autoScroll: true,

border: false,

stateful: true

}

};

var items = [{

region:'center',

id:'typo3-filelist-center-region-container',

frame:false,

layout:'fit'

}];

var cR = TYPO3.Components.filelist.ComponentRegistry.items;

Ext.each(['north','east','south','west'],function(i){

if(cR[i].length > 0) items.push(defaultRegionConf[i]);

})

var config = {

layout:'border',

items: items

};

Ext.apply(this, config);

TYPO3.Components.filelist.Ui.superclass.initComponent.call(this);

this.on('afterrender', this.addComponents, this);

},

/**

* equal segement the registert portlets to the columns

*

* @return {void}

*/

addComponents: function() {

Ext.each(['north','east','south','west','center'],function(region){

Ext.each(TYPO3.Components.filelist.ComponentRegistry.items[region],function(Component){

Ext.getCmp('typo3-filelist-'+region+'-region-container').add(new Component);

});

});

this.doLayout();

}

});

// register class as xclass

Ext.reg('TYPO3.Components.filelist.Ui', TYPO3.Components.filelist.Ui);