function createPaletteEntry(title, metadata) {
return shapesFactory.createNode({
'renderService': renderService,
'paper': palette,
'metadata': metadata
});
}
function handleDrag(event) {
// TODO offsetX/Y not on firefox
//$log.debug("tracking move: x="+event.pageX+",y="+event.pageY);
if (clickedElement && clickedElement.attr('metadata')) {
if (!viewBeingDragged) {
var dataOfClickedElement = clickedElement.attr('metadata');
// custom div if not already built.
$('<div>', {
id: 'palette-floater'
}).appendTo($('body'));
var floatergraph = new joint.dia.Graph();
floatergraph.attributes.type = joint.shapes.flo.FEEDBACK_TYPE;
var floaterpaper = new joint.dia.Paper({
el: $('#palette-floater'),
gridSize:10,
model: floatergraph,
height: 400,
width: 200,
validateMagnet: function() {
return false;
},
validateConnection: function() {
return false;
}
});
// TODO float thing needs to be bigger otherwise icon label is missing
// Initiative drag and drop - create draggable element
var floaternode = shapesFactory.createNode({
'renderService': renderService,
'paper': floaterpaper,
'graph': floatergraph,
'metadata': dataOfClickedElement
});
var box = floaterpaper.findViewByModel(floaternode).getBBox();
var size = floaternode.get('size');
// Account for node real size including ports
floaternode.translate(box.width - size.width, box.height - size.height);
viewBeingDragged = floaterpaper.findViewByModel(floaternode);
$('#palette-floater').offset({left:event.pageX+5,top:event.pageY+5});
// trigger('dragStarted',{'dragged':viewBeingDragged,'x':x,'y':y});
} else {
$('#palette-floater').offset({left:event.pageX+5,top:event.pageY+5});
trigger('drag',{'dragged':viewBeingDragged,'evt':event});
}
}
}