mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-11-26 18:03:39 +01:00
First test with egwActionObjectInterface for a listbox-like representation of egwActionObjects (test_action.html), fixed bugs in egw_action.js which occured during testing.
This commit is contained in:
parent
53a041c488
commit
49770971ce
@ -605,7 +605,7 @@ egwActionObject.prototype.getFocusedObject = function()
|
|||||||
//Search for the focused object in the children
|
//Search for the focused object in the children
|
||||||
for (var i = 0; i < this.children.length; i++)
|
for (var i = 0; i < this.children.length; i++)
|
||||||
{
|
{
|
||||||
var obj = this.children[i].getFocused()
|
var obj = this.children[i].getFocusedObject()
|
||||||
if (obj)
|
if (obj)
|
||||||
{
|
{
|
||||||
return obj;
|
return obj;
|
||||||
@ -632,16 +632,18 @@ egwActionObject.prototype.getFocusedObject = function()
|
|||||||
*/
|
*/
|
||||||
egwActionObject.prototype._ifaceCallback = function(_newState, _shiftState)
|
egwActionObject.prototype._ifaceCallback = function(_newState, _shiftState)
|
||||||
{
|
{
|
||||||
|
if (typeof _shiftState == "undefined")
|
||||||
|
_shiftState = EGW_AO_SHIFT_STATE_NONE;
|
||||||
// Remove the focus from all children on the same level
|
// Remove the focus from all children on the same level
|
||||||
if (this.parent)
|
if (this.parent)
|
||||||
{
|
{
|
||||||
var selected = egwBitIsSet(_newState, EGW_AO_STATE_SELECTED);
|
var selected = egwBitIsSet(_newState, EGW_AO_STATE_SELECTED);
|
||||||
|
var objs = [];
|
||||||
|
|
||||||
if (selected)
|
if (selected)
|
||||||
{
|
{
|
||||||
// Search the index of this object
|
// Search the index of this object
|
||||||
var id = this.parent.children.indexOf(this);
|
var id = this.parent.children.indexOf(this);
|
||||||
var objs = [];
|
|
||||||
|
|
||||||
// Deselect all other objects inside this container, if the "MULTI" shift-
|
// Deselect all other objects inside this container, if the "MULTI" shift-
|
||||||
// state is not set
|
// state is not set
|
||||||
@ -671,13 +673,13 @@ egwActionObject.prototype._ifaceCallback = function(_newState, _shiftState)
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// If the focused element didn't belong to this container, or the "list"
|
// If the focused element didn't belong to this container, or the "list"
|
||||||
// shift-state isn't active, set the focus to this element.
|
// shift-state isn't active, set the focus to this element.
|
||||||
if (objs.length == 0 || !egwBitIsSet(_shiftState, EGW_AO_SHIFT_STATE_BLOCK))
|
if (objs.length == 0 || !egwBitIsSet(_shiftState, EGW_AO_SHIFT_STATE_BLOCK))
|
||||||
{
|
{
|
||||||
this.setFocused(true);
|
this.setFocused(true);
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -712,7 +714,7 @@ egwActionObject.prototype.getState = function()
|
|||||||
* be de-focused.
|
* be de-focused.
|
||||||
*
|
*
|
||||||
* @param boolean _focused - whether to remove or set the focus. Defaults to true
|
* @param boolean _focused - whether to remove or set the focus. Defaults to true
|
||||||
* @param boolean _recPrev is internally used to prevent infinit recursion. Do not touch.
|
* @param object _recPrev is internally used to prevent infinit recursion. Do not touch.
|
||||||
*/
|
*/
|
||||||
egwActionObject.prototype.setFocused = function(_focused, _recPrev)
|
egwActionObject.prototype.setFocused = function(_focused, _recPrev)
|
||||||
{
|
{
|
||||||
@ -731,10 +733,10 @@ egwActionObject.prototype.setFocused = function(_focused, _recPrev)
|
|||||||
//Reset the focus of the formerly focused element
|
//Reset the focus of the formerly focused element
|
||||||
if (!_recPrev)
|
if (!_recPrev)
|
||||||
{
|
{
|
||||||
var focused = this.getRootObject.getFocusedObject();
|
var focused = this.getRootObject().getFocusedObject();
|
||||||
if (focused)
|
if (focused)
|
||||||
{
|
{
|
||||||
focused.setFocused(false, true);
|
focused.setFocused(false, this);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -743,7 +745,10 @@ egwActionObject.prototype.setFocused = function(_focused, _recPrev)
|
|||||||
//If the object is not focused, reset the focus state of all children
|
//If the object is not focused, reset the focus state of all children
|
||||||
for (var i = 0; i < this.children.length; i++)
|
for (var i = 0; i < this.children.length; i++)
|
||||||
{
|
{
|
||||||
this.children[i].setFocused(false, true);
|
// if (this.children[i] != _recPrev)
|
||||||
|
// {
|
||||||
|
this.children[i].setFocused(false, _recPrev);
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
@ -751,7 +756,7 @@ egwActionObject.prototype.setFocused = function(_focused, _recPrev)
|
|||||||
//Otherwise set the focused state of the parent to true
|
//Otherwise set the focused state of the parent to true
|
||||||
if (this.parent)
|
if (this.parent)
|
||||||
{
|
{
|
||||||
this.parent.setFocused(true, true);
|
this.parent.setFocused(true, _recPrev);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -933,20 +938,17 @@ egwActionObjectInterface.prototype.setStateChangeCallback = function(_callback,
|
|||||||
* the object and call the stateChangeCallback (if it has been set)
|
* the object and call the stateChangeCallback (if it has been set)
|
||||||
*
|
*
|
||||||
* @param boolean _selected Whether the object is selected or not.
|
* @param boolean _selected Whether the object is selected or not.
|
||||||
|
* @param int _shiftState special keys which change how the state change will
|
||||||
|
* be treated.
|
||||||
*/
|
*/
|
||||||
egwActionObjectInterface.prototype._selectChange = function(_selected)
|
egwActionObjectInterface.prototype._selectChange = function(_selected, _shiftState)
|
||||||
{
|
{
|
||||||
// Check whether the selected bit has actually changed - the callback may
|
//Set the EGW_AO_STATE_SELECTED bit accordingly and call the callback
|
||||||
// perform expensive operations, and we don't want those to happen without
|
this._state = egwSetBit(this._state, EGW_AO_STATE_SELECTED, _selected);
|
||||||
// a reason.
|
if (this.stateChangeCallback)
|
||||||
if (egwBitIsSet(this._state, EGW_AO_STATE_SELECTED) != _selected)
|
|
||||||
{
|
{
|
||||||
//Set the EGW_AO_STATE_SELECTED bit accordingly and call the callback
|
this.stateChangeCallback.call(this.stateChangeContext,
|
||||||
this._state = egwBitSet(this._state, EGW_AO_STATE_SELECTED, _selected);
|
this._state, _shiftState);
|
||||||
if (this.stateChangeCallback)
|
|
||||||
{
|
|
||||||
this.stateChangeCallback.call(this.stateChangeContext, this._state);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -996,7 +998,7 @@ egwActionObjectInterface.prototype.getState = function()
|
|||||||
*/
|
*/
|
||||||
function egwActionObjectManager(_id, _manager)
|
function egwActionObjectManager(_id, _manager)
|
||||||
{
|
{
|
||||||
return new egwActionObject(_id, null, _manager,
|
return new egwActionObject(_id, null, new egwActionObjectInterface(),
|
||||||
new egwActionObjectInterface(), EGW_AO_FLAG_IS_CONTAINER);
|
_manager, EGW_AO_FLAG_IS_CONTAINER);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -30,8 +30,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.listbox .focused {
|
.listbox .focused {
|
||||||
border: 1px dashed white;
|
border: 1px dashed black;
|
||||||
padding: 1px;
|
padding: 2px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
@ -40,31 +40,84 @@
|
|||||||
<tr id="le1">
|
<tr id="le1">
|
||||||
<td><img src="imgs/page.png"/></td>
|
<td><img src="imgs/page.png"/></td>
|
||||||
<td style="width: 200px">File 1</td>
|
<td style="width: 200px">File 1</td>
|
||||||
<td><input id="le1_chk" type="checkbox"></td>
|
<td><input type="checkbox"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="le2">
|
<tr id="le2">
|
||||||
<td><img src="imgs/page.png"/></td>
|
<td><img src="imgs/page.png"/></td>
|
||||||
<td style="width: 200px">File 2</td>
|
<td style="width: 200px">File 2</td>
|
||||||
<td><input id="le2_chk" type="checkbox"></td>
|
<td><input type="checkbox"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="le3">
|
<tr id="le3">
|
||||||
<td><img src="imgs/page.png"/></td>
|
<td><img src="imgs/page.png"/></td>
|
||||||
<td style="width: 200px">File 3</td>
|
<td style="width: 200px">File 3</td>
|
||||||
<td><input id="le3_chk" type="checkbox"></td>
|
<td><input type="checkbox"></td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<script>
|
<script>
|
||||||
var actionManager = null;
|
var actionManager = null;
|
||||||
|
var objectManager = null;
|
||||||
|
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
init();
|
init();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// An action object interface for the listbox - "inherits" from
|
||||||
|
// egwActionObjectInterface
|
||||||
|
function listboxItemAOI(_node)
|
||||||
|
{
|
||||||
|
var aoi = new egwActionObjectInterface();
|
||||||
|
|
||||||
|
aoi.node = _node;
|
||||||
|
aoi.checkBox = ($(":checkbox", aoi.node))[0];
|
||||||
|
|
||||||
|
aoi.doGetDOMNode = function() {
|
||||||
|
return self.node;
|
||||||
|
}
|
||||||
|
|
||||||
|
aoi.doSetState = function(_state, _outerCall, _shiftState) {
|
||||||
|
var selected = egwBitIsSet(_state, EGW_AO_STATE_SELECTED);
|
||||||
|
this.checkBox.checked = selected;
|
||||||
|
$(this.node).toggleClass('focused',
|
||||||
|
egwBitIsSet(_state, EGW_AO_STATE_FOCUSED));
|
||||||
|
$(this.node).toggleClass('selected',
|
||||||
|
selected);
|
||||||
|
if (! _outerCall)
|
||||||
|
{
|
||||||
|
this._selectChange(egwBitIsSet(_state,
|
||||||
|
EGW_AO_STATE_SELECTED), _shiftState);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Now append some action code to the node
|
||||||
|
$(_node).click(function(e) {
|
||||||
|
if (e.target != aoi.checkBox)
|
||||||
|
{
|
||||||
|
// "Normal" Listbox behaviour
|
||||||
|
// aoi.doSetState(egwSetBit(aoi.getState(), EGW_AO_STATE_SELECTED,
|
||||||
|
// true), false, EGW_AO_SHIFT_STATE_NONE);
|
||||||
|
|
||||||
|
// "PHPMyAdmin" Listbox behaviour
|
||||||
|
var selected = egwBitIsSet(aoi.getState(), EGW_AO_STATE_SELECTED);
|
||||||
|
aoi.doSetState(egwSetBit(aoi.getState(), EGW_AO_STATE_SELECTED,
|
||||||
|
!selected), false, EGW_AO_SHIFT_STATE_MULTI);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$(aoi.checkBox).change(function() {
|
||||||
|
aoi.doSetState(egwSetBit(aoi.getState(), EGW_AO_STATE_SELECTED,
|
||||||
|
this.checked), false, EGW_AO_SHIFT_STATE_MULTI);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
return aoi;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
function init()
|
function init()
|
||||||
{
|
{
|
||||||
//Initialize the action manager and add some actions to it
|
//Initialize the action manager and add some actions to it
|
||||||
actionManager = new egwActionManager();
|
actionManager = new egwActionManager();
|
||||||
|
objectManager = new egwActionObjectManager("", actionManager);
|
||||||
|
|
||||||
actionManager.updateActions(
|
actionManager.updateActions(
|
||||||
[
|
[
|
||||||
@ -83,8 +136,7 @@
|
|||||||
);
|
);
|
||||||
|
|
||||||
$('#lb1 tr').each(function(index, elem) {
|
$('#lb1 tr').each(function(index, elem) {
|
||||||
// Create an action object and attach it to an interface
|
objectManager.addObject(elem.id, new listboxItemAOI(elem));
|
||||||
console.log(index, elem);
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
Reference in New Issue
Block a user