Bug #22134 ยป 13573.diff
t3lib/js/extjs/ext_rowexpander.js (revision 0) | ||
---|---|---|
/*
|
||
* 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 '<div class="x-grid3-row-expander"> </div>';
|
||
},
|
||
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 id=\"remData" + rowIndex + "\" class=\"rem-data-expand\"><\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);
|
||
}
|
||
}
|
||
});
|
typo3/sysext/recycler/mod1/index.php (working copy) | ||
---|---|---|
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 = (
|
||
... | ... | |
* @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" . '<link rel="stylesheet" type="text/css" href="' . $fileName . '" />' . "\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" . '<script language="javascript" type="text/javascript" src="' . $fileName . '"></script>' . "\n";
|
||
}
|
||
/**
|
||
* Gets the JavaScript configuration for the Ext JS interface.
|
||
*
|
||
* @return array The JavaScript configuration
|
typo3/sysext/recycler/res/js/t3_recycler.js (working copy) | ||
---|---|---|
* @subpackage tx_recycler
|
||
* @version $Id$
|
||
*/
|
||
Event.observe(window, 'load', function() {
|
||
Ext.ns('Recycler');
|
||
Ext.onReady(function() {
|
||
//Quicktips initialisieren
|
||
Ext.QuickTips.init();
|
||