Play
JavaScript
CSS
HTML
ReadMe
Snapshots

if (typeof Application == "undefined" || !Application) {
	var Application = {};
}

Application.genocon = function() {
	this._init.apply(this, arguments);
};

Application.genocon.prototype = {
	
	CHAR_SEQ_EMPTY : "-",
	
	_baseSequence : null,
	_tooltip : null,
	_methodList : null,
	_appBaseLineSequence : null,
	_appMenuHandler : null,
	
	_default : {
		baseSequenceContainerId : "baseSequenceContainer",
		fixedSequenceClass : "fixedSequence",
		finishSequence : "finishSequence",
		baseErrorMessageClass : "baseErrorMessage",
		errorMessageEnterSequence : "Please enter a sequence of minimum length {0}",
		errorMessageMaximumSequence : "Please enter a sequence of maximum length {0}",
		useButtonClass : "useButton",
		nextButtonClass : "nextButton",
		finishNowButtonClass : "finishNow",
		nextButtonContainerClass : "nextButtonContainer",
		collapseButton : "collapseButton",
		expandButton : "expandButton",
		removeButton : "removeButton",
		appContainerClass : "applicationContainer",
		appDataContainerClass : "applicationDataContainer",
		actionButtonContainer : "actionButtonContainer",
		actionResultContainer : "actionResultContainer",
		baseSequenceBoxClass : "baseSequenceBox",
		baseSequenceClass : "baseSequence",
		selectDataBaseList : "databaseList",
		selectMethodList : "optionList",
		databaseFilteringProperty : "#motif%20sequence",
		methodUrlProperty : "#application%20URL",
		baseSequenceMinLength : 50,
		baseSequenceMaxLength : 500,
		applicationOptionClass : "applicationOptionRadio"
	},
	
	_tag : {
		databaseTag : "database",
		methodTag : "method"
	},
	
	_tooltipName : {
		atGeneExpress : "atgenexpress",
		diurnal : "diurnal",
		selectDatabase : "selectdatabase",
		selectTool : "selecttool",
		motifExpress : "motifexpress",
		motifCircatian : "motifcircadian",
		motifRank : "motifrank",
		motifQuery : "motifquery",
		defaultSequence : "basesequence",
		fixedSequence : "gacccttcctctatataaggaagttcatttcatttggagaggacctcgac",
		finishNow : "finishnow",
		next : "next"
	},
	
	_init : function() {
		this._methodList = [];
		this._initToolTip();
		this._initDefaultSequence();
		this._initAppBaseLineSequence();
		this._initLoadScript();
		this._initUseButtonListener();
		//this._initAppMenuHanndler();
	},
	
	_initToolTip : function() {
		this._tooltip = new Application.tooltip();
	},
	
	_initDefaultSequence : function() {
		var self = this, sb = [];
		for (var i = 0; i < self._default.baseSequenceMaxLength; i++) {
			sb[sb.length] = self.CHAR_SEQ_EMPTY;
		}
		$baseInput = $("#" + this._default.baseSequenceContainerId + " ." + this._default.baseSequenceClass);
		$baseInput.val(sb.join(""));
		$baseInput.keyup(function() {
			var size = ($baseInput.val().length != 0) ? $baseInput.val().length : 1;
			$baseInput.attr("size", size);
		});
		$("#" + this._default.baseSequenceContainerId + " ." + this._default.baseSequenceBoxClass).scrollLeft(10000);
		var timer = new Application.timer();
		var applyToolTip = function() {
			var dToolTip = self._getToolTip(self._tooltipName.defaultSequence);
			var fToolTip = self._getToolTip(self._tooltipName.fixedSequence);
			if (dToolTip && fToolTip) {
				$("#" + self._default.baseSequenceContainerId + " ." + self._default.baseSequenceClass).attr("title", dToolTip);
				$("#" + self._default.baseSequenceContainerId + " ." + self._default.fixedSequenceClass).attr("title", fToolTip);
			} else {
				timer.call(applyToolTip);
			}
		}
		applyToolTip();
	},
	
	_initAppBaseLineSequence : function() {
		this._appBaseLineSequence = new Application.baseLineSequence();
	},
	
	_initAppMenuHanndler : function() {
		this._appMenuHandler = new Application.MenuHandler()
	},
	
	_initLoadScript : function() {
		var self = this;
		var getFilesByTag = function(result) {
			$.each(result, function(workId, fileArray){
				$.each(fileArray, function(fileKey, fileName) {
					var getProperties = function(propertytList) {
						$.each(propertytList, function(propKey, propVal) {
							if (propVal.indexOf(self._default.methodUrlProperty) > -1) {
								self._loadPluginScriptList(workId, fileName, propVal);
								return false;
							}
						});
					}
					LinkData.getProperties(workId, fileName, getProperties);
					return false;
				});
			});
		}
		LinkData.getFilesByTag(null, self._tag.methodTag, getFilesByTag);
	},
	
	_initDefaultContainer : function() {
		this._initDatabase();
		this._initMethod();
		this._initActionButton();
		this._initDatabaseListener();
		this._initMethodListener();
	},
	
	_initDatabase : function() {
		var self = this;
		var $select = $("." + self._default.appContainerClass + " ." + self._default.selectDataBaseList);
		$select.attr("title", self._getToolTip(self._tooltipName.selectDatabase));
		$("option", $select).remove();
		$select.append("<option value='-1' selected='selected'>-- Select Database --</option>");
		var getFilesByTag = function(result) {
			$.each(result, function(workId, fileArray){
				$.each(fileArray, function(fileKey, fileName) {
					var dbKey = self._getDatabaseOptionKey(workId, fileName);
					var tooltip = self._tooltip.getByKey(fileName);
					$select.append("<option value='" + dbKey + "' title='" + tooltip + "'>" + fileName + "</option>");
				});
			});
		}
		LinkData.getFilesByTag("", self._tag.databaseTag, getFilesByTag);
	},
	
	_initMethod : function() {
		var self = this;
		var $select = $("." + self._default.appContainerClass + " ." + self._default.selectMethodList);
		$("option", $select).remove();
		$select.append("<option value='-1' selected='selected'>-- Select Tool --</option>");
		$select.attr("title", self._getToolTip(self._tooltipName.selectTool));
		var getFilesByTag = function(result) {
			$.each(result, function(workId, fileArray){
				$.each(fileArray, function(fileKey, fileName) {
					var getSubjects = function(subjectList) {
						$.each(subjectList, function(subKey, subVal) {
							var label = self._getLabel(subVal);
							var tooltip = self._getToolTipByToolName(label);
							tooltip = (tooltip) ? tooltip : "";
							$select.append("<option value='" + label + "' title='" + tooltip + "'>" + label + "</option>");
							self._methodList.push(label);
						});
					}
					LinkData.getSubjects(workId, fileName, getSubjects);
				});
			});
		}
		LinkData.getFilesByTag(null, self._tag.methodTag, getFilesByTag);
	},
	
	_initActionButton : function() {
		var self = this;
		$("." + self._default.actionButtonContainer + " ." + self._default.collapseButton).click(function() {
			var parent = $(this).closest("." + self._default.appContainerClass);
			$(parent).find("." + self._default.appDataContainerClass).hide();
		});
		$("." + self._default.actionButtonContainer + " ." + self._default.expandButton).click(function() {
			var parent = $(this).closest("." + self._default.appContainerClass);
			$(parent).find("." + self._default.appDataContainerClass).show();
		});
		$("." + self._default.actionButtonContainer + " ." + self._default.removeButton).click(function() {
			if ($("." + self._default.appContainerClass).length == 1) {
				$("." + self._default.appContainerClass).hide();
				$("." + self._default.appContainerClass + " .actionResultContainer").html("");
				//$("." + self._default.appContainerClass + " .databaseList").find.empty();
				//$("." + self._default.appContainerClass + " .optionList").find('option').remove();
				$("#" + self._default.baseSequenceContainerId + " ." + self._default.useButtonClass).show();
			} else {
				$(this).closest("." + self._default.appContainerClass).remove();
			}
		});
	},
	
	_initDatabaseListener : function() {
		var self = this;
		var $selectDb = $("." + self._default.appContainerClass + " ." + self._default.selectDataBaseList);
		$selectDb.change(function() {
			var parent = $(this).closest("." + self._default.appContainerClass);
			$(parent).find("." + self._default.applicationOptionClass).hide();
			$(parent).find("." + self._default.selectMethodList + " option").removeAttr("selected");
			$(parent).find("." + self._default.nextButtonContainerClass).hide();
			$container = $(parent).find("." + self._default.actionResultContainer);
			$container.html("");
			var dbKey = $("option:selected", $(this)).val();
			self._changeMethodList(dbKey);
		});
	},
	
	_initMethodListener : function() {
		var self = this;
		var $selectDb = $("." + self._default.appContainerClass + " ." + self._default.selectDataBaseList);
		var $select = $("." + self._default.appContainerClass + " ." + self._default.selectMethodList);
		$select.change(function() {
			var parent = $(this).closest("." + self._default.appContainerClass);
			var method = $("option:selected", $(this)).text();
			var database = $("option:selected", $(parent).find("." + self._default.selectDataBaseList)).val();
			if (database == -1) {
				return;
			}
			$container = $(parent).find("." + self._default.actionResultContainer);
			$container.html("Loading...");
			$(parent).find("." + self._default.applicationOptionClass).hide();
			$(parent).find("." + self._default.nextButtonContainerClass).hide();
			var date = new Date();
			var id = "container_id_" + date.getTime();
			$container.attr("id", id);
			var func = function() {
				self._callback(parent, self);
			}
			var arr = database.split("|");
			var obj = {
				workId : arr[0],
				fileName : arr[1],
				baseSequence : self._baseSequence,
				tooltip : self._tooltip,
				callback : func
			};
			if (method === "MotifExpress") {
				$(parent).find("." + self._default.applicationOptionClass).show();
				var appOption = $(parent).find("." + self._default.applicationOptionClass + " input[name=applicationOption]:checked").val();
				if (!appOption) {
					appOption = "max";
					$(parent).find("." + self._default.applicationOptionClass + " input[name=applicationOption][value='max']").attr("checked", true);
				}
				obj.applicationOption = appOption;
				$(parent).find("." + self._default.applicationOptionClass).unbind('click');
				$(parent).find("." + self._default.applicationOptionClass).click(function() {
					$(parent).find("." + self._default.nextButtonContainerClass).hide();
					$("#" + id).html("");
					obj.applicationOption = $(this).find("input[name=applicationOption]:checked").val();
					eval(method)(id, obj);
				});
			}
			eval(method)(id, obj);
		});
	},
	
	_loadPluginScriptList : function(workId, fileName, property) {
		var getTripleList = function(tripleList) {
			$.each(tripleList, function(tKey, tVal) {
				LinkDataUtil.loadScript(tVal.object);
			});
		}
		LinkData.getTriplesByProperty(workId, fileName, property, getTripleList);
	},
	
	_changeMethodList : function(dbKey) {
		var self = this;
		var $select = $("." + self._default.appContainerClass + " ." + self._default.selectMethodList);
		$select.attr("title", self._getToolTip(self._tooltipName.selectTool));
		$("option", $select).remove();
		$select.append("<option value='-1' selected='selected'>-- Select Tool --</option>");
		if (dbKey == -1) {
			return;
		}
		var arr = dbKey.split("|");
		var workId = arr[0];
		var fileName = arr[1];
		$.each(self._methodList, function(key, method) {
			self._addValidMethod($select, workId, fileName, method);
		});
	},
	
	_addValidMethod : function($select, workId, fileName, method) {
		var self = this;
		var getFilesByTag = function(fileList) {
			if (!fileList) {
				return;
			}
			$.each(fileList, function(fKey, fName) {
				if (fName === fileName) {
					var tooltip = self._getToolTipByToolName(method);
					tooltip = (tooltip) ? tooltip : "";
					$select.append("<option value='" + method + "' title='" + tooltip + "'>" + method + "</option>");
					return false;
				}
			});
		}
		LinkData.getFilesByTag(workId, method, getFilesByTag);
	},
	
	_initUseButtonListener : function() {
		var self = this;
		$("#" + self._default.baseSequenceContainerId + " ." + self._default.useButtonClass).click(function() {
			self._initDefaultContainer();
			$txtSeq = $("#" + self._default.baseSequenceContainerId + " ." + self._default.baseSequenceClass);
			$fixedSeq = $("#" + self._default.baseSequenceContainerId + " ." + self._default.fixedSequenceClass);
			self._hideError();
			if ($txtSeq.val().length > self._default.baseSequenceMaxLength) {
				self._showError(self._default.errorMessageMaximumSequence.replace("{0}", self._default.baseSequenceMaxLength));
				return;
			}
			if ($txtSeq.val().length < self._default.baseSequenceMaxLength) {
				var tmpVal = $txtSeq.val();
				var eVal = self._getExtraDefaultSequence(self._default.baseSequenceMaxLength - $txtSeq.val().length);
				$txtSeq.val(eVal + tmpVal);
				$("#" + self._default.baseSequenceContainerId + " ." + self._default.baseSequenceClass).attr("size", 500);
			}
			self._baseSequence = $txtSeq.val() + $fixedSeq.html();
			if (!self._baseSequence || self._baseSequence.length < self._default.baseSequenceMinLength) {
				self._showError(self._default.errorMessageEnterSequence.replace("{0}", self._default.baseSequenceMinLength));
			} else {
				$txtSeq.attr('readonly', true).addClass("noborder");
				$(this).hide();
				$("." + self._default.appContainerClass).show();
			}
		});
	},
	
	_callback : function(parent, self) {
		$(parent).find("." + self._default.nextButtonContainerClass).show();
		$(parent).find("." + self._default.finishSequence).hide();
		$("." + self._default.appContainerClass + " ." + self._default.nextButtonClass).attr("title", self._getToolTip(self._tooltipName.next));
		$("." + self._default.appContainerClass + " ." + self._default.finishNowButtonClass).attr("title", self._getToolTip(self._tooltipName.finishNow));
		self._initNextButtonListener();
		self._initFinishNowButtonListener();
	},
	
	_initNextButtonListener : function() {
		var self = this;
		$("." + self._default.appContainerClass + " ." + self._default.nextButtonClass).unbind('click');
		$("." + self._default.appContainerClass + " ." + self._default.nextButtonClass).click(function() {
			$parent = $(this).closest("." + self._default.appContainerClass);
			$parent.find("." + self._default.nextButtonContainerClass).hide();
			$(parent).find("." + self._default.finishSequence).hide()
			var clone = $parent.clone(true);
			$(clone).find("." + self._default.applicationOptionClass).hide();
			var text = $(clone).find(".replaceSequence").text();
			if (text && text.trim().length != 0) {
				self._baseSequence = text;
			}
			$(clone).find("." + self._default.actionResultContainer).html("");
			$(clone).find("." + self._default.nextButtonContainerClass).hide();
			$parent.parent().append(clone);
		});
	},
	
	_initFinishNowButtonListener : function() {
		var self = this;
		$("." + self._default.appContainerClass + " ." + self._default.finishNowButtonClass).unbind('click');
		$("." + self._default.appContainerClass + " ." + self._default.finishNowButtonClass).click(function() {
			var parent = $(this).closest("." + self._default.appContainerClass);
			$(parent).find("." + self._default.nextButtonContainerClass).hide();
			$(parent).find("." + self._default.finishSequence).hide()
			var gene = $(parent).find(".replaceSequence .gene").val();
			var geneType = $(parent).find(".replaceSequence .geneType").val();
			var callback = function(bSequence) {
				self._showFinishedBaseSequence(parent, bSequence);
			}
			self._appBaseLineSequence.getBaseSequence(gene, geneType, callback);
		});
	},
	
	_showFinishedBaseSequence : function(parent, bSequence) {
		var self = this;
		var defaultSequence = $(parent).find(".replaceSequence").text()
		var html = self._getFinishedBaseSequence(defaultSequence, bSequence);
		$(parent).find("." + self._default.finishSequence).show()
		$(parent).find("." + self._default.finishSequence).html(html);
		$(parent).find("." + self._default.finishSequence).scrollLeft(10000);
	},
	
	_getFinishedBaseSequence : function(defaultSequence, bSequence) {
		var self = this, sb = [];
		for (var i = 0; i < defaultSequence.length; i++) {
			var dChar = defaultSequence.charAt(i);
			var bChar = bSequence.charAt(i);
			if (bChar) {
				if (dChar !== self.CHAR_SEQ_EMPTY) {
					sb[sb.length] = "<span class='highlight-sequence'><span class='replace'>" + dChar + "</span></span>";
				} else {
					sb[sb.length] = bChar;
				}
			} else {
				sb[sb.length] = "<span class='highlight-sequence'><span class='replace'>" + dChar + "</span></span>";
			}
		}
		return sb.join("");
	},
	
	_getExtraDefaultSequence : function(count) {
		var self = this, sb = [];
		for (var i = 0; i < count; i++) {
			sb[sb.length] = self.CHAR_SEQ_EMPTY;
		}
		return sb.join("");
	},
	
	_getDatabaseOptionKey : function(workId, fileName) {
		return workId + "|" + fileName;
	},
	
	_getLabel : function(value) {
		var propLabel = value;
		var arr = value.split("#");
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
		}
		return propLabel;
	},
	
	_showError : function(message) {
		var self = this;
		$errMsgEl = $("#" + self._default.baseSequenceContainerId + " ." + self._default.baseErrorMessageClass);
		$errMsgEl.html(message);
		$errMsgEl.show();
	},
	
	_hideError : function() {
		var self = this;
		$("#" + self._default.baseSequenceContainerId + " ." + self._default.baseErrorMessageClass).hide();
	},
	
	_getToolTipByFileName : function(fileName) {
		var self = this;
		if (fileName) {
			if (fileName.toLowerCase().indexOf(self._tooltipName.atGeneExpress) > -1) {
				return self._getToolTip(self._tooltipName.atGeneExpress);
			} else if (fileName.toLowerCase().indexOf(self._tooltipName.diunal) > -1) {
				return self._getToolTip(self._tooltipName.diunal);
			}
		}
	},
	
	_getToolTipByToolName : function(tool) {
		var self = this;
		if (tool) {
			if (tool.toLowerCase().indexOf(self._tooltipName.motifExpress) > -1) {
				return self._getToolTip(self._tooltipName.motifExpress);
			} else if (tool.toLowerCase().indexOf(self._tooltipName.motifCircatian) > -1) {
				return self._getToolTip(self._tooltipName.motifCircatian);
			} else if (tool.toLowerCase().indexOf(self._tooltipName.motifRank) > -1) {
				return self._getToolTip(self._tooltipName.motifRank);
			} else if (tool.toLowerCase().indexOf(self._tooltipName.motifQuery) > -1) {
				return self._getToolTip(self._tooltipName.motifQuery);
			}
		}
	},
	
	_getToolTip : function(key) {
		return this._tooltip.getByKey(key);
	}
	
};

Application.MenuHandler = function() {
	this._init.apply(this,arguments);
}

Application.MenuHandler.prototype = {
	
	_fullList : [],
	_currentFilteredList : [],
	
	_properties : {
		motifAnalysisMethod : "motif analysis method",
		geneExpressionData : "gene expression data",
		menuDisplayName : "menu display name",
		toolsList : "tools list",
		workId : "workID"
    },
	
	_tags : {
		menuDataSourceTag : "menu"
	},
	
	_init : function(args) {
		this._initMenuDataSource();
	},
	
	_initMenuDataSource : function() {
		var self = this;
		var foundMenuFiles = [];
		var loadMenuFiles = function(resultList) {
			$.each(resultList, function(wId, fileList) {
				$.each(fileList, function(fileKey, fName) {
					var obj = {
						workId : wId,
						fileName : fName
					};
					foundMenuFiles.push(obj);
				});
			});
			self._loadMenuFileContent(foundMenuFiles);
		};
		LinkData.getFilesByTag(null, this._tags.menuDataSourceTag, loadMenuFiles);
	},
	
	_loadMenuFileContent : function(menuFiles) {
		var self = this;
		var addFileContent = function(triples) {
			for (var index = 0 ; index < triples.length ; index++) {
				self._fullList.push(triples[index]);
			}
			if (menuFiles.length > 0) {
				self._loadMenuFileContent(menuFiles);
			}
		};
		if (menuFiles.length == 0) {
			return;
		}
		var obj = menuFiles.shift(); // removing the first element
		var fileName = obj.fileName;
		var workId = obj.workId;
		LinkData.getTriples(workId,fileName,addFileContent,{start:1, end:1000});
	},
	
	_filterAndGetAnalysisMethods : function(toolName) {
		var listByTool = this._getTriplesByProperty(this._properties.toolsList);
		for (var index = 0 ; index < listByTool.length ; index++) {
			var triple = listByTool[index];
			if (triple.object) {
				var toolList = triple.object.split(",");
				if (toolList.indexOf(toolName) != -1) {
					this._currentFilteredList.push(triple);
				}
			}
		}
		var distinctList = this._getDistinctList(this._properties.motifAnalysisMethod);
		return distinctList;
	},
	
	_getTriplesByProperty : function(property) {
		var filteredList = [];
		var currentList = this._getCurrentUsingList();
		for (var index = 0 ; index < currentList.length ; index++) {
			var triple = currentList[index];
			var prop = triple.property;
			if (prop.indexOf(property) != -1) {
				filteredList.push(triple);
			}
		}
	},
	
	// returns a string array
	_getDistinctObjectList : function(propName) {
		var currentList = this._getCurrentUsingList();
		var distinctList = [];
		for (var index = 0 ; index < currentList.length ; index++) {
			var triple = currentList[index];
			var prop = triple.property;
			if (prop && prop.indexOf(propName) != -1) {
				var objVal = triple.object;
				if (distinctList.indexOf(objVal) != -1) {
					distinctList.push(objVal);
				}
			}
		}
		return distinctList;
	},
	
	_getCurrentUsingList : function() {
		if (this._currentFilteredList.length == 0) {
			return this._fullList;
		} else {
			return this._currentFilteredList;
		}
	},
}
	
Application.baseLineSequence = function() {
	this._init.apply(this, arguments);
};

Application.baseLineSequence.prototype = {
	
	_attedSequenceInfo : null,
	_ppdbSequenceInfo : null,
	
	_default : {
		sequenceProperty : "sequence"
	},
	
	_tag : {
		attedBaseSequenceTag : "atted_baseLineSequence",
		ppdbBaseSequenceTag : "ppdb_baseLineSequence"
	},
	
	_init : function() {
		this._attedSequenceInfo = {};
		this._ppdbSequenceInfo = {};
		this._initBaseSequenceFile();
	},
	
	_initBaseSequenceFile : function() {
		this._initAttedBaseSequenceFile();
		this._initPpdbBaseSequenceFile();
	},
	
	_initAttedBaseSequenceFile : function() {
		var self = this;
		var getFilesByTag = function(resultList) {
			$.each(resultList, function(workId, fileList) {
				$.each(fileList, function(fileKey, fileName) {
					self._initAttedInfo(workId, fileName);
					return false;
				});
			});
		}
		LinkData.getFilesByTag(null, self._tag.attedBaseSequenceTag, getFilesByTag);
	},
	
	_initPpdbBaseSequenceFile : function() {
		var self = this;
		var getFilesByTag = function(resultList) {
			$.each(resultList, function(workId, fileList) {
				$.each(fileList, function(fileKey, fileName) {
					self._initPpdbInfo(workId, fileName);
					return false;
				});
			});
		}
		LinkData.getFilesByTag(null, self._tag.ppdbBaseSequenceTag, getFilesByTag);
	},
	
	_initAttedInfo : function(workId, fileName) {
		var self = this;
		var getProperties = function(propertyList) {
			$.each(propertyList, function(pKey, pValue) {
				if (pValue.indexOf(self._default.sequenceProperty) > -1) {
					self._attedSequenceInfo.workId = workId;
					self._attedSequenceInfo.fileName = fileName;
					self._attedSequenceInfo.property = pValue;
					return false;
				}
			});
		}
		LinkData.getProperties(workId, fileName, getProperties);
	},
	
	_initPpdbInfo : function(workId, fileName) {
		var self = this;
		var getProperties = function(propertyList) {
			$.each(propertyList, function(pKey, pValue) {
				if (pValue.indexOf(self._default.sequenceProperty) > -1) {
					self._ppdbSequenceInfo.workId = workId;
					self._ppdbSequenceInfo.fileName = fileName;
					self._ppdbSequenceInfo.property = pValue;
					return false;
				}
			});
		}
		LinkData.getProperties(workId, fileName, getProperties);
	},
	
	_getAttedSubjectUrl : function(gene) {
		return "http://atted.jp/data/locus/" + gene + ".html";
	},
	
	_getPpdbSubjectUrl : function(gene) {
		return "http://ppdb.agr.gifu-u.ac.jp/ppdb/cgi-bin/display.cgi?organism=At&gene=" + gene;
	},
	
	_getAttedBaseSequence : function(gene, callback) {
		var self = this;
		var workId = self._attedSequenceInfo.workId;
		var fileName = self._attedSequenceInfo.fileName;
		var property = self._attedSequenceInfo.property;
		var subject = self._getAttedSubjectUrl(gene);
		var getObjects = function(objList) {
			callback(objList[0]);
		}
		LinkData.getObjects(workId, fileName, subject, property, getObjects);
	},
	
	_getPpdbBaseSequence : function(gene, callback) {
		var self = this;
		var workId = self._ppdbSequenceInfo.workId;
		var fileName = self._ppdbSequenceInfo.fileName;
		var property = self._ppdbSequenceInfo.property;
		var subject = self._getPpdbSubjectUrl(gene);
		var getObjects = function(objList) {
			callback(objList[0]);
		}
		LinkData.getObjects(workId, fileName, subject, property, getObjects);
	},
	
	getBaseSequence : function(gene, geneType, callback) {
		var self = this;
		if ("ATTED" === geneType) {
			self._getAttedBaseSequence(gene, callback);
		} else if ("PPDB" === geneType) {
			self._getPpdbBaseSequence(gene, callback);
		} else {
			// error
		}
	}
	
};

Application.tooltip = function() {
	this._init.apply(this, arguments);
};

Application.tooltip.prototype = {
	
	_toolTipList : null,
	
	_default : {
		explanationProperty : "explanation"
	},
	
	_init : function() {
		this._toolTipList = [];
		this._initToolTip();
	},
	
	_initToolTip : function() {
		var self = this;
		var getFilesByTag = function(resultList) {
			$.each(resultList, function(workId, fileList) {
				$.each(fileList, function(fileKey, fileName) {
					self._getFilePropertyList(workId, fileName);
				});
			});
		}
		LinkData.getFilesByTag(null, "tooltip", getFilesByTag);
	},
	
	_getFilePropertyList : function(workId, fileName) {
		var self = this;
		var index = new Application.index(1, 10000);
		var getProperties = function(propertyList) {
			$.each(propertyList, function(pKey, pValue) {
				if (pValue.indexOf(self._default.explanationProperty) > -1) {
					self._getSubjectList(workId, fileName, pValue, index);
					return false;
				}
			});
		}
		LinkData.getProperties(workId, fileName, getProperties);
	},
	
	_getSubjectList : function(workId, fileName, property, index) {
		var self = this;
		var getSubjects = function(subjectList) {
			self._getPropertyList(subjectList, workId, fileName, property, index);
		}
		LinkData.getSubjects(workId, fileName, getSubjects, index);
	},
	
	_getPropertyList : function(subjectList, workId, fileName, property, index) {
		var self = this;
		var getTriplesByProperty = function(tripleList) {
			self._addToolTipToList(subjectList, tripleList, workId, fileName, property, index);
		}
		LinkData.getTriplesByProperty(workId, fileName, property, getTriplesByProperty, index);
	},
	
	_addToolTipToList : function(subjectList, tripleList, workId, fileName, property, index) {
		var self = this;
		for (var i = 0; i < subjectList.length; i++) {
			var key = self._getLabelAfterHash(subjectList[i]);
			if (tripleList[i]) {
				var value = tripleList[i].object;
				self._addToolTip(key, value);
			}
			//var value = tripleList[i].object;
			//self._addToolTip(key, value);
		}
		if (subjectList && subjectList.length == index.getItemCount()) {
			self._getSubjectList(workId, fileName, property, index.increment());
		}
	},
	
	_addToolTip : function(key, tooltip) {
		var obj = {};
		obj.key = key;
		obj.tooltip = tooltip;
		this._toolTipList.push(obj);
	},
	
	getByKey : function(key) {
		var self = this, tooltip;
		$.each(self._toolTipList, function(objKey, obj) {
			if (obj.key === key) {
				tooltip = obj.tooltip;
				return false;
			}
		});
		return (tooltip) ? tooltip : "";
	},
	
	_getLabelAfterHash : function(value) {
		var propLabel = value;
		var arr = value.split("#");
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
		}
		return propLabel;
	}
	
};

Application.index = function() {
	this._init.apply(this, arguments);
}

Application.index.prototype = {
	
	_start : null,
	_end : null,
	
	_init : function(start, end) {
		this._start = start;
		this._end = end;
	},
	
	getIndex : function() {
		return {start : this._start, end : this._end};
	},
	
	getItemCount : function() {
		return (this._end - this._start + 1);
	},
	
	increment : function() {
		var itemCount = this.getItemCount();
		this._start = this._start + itemCount;
		this._end = this._end + itemCount;
		return {start : this._start, end : this._end};
	},
	
	getStartIndex : function() {
		return this._start;
	},
	
	getEndIndex : function() {
		return this._end;
	}
	
};

Application.timer = function() {
	this._init.apply(this, arguments);
};

Application.timer.prototype = {
	
	_delay : null,
	_retry : null,
	_maxRetry : null,
	
	_init : function() {
		this._delay = 1000;
		this._retry = 0;
		this._maxRetry = 100;
	},
	
	call : function(func) {
		if (this._retry < this._maxRetry) {
			setTimeout(func, this._delay);
		}
		this._retry++;
	}
};

Application.MotifConflication = function() {
	this._init.apply(this, arguments);
};

/*
Application.MotifConflication.prototype = {
	
	_motifConflictConfirmDialogId : null,
	_containerId : null,
	_resultAreaClass : "resultArea",
	_baseSequenceLength : 550,
	_baseSequence : null,
	_appSequence : null,
	replaceSequenceClass : "replaceSequence",
	htmlRenderFunction : null,
	htmlSetFunctionOwner : null,
	
	defaults : {
		conflictionDialogTitle : "Confliction",	
	},
	
	_init : function(para,appSequnce) {
		//this._containerId = para;
		this._containerId = para;
		//this._resultAreaClass = para.resutAreaClass;
		//this._baseSequenceLength = para.baseSequenceLength;
		//this._appSequence = appSequnce; 
	},
	
	_setAppSequnce : function(appSequence) {
		this._appSequence = appSequence;	
	},
	
	_setHtmlSetFunction  : function(func) {
		this.htmlRenderFunction = func;
	},
	
	_setHtmlSetFunctionOwner : function(owner) {
		this.htmlSetFunctionOwner = owner;
	},
	
	_initConflictConfirmDialogView : function() {
		var sb = [], date = new Date(); 
		//self._motifConflictConfirmDialogId = "motifConflictConfirmDialog_id_" + self._containerId + "_" + date.getTime();
		this._motifConflictConfirmDialogId = "motifConflictConfirmDialog_id_" + date.getTime();
		sb[sb.length] = "<div id='" + this._motifConflictConfirmDialogId + "' class='hidden' style='width:200px'>";
		sb[sb.length] = "<div>New motif overlaps with old one. Which one should be kept in overalp regions?</div>";
		sb[sb.length] = "<div class='option'>";
		sb[sb.length] = "<div><label><input type='radio' name='motifReplaceOption' value='new'/>&nbsp;New</label></div>";
		sb[sb.length] = "<div><label><input type='radio' name='motifReplaceOption' value='old'/>&nbsp;Old</label></div>";
		sb[sb.length] = "<div><label><input type='radio' name='motifReplaceOption' value='discard'/>&nbsp;Discard new motif</label></div>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<label><input type='checkbox' checked=checked class='motifReplaceApplyToAllMotifMax' value='applytoall'/>&nbsp;Apply to all</label>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "</div>";
		$("#" + this._containerId).append(sb.join(""));
		console.log(this._containerId);
	},
	
	_initMotifConflictConfirmDialog : function() {
		var self = this;
		$("#" + self._motifConflictConfirmDialogId).dialog({
			autoOpen: false,
			width: 420,
			dialogClass : "motifConflictionDialog"
		});
	},
	
	_handleConfliction : function(conflictArray) {
		var self = this;
		if (conflictArray.length > 0) {
			var arr = conflictArray[0].split("|");
			var bArray = self._getConflictConfirmDialogButtonArray(conflictArray);
			var dialogTitle =  this.defaults.conflictionDialogTitle + " - " +  arr[0] + "[" + arr[1] + "]";
			$("#" + self._motifConflictConfirmDialogId).find("input[name='motifReplaceOption'][value='new']").attr("checked", "checked");
			var checkBox = $("#" + self._motifConflictConfirmDialogId).find("input[class='motifReplaceApplyToAllMotifMax']");
			$(checkBox).attr("checked",$(checkBox).is(':checked'));
			//$("#" + self._motifConflictConfirmDialogId).find(".motifReplaceApplyToAll").attr("checked", "checked");
			$("#" + self._motifConflictConfirmDialogId).dialog({title : dialogTitle});
			$("#" + self._motifConflictConfirmDialogId).dialog({buttons : bArray});
			$("#" + self._motifConflictConfirmDialogId).dialog("open");
		} else {
			$("#" + self._motifConflictConfirmDialogId).find("input[class='motifReplaceApplyToAllMotifMax']").attr("checked", "checked");	
		}
	},
	
	_getConflictConfirmDialogButtonArray : function(conflictArray) {
		var self = this;
		return [
				{
					text: "Done",
					click : function() {
						$(this).dialog("close");
						var option = $(this).find("input[name='motifReplaceOption']:checked").val();
						var isApplyToAll = $(this).find(".motifReplaceApplyToAll").is(":checked");
						self._replaceWithOption(option, isApplyToAll, conflictArray);
					}
				},
				{
					text: "Cancel",
					click : function() {
						$(this).dialog("close");
					}
				}
			];
	},
	
	_replaceWithOption : function(option, isApplyToAll, conflictArray) {
		var self = this;
		if (isApplyToAll) {
			self._replaceAllWithOption(option, conflictArray);
			$("#" + self._motifConflictConfirmDialogId).find(".motifReplaceApplyToAll").attr("checked", "checked");
		} else {
			var value = conflictArray.splice(0, 1);
			var arr = value[0].split("|");
			self._replaceSequenceByOption(option, arr[0], arr[1]);
			self._handleConfliction(conflictArray);
		}
	},
	
	_replaceAllWithOption : function(option, conflictArray) {
		var self = this, html = oldSequence;
		var oldSequence = $("#" + self._containerId + " ." + self.replaceSequenceClass).text();
		if (!oldSequence) {
			oldSequence = $("#" + self._containerId + " ." + self.resultAreaClass + " .baseSequence").html();
		}
		$.each(conflictArray, function(key, conflict) {
			var arr = conflict.split("|");
			self._replaceSequenceByOption(option, arr[0], arr[1]);
		});
	},
	
	_replaceSequenceByOption : function(option, seq, pos) {
		var self = this;
		var oldSequence = $("#" + self._containerId + " ." + self.replaceSequenceClass).text();
		if (!oldSequence) {
			oldSequence = $("#" + self._containerId + " ." + self.resultAreaClass + " .baseSequence").html();
		}
		var formattedSeq = self._appSequence.getFormattedSequence(self._baseSequenceLength, seq, pos);
		var seqArray = [formattedSeq];
		var newSequence = self._appSequence._getMergeCharSequence(seqArray);
		var html = oldSequence;
		if (option === "new") {
			html = self._appSequence.getHtmlByReplacingNewSequence(oldSequence, newSequence);
		} else if (option === "old") {
			html = self._appSequence.getHtmlByReplacingOldSequence(oldSequence, newSequence);
		}
		//self._doReplaceWithHtml(html);
		self.htmlRenderFunction.call(html);
	},
	
	_hasConfliction : function(seq, pos, oldSequence) {
		var self = this;
		if (!oldSequence) {
			oldSequence = $("#" + self._containerId + " ." + self._resultAreaClass + " .baseSequence").html();
		}
		var formattedSeq = self._appSequence.getFormattedSequence(self._baseSequenceLength, seq, pos);
		var array = [formattedSeq];
		var newSequence = self._appSequence._getMergeCharSequence(array);
		for (var i = 0; i < oldSequence.length; i++) {
			var oChar = oldSequence.charAt(i);
			var nChar = newSequence.charAt(i);
			if (nChar !== "-" && oChar !== "-" && nChar !== oChar) {
				return true;
			}
		}
		return false;
	},
}
*/
$(document).ready(function() {
	new Application.genocon();
});

body {
    font-family: sans-serif;
    font-size: 14px;
}

a {
    color: #3B5998;
    font-weight: bold;
    text-decoration: none;
}

#gcAppContainer {
	width: 900px;
}

.hidden {
	display:none;
}

.left {
    float: left;
}

.label {
	color: #E87B10;
    font: 1.1em "Trebuchet MS","Helvetica","Arial","Verdana","sans-serif";
    height: 24px;
    min-width: 125px;
}

input.baseSequence {
	/*width: 100%;*/
}

.highlight-sequence {
	font-weight: bold;
}

.resultArea {
    font-family: "Courier New","Lucida Console";
    margin: 10px 0;
    min-width: 410px;
    overflow: auto;
    width: 100%;
	background-color: #FFFFFF;
    border: 1px solid #DDDDDD;
	white-space: nowrap;
}

.resultArea .userSequence {
	white-space: nowrap;
	float: left;
}

.finishSequence,
.replaceSequence {
    background-color: #FFFFFF;
    border: 1px solid #DDDDDD;
    margin: 10px 0 0;
	font-family: "Courier New","Lucida Console";
	overflow: auto;
	/*word-wrap: break-word;*/
	white-space: nowrap;
	/*width:490px;*/
	/*height:100px;*/
	/*word-break: break-all;*/
}

.replace {
    color: #E80010;
}

.baseErrorMessage,
.errorMessage {
	color: #FF0000;
	text-align: center;
}

.errorText {
	color: #FF0000;
}

.applicationContainer {
    background-color: #F6F6F6;
    border: 1px solid #CCCCCC;
    margin: 5px 0 0;
    padding: 5px;
}

.actionButtonContainer {
    text-align: right;
}

.actionBtn {
    border: 1px solid #DDDDDD;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    padding: 5px 2px;
    text-align: center;
    width: 25px;
}

.row {
    padding: 5px 0;
}
.row:after {
    clear: left;
    content: "";
    display: block;
}
.row input[type="text"] {
    width: 200px;
}

.row .externalLink {
	margin: 0 5px;
}

.noborder {
    border: medium none;
}

#baseSequenceContainer .baseSequenceBox {
	width: 100%;
	overflow: auto;
	white-space: nowrap;
}
#baseSequenceContainer .baseSequenceBox span,
#baseSequenceContainer .baseSequenceBox .baseSequence {
	font-family: Courier;
}

#baseSequenceContainer .baseSequenceBox .fixedSequence {
	position: relative;
	left: -6px;
	color: #AAAAAA;
	font-weight: bold;
}

.applicationContainer .nextButtonContainer {
	margin-top: 10px;
}

.databaseInfo .motif {
	width: 70%;
}

/**
 * button css
 */

a.useButton {
	width: 80px;
}

.actionBtn {
	border: 1px solid #DDDDDD;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    padding: 5px 2px;
    text-align: center;
    width: 25px;
}

.actionBtn:hover {
	border: 1px solid #000000;
}

.btn {
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */

*zoom: 1;
  padding: 4px 10px 4px;
  margin-bottom: 0;
  font-size: 13px;
  line-height: 18px;
  color: #333333;
  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  background-color: #f5f5f5;
  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -ms-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(top, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  border: 1px solid #cccccc;
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  *margin-left: .3em;
}

.btn:hover,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
  background-color: #e6e6e6;
}

.btn:hover {
  color: #333333;
  text-decoration: none;
  background-color: #e6e6e6;
  background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
  -moz-transition: background-position 0.1s linear;
  -ms-transition: background-position 0.1s linear;
  -o-transition: background-position 0.1s linear;
  transition: background-position 0.1s linear;
}

.btn-blue,
.btn-blue:hover,
.btn-yellow,
.btn-yellow:hover,
.btn-red,
.btn-red:hover,
.btn-green,
.btn-green:hover,
.btn-lightblue,
.btn-lightblue:hover,
.btn-black,
.btn-black:hover {
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  color: #ffffff;
}

.btn-blue {
  background-color: #0074cc;
  background-image: -moz-linear-gradient(top, #0088cc, #0055cc);
  background-image: -ms-linear-gradient(top, #0088cc, #0055cc);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0055cc));
  background-image: -webkit-linear-gradient(top, #0088cc, #0055cc);
  background-image: -o-linear-gradient(top, #0088cc, #0055cc);
  background-image: linear-gradient(top, #0088cc, #0055cc);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0055cc', GradientType=0);
  border-color: #0055cc #0055cc #003580;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}

.btn-blue:hover,
.btn-blue:active,
.btn-blue.active,
.btn-blue.disabled,
.btn-blue[disabled] {
  background-color: #0055cc;
}

.btn-green {
  background-color: #5bb75b;
  background-image: -moz-linear-gradient(top, #62c462, #51a351);
  background-image: -ms-linear-gradient(top, #62c462, #51a351);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#51a351));
  background-image: -webkit-linear-gradient(top, #62c462, #51a351);
  background-image: -o-linear-gradient(top, #62c462, #51a351);
  background-image: linear-gradient(top, #62c462, #51a351);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#51a351', GradientType=0);
  border-color: #51a351 #51a351 #387038;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}
.btn-green:hover,
.btn-green:active,
.btn-green.active,
.btn-green.disabled,
.btn-green[disabled] {
  background-color: #51a351;
}
.btn-green:active,
.btn-green.active {
  background-color: #408140 ¥9;
}
.btn-lightblue {
  background-color: #49afcd;
  background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -ms-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
  background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: linear-gradient(top, #5bc0de, #2f96b4);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#2f96b4', GradientType=0);
  border-color: #2f96b4 #2f96b4 #1f6377;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}
.btn-lightblue:hover,
.btn-lightblue:active,
.btn-lightblue.active,
.btn-lightblue.disabled,
.btn-lightblue[disabled] {
  background-color: #2f96b4;
}

/* Dialog css */

.motifViewDialog .explanation {
	color: #AAAAAA;
	font-size: 12px;
	margin-left: 200px;
}

.motifViewDialog .moreInfo {
	color: #3B5998;
	cursor: pointer;
}

.motifViewDialog .position {
	width: 70px;
}

.motifViewDialog .dialogErrorMessage {
	font-size: 12px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 1px;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 1px;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 1px;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 1px;
}

.loadingImageContainer .loadingMessage {
	color: #FF0000;
}

.motifConflictionDialog .option {
	margin: 10px;
}

.motifViewDialog {
	margin-top: 10px;	
}

.motifViewDialog .label {
	color: #E87B10;
    font: 1.1em "Trebuchet MS","Helvetica","Arial","Verdana","sans-serif";
    height: 24px;
    width : 200px;
}

.motifViewDialog .motifviewinfo {
	float: right;
    margin-top: -150px;
    position: relative;
    width: 300px;	
}

.deletelink {
	cursor: pointer;	
}

.deletelink img {
	margin-bottom: -3px;	
}

.manualMotifView .manualMotifViewInfo {
	float: right;
    height: 50px;
    margin-right: 10px;
    margin-top: -65px;
    position: relative;
    width: 380px;
}

<div id="baseSequenceContainer">
	<div class="label">Base Sequence</div>
	<div class="baseSequenceBox">
		<span>
			<input type="text" class="baseSequence" size="500" value=""/>
		</span>
		<span class="fixedSequence">GACCCTTCCTCTATATAAGGAAGTTCATTTCATTTGGAGAGGACCTCGAC</span>
	</div>
	<div style="margin-top:5px;"><a class="useButton btn btn-green">Start</a></div>
	<div class="baseErrorMessage hidden"></div>
</div>
<div class="applicationContainer hidden">
	<div class="actionButtonContainer">
		<span class="appSummery"></span>
		<span class="collapseButton actionBtn" title="collapse">_</span>
		<span class="expandButton actionBtn" title="expand">+</span>
		<span class="removeButton actionBtn" title="remove">x</span>
		<br clear="all"/>
	</div>
	<div class="applicationDataContainer">
		<div class="row">
			<div class="label left">Select Database</div>
			<div class="left"><select class="databaseList"></select></div>
		</div>
		<div class="row">
			<div class="label left">Select Tool</div>
			<div class="left">
				<select class="optionList"></select>
				<span class="applicationOptionRadio hidden">
					<input type="radio" name="applicationOption" value="max" checked="checked"/>&nbsp;Max
					<input type="radio" name="applicationOption" value="min"/>&nbsp;Min
				</span>
			</div>
		</div>
		<div class="actionResultContainer"></div>
		<div class="nextButtonContainer hidden">
			<a class="btn nextButton">Next</a>
			<a class="btn finishNow">Finish Now</a>
		</div>
		<div class="finishSequence hidden"></div>
	</div>
</div>
</div>

Below is a description of the PromoterCAD Application.

Title: Synthetic Plant Promoter Design for Tissue/Time Specific Expression of Firefly Luciferase in Arabidopsis Plant Body

Name: RIKEN GenoCon

Affiliation: RIKEN The Institute of Physical and Chemical Research

Date: 2013-01-17

Abstract

PromoterCAD uses plant gene sequence and expression data to create synthetic promoters for tissue and time specific expression. The experimental test of such synthetic promoters will be to measure firefly Luciferase in Arabidopsis plant body. The program provides a graphical user interface (GUI), so anyone can design promoters using options in a series of select menus and push buttons. The program is written in JavaScript, on an open platform that allows for easy user customization.

The program provides several plugin tools for promoter designs MotifExpress, and MotifCircadian function, as well as LocusSelect function for graph visualization of expression data. MotifExpress picks up the sequence motifs from the gene with maximum/minimum expression in a specific developmental condition or time of day. MotifCircadian picks up the motifs with maximum circadian amplitude. Output includes visualization such as HighCharts graph visualization of expression data under experimental conditions (AtGenExpress) and time evolution of expression under circadian conditions (DIURNAL). Programmers can easily fork and add to these functions following the PromoterCAD manuals and help pages:

For detail of GenoCon2 Promoter Design Challenge, please see the Promoter Design Challenge page. If you are ready to submit a design to GenoCon2, please check the manual for Promoter Design Submission. If you want to learn more about the PromoterCAD software and data, check out the PromoterCAD homepage.