<script src="componentes/talento-humano/recursos/js/go.js"></script>
<div id="myDiagramDiv" style="border: solid 1px black; height: 580px"></div>
<script type="text/javascript" >
var JsonNodo = { 
    "class": "go.TreeModel", 
    "nodeDataArray": [
{% for Colaborador in Colaboradores %}
{% if Colaborador.colaboradorJEFEINMEDIATO %}
{
    "key":{{Colaborador.colaboradorID}}, 
    "parent":{{Colaborador.colaboradorJEFEINMEDIATO}},
    "usuario": {% if Colaborador.usuarioID %}{{Colaborador.usuarioID}}{% else %}0{% endif %},
    "login": "{% if Colaborador.usuarioID %}{{Colaborador.usuarioNOMBRE}}{% endif %}",
    "cedula":"{{Colaborador.personaIDENTIFICACION}}", 
    "responsable":"{{Colaborador.personaNOMBRES|striptags}} {{Colaborador.personaAPELLIDOS|raw|nl2br}}", 
    "cargo":"{{Colaborador.cargoTITULO}}", 
    "foto": "{{Colaborador.colaboradorFOTO}}"
    
},
{% endif %}
{% endfor %}
     ]
};


var levelColors = ["#3333ff", "#927fff", "#7c66ff", "#664cff", "#5133ff", "#3b19ff", "#2100e5", "#2500ff"];
function textStyle() {
  return { font: "9pt  Segoe UI,sans-serif", stroke: "white" };
}
function fotoColaborador(foto) {
    if( foto)
        return foto
    return 'archivo/colaboradores/fotos/sin-foto.png';
}
function dobleClicNodo(e, obj) {
    if( obj.part.data.usuario === 0){
        alertaInformacion( "Este colaborador no tiene un usuario asignado." );
    }else{
        cargarVista(
            'usuarios', 'UsuariosColaborador', 'mostrarFormularioEditar',
            'UsuariosColaboradorID=' + obj.part.data.key
        );
    }
}

// this is used to determine feedback during drags
function sePuedenAsociarNodos(node1, node2) {
  if (!(node1 instanceof go.Node)) return false;  // must be a Node
  if (node1 === node2) return false;  // cannot work for yourself
  if (node2.isInTreeOf(node1)) return false;  // cannot work for someone who works for you
  return true;
}
function pasarArrastrandoNodoEncimaOtroNodo(e, node, prev) {
    var diagram = node.diagram;
    var selnode = diagram.selection.first();
        var shape = node.findObject("SHAPE");
    if (sePuedenAsociarNodos(selnode, node)) {
        if (shape) {
            shape._prevFill = shape.fill;  // remember the original brush
            shape.fill = "green";
        }
    }else{
        if (shape) {
            shape._prevFill = shape.fill;  // remember the original brush
            shape.fill = "red";
        }
    }
}
function salirArrastrandoNodoEncimaOtroNodo(e, node, next) {
    var shape = node.findObject("SHAPE");
    if (shape && shape._prevFill) {
      shape.fill = shape._prevFill;  // restore the original brush
    }
}

function soltarNodoEncimaOtroNodo(e, node) {
    var diagram = node.diagram;
    var selnode = diagram.selection.first();  // assume just one Node in selection
    var idJefe = node.part.data.key;
    var idColaborador = selnode.part.data.key;
    var nombreJefe = node.part.data.responsable;
    var nombreColaborador = selnode.part.data.responsable;
    var cargoJefe = node.part.data.cargo;
    var cargoColaborador = selnode.part.data.cargo;
    if (sePuedenAsociarNodos(selnode, node)) {
        var link = selnode.findTreeParentLink();
        if (link !== null) {  // reconnect any existing link
            confirmacionOperacion("Vinculación de Nuevo Jefe Inmediato","¿Segur@ que desea asociar a "+nombreJefe+" ("+cargoJefe+") como JEFE INMEDIATO de " +nombreColaborador+ " ("+cargoColaborador+") ?", function(){
                
                ejecutarOperacion( 
                    "talento-humano", "colaboradores", "cambiarJefeInmediato", 
                    "colaboradorID="+idColaborador+"&jefeInmediatoID="+idJefe,
                    function(){
                        link.fromNode = node;
                    }
                );
                
            });
        } else {
            
            confirmacionOperacion("Vinculación de Nuevo Jefe Inmediato","¿Segur@ que desea asociar a "+nombreJefe+" ("+cargoJefe+") como JEFE INMEDIATO de " +nombreColaborador+ " ("+cargoColaborador+") ?", function(){
                
                ejecutarOperacion( 
                    "talento-humano", "colaboradores", "cambiarJefeInmediato", 
                    "colaboradorID="+idColaborador+"&jefeInmediatoID="+idJefe,
                    function(){
                        diagram.toolManager.linkingTool.insertLink(node, node.port, selnode, selnode.port);
                    }
                );
                
            });
            
            
        }
    }
}


function init() {
    
var $ = go.GraphObject.make;
myDiagram =
  $(go.Diagram, "myDiagramDiv", {
        initialContentAlignment: go.Spot.Center,
        //initialAutoScale:  go.Diagram.UniformToFill,
        allowZoom: true,
        maxSelectionCount: 1, // users can select only one part at a time
        validCycle: go.Diagram.CycleDestinationTree, // make sure users can only create trees
        layout: $(go.TreeLayout, {
                treeStyle: go.TreeLayout.StyleLastParents,
                arrangement: go.TreeLayout.ArrangementHorizontal,
                // properties for most of the tree:
                angle: 90,
                layerSpacing: 78,
                // properties for the "last parents":
                alternateAngle: 90,
                alternateLayerSpacing: 78,
                alternateAlignment: go.TreeLayout.AlignmentBus,
                alternateNodeSpacing: 78
            }
        ),
    });
myDiagram.layout.commitNodes = function() {
  go.TreeLayout.prototype.commitNodes.call(myDiagram.layout);  
  myDiagram.layout.network.vertexes.each(function(v) {
    if (v.node) {
      var level = v.level % (levelColors.length);
      var color = levelColors[level];
      var shape = v.node.findObject("SHAPE");
      if (shape) shape.fill = $(go.Brush, "Linear", { 0: color, 1: go.Brush.lightenBy(color, 0.05), start: go.Spot.Left, end: go.Spot.Right });
    }
  });
};

myDiagram.nodeTemplate =
 $(go.Node, "Auto",
    {  doubleClick: dobleClicNodo },
     // define the node's outer shape
     $(go.Shape, "Rectangle", {
         name: "SHAPE",
         fill: "white",
         stroke: null,
         cursor: "pointer"
     }),
     $(go.Panel, "Vertical",
         $(go.Picture, {
                 name: "Picture",
                 desiredSize: new go.Size(128, 128),
                 margin: new go.Margin(3, 3, 3, 3),
                 background: "white",
                //  border: new go.Border(1, 1, 1, 1),
             },
             new go.Binding("source", "foto", fotoColaborador)
        ),
         $(go.Panel, "Table", {
                 maxSize: new go.Size(170, 999),
                 margin: new go.Margin(6, 10, 0, 3),
                 defaultAlignment: go.Spot.Center
             },
             $(go.RowColumnDefinition, {
                 column: 1,
                 width: 4
             }),
             $(go.TextBlock, textStyle(), 
                {
                     row: 0,
                     column: 0,
                     font: "9pt Segoe UI,sans-serif",
                     minSize: new go.Size(10, 16)
                 },
                 new go.Binding("text", "cargo").makeTwoWay()
            ),
            $(go.TextBlock, textStyle(), 
                {
                     row: 1,
                     column: 0,
                     font: "11pt Segoe UI,sans-serif",
                     minSize: new go.Size(10, 14),
                     margin: new go.Margin(0, 0, 0, 3)
                },
                new go.Binding("text", "responsable").makeTwoWay()
            ),
            $(go.TextBlock, textStyle(),
                {
                     row: 2,
                     column: 0,
                     font: "italic 9pt sans-serif",
                     minSize: new go.Size(10, 14)
                },
                new go.Binding("text", "login").makeTwoWay()
            ),
            $(go.TextBlock, textStyle(), 
                {
                     row: 3,
                     column: 0,
                     font: "italic 9pt sans-serif",
                     minSize: new go.Size(10, 14)
                },
                new go.Binding("text", "cedula").makeTwoWay()
            )
         ) // end Table Panel
     ), // end Horizontal Panel
     {  doubleClick: dobleClicNodo },
     {  mouseDragEnter: pasarArrastrandoNodoEncimaOtroNodo},
     {  mouseDragLeave: salirArrastrandoNodoEncimaOtroNodo},
     {  mouseDrop: soltarNodoEncimaOtroNodo},
     
 ); // end Node




myDiagram.linkTemplate =
  $(go.Link, go.Link.Orthogonal,
    { corner: 5, relinkableFrom: true, relinkableTo: true },
    $(go.Shape, { strokeWidth: 4, stroke: "#00a4a4" }));  // the link shape

// read in the JSON-format data from the "mySavedModel" element
myDiagram.model = go.Model.fromJson(JsonNodo);
}
init();
</script>