accurator/commit

Added domain object to javascript.

diff --git a/web/html/domain.html b/web/html/domain.html
index 5e1c638..cf3e5c8 100644
--- a/web/html/domain.html
+++ b/web/html/domain.html
@@ -77,6 +77,7 @@
 	<script type="text/javascript" src="js/lib/bootstrap.min.js"></script>
 	<script type="text/javascript" src="js/lib/laconic.js"></script>
 	<script type="text/javascript" src="js/components/utilities.js"></script>
+	<script type="text/javascript" src="js/components/domain.js"></script>
 	<script type="text/javascript" src="js/domain.js"></script>
 	<script>domainInit()</script>
 </body>
diff --git a/web/js/components/domain.js b/web/js/components/domain.js
new file mode 100644
index 0000000..72fca21
--- /dev/null
+++ b/web/js/components/domain.js
@@ -0,0 +1,51 @@
+/******************************************************************************
+Domain
+
+Code for representing domains
+*******************************************************************************/
+function Domain(id, title, image, imageBrightness) {
+	console.log(arguments);
+	this.id = id; // id of domain
+	this.title = title; // title of domain
+	this.image = image; // image illustrating domain
+	this.imageBrightness = imageBrightness; // is the descriptive image dark or light
+	this.link = null; // URL of location where someone can show expertise of domain
+	// this.subDomains = subDomains;
+	this.node = null;  // html of thumbnail
+
+	this.init();
+}
+
+Domain.prototype.init = function() {
+	this.node = $.el.div({'class':'noPadding col-md-6'},
+		$.el.h3({'class':'domainHdr',
+				 'id':'domainTxt' + this.id},
+				 this.title),
+		$.el.img({'class':'domainImg',
+				  'id':'domainImg' + this.id,
+				  'src':this.image})
+	);
+
+	this.setTitleColor();
+	this.setClickEvent();
+}
+
+Domain.prototype.setTitleColor = function() {
+	if(this.imageBrightness === "dark")
+		$(this.node).find("#domainTxt" + this.id).css('color', '#fff');
+}
+
+Domain.prototype.setClickEvent = function() {
+	$(this.node).find("#domainImg" + this.id).click(function() {
+		setDomain(this.id)
+		.then(function() {
+			document.location.href = "results.html";
+		});
+	});
+	$(this.node).find("#domainTxt" + this.id).click(function() {
+		setDomain(this.id)
+		.then(function() {
+			document.location.href = "results.html";
+		});
+	});
+}
diff --git a/web/js/domain.js b/web/js/domain.js
index 5961254..bf0a87a 100644
--- a/web/js/domain.js
+++ b/web/js/domain.js
@@ -66,7 +66,15 @@ function populateDomains(locale, domainLabels) {
 		// define function to keep stable track of row
 		var addDomain = function (row, locale) {
 			return function(domainData) {
-				domainHtml(domainData, row, locale);
+				console.log(domainData);
+				var domain = new Domain (
+					domainData.domain,
+					"title", // should retrieve using labels
+					domainData.image,
+					domainData.imageBrightness
+				);
+
+				$("#domainDiv" + row).append(domain.node);
 			}
 		}
 
@@ -80,14 +88,7 @@ function domainHtml(domainData, row, locale) {
 
 	getLabels(locale, domainData.hasUI + "domain")
 	.then(function(labels) {
-		$("#domainDiv" + row).append(
-			$.el.div({'class':'noPadding col-md-6'},
-				$.el.h3({'class':'domainHdr',
-						 'id':'domainTxt' + domain},
-						 labels.domainLabel),
-				$.el.img({'class':'domainImg',
-						  'id':'domainImg' + domain,
-						  'src':domainData.image})));
+		$("#domainDiv" + row).append();
 
 		if(domainData.imageBrightness === "dark")
 			$("#domainTxt" + domainData.domain).css('color', '#fff');