<commit_before>var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
                            window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame;


function Lightbox(Content) {
 	var that = this;
 	this.animationId;
 	this.currentEvent;
 	this.startEvent;


 	this.container = d3.select('body')
						.append('div')
						.attr('class', 'lightbox');

	this.container.append('div')
		.attr('class', 'lightboxHeader')
		.on('mousedown', function () {
			d3.event.preventDefault();		
			if(d3.event.target == that.container.select(".lightboxHeader")[0][0]) {
				that.currentEvent = null;
				that.startEvent = d3.event;
				// Add Animation Loop and Move Listener
				that.animationId = requestAnimationFrame(that.dragLightbox);
				d3.select(document)
					.on('mousemove', function (){
						console.log("move");
						that.currentEvent = d3.event;
						that.checkbounds();
					})
					.on('mouseup',function () {
						console.log("mouseup");

						cancelDrag();
					})
			}
		})
		.append('a')
			.on('click', function(e) {
				that.close(e);
			})
			.html('x');

	var contentContainer = this.container.append('div')
			.attr('class', 'lightboxContent');

	//contentContainer.append(Content);
	Content.attr('width', '401')
	contentContainer.node().appendChild(Content.node());

	this.close = function() {
		that.container.remove();
	}

	this.dragLightbox = function () {
		console.log("draw");
		if(that.currentEvent != null && that.startEvent != null) {
			var x = (that.currentEvent.clientX - that.startEvent.offsetX);
			var y = (that.currentEvent.clientY - that.startEvent.offsetY);
			that.container.style("left", x + "px");
			that.container.style("top", y + "px");
			that.currentEvent = null;
		}
		that.animationId = requestAnimationFrame(that.dragLightbox);
	}

	this.checkbounds = function () {
		if(d3.event.clientX < 0 || d3.event.clientX > window.innerWidth) {
			cancelDrag();
		}
		else if(d3.event.clientY < 0 || d3.event.clientY > window.innerHeight) {
			cancelDrag()
		}
	}
	function cancelDrag () {
		console.log("cancelDrag");

		d3.select(document).on('mousemove',null);
		d3.select(document).on('mouseup',null);
		d3.select(document).on('mouseout',null);

		cancelAnimationFrame(that.animationId);
		that.animationId = null;
		that.startEvent = null;
	}
};<commit_msg>Fixed Lightbox<commit_after>var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
                            window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame;


function Lightbox(Content) {
 	var that = this;
 	this.animationId;
 	this.currentEvent;
 	this.startOffset = {
 		x: 0,
 		y: 0
 	};


 	this.container = d3.select('body')
						.append('div')
						.attr('class', 'lightbox');

	this.container.append('div')
		.attr('class', 'lightboxHeader')
		.on('mousedown', function () {
			d3.event.preventDefault();

			if(d3.event.target == that.container.select(".lightboxHeader")[0][0]) {
				that.currentEvent = null;
				that.startOffset.x = d3.event.offsetX;
				that.startOffset.y = d3.event.offsetY;

				// Add Animation Loop and Move Listener
				that.animationId = requestAnimationFrame(that.dragLightbox);
				d3.select(document)
					.on('mousemove', function (){
						console.log("move");
						that.currentEvent = d3.event;
						that.checkbounds();
					})
					.on('mouseup',function () {
						console.log("mouseup");

						cancelDrag();
					})
			}
		})
		.append('a')
			.on('click', function(e) {
				that.close(e);
			})
			.html('x');

	var contentContainer = this.container.append('div')
			.attr('class', 'lightboxContent');

	//contentContainer.append(Content);
	contentContainer.node().appendChild(Content.node());

	this.close = function() {
		that.container.remove();
	}

	this.dragLightbox = function () {
		console.log("draw");
		if(that.currentEvent != null) {
			var x = (that.currentEvent.clientX - that.startOffset.x);
			var y = (that.currentEvent.clientY - that.startOffset.y);
			that.container.style("left", x + "px");
			that.container.style("top", y + "px");
			that.currentEvent = null;
		}
		that.animationId = requestAnimationFrame(that.dragLightbox);
	}

	this.checkbounds = function () {
		if(d3.event.clientX < 0 || d3.event.clientX > window.innerWidth) {
			cancelDrag();
		}
		else if(d3.event.clientY < 0 || d3.event.clientY > window.innerHeight) {
			cancelDrag()
		}
	}
	function cancelDrag () {
		console.log("cancelDrag");

		d3.select(document).on('mousemove',null);
		d3.select(document).on('mouseup',null);
		d3.select(document).on('mouseout',null);

		cancelAnimationFrame(that.animationId);
		that.animationId = null;
	}
};
{'fraction_non_alphanumeric': 0.16319018404907976, 'fraction_numerical': 0.0081799591002045, 'mean_word_length': 3.653663177925785, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2600753', 'n_tokens_mistral': 1860, 'n_tokens_neox': 1571, 'n_words': 239}