draggableCalculatableChairs.js

Qualtrics.SurveyEngine.addOnReady(function() {

  //variables
  var draggableClassName = ".chair"; // the class name of elements that should be draggable
  var edField = "distance"; // this will be the name of the Embedded Data field with the distance. 

	jQuery( function() {
		jQuery( draggableClassName ).draggable({
			stop: function() {
				var distance = getDistanceBetweenElements(document.getElementById("Chair1"),
                                              document.getElementById("Chair2"));
				Qualtrics.SurveyEngine.setEmbeddedData(edField, distance);
			}
		});
	});
	
	var getPositionAtCenter = function (element) {
        var data = element.getBoundingClientRect();
        return {
            x: data.left + data.width / 2,
            y: data.top + data.height / 2
        };
    };

    var getDistanceBetweenElements = function(a, b) {
        var aPosition = getPositionAtCenter(a);
        var bPosition = getPositionAtCenter(b);

        return Math.sqrt(
            Math.pow(aPosition.x - bPosition.x, 2) + 
            Math.pow(aPosition.y - bPosition.y, 2) 
        );
    };

});