var laydown = {
  diagram: {
    dataFile: null
  }
}

var graph = new joint.dia.Graph;

var paper = new joint.dia.Paper({
    el: document.getElementById('myholder'),
    model: graph,
    width: 600,
    height: 100,
    gridSize: 1
});

var rect = new joint.shapes.standard.Rectangle();
var rect2 = rect.clone();
var link = new joint.shapes.standard.Link();

drawDiagram = function() {
	rect.position(100, 30);
	rect.resize(100, 40);
	rect.attr({
	    body: {
		fill: 'blue'
	    },
	    label: {
		text: 'Hello',
		fill: 'white'
	    }
	});
	rect.addTo(graph);


	rect2.translate(300, 0);
	rect2.attr('label/text', 'World!');
	rect2.addTo(graph);


	link.source(rect);
	link.target(rect2);
	link.addTo(graph);
}



Shiny.addCustomMessageHandler("render-pivot",
  function(message) {
    laydown.diagram.dataFile = message.laydown + ".json";
    drawDiagram();
  }
);


$(document).on('shiny:inputchanged', function(event){
   //TO BE INTEGRATED
});