mirror of
https://github.com/pandorafms/pandorafms.git
synced 2025-07-30 17:25:26 +02:00
Multiple erasure and displacement of elements in visual console - #624
This commit is contained in:
parent
ca45db3ba3
commit
ce35af3e61
@ -15,6 +15,7 @@ var creationItem = null;
|
|||||||
var is_opened_palette = false;
|
var is_opened_palette = false;
|
||||||
var idItem = 0;
|
var idItem = 0;
|
||||||
var selectedItem = null;
|
var selectedItem = null;
|
||||||
|
var selectedItems = null;
|
||||||
var lines = Array();
|
var lines = Array();
|
||||||
var user_lines = Array();
|
var user_lines = Array();
|
||||||
var toolbuttonActive = null;
|
var toolbuttonActive = null;
|
||||||
@ -1518,7 +1519,6 @@ function set_static_graph_status(idElement, image, status) {
|
|||||||
data: parameter,
|
data: parameter,
|
||||||
success: function (data) {
|
success: function (data) {
|
||||||
set_static_graph_status(idElement, image, data);
|
set_static_graph_status(idElement, image, data);
|
||||||
|
|
||||||
if($('#'+idElement+' table').css('float') == 'right' || $('#'+idElement+ ' table').css('float') == 'left'){
|
if($('#'+idElement+' table').css('float') == 'right' || $('#'+idElement+ ' table').css('float') == 'left'){
|
||||||
$('#'+idElement+ ' img').css('margin-top', parseInt($('#'+idElement).css('height'))/2 - parseInt($('#'+idElement+ ' img').css('height'))/2);
|
$('#'+idElement+ ' img').css('margin-top', parseInt($('#'+idElement).css('height'))/2 - parseInt($('#'+idElement+ ' img').css('height'))/2);
|
||||||
}
|
}
|
||||||
@ -1554,7 +1554,6 @@ function set_static_graph_status(idElement, image, status) {
|
|||||||
suffix = ".png";
|
suffix = ".png";
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
set_image("image", idElement, image + suffix);
|
set_image("image", idElement, image + suffix);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -2025,6 +2024,10 @@ function createItem(type, values, id_data) {
|
|||||||
if($('#preview > img')[0].naturalWidth > 150 || $('#preview > img')[0].naturalHeight > 150){
|
if($('#preview > img')[0].naturalWidth > 150 || $('#preview > img')[0].naturalHeight > 150){
|
||||||
$image.attr('width', '70')
|
$image.attr('width', '70')
|
||||||
.attr('height', '70');
|
.attr('height', '70');
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
$image.attr('width', $('#preview > img')[0].naturalWidth)
|
||||||
|
.attr('height', $('#preview > img')[0].naturalHeight);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
@ -2761,10 +2764,19 @@ function activeToolboxButton(id, active) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function click_delete_item_callback() {
|
function click_delete_item_callback() {
|
||||||
activeToolboxButton('edit_item', false);
|
if(selectedItems == null){
|
||||||
deleteDB(idItem);
|
activeToolboxButton('edit_item', false);
|
||||||
idItem = 0;
|
deleteDB(idItem);
|
||||||
selectedItem = null;
|
idItem = 0;
|
||||||
|
selectedItem = null;
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
idItem = 0;
|
||||||
|
selectedItem = null;
|
||||||
|
selectedItems.forEach( function(valor, indice, array) {
|
||||||
|
deleteDB(valor);
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -2783,6 +2795,7 @@ function eventsItems(drag) {
|
|||||||
//$(".item").resizable(); //Disable but run in ff and in the waste (aka micro$oft IE) show ungly borders
|
//$(".item").resizable(); //Disable but run in ff and in the waste (aka micro$oft IE) show ungly borders
|
||||||
|
|
||||||
$('.item').bind('click', function(event, ui) {
|
$('.item').bind('click', function(event, ui) {
|
||||||
|
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
if (!is_opened_palette) {
|
if (!is_opened_palette) {
|
||||||
var divParent = $(event.target);
|
var divParent = $(event.target);
|
||||||
@ -2891,6 +2904,62 @@ function eventsItems(drag) {
|
|||||||
enterprise_click_item_callback(divParent);
|
enterprise_click_item_callback(divParent);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
if(!event.ctrlKey){
|
||||||
|
firstItem = event.currentTarget.id;
|
||||||
|
selectedItems = null;
|
||||||
|
selectedItems = Array();
|
||||||
|
selectedItems.push(event.currentTarget.id);
|
||||||
|
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
|
||||||
|
selectedItem = null;
|
||||||
|
|
||||||
|
unselectAll();
|
||||||
|
|
||||||
|
if(selectedItems.indexOf(event.currentTarget.id) > -1){
|
||||||
|
|
||||||
|
$('#'+event.currentTarget.id).css('left', '+=1');
|
||||||
|
$('#'+event.currentTarget.id).css('top', '+=1');
|
||||||
|
$('#'+event.currentTarget.id).css('border', '');
|
||||||
|
$('#'+event.currentTarget.id).attr('withborder') == 'false';
|
||||||
|
|
||||||
|
|
||||||
|
selectedItems.splice(selectedItems.indexOf(event.currentTarget.id),1);
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
$('#'+event.currentTarget.id).css('left', '-=1');
|
||||||
|
$('#'+event.currentTarget.id).css('top', '-=1');
|
||||||
|
$('#'+event.currentTarget.id).css('border', '1px dotted rgb(0, 0, 255)');
|
||||||
|
$('#'+event.currentTarget.id).attr('withborder') == 'true';
|
||||||
|
|
||||||
|
|
||||||
|
selectedItems.push(event.currentTarget.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
selectedItems.forEach( function(valor, indice, array) {
|
||||||
|
if(selectedItems.indexOf(valor) > -1 && $('#'+valor).css('border') != '1px dotted rgb(0, 0, 255)'){
|
||||||
|
// $('#'+valor).css('left', '-=1');
|
||||||
|
// $('#'+valor).css('top', '-=1');
|
||||||
|
$('#'+valor).css('border', '1px dotted rgb(0, 0, 255)');
|
||||||
|
$('#'+valor).attr('withborder') == 'true';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#'+firstItem).css('left', '-=1');
|
||||||
|
$('#'+firstItem).css('top', '-=1');
|
||||||
|
|
||||||
|
firstItem = null;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
//Double click in the item
|
//Double click in the item
|
||||||
@ -2907,8 +2976,9 @@ function eventsItems(drag) {
|
|||||||
$(".item").draggable({containment: "#background", grid: drag});
|
$(".item").draggable({containment: "#background", grid: drag});
|
||||||
|
|
||||||
$('.item').bind('dragstart', function(event, ui) {
|
$('.item').bind('dragstart', function(event, ui) {
|
||||||
|
|
||||||
event.stopPropagation();
|
if(selectedItems == null || selectedItems.length < 2){
|
||||||
|
event.stopPropagation();
|
||||||
if (!is_opened_palette) {
|
if (!is_opened_palette) {
|
||||||
unselectAll();
|
unselectAll();
|
||||||
$(event.target).css('border', '1px blue dotted');
|
$(event.target).css('border', '1px blue dotted');
|
||||||
@ -2974,6 +3044,7 @@ function eventsItems(drag) {
|
|||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
idItem = $(event.target).attr('id');
|
idItem = $(event.target).attr('id');
|
||||||
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
activeToolboxButton('copy_item', true);
|
activeToolboxButton('copy_item', true);
|
||||||
@ -2981,10 +3052,17 @@ function eventsItems(drag) {
|
|||||||
activeToolboxButton('delete_item', true);
|
activeToolboxButton('delete_item', true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
console.log('Dragstart');
|
||||||
|
|
||||||
|
multiDragStart(event);
|
||||||
|
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('.item').bind('dragstop', function(event, ui) {
|
$('.item').bind('dragstop', function(event, ui) {
|
||||||
|
if(selectedItems == null || selectedItems.length < 2){
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
|
|
||||||
var values = {};
|
var values = {};
|
||||||
@ -2992,9 +3070,16 @@ function eventsItems(drag) {
|
|||||||
values['mov_top'] = ui.position.top;
|
values['mov_top'] = ui.position.top;
|
||||||
|
|
||||||
updateDB(selectedItem, idItem, values, 'dragstop');
|
updateDB(selectedItem, idItem, values, 'dragstop');
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
|
||||||
|
console.log('Dragstop');
|
||||||
|
multidragStop(event);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('.item').bind('drag', function(event, ui) {
|
$('.item').bind('drag', function(event, ui) {
|
||||||
|
if(selectedItems == null || selectedItems.length < 2){
|
||||||
if ($(event.target).hasClass('handler_start')) {
|
if ($(event.target).hasClass('handler_start')) {
|
||||||
selectedItem = 'handler_start';
|
selectedItem = 'handler_start';
|
||||||
}
|
}
|
||||||
@ -3075,6 +3160,11 @@ function eventsItems(drag) {
|
|||||||
draw_user_lines("", 0, 0, 0 , 0, 0, true);
|
draw_user_lines("", 0, 0, 0 , 0, 0, true);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
console.log('Drag');
|
||||||
|
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -3140,6 +3230,8 @@ function eventsBackground() {
|
|||||||
|
|
||||||
// Event click for background
|
// Event click for background
|
||||||
$("#background").click(function(event) {
|
$("#background").click(function(event) {
|
||||||
|
selectedItems = null;
|
||||||
|
selectedItems = Array();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
if (!is_opened_palette) {
|
if (!is_opened_palette) {
|
||||||
unselectAll();
|
unselectAll();
|
||||||
@ -3510,3 +3602,49 @@ function showGrid() {
|
|||||||
eventsItems();
|
eventsItems();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function multiDragStart(event){
|
||||||
|
multiDragMouse(event);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function multidragStop(event){
|
||||||
|
$('#background').off("mousemove");
|
||||||
|
values = [];
|
||||||
|
selectedItems.forEach( function(valor, indice, array) {
|
||||||
|
$('#'+valor).css('left','+=1');
|
||||||
|
$('#'+valor).css('top','+=1');
|
||||||
|
classItem = $('#'+valor).attr('class').replace(/item|ui-draggable|ui-draggable-dragging|-dragging/g, '').trim();
|
||||||
|
values['mov_left'] = parseInt($('#'+valor).css('left'));
|
||||||
|
values['mov_top'] = parseInt($('#'+valor).css('top'));
|
||||||
|
updateDB(classItem, valor, values,'dragstop');
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
function multiDragMouse(eventDrag){
|
||||||
|
var preX = [];
|
||||||
|
var preY = [];
|
||||||
|
|
||||||
|
selectedItems.forEach( function(valor, indice, array) {
|
||||||
|
preX[indice] = $('#'+valor).css('left');
|
||||||
|
preY[indice] = $('#'+valor).css('top');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#background').on('mousemove',function(event){
|
||||||
|
var moveDiffX = event.clientX - eventDrag.clientX;
|
||||||
|
var moveDiffY = event.clientY - eventDrag.clientY;
|
||||||
|
selectedItems.forEach( function(valor, indice, array) {
|
||||||
|
if(!(parseInt($('#'+valor).css('left')) < 0 && parseInt(moveDiffX)+parseInt(preX[indice]) < 0) &&
|
||||||
|
!(parseInt($('#'+valor).css('left')) + parseInt($('#'+valor).css('width')) > parseInt($('#background').css('width')) && parseInt(moveDiffX+preX[indice]) > 0)){
|
||||||
|
$('#'+valor).css('left',parseInt(moveDiffX)+parseInt(preX[indice])+'px');
|
||||||
|
}
|
||||||
|
if(!(parseInt($('#'+valor).css('top')) < 0 && parseInt(moveDiffY)+parseInt(preY[indice]) < 0) &&
|
||||||
|
!(parseInt($('#'+valor).css('top')) + parseInt($('#'+valor).css('height')) > parseInt($('#background').css('height')) && parseInt(moveDiffY+preY[indice]) > 0)){
|
||||||
|
$('#'+valor).css('top',parseInt(moveDiffY)+parseInt(preY[indice])+'px');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user