mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-12-27 00:58:55 +01:00
Convert et2_hbox to TS
This commit is contained in:
Hadi Nategh
parent
df9e708b55
commit
e1c4613a4d
@ -1,3 +1,4 @@
|
|||||||
|
"use strict";
|
||||||
/**
|
/**
|
||||||
* EGroupware eTemplate2 - JS HBox object
|
* EGroupware eTemplate2 - JS HBox object
|
||||||
*
|
*
|
||||||
@ -6,182 +7,164 @@
|
|||||||
* @subpackage api
|
* @subpackage api
|
||||||
* @link http://www.egroupware.org
|
* @link http://www.egroupware.org
|
||||||
* @author Andreas Stöckel
|
* @author Andreas Stöckel
|
||||||
* @copyright Stylite 2011
|
|
||||||
* @version $Id: et2_box.js 36147 2011-08-16 13:12:39Z igel457 $
|
|
||||||
*/
|
*/
|
||||||
|
var __extends = (this && this.__extends) || (function () {
|
||||||
|
var extendStatics = function (d, b) {
|
||||||
|
extendStatics = Object.setPrototypeOf ||
|
||||||
|
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
||||||
|
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
||||||
|
return extendStatics(d, b);
|
||||||
|
};
|
||||||
|
return function (d, b) {
|
||||||
|
extendStatics(d, b);
|
||||||
|
function __() { this.constructor = d; }
|
||||||
|
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
||||||
|
};
|
||||||
|
})();
|
||||||
|
Object.defineProperty(exports, "__esModule", { value: true });
|
||||||
/*egw:uses
|
/*egw:uses
|
||||||
/vendor/bower-asset/jquery/dist/jquery.js;
|
/vendor/bower-asset/jquery/dist/jquery.js;
|
||||||
et2_core_baseWidget;
|
et2_core_baseWidget;
|
||||||
*/
|
*/
|
||||||
|
var et2_core_inheritance_1 = require("./et2_core_inheritance");
|
||||||
|
var et2_core_widget_1 = require("./et2_core_widget");
|
||||||
|
var et2_core_baseWidget_1 = require("./et2_core_baseWidget");
|
||||||
/**
|
/**
|
||||||
* Class which implements hbox tag
|
* Class which implements hbox tag
|
||||||
*
|
*
|
||||||
* @augments et2_baseWidget
|
* @augments et2_baseWidget
|
||||||
*/
|
*/
|
||||||
var et2_hbox = (function(){ "use strict"; return et2_baseWidget.extend(
|
var et2_hbox = /** @class */ (function (_super) {
|
||||||
{
|
__extends(et2_hbox, _super);
|
||||||
createNamespace: true,
|
/**
|
||||||
|
* Constructor
|
||||||
/**
|
*
|
||||||
* Constructor
|
* @memberOf et2_hbox
|
||||||
*
|
*/
|
||||||
* @memberOf et2_hbox
|
function et2_hbox(_parent, _attrs, _child) {
|
||||||
*/
|
var _this = _super.call(this, _parent, _attrs, et2_core_inheritance_1.ClassWithAttributes.extendAttributes(et2_core_baseWidget_1.et2_baseWidget._attributes, _child || {})) || this;
|
||||||
init: function() {
|
_this.createNamespace = true;
|
||||||
this._super.apply(this, arguments);
|
_this.alignData = {
|
||||||
|
"hasAlign": false,
|
||||||
this.alignData = {
|
"hasLeft": false,
|
||||||
"hasAlign": false,
|
"hasCenter": false,
|
||||||
"hasLeft": false,
|
"hasRight": false,
|
||||||
"hasCenter": false,
|
"lastAlign": "left"
|
||||||
"hasRight": false,
|
};
|
||||||
"lastAlign": "left"
|
_this.leftDiv = null;
|
||||||
};
|
_this.rightDiv = null;
|
||||||
|
_this.div = null;
|
||||||
this.leftDiv = null;
|
_this.leftDiv = null;
|
||||||
this.rightDiv = null;
|
_this.rightDiv = null;
|
||||||
|
_this.div = jQuery(document.createElement("div"))
|
||||||
this.div = jQuery(document.createElement("div"))
|
.addClass("et2_" + _super.prototype.getType.call(_this))
|
||||||
.addClass("et2_" + this._type)
|
.addClass("et2_box_widget");
|
||||||
.addClass("et2_box_widget");
|
_super.prototype.setDOMNode.call(_this, _this.div[0]);
|
||||||
|
return _this;
|
||||||
this.setDOMNode(this.div[0]);
|
}
|
||||||
},
|
et2_hbox.prototype._buildAlignCells = function () {
|
||||||
|
if (this.alignData.hasAlign) {
|
||||||
_buildAlignCells: function() {
|
// Check whether we have more than one type of align
|
||||||
if (this.alignData.hasAlign)
|
var mto = (this.alignData.hasLeft && this.alignData.hasRight) ||
|
||||||
{
|
(this.alignData.hasLeft && this.alignData.hasCenter) ||
|
||||||
// Check whether we have more than one type of align
|
(this.alignData.hasCenter && this.alignData.hasRight);
|
||||||
var mto = (this.alignData.hasLeft && this.alignData.hasRight) ||
|
if (!mto) {
|
||||||
(this.alignData.hasLeft && this.alignData.hasCenter) ||
|
// If there is only one type of align, we simply have to set
|
||||||
(this.alignData.hasCenter && this.alignData.hasRight);
|
// the align of the top container
|
||||||
|
if (this.alignData.lastAlign != "left") {
|
||||||
if (!mto)
|
this.div.addClass("et2_hbox_al_" + this.alignData.lastAlign);
|
||||||
{
|
}
|
||||||
// If there is only one type of align, we simply have to set
|
}
|
||||||
// the align of the top container
|
else {
|
||||||
if (this.alignData.lastAlign != "left")
|
// Create an additional container for elements with align type
|
||||||
{
|
// "right"
|
||||||
this.div.addClass("et2_hbox_al_" + this.alignData.lastAlign);
|
if (this.alignData.hasRight) {
|
||||||
}
|
this.rightDiv = jQuery(document.createElement("div"))
|
||||||
}
|
.addClass("et2_hbox_right")
|
||||||
else
|
.appendTo(this.div);
|
||||||
{
|
}
|
||||||
// Create an additional container for elements with align type
|
// Create an additional container for elements with align type
|
||||||
// "right"
|
// left, as the top container is used for the centered elements
|
||||||
if (this.alignData.hasRight)
|
if (this.alignData.hasCenter) {
|
||||||
{
|
// Create the left div if an element is centered
|
||||||
this.rightDiv = jQuery(document.createElement("div"))
|
this.leftDiv = jQuery(document.createElement("div"))
|
||||||
.addClass("et2_hbox_right")
|
.addClass("et2_hbox_left")
|
||||||
.appendTo(this.div);
|
.appendTo(this.div);
|
||||||
}
|
this.div.addClass("et2_hbox_al_center");
|
||||||
|
}
|
||||||
// Create an additional container for elements with align type
|
}
|
||||||
// left, as the top container is used for the centered elements
|
}
|
||||||
if (this.alignData.hasCenter)
|
};
|
||||||
{
|
/**
|
||||||
// Create the left div if an element is centered
|
* The overwritten loadFromXML function checks whether any child element has
|
||||||
this.leftDiv = jQuery(document.createElement("div"))
|
* a special align value.
|
||||||
.addClass("et2_hbox_left")
|
*
|
||||||
.appendTo(this.div);
|
* @param {object} _node
|
||||||
|
*/
|
||||||
this.div.addClass("et2_hbox_al_center");
|
et2_hbox.prototype.loadFromXML = function (_node) {
|
||||||
}
|
// Check whether any child node has an alignment tag
|
||||||
}
|
et2_filteredNodeIterator(_node, function (_node) {
|
||||||
}
|
var align = _node.getAttribute("align");
|
||||||
},
|
if (!align) {
|
||||||
|
align = "left";
|
||||||
/**
|
}
|
||||||
* The overwritten loadFromXML function checks whether any child element has
|
if (align != "left") {
|
||||||
* a special align value.
|
this.alignData.hasAlign = true;
|
||||||
*
|
}
|
||||||
* @param {object} _node
|
this.alignData.lastAlign = align;
|
||||||
*/
|
switch (align) {
|
||||||
loadFromXML: function(_node) {
|
case "left":
|
||||||
// Check whether any child node has an alignment tag
|
this.alignData.hasLeft = true;
|
||||||
et2_filteredNodeIterator(_node, function(_node) {
|
break;
|
||||||
var align = _node.getAttribute("align");
|
case "right":
|
||||||
|
this.alignData.hasRight = true;
|
||||||
if (!align)
|
break;
|
||||||
{
|
case "center":
|
||||||
align = "left";
|
this.alignData.hasCenter = true;
|
||||||
}
|
break;
|
||||||
|
}
|
||||||
if (align != "left")
|
}, this);
|
||||||
{
|
// Build the align cells
|
||||||
this.alignData.hasAlign = true;
|
this._buildAlignCells();
|
||||||
}
|
// Load the nodes as usual
|
||||||
|
_super.prototype.loadFromXML.call(this, _node);
|
||||||
this.alignData.lastAlign = align;
|
};
|
||||||
|
et2_hbox.prototype.assign = function (_obj) {
|
||||||
switch (align)
|
// Copy the align data and the cells from the object which should be
|
||||||
{
|
// assigned
|
||||||
case "left":
|
this.alignData = et2_cloneObject(_obj.alignData);
|
||||||
this.alignData.hasLeft = true;
|
this._buildAlignCells();
|
||||||
break;
|
// Call the inherited assign function
|
||||||
case "right":
|
_super.prototype.assign.call(this, _obj);
|
||||||
this.alignData.hasRight = true;
|
};
|
||||||
break;
|
et2_hbox.prototype.getDOMNode = function (_sender) {
|
||||||
case "center":
|
// Return a special align container if this hbox needs it
|
||||||
this.alignData.hasCenter = true;
|
if (_sender != this && this.alignData.hasAlign) {
|
||||||
break;
|
// Check whether we've create a special container for the widget
|
||||||
}
|
var align = (_sender.implements(et2_IAligned) ?
|
||||||
}, this);
|
_sender.get_align() : "left");
|
||||||
|
if (align == "left" && this.leftDiv != null) {
|
||||||
// Build the align cells
|
return this.leftDiv[0];
|
||||||
this._buildAlignCells();
|
}
|
||||||
|
if (align == "right" && this.rightDiv != null) {
|
||||||
// Load the nodes as usual
|
return this.rightDiv[0];
|
||||||
this._super.apply(this, arguments);
|
}
|
||||||
},
|
}
|
||||||
|
// Normally simply return the hbox-div
|
||||||
assign: function(_obj) {
|
return _super.prototype.getDOMNode.call(this, _sender);
|
||||||
// Copy the align data and the cells from the object which should be
|
};
|
||||||
// assigned
|
/**
|
||||||
this.alignData = et2_cloneObject(_obj.alignData);
|
* Tables added to the root node need to be inline instead of blocks
|
||||||
this._buildAlignCells();
|
*
|
||||||
|
* @param {et2_widget} child child-widget to add
|
||||||
// Call the inherited assign function
|
*/
|
||||||
this._super.apply(this, arguments);
|
et2_hbox.prototype.addChild = function (child) {
|
||||||
},
|
_super.prototype.addChild.call(this, child);
|
||||||
|
if (child.instanceOf && child.instanceOf(et2_grid) || child._type == 'et2_grid') {
|
||||||
getDOMNode: function(_sender) {
|
jQuery(child.getDOMNode(child)).css("display", "inline-table");
|
||||||
// Return a special align container if this hbox needs it
|
}
|
||||||
if (_sender != this && this.alignData.hasAlign)
|
};
|
||||||
{
|
return et2_hbox;
|
||||||
// Check whether we've create a special container for the widget
|
}(et2_core_baseWidget_1.et2_baseWidget));
|
||||||
var align = (_sender.implements(et2_IAligned) ?
|
et2_core_widget_1.et2_register_widget(et2_hbox, ["hbox"]);
|
||||||
_sender.get_align() : "left");
|
//# sourceMappingURL=et2_widget_hbox.js.map
|
||||||
|
|
||||||
if (align == "left" && this.leftDiv != null)
|
|
||||||
{
|
|
||||||
return this.leftDiv[0];
|
|
||||||
}
|
|
||||||
|
|
||||||
if (align == "right" && this.rightDiv != null)
|
|
||||||
{
|
|
||||||
return this.rightDiv[0];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Normally simply return the hbox-div
|
|
||||||
return this._super.apply(this, arguments);
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Tables added to the root node need to be inline instead of blocks
|
|
||||||
*
|
|
||||||
* @param {et2_widget} child child-widget to add
|
|
||||||
*/
|
|
||||||
addChild: function(child) {
|
|
||||||
this._super.apply(this, arguments);
|
|
||||||
if(child.instanceOf && child.instanceOf(et2_grid) || child._type == 'et2_grid')
|
|
||||||
{
|
|
||||||
jQuery(child.getDOMNode(child)).css("display", "inline-table");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});}).call(this);
|
|
||||||
et2_register_widget(et2_hbox, ["hbox"]);
|
|
||||||
|
|
||||||
1
api/js/etemplate/et2_widget_hbox.js.map
Normal file
1
api/js/etemplate/et2_widget_hbox.js.map
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"et2_widget_hbox.js","sourceRoot":"","sources":["et2_widget_hbox.ts"],"names":[],"mappings":"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"}
|
||||||
193
api/js/etemplate/et2_widget_hbox.ts
Normal file
193
api/js/etemplate/et2_widget_hbox.ts
Normal file
@ -0,0 +1,193 @@
|
|||||||
|
/**
|
||||||
|
* EGroupware eTemplate2 - JS HBox 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
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*egw:uses
|
||||||
|
/vendor/bower-asset/jquery/dist/jquery.js;
|
||||||
|
et2_core_baseWidget;
|
||||||
|
*/
|
||||||
|
|
||||||
|
import {ClassWithAttributes} from "./et2_core_inheritance";
|
||||||
|
import {et2_register_widget, WidgetConfig} from "./et2_core_widget";
|
||||||
|
import {et2_baseWidget} from "./et2_core_baseWidget";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Class which implements hbox tag
|
||||||
|
*
|
||||||
|
* @augments et2_baseWidget
|
||||||
|
*/
|
||||||
|
class et2_hbox extends et2_baseWidget
|
||||||
|
{
|
||||||
|
createNamespace: boolean = true;
|
||||||
|
alignData : any = {
|
||||||
|
"hasAlign": false,
|
||||||
|
"hasLeft": false,
|
||||||
|
"hasCenter": false,
|
||||||
|
"hasRight": false,
|
||||||
|
"lastAlign": "left"
|
||||||
|
};
|
||||||
|
leftDiv : JQuery = null;
|
||||||
|
rightDiv : JQuery = null;
|
||||||
|
div : JQuery = null;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Constructor
|
||||||
|
*
|
||||||
|
* @memberOf et2_hbox
|
||||||
|
*/
|
||||||
|
constructor(_parent?, _attrs? : WidgetConfig, _child? : object)
|
||||||
|
{
|
||||||
|
super(_parent, _attrs, ClassWithAttributes.extendAttributes(et2_baseWidget._attributes, _child || {}));
|
||||||
|
|
||||||
|
this.leftDiv = null;
|
||||||
|
this.rightDiv = null;
|
||||||
|
|
||||||
|
this.div = jQuery(document.createElement("div"))
|
||||||
|
.addClass("et2_" + super.getType())
|
||||||
|
.addClass("et2_box_widget");
|
||||||
|
|
||||||
|
super.setDOMNode(this.div[0]);
|
||||||
|
}
|
||||||
|
|
||||||
|
_buildAlignCells() {
|
||||||
|
if (this.alignData.hasAlign)
|
||||||
|
{
|
||||||
|
// Check whether we have more than one type of align
|
||||||
|
let mto = (this.alignData.hasLeft && this.alignData.hasRight) ||
|
||||||
|
(this.alignData.hasLeft && this.alignData.hasCenter) ||
|
||||||
|
(this.alignData.hasCenter && this.alignData.hasRight);
|
||||||
|
|
||||||
|
if (!mto)
|
||||||
|
{
|
||||||
|
// If there is only one type of align, we simply have to set
|
||||||
|
// the align of the top container
|
||||||
|
if (this.alignData.lastAlign != "left")
|
||||||
|
{
|
||||||
|
this.div.addClass("et2_hbox_al_" + this.alignData.lastAlign);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
// Create an additional container for elements with align type
|
||||||
|
// "right"
|
||||||
|
if (this.alignData.hasRight)
|
||||||
|
{
|
||||||
|
this.rightDiv = jQuery(document.createElement("div"))
|
||||||
|
.addClass("et2_hbox_right")
|
||||||
|
.appendTo(this.div);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Create an additional container for elements with align type
|
||||||
|
// left, as the top container is used for the centered elements
|
||||||
|
if (this.alignData.hasCenter)
|
||||||
|
{
|
||||||
|
// Create the left div if an element is centered
|
||||||
|
this.leftDiv = jQuery(document.createElement("div"))
|
||||||
|
.addClass("et2_hbox_left")
|
||||||
|
.appendTo(this.div);
|
||||||
|
|
||||||
|
this.div.addClass("et2_hbox_al_center");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The overwritten loadFromXML function checks whether any child element has
|
||||||
|
* a special align value.
|
||||||
|
*
|
||||||
|
* @param {object} _node
|
||||||
|
*/
|
||||||
|
loadFromXML(_node) {
|
||||||
|
// Check whether any child node has an alignment tag
|
||||||
|
et2_filteredNodeIterator(_node, function(_node) {
|
||||||
|
let align = _node.getAttribute("align");
|
||||||
|
|
||||||
|
if (!align)
|
||||||
|
{
|
||||||
|
align = "left";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (align != "left")
|
||||||
|
{
|
||||||
|
this.alignData.hasAlign = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.alignData.lastAlign = align;
|
||||||
|
|
||||||
|
switch (align)
|
||||||
|
{
|
||||||
|
case "left":
|
||||||
|
this.alignData.hasLeft = true;
|
||||||
|
break;
|
||||||
|
case "right":
|
||||||
|
this.alignData.hasRight = true;
|
||||||
|
break;
|
||||||
|
case "center":
|
||||||
|
this.alignData.hasCenter = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}, this);
|
||||||
|
|
||||||
|
// Build the align cells
|
||||||
|
this._buildAlignCells();
|
||||||
|
|
||||||
|
// Load the nodes as usual
|
||||||
|
super.loadFromXML(_node);
|
||||||
|
}
|
||||||
|
|
||||||
|
assign(_obj) {
|
||||||
|
// Copy the align data and the cells from the object which should be
|
||||||
|
// assigned
|
||||||
|
this.alignData = et2_cloneObject(_obj.alignData);
|
||||||
|
this._buildAlignCells();
|
||||||
|
|
||||||
|
// Call the inherited assign function
|
||||||
|
super.assign(_obj);
|
||||||
|
}
|
||||||
|
|
||||||
|
getDOMNode(_sender) {
|
||||||
|
// Return a special align container if this hbox needs it
|
||||||
|
if (_sender != this && this.alignData.hasAlign)
|
||||||
|
{
|
||||||
|
// Check whether we've create a special container for the widget
|
||||||
|
let align = (_sender.implements(et2_IAligned) ?
|
||||||
|
_sender.get_align() : "left");
|
||||||
|
|
||||||
|
if (align == "left" && this.leftDiv != null)
|
||||||
|
{
|
||||||
|
return this.leftDiv[0];
|
||||||
|
}
|
||||||
|
|
||||||
|
if (align == "right" && this.rightDiv != null)
|
||||||
|
{
|
||||||
|
return this.rightDiv[0];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Normally simply return the hbox-div
|
||||||
|
return super.getDOMNode(_sender);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Tables added to the root node need to be inline instead of blocks
|
||||||
|
*
|
||||||
|
* @param {et2_widget} child child-widget to add
|
||||||
|
*/
|
||||||
|
addChild(child) {
|
||||||
|
super.addChild(child);
|
||||||
|
if(child.instanceOf && child.instanceOf(et2_grid) || child._type == 'et2_grid')
|
||||||
|
{
|
||||||
|
jQuery(child.getDOMNode(child)).css("display", "inline-table");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
et2_register_widget(et2_hbox, ["hbox"]);
|
||||||
|
|
||||||
|
|
||||||
Loading…
Reference in New Issue
Block a user