Index: t3lib/js/extjs/ext_rowexpander.js =================================================================== --- t3lib/js/extjs/ext_rowexpander.js (revision 0) +++ t3lib/js/extjs/ext_rowexpander.js (revision 0) @@ -0,0 +1,159 @@ +/* + * Ext JS Library 2.0 + * Copyright(c) 2006-2007, Ext JS, LLC. + * licensing@extjs.com + * + * http://extjs.com/license + * + * MODIFIED: SGB [12.12.07] + * Added support for a new config option, remoteDataMethod, + * including getter and setter functions, and minor mods + * to the beforeExpand and expandRow functions + */ + +Ext.grid.RowExpander = function(config) { + Ext.apply(this, config); + Ext.grid.RowExpander.superclass.constructor.call(this); + + if (this.tpl) { + if (typeof this.tpl == 'string') { + this.tpl = new Ext.Template(this.tpl); + } + this.tpl.compile(); + } + + this.state = {}; + this.bodyContent = {}; + + this.addEvents({ + beforeexpand : true, + expand: true, + beforecollapse: true, + collapse: true + }); +}; + +Ext.extend(Ext.grid.RowExpander, Ext.util.Observable, { + header: "", + width: 20, + sortable: false, + fixed:true, + dataIndex: '', + id: 'expander', + lazyRender : true, + enableCaching: true, + + getRowClass : function(record, rowIndex, p, ds) { + p.cols = p.cols-1; + var content = this.bodyContent[record.id]; + if (!content && !this.lazyRender) { + content = this.getBodyContent(record, rowIndex); + } + if (content) { + p.body = content; + } + return this.state[record.id] ? 'x-grid3-row-expanded' : 'x-grid3-row-collapsed'; + }, + + init : function(grid) { + this.grid = grid; + + var view = grid.getView(); + view.getRowClass = this.getRowClass.createDelegate(this); + + view.enableRowBody = true; + + grid.on('render', function() { + view.mainBody.on('mousedown', this.onMouseDown, this); + }, this); + }, + + getBodyContent : function(record, index) { + if (!this.enableCaching) { + return this.tpl.apply(record.data); + } + var content = this.bodyContent[record.id]; + if (!content) { + content = this.tpl.apply(record.data); + this.bodyContent[record.id] = content; + } + return content; + }, + // Setter and Getter methods for the remoteDataMethod property + setRemoteDataMethod : function (fn) { + this.remoteDataMethod = fn; + }, + + getRemoteDataMethod : function (record, index) { + if (!this.remoteDataMethod) { + return; + } + return this.remoteDataMethod.call(this,record,index); + }, + + onMouseDown : function(e, t) { + if (t.className == 'x-grid3-row-expander') { + e.stopEvent(); + var row = e.getTarget('.x-grid3-row'); + this.toggleRow(row); + } + }, + + renderer : function(v, p, record) { + p.cellAttr = 'rowspan="2"'; + return '
 
'; + }, + + beforeExpand : function(record, body, rowIndex) { + if (this.fireEvent('beforexpand', this, record, body, rowIndex) !== false) { + // If remoteDataMethod is defined then we'll need a div, with a unique ID, + // to place the content + if (this.remoteDataMethod) { + this.tpl = new Ext.Template("
<\div>"); + } + if (this.tpl && this.lazyRender) { + body.innerHTML = this.getBodyContent(record, rowIndex); + } + + return true; + }else{ + return false; + } + }, + + toggleRow : function(row) { + if (typeof row == 'number') { + row = this.grid.view.getRow(row); + } + this[Ext.fly(row).hasClass('x-grid3-row-collapsed') ? 'expandRow' : 'collapseRow'](row); + }, + + expandRow : function(row) { + if (typeof row == 'number') { + row = this.grid.view.getRow(row); + } + var record = this.grid.store.getAt(row.rowIndex); + var body = Ext.DomQuery.selectNode('tr:nth(2) div.x-grid3-row-body', row); + if (this.beforeExpand(record, body, row.rowIndex)) { + this.state[record.id] = true; + Ext.fly(row).replaceClass('x-grid3-row-collapsed', 'x-grid3-row-expanded'); + if (this.fireEvent('expand', this, record, body, row.rowIndex) !== false) { + // If the expand event is successful then get the remoteDataMethod + this.getRemoteDataMethod(record,row.rowIndex); + } + } + }, + + collapseRow : function(row) { + if (typeof row == 'number') { + row = this.grid.view.getRow(row); + } + var record = this.grid.store.getAt(row.rowIndex); + var body = Ext.fly(row).child('tr:nth(1) div.x-grid3-row-body', true); + if (this.fireEvent('beforcollapse', this, record, body, row.rowIndex) !== false) { + this.state[record.id] = false; + Ext.fly(row).replaceClass('x-grid3-row-expanded', 'x-grid3-row-collapsed'); + this.fireEvent('collapse', this, record, body, row.rowIndex); + } + } +}); \ No newline at end of file Index: typo3/sysext/recycler/mod1/index.php =================================================================== --- typo3/sysext/recycler/mod1/index.php (revision 6908) +++ typo3/sysext/recycler/mod1/index.php (working copy) @@ -47,16 +47,25 @@ protected $recordsPageLimit = 50; /** + * + * @var t3lib_PageRenderer + */ + protected $pageRenderer; + + /** * Initializes the Module * * @return void */ public function initialize() { parent::init(); + $this->doc = t3lib_div::makeInstance('template'); $this->doc->setModuleTemplate(t3lib_extMgm::extPath('recycler') . 'mod1/mod_template.html'); $this->doc->backPath = $GLOBALS['BACK_PATH']; + $this->pageRenderer = $this->doc->getPageRenderer(); + $this->relativePath = t3lib_extMgm::extRelPath('recycler'); $this->pageRecord = t3lib_BEfunc::readPageAccess($this->id, $this->perms_clause); $this->isAccessibleForCurrentUser = ( @@ -134,45 +143,25 @@ * @return void */ protected function loadHeaderData() { + + // Load CSS Stylesheets: - $this->loadStylesheet($this->relativePath . 'res/css/customExtJs.css'); + $this->pageRenderer->addCssFile($this->relativePath . 'res/css/customExtJs.css'); // Load Ext JS: - $this->doc->getPageRenderer()->loadExtJS(); + $this->pageRenderer->loadExtJS(); // Integrate dynamic JavaScript such as configuration or lables: - $this->doc->JScode.= t3lib_div::wrapJS(' - Ext.namespace("Recycler"); + $this->pageRenderer->addJsInlineCode('RecyclerInit', ' Recycler.statics = ' . json_encode($this->getJavaScriptConfiguration()) . '; Recycler.lang = ' . json_encode($this->getJavaScriptLabels()) . ';' ); // Load Recycler JavaScript: - $this->loadJavaScript($this->relativePath . 'res/js/ext_expander.js'); - $this->loadJavaScript($this->relativePath . 'res/js/search_field.js'); - $this->loadJavaScript($this->relativePath . 'res/js/t3_recycler.js'); + $this->pageRenderer->addJsFile($this->doc->backPath . '../t3lib/js/extjs/ext_rowexpander.js'); + $this->pageRenderer->addJsFile($this->relativePath . 'res/js/search_field.js'); + $this->pageRenderer->addJsFile($this->relativePath . 'res/js/t3_recycler.js'); } - /** - * Loads a stylesheet by adding it to the HTML head section. - * - * @param string $fileName: Name of the file to be loaded - * @return void - */ - protected function loadStylesheet($fileName) { - $fileName = t3lib_div::resolveBackPath($this->doc->backPath . $fileName); - $this->doc->JScode.= "\t" . '' . "\n"; - } /** - * Loads a JavaScript file. - * - * @param string $fileName: Name of the file to be loaded - * @return void - */ - protected function loadJavaScript($fileName) { - $fileName = t3lib_div::resolveBackPath($this->doc->backPath . $fileName); - $this->doc->JScode.= "\t" . '' . "\n"; - } - - /** * Gets the JavaScript configuration for the Ext JS interface. * * @return array The JavaScript configuration Index: typo3/sysext/recycler/res/js/t3_recycler.js =================================================================== --- typo3/sysext/recycler/res/js/t3_recycler.js (revision 6908) +++ typo3/sysext/recycler/res/js/t3_recycler.js (working copy) @@ -31,7 +31,9 @@ * @subpackage tx_recycler * @version $Id$ */ -Event.observe(window, 'load', function() { + +Ext.ns('Recycler'); +Ext.onReady(function() { //Quicktips initialisieren Ext.QuickTips.init();