extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-26 16:48:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

Convert dynheight to typescript

Browse Source
This commit is contained in:
nathangray 2020-02-12 14:49:22 -07:00
parent ec83c3a181
commit 6857c42091
10 changed files with 494 additions and 347 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

266
api/js/etemplate/et2_extension_nextmatch.js
View File

@ -35,7 +35,7 @@
// Include all nextmatch subclasses // Include all nextmatch subclasses
et2_extension_nextmatch_rowProvider; et2_extension_nextmatch_rowProvider;
et2_extension_nextmatch_controller; et2_extension_nextmatch_controller;
et2_extension_nextmatch_dynheight; et2_widget_dynheight;
// Include the grid classes // Include the grid classes
et2_dataview; et2_dataview;
@ -2975,154 +2975,134 @@ et2_core_widget_1.et2_register_widget(et2_nextmatch_filterheader, ['nextmatch-fi
/** /**
* Filter by account * Filter by account
*/ */
// class et2_nextmatch_accountfilterheader extends et2_selectAccount implements et2_INextmatchHeader, et2_IResizeable var et2_nextmatch_accountfilterheader = /** @class */ (function (_super) {
// { __extends(et2_nextmatch_accountfilterheader, _super);
// /** function et2_nextmatch_accountfilterheader() {
// * Override to add change handler return _super !== null && _super.apply(this, arguments) || this;
// * }
// */ /**
// createInputWidget( ) * Override to add change handler
// { *
// // Make sure there's an option for all */
// if(!this.options.empty_label && !this.options.select_options[""]) et2_nextmatch_accountfilterheader.prototype.createInputWidget = function () {
// { // Make sure there's an option for all
// this.options.empty_label = this.options.label ? this.options.label : egw.lang("All"); if (!this.options.empty_label && !this.options.select_options[""]) {
// } this.options.empty_label = this.options.label ? this.options.label : egw.lang("All");
// super.createInputWidget(this, arguments); }
// _super.prototype.createInputWidget.call(this, this, arguments);
// this.input.change(this, function(event) { this.input.change(this, function (event) {
// if(typeof event.data.nextmatch == 'undefined') if (typeof event.data.nextmatch == 'undefined') {
// { // Not fully set up yet
// // Not fully set up yet return;
// return; }
// } var col_filter = {};
// var col_filter = {}; col_filter[event.data.id] = event.data.getValue();
// col_filter[event.data.id] = event.data.getValue(); event.data.nextmatch.applyFilters({ col_filter: col_filter });
// event.data.nextmatch.applyFilters({col_filter: col_filter}); });
// }); };
// /**
// } * Set nextmatch is the function which has to be implemented for the
// * et2_INextmatchHeader interface.
// /** *
// * Set nextmatch is the function which has to be implemented for the * @param {et2_nextmatch} _nextmatch
// * et2_INextmatchHeader interface. */
// * et2_nextmatch_accountfilterheader.prototype.setNextmatch = function (_nextmatch) {
// * @param {et2_nextmatch} _nextmatch this.nextmatch = _nextmatch;
// */ // Set current filter value from nextmatch settings
// setNextmatch( _nextmatch) if (this.nextmatch.activeFilters.col_filter && this.nextmatch.activeFilters.col_filter[this.id]) {
// { this.set_value(this.nextmatch.activeFilters.col_filter[this.id]);
// this.nextmatch = _nextmatch; }
// };
// // Set current filter value from nextmatch settings // Make sure selectbox is not longer than the column
// if(this.nextmatch.activeFilters.col_filter && this.nextmatch.activeFilters.col_filter[this.id]) et2_nextmatch_accountfilterheader.prototype.resize = function () {
// { var max = jQuery(this.parentNode).innerWidth() - 4;
// this.set_value(this.nextmatch.activeFilters.col_filter[this.id]); var surroundings = this.getSurroundings()._widgetSurroundings;
// } for (var i = 0; i < surroundings.length; i++) {
// } max -= jQuery(surroundings[i]).outerWidth();
// // Make sure selectbox is not longer than the column }
// resize( ) this.input.css("max-width", max + "px");
// { };
// var max = jQuery(this.parentNode).innerWidth() - 4; return et2_nextmatch_accountfilterheader;
// var surroundings = this.getSurroundings()._widgetSurroundings; }(et2_selectAccount));
// for(var i = 0; i < surroundings.length; i++) exports.et2_nextmatch_accountfilterheader = et2_nextmatch_accountfilterheader;
// { et2_core_widget_1.et2_register_widget(et2_nextmatch_accountfilterheader, ['nextmatch-accountfilter']);
// max -= jQuery(surroundings[i]).outerWidth();
// }
// this.input.css("max-width",max + "px");
// }
//
// }
// et2_register_widget(et2_nextmatch_accountfilterheader, ['nextmatch-accountfilter']);
/** /**
* Filter allowing multiple values to be selected, base on a taglist instead * Filter allowing multiple values to be selected, base on a taglist instead
* of a regular selectbox * of a regular selectbox
* *
* @augments et2_taglist * @augments et2_taglist
*/ */
// class et2_nextmatch_taglistheader extends et2_taglist implements et2_INextmatchHeader, et2_IResizeable var et2_nextmatch_taglistheader = /** @class */ (function (_super) {
// { __extends(et2_nextmatch_taglistheader, _super);
// static readonly _attributes : any = { function et2_nextmatch_taglistheader() {
// autocomplete_url: { default: ''}, return _super !== null && _super.apply(this, arguments) || this;
// multiple: { default: 'toggle'}, }
// onchange: { /**
// // @ts-ignore * Override to add change handler
// default: function(event) { *
// if(typeof this.nextmatch === 'undefined') * @memberOf et2_nextmatch_filterheader
// { */
// // Not fully set up yet et2_nextmatch_taglistheader.prototype.createInputWidget = function () {
// return; // Make sure there's an option for all
// } if (!this.options.empty_label && (!this.options.select_options || !this.options.select_options[""])) {
// var col_filter = {}; this.options.empty_label = this.options.label ? this.options.label : egw.lang("All");
// col_filter[this.id] = this.getValue(); }
// // Set value so it's there for response (otherwise it gets cleared if options are updated) _super.prototype.createInputWidget.call(this);
// //event.data.set_value(event.data.input.val()); };
// /**
// this.nextmatch.applyFilters({col_filter: col_filter}); * Disable toggle if there are 2 or less options
// } * @param {Object[]} options
// }, */
// rows: { default: 2}, et2_nextmatch_taglistheader.prototype.set_select_options = function (options) {
// class: {default: 'nm_filterheader_taglist'} if (options && options.length <= 2 && this.options.multiple == 'toggle') {
// }; this.set_multiple(false);
// private nextmatch: et2_nextmatch; }
// _super.prototype.set_select_options.call(this, options);
// /** };
// * Override to add change handler /**
// * * Set nextmatch is the function which has to be implemented for the
// * @memberOf et2_nextmatch_filterheader * et2_INextmatchHeader interface.
// */ *
// createInputWidget( ) * @param {et2_nextmatch} _nextmatch
// { */
// // Make sure there's an option for all et2_nextmatch_taglistheader.prototype.setNextmatch = function (_nextmatch) {
// if(!this.options.empty_label && (!this.options.select_options || !this.options.select_options[""])) this.nextmatch = _nextmatch;
// { // Set current filter value from nextmatch settings
// this.options.empty_label = this.options.label ? this.options.label : egw.lang("All"); if (this.nextmatch.activeFilters.col_filter && typeof this.nextmatch.activeFilters.col_filter[this.id] != "undefined") {
// } this.set_value(this.nextmatch.activeFilters.col_filter[this.id]);
// super.createInputWidget(); // Make sure it's set in the nextmatch
// } _nextmatch.activeFilters.col_filter[this.id] = this.getValue();
// }
// /** };
// * Disable toggle if there are 2 or less options // Make sure selectbox is not longer than the column
// * @param {Object[]} options et2_nextmatch_taglistheader.prototype.resize = function () {
// */ this.div.css("height", '');
// set_select_options(options) this.div.css("max-width", jQuery(this.parentNode).innerWidth() + "px");
// { _super.prototype.resize.call(this);
// if(options && options.length <= 2 && this.options.multiple == 'toggle') };
// { et2_nextmatch_taglistheader._attributes = {
// this.set_multiple(false); autocomplete_url: { default: '' },
// } multiple: { default: 'toggle' },
// super.set_select_options(options) onchange: {
// } // @ts-ignore
// default: function (event) {
// /** if (typeof this.nextmatch === 'undefined') {
// * Set nextmatch is the function which has to be implemented for the // Not fully set up yet
// * et2_INextmatchHeader interface. return;
// * }
// * @param {et2_nextmatch} _nextmatch var col_filter = {};
// */ col_filter[this.id] = this.getValue();
// setNextmatch( _nextmatch) // Set value so it's there for response (otherwise it gets cleared if options are updated)
// { //event.data.set_value(event.data.input.val());
// this.nextmatch = _nextmatch; this.nextmatch.applyFilters({ col_filter: col_filter });
// }
// // Set current filter value from nextmatch settings },
// if(this.nextmatch.activeFilters.col_filter && typeof this.nextmatch.activeFilters.col_filter[this.id] != "undefined") rows: { default: 2 },
// { class: { default: 'nm_filterheader_taglist' }
// this.set_value(this.nextmatch.activeFilters.col_filter[this.id]); };
// return et2_nextmatch_taglistheader;
// // Make sure it's set in the nextmatch }(et2_taglist));
// _nextmatch.activeFilters.col_filter[this.id] = this.getValue(); et2_core_widget_1.et2_register_widget(et2_nextmatch_taglistheader, ['nextmatch-taglistheader']);
// }
// }
//
// // Make sure selectbox is not longer than the column
// resize( )
// {
// this.div.css("height",'');
// this.div.css("max-width",jQuery(this.parentNode).innerWidth() + "px");
// super.resize();
// }
//
// }
// et2_register_widget(et2_nextmatch_taglistheader, ['nextmatch-taglistheader']);
/** /**
* Nextmatch filter that can filter for a selected entry * Nextmatch filter that can filter for a selected entry
*/ */

286
api/js/etemplate/et2_extension_nextmatch.ts
View File

@ -34,7 +34,7 @@
// Include all nextmatch subclasses // Include all nextmatch subclasses
et2_extension_nextmatch_rowProvider; et2_extension_nextmatch_rowProvider;
et2_extension_nextmatch_controller; et2_extension_nextmatch_controller;
et2_extension_nextmatch_dynheight; et2_widget_dynheight;
// Include the grid classes // Include the grid classes
et2_dataview; et2_dataview;
@ -3760,64 +3760,64 @@ et2_register_widget(et2_nextmatch_filterheader, ['nextmatch-filterheader']);
/** /**
* Filter by account * Filter by account
*/ */
// class et2_nextmatch_accountfilterheader extends et2_selectAccount implements et2_INextmatchHeader, et2_IResizeable export class et2_nextmatch_accountfilterheader extends et2_selectAccount implements et2_INextmatchHeader, et2_IResizeable
// { {
// /** /**
// * Override to add change handler * Override to add change handler
// * *
// */ */
// createInputWidget( ) createInputWidget( )
// { {
// // Make sure there's an option for all // Make sure there's an option for all
// if(!this.options.empty_label && !this.options.select_options[""]) if(!this.options.empty_label && !this.options.select_options[""])
// { {
// this.options.empty_label = this.options.label ? this.options.label : egw.lang("All"); this.options.empty_label = this.options.label ? this.options.label : egw.lang("All");
// } }
// super.createInputWidget(this, arguments); super.createInputWidget(this, arguments);
//
// this.input.change(this, function(event) { this.input.change(this, function(event) {
// if(typeof event.data.nextmatch == 'undefined') if(typeof event.data.nextmatch == 'undefined')
// { {
// // Not fully set up yet // Not fully set up yet
// return; return;
// } }
// var col_filter = {}; var col_filter = {};
// col_filter[event.data.id] = event.data.getValue(); col_filter[event.data.id] = event.data.getValue();
// event.data.nextmatch.applyFilters({col_filter: col_filter}); event.data.nextmatch.applyFilters({col_filter: col_filter});
// }); });
//
// } }
//
// /** /**
// * Set nextmatch is the function which has to be implemented for the * Set nextmatch is the function which has to be implemented for the
// * et2_INextmatchHeader interface. * et2_INextmatchHeader interface.
// * *
// * @param {et2_nextmatch} _nextmatch * @param {et2_nextmatch} _nextmatch
// */ */
// setNextmatch( _nextmatch) setNextmatch( _nextmatch)
// { {
// this.nextmatch = _nextmatch; this.nextmatch = _nextmatch;
//
// // Set current filter value from nextmatch settings // Set current filter value from nextmatch settings
// if(this.nextmatch.activeFilters.col_filter && this.nextmatch.activeFilters.col_filter[this.id]) if(this.nextmatch.activeFilters.col_filter && this.nextmatch.activeFilters.col_filter[this.id])
// { {
// this.set_value(this.nextmatch.activeFilters.col_filter[this.id]); this.set_value(this.nextmatch.activeFilters.col_filter[this.id]);
// } }
// } }
// // Make sure selectbox is not longer than the column // Make sure selectbox is not longer than the column
// resize( ) resize( )
// { {
// var max = jQuery(this.parentNode).innerWidth() - 4; var max = jQuery(this.parentNode).innerWidth() - 4;
// var surroundings = this.getSurroundings()._widgetSurroundings; var surroundings = this.getSurroundings()._widgetSurroundings;
// for(var i = 0; i < surroundings.length; i++) for(var i = 0; i < surroundings.length; i++)
// { {
// max -= jQuery(surroundings[i]).outerWidth(); max -= jQuery(surroundings[i]).outerWidth();
// } }
// this.input.css("max-width",max + "px"); this.input.css("max-width",max + "px");
// } }
//
// } }
// et2_register_widget(et2_nextmatch_accountfilterheader, ['nextmatch-accountfilter']); et2_register_widget(et2_nextmatch_accountfilterheader, ['nextmatch-accountfilter']);
/** /**
* Filter allowing multiple values to be selected, base on a taglist instead * Filter allowing multiple values to be selected, base on a taglist instead
@ -3825,90 +3825,90 @@ et2_register_widget(et2_nextmatch_filterheader, ['nextmatch-filterheader']);
* *
* @augments et2_taglist * @augments et2_taglist
*/ */
// class et2_nextmatch_taglistheader extends et2_taglist implements et2_INextmatchHeader, et2_IResizeable class et2_nextmatch_taglistheader extends et2_taglist implements et2_INextmatchHeader, et2_IResizeable
// { {
// static readonly _attributes : any = { static readonly _attributes : any = {
// autocomplete_url: { default: ''}, autocomplete_url: { default: ''},
// multiple: { default: 'toggle'}, multiple: { default: 'toggle'},
// onchange: { onchange: {
// // @ts-ignore // @ts-ignore
// default: function(event) { default: function(event) {
// if(typeof this.nextmatch === 'undefined') if(typeof this.nextmatch === 'undefined')
// { {
// // Not fully set up yet // Not fully set up yet
// return; return;
// } }
// var col_filter = {}; var col_filter = {};
// col_filter[this.id] = this.getValue(); col_filter[this.id] = this.getValue();
// // Set value so it's there for response (otherwise it gets cleared if options are updated) // Set value so it's there for response (otherwise it gets cleared if options are updated)
// //event.data.set_value(event.data.input.val()); //event.data.set_value(event.data.input.val());
//
// this.nextmatch.applyFilters({col_filter: col_filter}); this.nextmatch.applyFilters({col_filter: col_filter});
// } }
// }, },
// rows: { default: 2}, rows: { default: 2},
// class: {default: 'nm_filterheader_taglist'} class: {default: 'nm_filterheader_taglist'}
// }; };
// private nextmatch: et2_nextmatch; private nextmatch: et2_nextmatch;
//
// /** /**
// * Override to add change handler * Override to add change handler
// * *
// * @memberOf et2_nextmatch_filterheader * @memberOf et2_nextmatch_filterheader
// */ */
// createInputWidget( ) createInputWidget( )
// { {
// // Make sure there's an option for all // Make sure there's an option for all
// if(!this.options.empty_label && (!this.options.select_options || !this.options.select_options[""])) if(!this.options.empty_label && (!this.options.select_options || !this.options.select_options[""]))
// { {
// this.options.empty_label = this.options.label ? this.options.label : egw.lang("All"); this.options.empty_label = this.options.label ? this.options.label : egw.lang("All");
// } }
// super.createInputWidget(); super.createInputWidget();
// } }
//
// /** /**
// * Disable toggle if there are 2 or less options * Disable toggle if there are 2 or less options
// * @param {Object[]} options * @param {Object[]} options
// */ */
// set_select_options(options) set_select_options(options)
// { {
// if(options && options.length <= 2 && this.options.multiple == 'toggle') if(options && options.length <= 2 && this.options.multiple == 'toggle')
// { {
// this.set_multiple(false); this.set_multiple(false);
// } }
// super.set_select_options(options) super.set_select_options(options)
// } }
//
// /** /**
// * Set nextmatch is the function which has to be implemented for the * Set nextmatch is the function which has to be implemented for the
// * et2_INextmatchHeader interface. * et2_INextmatchHeader interface.
// * *
// * @param {et2_nextmatch} _nextmatch * @param {et2_nextmatch} _nextmatch
// */ */
// setNextmatch( _nextmatch) setNextmatch( _nextmatch)
// { {
// this.nextmatch = _nextmatch; this.nextmatch = _nextmatch;
//
// // Set current filter value from nextmatch settings // Set current filter value from nextmatch settings
// if(this.nextmatch.activeFilters.col_filter && typeof this.nextmatch.activeFilters.col_filter[this.id] != "undefined") if(this.nextmatch.activeFilters.col_filter && typeof this.nextmatch.activeFilters.col_filter[this.id] != "undefined")
// { {
// this.set_value(this.nextmatch.activeFilters.col_filter[this.id]); this.set_value(this.nextmatch.activeFilters.col_filter[this.id]);
//
// // Make sure it's set in the nextmatch // Make sure it's set in the nextmatch
// _nextmatch.activeFilters.col_filter[this.id] = this.getValue(); _nextmatch.activeFilters.col_filter[this.id] = this.getValue();
// } }
// } }
//
// // Make sure selectbox is not longer than the column // Make sure selectbox is not longer than the column
// resize( ) resize( )
// { {
// this.div.css("height",''); this.div.css("height",'');
// this.div.css("max-width",jQuery(this.parentNode).innerWidth() + "px"); this.div.css("max-width",jQuery(this.parentNode).innerWidth() + "px");
// super.resize(); super.resize();
// } }
//
// } }
// et2_register_widget(et2_nextmatch_taglistheader, ['nextmatch-taglistheader']); et2_register_widget(et2_nextmatch_taglistheader, ['nextmatch-taglistheader']);
/** /**
* Nextmatch filter that can filter for a selected entry * Nextmatch filter that can filter for a selected entry

6
api/js/etemplate/et2_extension_nextmatch_rowProvider.js
View File

@ -67,6 +67,12 @@ var et2_nextmatch_rowProvider = /** @class */ (function () {
this._context = _context; this._context = _context;
this._createEmptyPrototype(); this._createEmptyPrototype();
} }
et2_nextmatch_rowProvider.prototype.destroy = function () {
this._rowProvider.destroy();
this._subgridCallback = null;
this._context = null;
this._dataRow = null;
};
/** /**
* Creates the data row prototype. * Creates the data row prototype.
* *

10
api/js/etemplate/et2_extension_nextmatch_rowProvider.ts
View File

@ -21,7 +21,6 @@
import {et2_widget} from "./et2_core_widget"; import {et2_widget} from "./et2_core_widget";
import {et2_arrayMgrs_expand} from "./et2_core_arrayMgr"; import {et2_arrayMgrs_expand} from "./et2_core_arrayMgr";
import {et2_dataview_rowProvider} from "./et2_dataview_view_rowProvider";
/** /**
* The row provider contains prototypes (full clonable dom-trees) * The row provider contains prototypes (full clonable dom-trees)
@ -35,6 +34,7 @@ export class et2_nextmatch_rowProvider
private _context: any; private _context: any;
private _rootWidget: any; private _rootWidget: any;
private _template: any; private _template: any;
private _dataRow: any;
/** /**
* Creates the nextmatch row provider. * Creates the nextmatch row provider.
* *
@ -55,6 +55,14 @@ export class et2_nextmatch_rowProvider
this._createEmptyPrototype(); this._createEmptyPrototype();
} }
destroy()
{
this._rowProvider.destroy();
this._subgridCallback = null;
this._context = null;
this._dataRow = null;
}
/** /**
* Creates the data row prototype. * Creates the data row prototype.
* *

152
api/js/etemplate/et2_widget_dynheight.js Normal file
View File

@ -0,0 +1,152 @@
"use strict";
/**
* EGroupware eTemplate2 - JS Dynheight object
*
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @package etemplate
* @subpackage api
* @link http://www.egroupware.org
* @author Andreas Stöckel
* @copyright Stylite 2011
* @version $Id$
*/
Object.defineProperty(exports, "__esModule", { value: true });
/*egw:use
/vendor/bower-asset/jquery/dist/jquery.js;
et2_core_inheritance;
*/
/**
* Object which resizes an inner node to the maximum extend of an outer node
* (without creating a scrollbar) - it achieves that by performing some very
* nasty and time consuming calculations.
*/
var et2_dynheight = /** @class */ (function () {
function et2_dynheight(_outerNode, _innerNode, _minHeight) {
this.initialized = false;
this.minHeight = 0;
this.bottomNodes = [];
this.innerMargin = 0;
this.outerMargin = 0;
this.outerNode = jQuery(_outerNode);
this.innerNode = jQuery(_innerNode);
this.minHeight = _minHeight;
}
/**
* Resizes the inner node. When this is done, the callback function is
* called.
*
* @param {function} _callback
* @param {object} _context
*/
et2_dynheight.prototype.update = function (_callback, _context) {
// Check whether the inner node is actually visible - if not, don't
// trigger the callback function
if (this.innerNode.is(":visible")) {
// Initialize the height calculation
this._initialize();
// Get the outer container height and offset, if available
var oh = this.outerNode.height();
var ot = this.outerNode.offset() ? this.outerNode.offset().top : 0;
// Get top and height of the inner node
var it = this.innerNode.offset().top;
// Calculate the height of the "bottomNodes"
var bminTop = this.bottomNodes.length ? Infinity : 0;
var bmaxBot = 0;
for (var i = 0; i < this.bottomNodes.length; i++) {
// Ignore hidden popups
if (this.bottomNodes[i].find('.action_popup').length) {
egw.debug('warn', "Had to skip a hidden popup - it should be removed", this.bottomNodes[i].find('.action_popup'));
continue;
}
// Ignore other hidden nodes
if (!this.bottomNodes[i].is(':visible'))
continue;
// Get height, top and bottom and calculate the maximum/minimum
var bh_1 = this.bottomNodes[i].outerHeight(true);
var bt = this.bottomNodes[i].offset().top;
var bb = bh_1 + bt;
if (i == 0 || bminTop > bt) {
bminTop = bt;
}
if (i == 0 || bmaxBot < bb) {
bmaxBot = bb;
}
}
// Get the height of the bottom container
var bh = Math.max(0, bmaxBot - bminTop);
// Calculate the new height of the inner container
var h = Math.max(this.minHeight, oh + ot - it - bh -
this.innerMargin - this.outerMargin);
this.innerNode.height(h);
// Update the width
// Some checking to make sure it doesn't overflow the width when user
// resizes the window
var w = this.outerNode.width();
if (w > jQuery(window).width()) {
// 50px border, totally arbitrary, but we just need to make sure it's inside
w = jQuery(window).width() - 50;
}
if (w != this.innerNode.outerWidth()) {
this.innerNode.width(w);
}
// Call the callback function
if (typeof _callback != "undefined") {
_callback.call(_context, w, h);
}
}
};
/**
* Function used internally which collects all DOM-Nodes which are located
* below this element.
*
* @param {HTMLElement} _node
* @param {number} _bottom
*/
et2_dynheight.prototype._collectBottomNodes = function (_node, _bottom) {
// Calculate the bottom position of the inner node
if (typeof _bottom == "undefined") {
_bottom = this.innerNode.offset().top + this.innerNode.height();
}
if (_node) {
// Accumulate the outer margin of the parent elements
var node = jQuery(_node);
var ooh = node.outerHeight(true);
var oh = node.height();
this.outerMargin += (ooh - oh) / 2; // Divide by 2 as the value contains margin-top and -bottom
// Iterate over the children of the given node and do the same
// recursively to the parent nodes until the _outerNode or body is
// reached.
var self_1 = this;
jQuery(_node).children().each(function () {
var $this = jQuery(this);
var top = $this.offset().top;
if (this != self_1.innerNode[0] && top >= _bottom) {
self_1.bottomNodes.push($this);
}
});
if (_node != this.outerNode[0] && _node != jQuery("body")[0]) {
this._collectBottomNodes(_node.parentNode, _bottom);
}
}
};
/**
* Used internally to calculate some information which will not change over
* the time.
*/
et2_dynheight.prototype._initialize = function () {
if (!this.initialized) {
// Collect all bottomNodes and calculates the outer margin
this.bottomNodes = [];
this.outerMargin = 0;
this._collectBottomNodes(this.innerNode[0].parentNode);
// Calculate the inner margin
var ioh = this.innerNode.outerHeight(true);
var ih = this.innerNode.height();
this.innerMargin = ioh - ih;
this.initialized = true;
}
};
return et2_dynheight;
}());
exports.et2_dynheight = et2_dynheight;
//# sourceMappingURL=et2_widget_dynheight.js.map

93
api/js/etemplate/et2_extension_nextmatch_dynheight.js → api/js/etemplate/et2_widget_dynheight.ts
View File

@ -19,32 +19,25 @@
* Object which resizes an inner node to the maximum extend of an outer node * Object which resizes an inner node to the maximum extend of an outer node
* (without creating a scrollbar) - it achieves that by performing some very * (without creating a scrollbar) - it achieves that by performing some very
* nasty and time consuming calculations. * nasty and time consuming calculations.
*
* @augments Class
*/ */
var et2_dynheight = (function(){ "use strict"; return Class.extend( export class et2_dynheight
{ {
/** private initialized: boolean = false;
* Constructor for the dynheight object
* private outerNode: JQuery;
* @param _outerNode is the node which surrounds the _innerNode and to private innerNode: JQuery;
* which extend the innerNode should be expanded without creating a private minHeight: number = 0;
* scrollbar. Note: The outer node must be a parent of the inner node.
* @param _innerNode is the node which should be scaled. Call update to private bottomNodes: any[] = [];
* scale the node. private innerMargin: number = 0;
* @param _minHeight is the minimum height the inner node should have private outerMargin: number = 0;
* @memberOf et2_dynheight
*/ constructor(_outerNode, _innerNode, _minHeight)
init: function(_outerNode, _innerNode, _minHeight) { {
this.outerNode = jQuery(_outerNode); this.outerNode = jQuery(_outerNode);
this.innerNode = jQuery(_innerNode); this.innerNode = jQuery(_innerNode);
this.minHeight = _minHeight; this.minHeight = _minHeight;
}
this.bottomNodes = [];
this.initialized = false;
this.innerMargin = 0;
this.outerMargin = 0;
},
/** /**
* Resizes the inner node. When this is done, the callback function is * Resizes the inner node. When this is done, the callback function is
@ -53,7 +46,8 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
* @param {function} _callback * @param {function} _callback
* @param {object} _context * @param {object} _context
*/ */
update: function(_callback, _context) { update( _callback, _context)
{
// Check whether the inner node is actually visible - if not, don't // Check whether the inner node is actually visible - if not, don't
// trigger the callback function // trigger the callback function
if (this.innerNode.is(":visible")) if (this.innerNode.is(":visible"))
@ -62,16 +56,16 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
this._initialize(); this._initialize();
// Get the outer container height and offset, if available // Get the outer container height and offset, if available
var oh = this.outerNode.height(); const oh = this.outerNode.height();
var ot = this.outerNode.offset() ? this.outerNode.offset().top : 0; const ot = this.outerNode.offset() ? this.outerNode.offset().top : 0;
// Get top and height of the inner node // Get top and height of the inner node
var it = this.innerNode.offset().top; const it = this.innerNode.offset().top;
// Calculate the height of the "bottomNodes" // Calculate the height of the "bottomNodes"
var bminTop = this.bottomNodes.length ? Infinity : 0; let bminTop = this.bottomNodes.length ? Infinity : 0;
var bmaxBot = 0; let bmaxBot = 0;
for (var i = 0; i < this.bottomNodes.length; i++) for (let i = 0; i < this.bottomNodes.length; i++)
{ {
// Ignore hidden popups // Ignore hidden popups
if(this.bottomNodes[i].find('.action_popup').length) if(this.bottomNodes[i].find('.action_popup').length)
@ -85,9 +79,9 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
if(!this.bottomNodes[i].is(':visible')) continue; if(!this.bottomNodes[i].is(':visible')) continue;
// Get height, top and bottom and calculate the maximum/minimum // Get height, top and bottom and calculate the maximum/minimum
var bh = this.bottomNodes[i].outerHeight(true); let bh = this.bottomNodes[i].outerHeight(true);
var bt = this.bottomNodes[i].offset().top; let bt = this.bottomNodes[i].offset().top;
var bb = bh + bt; const bb = bh + bt;
if (i == 0 || bminTop > bt) if (i == 0 || bminTop > bt)
{ {
@ -101,17 +95,17 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
} }
// Get the height of the bottom container // Get the height of the bottom container
var bh = Math.max(0,bmaxBot - bminTop); const bh = Math.max(0, bmaxBot - bminTop);
// Calculate the new height of the inner container // Calculate the new height of the inner container
var h = Math.max(this.minHeight, oh + ot - it - bh - const h = Math.max(this.minHeight, oh + ot - it - bh -
this.innerMargin - this.outerMargin); this.innerMargin - this.outerMargin);
this.innerNode.height(h); this.innerNode.height(h);
// Update the width // Update the width
// Some checking to make sure it doesn't overflow the width when user // Some checking to make sure it doesn't overflow the width when user
// resizes the window // resizes the window
var w = this.outerNode.width(); let w = this.outerNode.width();
if (w > jQuery(window).width()) if (w > jQuery(window).width())
{ {
// 50px border, totally arbitrary, but we just need to make sure it's inside // 50px border, totally arbitrary, but we just need to make sure it's inside
@ -128,16 +122,17 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
_callback.call(_context, w, h); _callback.call(_context, w, h);
} }
} }
}, }
/** /**
* Function used internally which collects all DOM-Nodes which are located * Function used internally which collects all DOM-Nodes which are located
* below this element. * below this element.
* *
* @param {DOMElement} _node * @param {HTMLElement} _node
* @param {number} _bottom * @param {number} _bottom
*/ */
_collectBottomNodes: function(_node, _bottom) { _collectBottomNodes( _node : any, _bottom? : number)
{
// Calculate the bottom position of the inner node // Calculate the bottom position of the inner node
if (typeof _bottom == "undefined") if (typeof _bottom == "undefined")
{ {
@ -147,18 +142,18 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
if (_node) if (_node)
{ {
// Accumulate the outer margin of the parent elements // Accumulate the outer margin of the parent elements
var node = jQuery(_node); const node = jQuery(_node);
var ooh = node.outerHeight(true); const ooh = node.outerHeight(true);
var oh = node.height(); const oh = node.height();
this.outerMargin += (ooh - oh) / 2; // Divide by 2 as the value contains margin-top and -bottom this.outerMargin += (ooh - oh) / 2; // Divide by 2 as the value contains margin-top and -bottom
// Iterate over the children of the given node and do the same // Iterate over the children of the given node and do the same
// recursively to the parent nodes until the _outerNode or body is // recursively to the parent nodes until the _outerNode or body is
// reached. // reached.
var self = this; const self = this;
jQuery(_node).children().each(function() { jQuery(_node).children().each(function() {
var $this = jQuery(this); const $this = jQuery(this);
var top = $this.offset().top; const top = $this.offset().top;
if (this != self.innerNode[0] && top >= _bottom) if (this != self.innerNode[0] && top >= _bottom)
{ {
self.bottomNodes.push($this); self.bottomNodes.push($this);
@ -170,13 +165,14 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
this._collectBottomNodes(_node.parentNode, _bottom); this._collectBottomNodes(_node.parentNode, _bottom);
} }
} }
}, }
/** /**
* Used internally to calculate some information which will not change over * Used internally to calculate some information which will not change over
* the time. * the time.
*/ */
_initialize: function() { _initialize( )
{
if (!this.initialized) if (!this.initialized)
{ {
// Collect all bottomNodes and calculates the outer margin // Collect all bottomNodes and calculates the outer margin
@ -185,13 +181,12 @@ var et2_dynheight = (function(){ "use strict"; return Class.extend(
this._collectBottomNodes(this.innerNode[0].parentNode); this._collectBottomNodes(this.innerNode[0].parentNode);
// Calculate the inner margin // Calculate the inner margin
var ioh = this.innerNode.outerHeight(true); const ioh = this.innerNode.outerHeight(true);
var ih = this.innerNode.height(); const ih = this.innerNode.height();
this.innerMargin = ioh - ih; this.innerMargin = ioh - ih;
this.initialized = true; this.initialized = true;
} }
} }
});}).call(this); }

11
api/js/etemplate/et2_widget_historylog.js
View File

@ -29,6 +29,7 @@ var et2_core_valueWidget_1 = require("./et2_core_valueWidget");
var et2_dataview_1 = require("./et2_dataview"); var et2_dataview_1 = require("./et2_dataview");
var et2_dataview_model_columns_1 = require("./et2_dataview_model_columns"); var et2_dataview_model_columns_1 = require("./et2_dataview_model_columns");
var et2_dataview_controller_1 = require("./et2_dataview_controller"); var et2_dataview_controller_1 = require("./et2_dataview_controller");
var et2_widget_diff_1 = require("./et2_widget_diff");
/** /**
* eTemplate history log widget displays a list of changes to the current record. * eTemplate history log widget displays a list of changes to the current record.
* The widget is encapsulated, and only needs the record's ID, and a map of * The widget is encapsulated, and only needs the record's ID, and a map of
@ -200,7 +201,7 @@ var et2_historylog = /** @class */ (function (_super) {
if (this.controller) if (this.controller)
this.controller.destroy(); this.controller.destroy();
if (this.dynheight) if (this.dynheight)
this.dynheight.free(); this.dynheight.destroy();
_super.prototype.destroy.call(this); _super.prototype.destroy.call(this);
}; };
/** /**
@ -285,6 +286,7 @@ var et2_historylog = /** @class */ (function (_super) {
// Widget for text diffs // Widget for text diffs
var diff = et2_createWidget('diff', {}, this); var diff = et2_createWidget('diff', {}, this);
this.diff = { this.diff = {
// @ts-ignore
widget: diff, widget: diff,
nodes: jQuery(diff.getDetachedNodes()) nodes: jQuery(diff.getDetachedNodes())
}; };
@ -436,7 +438,7 @@ var et2_historylog = /** @class */ (function (_super) {
} }
for (var j = 0; j < widget._children.length; j++) { for (var j = 0; j < widget._children.length; j++) {
nodes.push(self.fields[_data.status].nodes[j].clone()); nodes.push(self.fields[_data.status].nodes[j].clone());
if (widget._children[j].instanceOf(et2_diff)) { if (widget._children[j].instanceOf(et2_widget_diff_1.et2_diff)) {
self._spanValueColumns(jQuery(this)); self._spanValueColumns(jQuery(this));
} }
} }
@ -543,8 +545,9 @@ var et2_historylog = /** @class */ (function (_super) {
} }
// Resize diff widgets to match new space // Resize diff widgets to match new space
if (this.dataview) { if (this.dataview) {
var columns = this.dataview.getColumnMgr().columnWidths; var columns = this.dataview.getColumnMgr();
jQuery('.et2_diff', this.div).closest('.innerContainer').width(columns[et2_historylog.NEW_VALUE] + columns[et2_historylog.OLD_VALUE]); jQuery('.et2_diff', this.div).closest('.innerContainer')
.width(columns.getColumnWidth(et2_historylog.NEW_VALUE) + columns.getColumnWidth(et2_historylog.OLD_VALUE));
} }
}; };
et2_historylog._attributes = { et2_historylog._attributes = {

13
api/js/etemplate/et2_widget_historylog.ts
View File

@ -25,6 +25,7 @@ import {et2_valueWidget} from "./et2_core_valueWidget";
import {et2_dataview} from "./et2_dataview"; import {et2_dataview} from "./et2_dataview";
import {et2_dataview_column} from "./et2_dataview_model_columns"; import {et2_dataview_column} from "./et2_dataview_model_columns";
import {et2_dataview_controller} from "./et2_dataview_controller"; import {et2_dataview_controller} from "./et2_dataview_controller";
import {et2_diff} from "./et2_widget_diff";
/** /**
* eTemplate history log widget displays a list of changes to the current record. * eTemplate history log widget displays a list of changes to the current record.
@ -288,7 +289,7 @@ export class et2_historylog extends et2_valueWidget implements et2_IDataProvider
// Free the grid components // Free the grid components
if(this.dataview) this.dataview.destroy(); if(this.dataview) this.dataview.destroy();
if(this.controller) this.controller.destroy(); if(this.controller) this.controller.destroy();
if(this.dynheight) this.dynheight.free(); if(this.dynheight) this.dynheight.destroy();
super.destroy(); super.destroy();
} }
@ -395,8 +396,9 @@ export class et2_historylog extends et2_valueWidget implements et2_IDataProvider
}; };
} }
// Widget for text diffs // Widget for text diffs
var diff = et2_createWidget('diff', {}, this); const diff = et2_createWidget('diff', {}, this);
this.diff = { this.diff = {
// @ts-ignore
widget: diff, widget: diff,
nodes: jQuery(diff.getDetachedNodes()) nodes: jQuery(diff.getDetachedNodes())
}; };
@ -582,7 +584,7 @@ export class et2_historylog extends et2_valueWidget implements et2_IDataProvider
let row = this.dataview.rowProvider.getPrototype("default"); let row = this.dataview.rowProvider.getPrototype("default");
let self = this; let self = this;
jQuery("div", row).each(function (i) { jQuery("div", row).each(function (i) {
let nodes = []; let nodes : any[] | JQuery = [];
let widget = et2_historylog.columns[i].widget; let widget = et2_historylog.columns[i].widget;
let value = _data[et2_historylog.columns[i].id]; let value = _data[et2_historylog.columns[i].id];
if(et2_historylog.OWNER === i && _data['share_email']) if(et2_historylog.OWNER === i && _data['share_email'])
@ -738,8 +740,9 @@ export class et2_historylog extends et2_valueWidget implements et2_IDataProvider
// Resize diff widgets to match new space // Resize diff widgets to match new space
if(this.dataview) if(this.dataview)
{ {
var columns = this.dataview.getColumnMgr().columnWidths; var columns = this.dataview.getColumnMgr();
jQuery('.et2_diff', this.div).closest('.innerContainer').width(columns[et2_historylog.NEW_VALUE] + columns[et2_historylog.OLD_VALUE]); jQuery('.et2_diff', this.div).closest('.innerContainer')
.width(columns.getColumnWidth(et2_historylog.NEW_VALUE) + columns.getColumnWidth(et2_historylog.OLD_VALUE));
} }
} }
} }

2
api/js/etemplate/test/test_dataview.html
View File

@ -27,7 +27,7 @@
<script src="../et2_core_interfaces.js"></script> <script src="../et2_core_interfaces.js"></script>
<script src="../et2_core_common.js"></script> <script src="../et2_core_common.js"></script>
<script src="../et2_extension_nextmatch_dynheight.js"></script> <script src="../et2_widget_dynheight.js"></script>
<script src="../et2_dataview_interfaces.js"></script> <script src="../et2_dataview_interfaces.js"></script>
<script src="../et2_dataview_controller.js"></script> <script src="../et2_dataview_controller.js"></script>

2
api/js/etemplate/test/test_xml.html
View File

@ -69,7 +69,7 @@
<script src="../et2_widget_progress.js"></script> <script src="../et2_widget_progress.js"></script>
<script src="../et2_extension_nextmatch.js"></script> <script src="../et2_extension_nextmatch.js"></script>
<script src="../et2_extension_nextmatch_dynheight.js"></script> <script src="../et2_widget_dynheight.js"></script>
<script src="../et2_dataview_interfaces.js"></script> <script src="../et2_dataview_interfaces.js"></script>
<script src="../et2_dataview_model_dataProvider.js"></script> <script src="../et2_dataview_model_dataProvider.js"></script>