item deletion improvements

This commit is contained in:
Daniel Maya 2019-07-30 11:20:03 +02:00
parent b203e62938
commit 8845fc9330
5 changed files with 145 additions and 81 deletions

View File

@ -375,57 +375,6 @@ function createVisualConsole(
.init();
});
// VC Item remove.
visualConsole.onItemRemove(function(e) {
var id = e.item.props.id;
var data = {
type: e.item.props.type
};
var taskId = "visual-console-item-update-" + id;
// Persist the new position.
asyncTaskManager
.add(taskId, function(done) {
var abortable = removeVisualConsoleItem(
baseUrl,
visualConsole.props.id,
id,
data,
function(error, data) {
if (error || !data) {
console.log(
"[ERROR]",
"[VISUAL-CONSOLE-CLIENT]",
"[API]",
error ? error.message : "Invalid response"
);
// Add the item to the list.
visualConsole.elementsById[e.item.props.id] = e.item;
visualConsole.elementIds.push(e.item.props.id);
// Item event handlers.
e.item.onClick(visualConsole.handleElementClick);
e.item.onDblClick(visualConsole.handleElementDblClick);
e.item.onMoved(visualConsole.handleElementMovement);
e.item.onResized(visualConsole.handleElementResizement);
e.item.onRemove(visualConsole.handleElementRemove);
// Add the item to the DOM.
visualConsole.containerRef.append(e.item.elementRef);
}
done();
}
);
return {
cancel: function() {
abortable.abort();
}
};
})
.init();
});
if (updateInterval != null && updateInterval > 0) {
// Start an interval to update the Visual Console.
updateVisualConsole(props.id, updateInterval, updateInterval);
@ -448,6 +397,48 @@ function createVisualConsole(
asyncTaskManager.cancel("visual-console");
asyncTaskManager.cancel("visual-console-start");
}
},
deleteItem: function(item) {
var aux = item;
var id = item.props.id;
item.remove();
var taskId = "visual-console-item-update-" + id;
// Persist the new position.
asyncTaskManager
.add(taskId, function(done) {
var abortable = removeVisualConsoleItem(
baseUrl,
visualConsole.props.id,
id,
function(error, data) {
if (error || !data) {
console.log(
"[ERROR]",
"[VISUAL-CONSOLE-CLIENT]",
"[API]",
error ? error.message : "Invalid response"
);
// Add the item to the list.
var itemRetrieved = aux.props;
itemRetrieved["receivedAt"] = new Date();
visualConsole.addElement(itemRetrieved);
}
done();
}
);
return {
cancel: function() {
abortable.abort();
}
};
})
.init();
}
};
}
@ -697,7 +688,7 @@ function getVisualConsoleItem(baseUrl, vcId, vcItemId, callback) {
* @return {Object} Cancellable. Object which include and .abort([statusText]) function.
*/
// eslint-disable-next-line no-unused-vars
function removeVisualConsoleItem(baseUrl, vcId, vcItemId, data, callback) {
function removeVisualConsoleItem(baseUrl, vcId, vcItemId, callback) {
// var apiPath = baseUrl + "/include/rest-api";
var apiPath = baseUrl + "/ajax.php";
var jqXHR = null;
@ -742,8 +733,7 @@ function removeVisualConsoleItem(baseUrl, vcId, vcItemId, data, callback) {
page: "include/rest-api/index",
removeVisualConsoleItem: 1,
visualConsoleId: vcId,
visualConsoleItemId: vcItemId,
data: data
visualConsoleItemId: vcItemId
},
"json"
)

View File

@ -121,9 +121,24 @@ if ($getVisualConsole === true) {
return;
}
$itemData = $item->toArray();
$itemAclGroupId = $itemData['aclGroupId'];
$aclWrite = check_acl($config['id_user'], $itemAclGroupId, 'VW');
$aclManage = check_acl($config['id_user'], $itemAclGroupId, 'VM');
// ACL.
if (!$aclWrite && !$aclManage) {
db_pandora_audit(
'ACL Violation',
'Trying to delete visual console item without group access'
);
http_response_code(403);
return;
}
$data = get_parameter('data');
$class = VisualConsole::getItemClass((int) $data['type']);
$result = $class::delete($itemId);
$result = $item::delete($itemId);
echo $result;
return;
}

View File

@ -167,7 +167,7 @@ if ($pure === false) {
echo '<div id ="edit-controls" class="visual-console-edit-controls" style="visibility:hidden">';
html_print_button(
'delete_item',
'button_toolbox2',
'button_delete',
true,
'',
'class="sub visual_editor_button_toolbox delete_item delete_min"',
@ -176,9 +176,9 @@ if ($pure === false) {
);
html_print_button(
'copy_item',
'button_toolbox2',
'button_copy',
true,
"click_button_toolbox('copy_item');",
'',
'class="sub visual_editor_button_toolbox copy_item delete_min"',
false,
true
@ -386,12 +386,26 @@ $visualConsoleItems = VisualConsole::getItemsFromDB(
}
});
$(".visual-console-item, .is-editing").bind("click", function(event) {
var prueba = event.currentTarget;
console.log(prueba);
visualConsoleManager.visualConsole.onItemSelectionChanged(function (e) {
if (e.selected === true) {
$('#button-button_delete').prop('disabled', false);
$('#button-button_copy').prop('disabled', false);
} else {
$('#button-button_delete').prop('disabled', true);
$('#button-button_copy').prop('disabled', true);
}
});
$('#button-button_toolbox2').click(function (event){
visualConsoleManager.visualConsole.deleteItem();
$('#button-button_delete').click(function (event){
// visualConsoleManager.visualConsole.deleteItem();
visualConsoleManager.visualConsole.elements.forEach(item => {
if (item.meta.isSelected === true) {
visualConsoleManager.deleteItem(item);
}
});
});
$('#button-button_copy').click(function (event){
});
</script>

View File

@ -84,6 +84,10 @@ export interface ItemResizedEvent {
newSize: Size;
}
export interface ItemSelectionChangedEvent {
selected: boolean;
}
// TODO: Document
class LinkInputGroup extends InputGroup<Partial<ItemProps>> {
protected createContent(): HTMLElement | HTMLElement[] {
@ -307,6 +311,10 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
private readonly resizedEventManager = new TypedEvent<ItemResizedEvent>();
// Event manager for remove events.
private readonly removeEventManager = new TypedEvent<ItemRemoveEvent>();
// Event manager for selection change events.
private readonly selectionChangedEventManager = new TypedEvent<
ItemSelectionChangedEvent
>();
// List of references to clean the event listeners.
private readonly disposables: Disposable[] = [];
@ -730,6 +738,15 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
...newMetadata
};
if (
typeof newMetadata.isSelected !== "undefined" &&
prevMetadata.isSelected !== newMetadata.isSelected
) {
this.selectionChangedEventManager.emit({
selected: newMetadata.isSelected
});
}
// From this point, things which rely on this.props can access to the changes.
// Check if we should re-render.
@ -1094,6 +1111,24 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
return disposable;
}
/**
* To add an event handler to item selection.
* @param listener Function which is going to be executed when a item is removed.
*/
public onSeletionChanged(
listener: Listener<ItemSelectionChangedEvent>
): Disposable {
/*
* The '.on' function returns a function which will clean the event
* listener when executed. We store all the 'dispose' functions to
* call them when the item should be cleared.
*/
const disposable = this.selectionChangedEventManager.on(listener);
this.disposables.push(disposable);
return disposable;
}
// TODO: Document
public getFormContainer(): FormContainer {
return new FormContainer(

View File

@ -12,7 +12,8 @@ import Item, {
ItemClickEvent,
ItemRemoveEvent,
ItemMovedEvent,
ItemResizedEvent
ItemResizedEvent,
ItemSelectionChangedEvent
} from "./Item";
import StaticGraph, { staticGraphPropsDecoder } from "./items/StaticGraph";
import Icon, { iconPropsDecoder } from "./items/Icon";
@ -211,7 +212,9 @@ export default class VisualConsole {
// Event manager for resize events.
private readonly resizedEventManager = new TypedEvent<ItemResizedEvent>();
// Event manager for remove events.
private readonly removeEventManager = new TypedEvent<ItemRemoveEvent>();
private readonly selectionChangedEventManager = new TypedEvent<
ItemSelectionChangedEvent
>();
// List of references to clean the event listeners.
private readonly disposables: Disposable[] = [];
@ -280,7 +283,21 @@ export default class VisualConsole {
this.elementIds = this.elementIds.filter(id => id !== e.item.props.id);
delete this.elementsById[e.item.props.id];
this.clearRelations(e.item.props.id);
this.removeEventManager.emit(e);
};
/**
* React to element selection change
* @param e Event object.
*/
private handleElementSelectionChanged: (
e: ItemSelectionChangedEvent
) => void = e => {
if (this.elements.filter(item => item.meta.isSelected == true).length > 0) {
e.selected = true;
} else {
e.selected = false;
}
this.selectionChangedEventManager.emit(e);
};
// TODO: Document
@ -352,6 +369,8 @@ export default class VisualConsole {
itemInstance.onMoved(context.handleElementMovement);
itemInstance.onResized(context.handleElementResizement);
itemInstance.onRemove(context.handleElementRemove);
itemInstance.onSeletionChanged(context.handleElementSelectionChanged);
// Add the item to the DOM.
context.containerRef.append(itemInstance.elementRef);
} catch (error) {
@ -763,16 +782,18 @@ export default class VisualConsole {
}
/**
* Add an event handler to the resizement of the visual console elements.
* Add an event handler to the elements selection change of the visual console .
* @param listener Function which is going to be executed when a linked console is moved.
*/
public onItemRemove(listener: Listener<ItemRemoveEvent>): Disposable {
public onItemSelectionChanged(
listener: Listener<ItemSelectionChangedEvent>
): Disposable {
/*
* The '.on' function returns a function which will clean the event
* listener when executed. We store all the 'dispose' functions to
* call them when the item should be cleared.
*/
const disposable = this.removeEventManager.on(listener);
const disposable = this.selectionChangedEventManager.on(listener);
this.disposables.push(disposable);
return disposable;
@ -798,17 +819,6 @@ export default class VisualConsole {
this.containerRef.classList.remove("is-editing");
}
/**
* delete item.
*/
public deleteItem(): void {
this.elements.forEach(item => {
if (item.meta.isSelected === true) {
item.remove();
}
});
}
/**
* Select an item.
* @param itemId Item Id.