arian/jshint.html

## jshint.html
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<style>
	body {font: 0.8em sans-serif;}
	strong {font-weight: bold}
	h3 {font-size: 1.2em}
	.fail {background: lightcoral}
	.pass {background: greenyellow}

	textarea#files {
		width: 100%;
		height: 100px;
	}

	</style>

	<script src="jshint.js"></script>

	<script>
	var SimpleRequest = (function(){

		/**
		 * Parse the XML document contained in the string argument and return
		 * a Document object that represents it.
		 */
		var parseXML = (function(){
			// Mozilla, Firefox, and related browsers
			return (typeof DOMParser != "undefined") ? function(rawXML){
				return (new DOMParser()).parseFromString(rawXML, "application/xml");
			} : (typeof ActiveXObject != "undefined") ? function(rawXML){
				var xmlDocument = new ActiveXObject("Microsoft.XMLDOM");
				xmlDocument.async = false;
				xmlDocument.loadXML(rawXML);
				if (xmlDocument.parseError && xmlDocument.parseError.errorCode)
					xmlDocument.loadXML(rawXML.replace(/<!DOCTYPE[^>]*?>/i,''));
				if (xmlDocument.parseError && xmlDocument.parseError.errorCode)
				throw new Error([''
					,("Error code: " + xmlDocument.parseError.errorCode)
					,("Error reason: " + xmlDocument.parseError.reason)
					,("Error line: " + xmlDocument.parseError.line)
					,rawXML
				].join('\n'));
				return xmlDocument;
			} : function(){
				return null;
			};
		})();

		function SimpleRequest(){
			this.initialize();
		};

		SimpleRequest.prototype = {

			initialize: function(){
				this.xhr = this.createXHR();
			},

			createXHR: function(){
				// return ('XMLHttpRequest' in window)? new XMLHttpRequest(): new ActiveXObject('MSXML2.XMLHTTP');
				return ('XMLHttpRequest' in window) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
			},

			stateChange: function(fn){
				if(this.xhr.readyState == 4 && this.xhr.status == 200){
					fn.apply(this, [this.xhr.responseText, this.getXML()]);
				}
			},

			getXML: function(){
				if (this.xhr.responseXML && this.xhr.responseXML.documentElement)
					return this.xhr.responseXML;
				return parseXML(this.xhr.responseText);
			},

			send: function(url, fn){
				var self = this;
				this.xhr.onreadystatechange = function(){ self.stateChange(fn); };
				this.xhr.open('get', url + '?n=' + (new Date()).getTime(), true);
				this.xhr.send(null);
			}

		};

		return SimpleRequest;
	})();

	var hint = function(){

		var errors = document.getElementById('errors');
		var files = document.getElementById('files');

		var empty = function(){
			if (errors.childNodes.length) for (var i = errors.childNodes.length; i--;){
				console.log(errors.childNodes[i]);
				errors.removeChild(errors.childNodes[i]);
			}
		};

		var loadFiles = function(project, sources){
			return function(){

				var config = document.createElement('script');
				config.src = project + '/Specs/Configuration.js';
				document.head.appendChild(config);

				config.addEventListener('load', function(){

					var filesArray = [];
					sources.forEach(function(sourceObject){
						var source = Configuration.source[sourceObject], i, l;
						for (i = 0, l = source.files.length; i < l; i++) filesArray.push(source.path + source.files[i]);
					});

					files.value = filesArray.map(function(file){
						return file.replace('../', project + '/') + '.js';
					}).join('\n');

				}, false);
			};
		};


		// Globals defined in Core
		var globals = 'Events, Options, MooTools, Class, Element, typeOf, instanceOf,'
			+ 'Fx, Slick, Type, Chain, Elements, Document, Event, Window, Browser'.split(', ').map(function(value, key){
			return value + ': false'
		}).join(', ');

		// Get all file paths


		// Request instance
		var request = new SimpleRequest();

		var makeRequest = function(filesArray, counter){
			var file = filesArray[counter];
			console.log(file);
			request.send(file, function(js){

				js = '/*global ' + globals + ' */' + js;

				// JSHint
				var myresult = JSHINT(js, {
					debug: true,
					devel: true,
					forin: true,
					undef: true,
					browser: true,
					maxerr: 500
				});
				var report = JSHINT.data();

				// Display results
				if (!myresult){
					var error;

					for (var i = 0, l = report.errors.length; i < l; i++){
						error = report.errors[i];
						if (!error) continue;

						var errorLI = document.createElement('li');
						errorLI.classList.add('fail');
						errorLI.innerHTML = '<strong>FAIL: </strong>' + file + '<h3>' + error.reason + '</h3>' +
							'<p><code>' + error.evidence +  '</code> on line ' +
							error.line + ' char: ' + error.character + '</p>';
						errors.appendChild(errorLI);
					}
				} else {
					var passLI = document.createElement('li');
					passLI.classList.add('pass');
					passLI.innerHTML = '<strong>PASS: </strong>' + file;
					errors.appendChild(passLI);
				}
				if (filesArray[counter + 1]) makeRequest(filesArray, counter + 1);
			});

		};

		document.getElementById('JSHint').addEventListener('click', function(){
			empty();
			var filesArray = files.value.split('\n');
			if (filesArray.length) makeRequest(filesArray, 0);
		}, false);

		document.getElementById('mootools-core-files').addEventListener('click', loadFiles(
			'mootools-core',
			['core-1.3-base', 'core-1.3-client']
		), true);

		document.getElementById('mootools-more-files').addEventListener('click', loadFiles(
			'mootools-more',
			['more-1.3-base', 'more-1.3-client', 'more-others']
		), true);

	};

	window.addEventListener('load', hint, false);

	</script>

	<title></title>

</head>
<body>

	<div>
		<strong>Files to JSHint:</strong><br>
		<textarea id="files"></textarea>
	</div>

	<div>
		<button id="mootools-core-files">Use MooTools Core Files</button>
		<button id="mootools-more-files">Use MooTools More Files</button>
		<button id="JSHint">Start JSHint</button>
	</div>


	<h1>Errors:</h1>

	<ol id="errors"></ol>

</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<style>
	body {font: 0.8em sans-serif;}
	strong {font-weight: bold}
	h3 {font-size: 1.2em}
	.fail {background: lightcoral}
	.pass {background: greenyellow}

	textarea#files {
	width: 100%;
	height: 100px;
	}

	</style>

	<script src="jshint.js"></script>

	<script>
	var SimpleRequest = (function(){

	/**
	* Parse the XML document contained in the string argument and return
	* a Document object that represents it.
	*/
	var parseXML = (function(){
	// Mozilla, Firefox, and related browsers
	return (typeof DOMParser != "undefined") ? function(rawXML){
	return (new DOMParser()).parseFromString(rawXML, "application/xml");
	} : (typeof ActiveXObject != "undefined") ? function(rawXML){
	var xmlDocument = new ActiveXObject("Microsoft.XMLDOM");
	xmlDocument.async = false;
	xmlDocument.loadXML(rawXML);
	if (xmlDocument.parseError && xmlDocument.parseError.errorCode)
	xmlDocument.loadXML(rawXML.replace(/<!DOCTYPE[^>]*?>/i,''));
	if (xmlDocument.parseError && xmlDocument.parseError.errorCode)
	throw new Error([''
	,("Error code: " + xmlDocument.parseError.errorCode)
	,("Error reason: " + xmlDocument.parseError.reason)
	,("Error line: " + xmlDocument.parseError.line)
	,rawXML
	].join('\n'));
	return xmlDocument;
	} : function(){
	return null;
	};
	})();

	function SimpleRequest(){
	this.initialize();
	};

	SimpleRequest.prototype = {

	initialize: function(){
	this.xhr = this.createXHR();
	},

	createXHR: function(){
	// return ('XMLHttpRequest' in window)? new XMLHttpRequest(): new ActiveXObject('MSXML2.XMLHTTP');
	return ('XMLHttpRequest' in window) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
	},

	stateChange: function(fn){
	if(this.xhr.readyState == 4 && this.xhr.status == 200){
	fn.apply(this, [this.xhr.responseText, this.getXML()]);
	}
	},

	getXML: function(){
	if (this.xhr.responseXML && this.xhr.responseXML.documentElement)
	return this.xhr.responseXML;
	return parseXML(this.xhr.responseText);
	},

	send: function(url, fn){
	var self = this;
	this.xhr.onreadystatechange = function(){ self.stateChange(fn); };
	this.xhr.open('get', url + '?n=' + (new Date()).getTime(), true);
	this.xhr.send(null);
	}

	};

	return SimpleRequest;
	})();

	var hint = function(){

	var errors = document.getElementById('errors');
	var files = document.getElementById('files');

	var empty = function(){
	if (errors.childNodes.length) for (var i = errors.childNodes.length; i--;){
	console.log(errors.childNodes[i]);
	errors.removeChild(errors.childNodes[i]);
	}
	};

	var loadFiles = function(project, sources){
	return function(){

	var config = document.createElement('script');
	config.src = project + '/Specs/Configuration.js';
	document.head.appendChild(config);

	config.addEventListener('load', function(){

	var filesArray = [];
	sources.forEach(function(sourceObject){
	var source = Configuration.source[sourceObject], i, l;
	for (i = 0, l = source.files.length; i < l; i++) filesArray.push(source.path + source.files[i]);
	});

	files.value = filesArray.map(function(file){
	return file.replace('../', project + '/') + '.js';
	}).join('\n');

	}, false);
	};
	};


	// Globals defined in Core
	var globals = 'Events, Options, MooTools, Class, Element, typeOf, instanceOf,'
	+ 'Fx, Slick, Type, Chain, Elements, Document, Event, Window, Browser'.split(', ').map(function(value, key){
	return value + ': false'
	}).join(', ');

	// Get all file paths


	// Request instance
	var request = new SimpleRequest();

	var makeRequest = function(filesArray, counter){
	var file = filesArray[counter];
	console.log(file);
	request.send(file, function(js){

	js = '/global ' + globals + ' /' + js;

	// JSHint
	var myresult = JSHINT(js, {
	debug: true,
	devel: true,
	forin: true,
	undef: true,
	browser: true,
	maxerr: 500
	});
	var report = JSHINT.data();

	// Display results
	if (!myresult){
	var error;

	for (var i = 0, l = report.errors.length; i < l; i++){
	error = report.errors[i];
	if (!error) continue;

	var errorLI = document.createElement('li');
	errorLI.classList.add('fail');
	errorLI.innerHTML = '<strong>FAIL: </strong>' + file + '<h3>' + error.reason + '</h3>' +
	'<p><code>' + error.evidence + '</code> on line ' +
	error.line + ' char: ' + error.character + '</p>';
	errors.appendChild(errorLI);
	}
	} else {
	var passLI = document.createElement('li');
	passLI.classList.add('pass');
	passLI.innerHTML = '<strong>PASS: </strong>' + file;
	errors.appendChild(passLI);
	}
	if (filesArray[counter + 1]) makeRequest(filesArray, counter + 1);
	});

	};

	document.getElementById('JSHint').addEventListener('click', function(){
	empty();
	var filesArray = files.value.split('\n');
	if (filesArray.length) makeRequest(filesArray, 0);
	}, false);

	document.getElementById('mootools-core-files').addEventListener('click', loadFiles(
	'mootools-core',
	['core-1.3-base', 'core-1.3-client']
	), true);

	document.getElementById('mootools-more-files').addEventListener('click', loadFiles(
	'mootools-more',
	['more-1.3-base', 'more-1.3-client', 'more-others']
	), true);

	};

	window.addEventListener('load', hint, false);

	</script>

	<title></title>

	</head>
	<body>

	<div>
	<strong>Files to JSHint:</strong><br>
	<textarea id="files"></textarea>
	</div>

	<div>
	<button id="mootools-core-files">Use MooTools Core Files</button>
	<button id="mootools-more-files">Use MooTools More Files</button>
	<button id="JSHint">Start JSHint</button>
	</div>


	<h1>Errors:</h1>

	<ol id="errors"></ol>

	</body>
	</html>