Publish your application｜Mash up the Linked Open Data

MotifMaxExpress2 = function(containerId, options) {
	new Application.motifMax(containerId, options);
};

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

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

Application.motifMax.prototype = {
	
	_containerId : null,
	_baseSequence : null,
	_options : null,
	_motifProperty : null,
	_heptamer : null,
	_octamer : null,
	_appSequence : null,
	_filteredSubjectList : null,
	_motifViewDialogId : null,
	_geneInfoContainerId : null,
	
	_default : {
		appName : "MotifMaxExpress2",
		selectPropertyCaption : "Select Property",
		selectPropertyAreaClass : "selectPropertyArea",
		selectPropertyClass : "selectProperty",
		resultAreaClass : "resultArea",
		replaceButtonAreaClass : "replaceButtonArea",
		replaceButtonClass : "replaceButton",
		nextButtonAreaClass : "nextButtonArea",
		replaceSequenceClass : "replaceSequence",
		errorMessageAreaClass : "errorMessage",
		dialogErrorMessageClass : "dialogErrorMessage",
		dialogOutRangeValueMessage : "Please input a value between {0} and {1}",
		databaseInfoClass : "databaseInfo",
		geneLabelClass : "geneUrl",
		geneInfoLinkClass : "geneInfoLink",
		motifSequenceProperty : "motif sequence",
		motifPositionProperty : "motif position",
		typeProperty : "type",
		validType : "REG",
		motifViewDialogId : "motifViewDialog",
		motifViewDialogClass : "motifViewDialog",
		motifViewDialogTitle : "Motif View",
		minSequenceClass : "minSeq",
		maxSequenceClass : "maxSeq",
		websiteNameAtted : "ATTED",
		websiteNamePpdb : "PPDB",
		baseSequenceMinLength : 50,
		dialogImageUrl : "http://app.linkdata.org/asset/a06f4de4.png",
		callback : function() {},
		loadingImageContainer : "loadingImageContainer",
		loadingImageUrl : "http://app.linkdata.org/asset/67556085.gif",
		loadingMessageClass : "loadingMessage",
		loadingMessage : "Loading linked data, it may take a few minutes..."
	},
	
	_tag : {
		topResult : "result_top",
		bottomResult : "result_bottom"
	},
	
	_init : function(containerId, options) {
		this._containerId = containerId;
		this._options = $.extend({}, this._default, options);
		this._baseSequence = this._options.baseSequence;
		this.filteredSubjectList = [];
		var date = new Date();
		this._geneInfoContainerId = "gene_info_containerId_" + date.getTime();
		this._initMotifProperty(this._options);
		this._initAppSequence(this._options);
		this._initHeptamer();
		this._initOctamer();
		this._initView();
		this._initMotifViewDialog();
	},
	
	_initMotifProperty : function(opts) {
		var obj = {
			workId : opts.workId,
			fileName : opts.fileName
		};
		this._motifProperty = new Application.motifProperty(obj);
	},
	
	_initAppSequence : function(opts) {
		var self = this;
		var timer = new Application.timer();
		var init = function() {
			var seqProperty = self._motifProperty.getPropertyByLabel(self._options.motifSequenceProperty);
			var posProperty = self._motifProperty.getPropertyByLabel(self._options.motifPositionProperty);
			if (seqProperty && posProperty) {
				var obj = {
					workId : opts.workId,
					fileName : opts.fileName,
					baseSequence : self._baseSequence,
					motifSequenceProperty : seqProperty,
					motifPositionProperty : posProperty,
					containerId : self._containerId,
					errorMessageClass : self._options.errorMessageAreaClass,
					baseSequenceMinLength : self._options.baseSequenceMinLength
				};
				self._appSequence = new Application.sequence(obj);
			} else {
				timer.call(init);
			}
		}
		init();
	},
	
	_initHeptamer : function() {
		this._heptamer = new Application.heptamer();
	},
	
	_initOctamer : function() {
		this._octamer = new Application.octamer();
	},
	
	_initView : function() {
		this._initMainView();
		this._initDialogView();
	},
	
	_initMainView : function() {
		var self = this;
		var timer = new Application.timer();
		var fillOptionMethod = function() {
			var optionArray = self._motifProperty.getOptionArray();
			if (optionArray) {
				var sb = [];
				sb[sb.length] = "<div class='" + self._options.selectPropertyAreaClass + " row'>";
				sb[sb.length] = "<div class='label left'>" + self._options.selectPropertyCaption + "</div>";
				sb[sb.length] = "<div class='left'>";
				sb[sb.length] = "<select class='" + self._options.selectPropertyClass + "'>";
				sb[sb.length] = "<option value='" + -1 + "'>-- Select Property --</option>";
				$.each(optionArray, function(key, obj) {
					sb[sb.length] = "<option value='" + obj.key + "'>" + obj.value + "</option>";
				});
				sb[sb.length] = "</select>";
				sb[sb.length] = "</div>";
				sb[sb.length] = "</div>";
				sb[sb.length] = "<div class='" + self._options.databaseInfoClass + " hidden'></div>";
				sb[sb.length] = "<div id='" + self._geneInfoContainerId + "'></div>";
				sb[sb.length] = "<div class='" + self._options.resultAreaClass + " hidden'></div>";
				sb[sb.length] = "<div class='" + self._options.errorMessageAreaClass + " hidden'>error</div>";
				sb[sb.length] = "<div class='" + self._options.replaceButtonAreaClass + " hidden'>";
				sb[sb.length] = "<a class='" + self._options.replaceButtonClass + " btn btn-lightblue'>Replace</a>";
				sb[sb.length] = "</div>";
				sb[sb.length] = "<div class='" + self._options.replaceSequenceClass + " hidden'></div>";
				sb[sb.length] = "<div class='" + self._options.loadingImageContainer + " hidden' align='center'>";
				sb[sb.length] = "<div class='" + self._options.loadingMessageClass + "'>" + self._options.loadingMessage + "</div>";
				sb[sb.length] = "<div>";
				sb[sb.length] = "<img src='" + self._options.loadingImageUrl + "'/>";
				sb[sb.length] = "</div>";
				sb[sb.length] = "</div>";
				$("#" + self._containerId).html(sb.join(""));
				self._initSelectPropertyListener();
			} else {
				timer.call(fillOptionMethod);
			}
		}
		fillOptionMethod();
	},
	
	_initDialogView : function() {
		var sb = [], self = this, date = new Date(); 
		this._motifViewDialogId = "motifViewDialog_id_" + self._containerId + "_" + date.getTime();
		sb[sb.length] = "<div id='" + this._motifViewDialogId + "' class='hidden'>";
		sb[sb.length] = "<input type='hidden' class='sequence'>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<span>Place motif at position</span>";
		sb[sb.length] = "<input type='text' class='position'/>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<span class='explanation'>Replace with prefer position between ";
		sb[sb.length] = "<span class='minSeq'></span> and <span class='maxSeq'>";
		sb[sb.length] = "</span>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<span>Number of extra copies</span>";
		sb[sb.length] = "<input type='text' class='extraCopies' value='0'/>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<span>Space between copies (Base Pairs)</span>";
		sb[sb.length] = "<input type='text' class='basePairs' value='0'/>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div class='motifImageArea'>";
		sb[sb.length] = "<img src='" + this._options.dialogImageUrl + "'/>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<span class='explanation'>Click ";
		sb[sb.length] = "<a class='moreInfo'>here</a> to see the additional information about motif from " + self._getDataBaseWebsiteName() + " website";
		sb[sb.length] = "</span>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div>";
		sb[sb.length] = "<span class='dialogErrorMessage errorMessage hidden'></span>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "</div>";
		$("#" + this._containerId).append(sb.join(""));
	},
	
	_initSelectPropertyListener : function() {
		var self = this, workId = self._options.workId, fileName = self._options.fileName;
		var timer = new Application.timer();
		var setSelectListener = function() {
			if ($("#" + self._containerId + " ." + self._options.selectPropertyClass).length != 0) {
				$("#" + self._containerId + " ." + self._options.selectPropertyClass).change(function() {
					$("#" + self._containerId + " ." + self._options.loadingImageContainer).show();
					self._appSequence.hideError();
					$("#" + self._containerId + " ." + self._options.resultAreaClass).hide();
					$("#" + self._containerId + " ." + self._options.replaceButtonAreaClass).hide();
					$("#" + self._containerId + " ." + self._options.replaceSequenceClass).hide();
					$("#" + self._containerId + " ." + self._options.databaseInfoClass).hide();
					$("#" + self._containerId + " #" + self._geneInfoContainerId).hide();
					var propLabel = $("option:selected", this).val();
					self._showMotifMaxSequence(workId, fileName, propLabel);
				});
			} else {
				timer.call(setSelectListener);
			}
		}
		setSelectListener();
	},
	
	_showGenePlot : function(subject, property) {
		var self = this;
		$("#" + self._containerId + " #" + self._geneInfoContainerId).show();
		var options = {
			workId : self._options.workId,
			fileName : self._options.fileName,
			subject : subject,
			property : property
		};
		new Application.geneChart(self._geneInfoContainerId, options);
	},
	
	_showDataBaseInformationList : function() {
		var self = this, seqVal = [];
		$("#" + self._containerId + " .userSequence .hdnSequence").each(function() {
			var tmpPos = $(this).siblings(".hdnPosition").val();
			seqVal.push($(this).val() + "[" + tmpPos + "]");
		});
		self._showDatabaseInfo(seqVal.join(", "));
	},
	
	_initReplaceButtonLitener : function() {
		var self = this, workId = self._options.workId, fileName = self._options.fileName;
		$("#" + self._containerId + " ." + self._options.replaceButtonClass).click(function() {
			self._appSequence.hideError();
			$("#" + self._containerId + " ." + self._options.replaceSequenceClass).show();
			var seqs = [];
			$("#" + self._containerId + " .userSequence").each(function() {
				seqs.push($(this).text());
			});
			var html = self._appSequence.replace(seqs);
			$("#" + self._containerId + " ." + self._options.replaceSequenceClass).html(html);
			self._showDataBaseInformationList();
			self._options.callback();
		});
	},
	
	_initMotifSequenceListener : function() {
		var self = this;
		$("#" + self._containerId + " .motifSequence").click(function() {
			$("." + self._options.motifViewDialogClass).hide();
			var parent = $(this).closest('.userSequence');
			var container = $(this).closest('.userSequence');
			var seq = $(parent).find(".hdnSequence").val();
			var pos = $(parent).find(".hdnPosition").val();
			var seqEl = self._getSeqElBySeq(seq);
			var appropriatePos = (seqEl && seqEl.getAppropriatePos()) ? seqEl.getAppropriatePos() : pos;
			self._initSequencePopup(seqEl);
			$("#" + self._motifViewDialogId + " ." + self._options.dialogErrorMessageClass).hide();
			$("#" + self._motifViewDialogId + " .sequence").val(seq);
			$("#" + self._motifViewDialogId + " .position").val(appropriatePos);
			$("#" + self._motifViewDialogId + " .extraCopies").val(0);
			$("#" + self._motifViewDialogId + " .basePairs").val(0);
			$("#" + self._motifViewDialogId + " .minSeq").html(self._getMinPosition(seq));
			$("#" + self._motifViewDialogId + " .maxSeq").html(self._getMaxPosition(seq));
			self._initPositionInsert(seq, appropriatePos);
			$("#" + self._motifViewDialogId).dialog({title: self._default.motifViewDialogTitle + " - " + seq});
			$("#" + self._motifViewDialogId).dialog("open");
			$("#" + self._motifViewDialogId).closest('.' + self._options.motifViewDialogClass).show();
		});
	},
	
	_initSequencePopup : function(seqEl) {
		var self = this;
		$("#" + self._motifViewDialogId + " .moreInfo").unbind("click");
		var url = (seqEl && seqEl.getExternalUrl()) ? seqEl.getExternalUrl() : "#";
		$("#" + self._motifViewDialogId + " .moreInfo").click(function() {
			self._showPopupWindow(url);
		});
	},
	
	_showPopupWindow : function(url) {
		var winWidth = 800;
		var winHeight = 800;
		var winLeft = parseInt((screen.availWidth/2) - (winWidth/2));
		var winTop = parseInt((screen.availHeight/2) - (winHeight/2));
		var winStyle = "width=" + winWidth + ",height=" + winHeight + ",left=" + winLeft + ",top=" + winTop + ",screenX=" + winLeft + ",screenY=" + winTop + ",scrollbars=1";
		window.open(url, "Motif", winStyle);
	},
	
	_initPositionInsert : function(seq, pos) {
		var self = this;
		var mod = seq.length % 2;
		$("#" + self._motifViewDialogId + " .position").unbind("keyup");
		$("#" + self._motifViewDialogId + " .position").keyup(function() {
			var val = $(this).val();
			if (isNaN(val)) {
				$(this).val(pos);
				return;
			}
			var tmpVal = new String(val);
			if (mod == 0) {
				if (tmpVal.indexOf(".") == -1) {
					$(this).val(tmpVal + ".5");
				} else {
					$(this).val(tmpVal.split(".")[0] + ".5");
				}
			} else {
				if (tmpVal.indexOf(".") > -1) {
					$(this).val(tmpVal.split(".")[0]);
				}
			}
		});
	},
	
	_initMotifViewDialog : function() {
		var self = this;
		$("#" + self._motifViewDialogId).dialog({
			autoOpen: false,
			title: self._default.motifViewDialogTitle,
			width: 520,
			dialogClass : self._options.motifViewDialogClass,
			buttons : [
				{
					text: "Replace",
					click : function() {
						var seq = $("#" + self._motifViewDialogId).find(".sequence").val();
						var pos = $("#" + self._motifViewDialogId).find(".position").val();
						var extraCopies = parseInt($("#" + self._motifViewDialogId).find(".extraCopies").val());
						var basePairs = parseInt($("#" + self._motifViewDialogId).find(".basePairs").val());
						var minPos = parseFloat($("#" + self._motifViewDialogId).find(".minSeq").html());
						var maxPos = parseFloat($("#" + self._motifViewDialogId).find(".maxSeq").html());
						if (minPos > pos || maxPos < pos) {
							$dialogError = $("#" + self._motifViewDialogId + " ." + self._options.dialogErrorMessageClass);
							$dialogError.html(self._options.dialogOutRangeValueMessage.replace("{0}", minPos).replace("{1}", maxPos));
							$dialogError.show();
							return;
						}
						self._appSequence.hideError();
						self._replaceWithSequence(seq, pos, extraCopies, basePairs);
						$(this).dialog("close");
					}
				},
				{
					text: "Cancel",
					click : function() {
						$(this).dialog("close");
					}
				}
			]
		});
	},
	
	_getMotifMaxTriple : function(workId, fileName, property) {
		var self = this;
		var index = new Application.index(1, 8000);
		var maxTriple;
		var getTriplesByProperty = function(tripleList) {
			var maxIndex = -1;
			var maxValue = -99999;
			$.each (tripleList, function(tKey, tValue) {
				var tmpValue = parseFloat(tValue.object);
				if (Math.max(tmpValue, maxValue) != maxValue) {
					maxValue = tmpValue;
					maxIndex = tKey;
				}
			});
			if (maxIndex != -1) {
				if (!maxTriple) {
					maxTriple = tripleList[maxIndex];
				}
				var tmpMaxValue = parseFloat(maxTriple.object);
				var currentValue = parseFloat(tripleList[maxIndex].object);
				if (Math.max(tmpMaxValue, currentValue) != tmpMaxValue) {
					maxTriple = tripleList[maxIndex];
				}	
			}
			if (tripleList && tripleList.length == index.getItemCount()) {
				LinkData.getTriplesByProperty(workId, fileName, property, getTriplesByProperty, index.increment());
			} else {
				self._motifMaxSequence(workId, fileName, maxTriple.subject, property);
			}
		}
		LinkData.getTriplesByProperty(workId, fileName, property, getTriplesByProperty, index.getIndex());
	},
	
	_showMotifMaxSequence : function(workId, fileName, propLabel) {
		var self = this, foundTopFile = false;
		var getFilesByTag = function(resultList) {
			$.each(resultList, function(wId, fileList) {
				$.each(fileList, function(fileKey, fName) {
					var tmpName = fName.split("_top");
					if (fileName.indexOf(tmpName[0]) > -1) {
						self._getTopFilePropertyList(workId, fileName, wId, fName, propLabel);
						foundTopFile = true;
						return false;
					}
				});
			});
			if (!foundTopFile) {
				var property = self._motifProperty.getPropertyByLabel(propLabel);
				self._getMotifMaxTriple(workId, fileName, property);
			}
		}
		LinkData.getFilesByTag(null, self._tag.topResult, getFilesByTag);
	},
	
	_getTopFilePropertyList : function(workId, fileName, topWorkId, topFileName, propLabel) {
		var self = this;
		var getProperties = function(propList) {
			$.each(propList, function(propKey, propValue) {
				var tmpProperty = self._motifProperty._getLabel(propValue);
				if (tmpProperty.indexOf(propLabel) > -1) {
					var property = self._motifProperty.getPropertyByLabel(propLabel);
					self._showMotifMax(workId, fileName, property, topWorkId, topFileName, propValue);
					return false;
				}
			});
		}
		LinkData.getProperties(topWorkId, topFileName, getProperties);
	},
	
	_showMotifMax : function(workId, fileName, property, topWorkId, topFileName, topProperty) {
		var self = this;
		var index = new Application.index(1, 1000);
		var getTriplesByProperty = function(tripleList) {
			self._showMotifMaxByTripleList(workId, fileName, property, tripleList);
		}
		LinkData.getTriplesByProperty(topWorkId, topFileName, topProperty, getTriplesByProperty, index.getIndex());
	},
	
	_showMotifMaxByTripleList : function(workId, fileName, property, tripleList) {
		var self = this, i = 0, subject = tripleList[i].object;
		var posProperty = self._motifProperty.getPropertyByLabel(self._options.motifPositionProperty);
		var showMaxMotif = function(posTripleList) {
			var found = false;
			i++;
			$.each(posTripleList, function(pKey, pValue) {
				var tmpPos = parseInt(pValue);
				if (self._options.baseSequenceMinLength < tmpPos && self._options.baseSequence.length >= tmpPos) {
					found = true;
					self._motifMaxSequence(workId, fileName, subject, property);
					return false;
				}
			});
			if (! found) {
				subject = tripleList[i].object;
				LinkData.getObjects(workId, fileName, subject, posProperty, showMaxMotif);
			}
		}
		LinkData.getObjects(workId, fileName, subject, posProperty, showMaxMotif);
	},
	
	_getDataBaseWebsiteName : function() {
		var self = this;
		var fileName = self._options.fileName
		if (fileName.indexOf(self._options.websiteNameAtted) > -1) {
			return self._options.websiteNameAtted;
		} else if (fileName.indexOf(self._options.websiteNamePpdb) > -1) {
			return self._options.websiteNamePpdb;
		} else {
			return "UNKNOWN";
		}
	},
	
	_motifMaxSequence : function(workId, fileName, subject, property) {
		var self = this;
		var drawSequence = function(seqHtml) {
			var sb = [];
			sb[sb.length] = "<input type='hidden' class='" + self._default.geneLabelClass + "' value='" + subject + "'/>";
			sb[sb.length] = "<div class='baseSequence'>" + self._baseSequence + "</div>";
			sb[sb.length] = seqHtml;
			$("#" + self._containerId + " ." + self._options.resultAreaClass).html(sb.join(""));
			if (seqHtml.length == 0) {
				$("#" + self._containerId + " ." + self._options.replaceButtonAreaClass).hide();
			}
			self._initMotifSequenceListener();
			self._initReplaceButtonLitener();
			self._showDataBaseInformationList();
			self._showGenePlot(subject, property);
			$("#" + self._containerId + " ." + self._options.resultAreaClass).show();
			$("#" + self._containerId + " ." + self._options.replaceButtonAreaClass).show();
			$("#" + self._containerId + " ." + self._options.loadingImageContainer).hide();
		}
		self._appSequence.getSequenceHtml(subject, drawSequence);
	},
	
	_getMinPosition : function(seq) {
		var self = this;
		var mod = seq.length % 2;
		var tHold = (mod == 1) ? 1 : 0.5;
		return self._default.baseSequenceMinLength + Math.floor(seq.length / 2) + tHold;
	},
	
	_getMaxPosition : function(seq) {
		var self = this;
		var mod = seq.length % 2;
		var tHold = (mod == 1) ? 0 : 0.5;
		return self._baseSequence.length - 1 - Math.floor(seq.length / 2) + tHold;
	},
	
	_getSeqElBySeq : function(seq) {
		if (seq && seq.trim().length == 7) {
			return this._heptamer.getBySequence(seq);
		} else if (seq && seq.trim().length == 8) {
			return this._octamer.getBySequence(seq);
		}
	},
	
	_showDatabaseInfo : function(seqVal) {
		var self = this, fileName = self._options.fileName, appName = self._options.appName;
		var propLabel = $("option:selected", "#" + self._containerId + " ." + self._options.selectPropertyClass).val();
		var subject = $("#" + self._containerId + " ." + self._options.geneLabelClass).val();
		var label = self._motifProperty._getDisplayLabel(propLabel);
		label = (label && label.trim().length != 0) ? label : propLabel;
		var usedMotif = (seqVal.length != 0) ? seqVal : "-";
		var dbInfoHtml = self._getDatabaseInfo(fileName, appName, subject, label, usedMotif);
		$("#" + self._containerId + " ." + self._options.databaseInfoClass).html(dbInfoHtml);
		$("#" + self._containerId + " ." + self._options.databaseInfoClass).show();
		self._genePreviewListener(subject);
	},
	
	_genePreviewListener : function(subject) {
		var self = this;
		$("#" + self._containerId + " ." + self._options.geneInfoLinkClass).click(function() {
			self._showPopupWindow(subject);
		});
	},
	
	_getDatabaseInfo : function(fileName, method, subject, property, motif) {
		var self = this;
		var gene = self._motifProperty.getGeneBySubject(subject);
		var sb = [];
		sb[sb.length] = "<div class='row'>";
		sb[sb.length] = "<div class='label left'>Database</div>";
		sb[sb.length] = "<div class='left'>" + fileName + "</div>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div class='row'>";
		sb[sb.length] = "<div class='label left'>Application</div>";
		sb[sb.length] = "<div class='left'>" + method + "</div>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div class='row'>";
		sb[sb.length] = "<div class='label left'>Gene Locus</div>";
		sb[sb.length] = "<div class='left'><a href='javascript:void(0);' class='" + self._options.geneInfoLinkClass + "'>" + gene + "</a></div>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div class='row'>";
		sb[sb.length] = "<div class='label left'>Property</div>";
		sb[sb.length] = "<div class='left'>" + property + "</div>";
		sb[sb.length] = "</div>";
		sb[sb.length] = "<div class='row'>";
		sb[sb.length] = "<div class='label left'>Motif</div>";
		sb[sb.length] = "<div class='left motif'>" + motif + "</div>";
		sb[sb.length] = "</div>";
		return sb.join("");
	},
	
	_replaceWithSequence : function(seq, pos, extraCopies, basePairs) {
		var self = this;
		var html = self._appSequence.replaceWith(seq, pos, extraCopies, basePairs);
		$("#" + self._containerId + " ." + self._options.replaceSequenceClass).html(html);
		$("#" + self._containerId + " ." + self._options.replaceSequenceClass).show();
		var seqLabel = seq + "[" + pos + "]";
		self._showDatabaseInfo(seqLabel);
		self._options.callback();
	}
	
};

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

Application.geneChart.prototype = {
	
	_containerId : null,
	_options : null,
	_workId : null,
	_fileName : null,
	_subject : null,
	_property : null,
	_highChartContainerId : null,
	_appProperty : null,
	
	_default : {
		filterNamespace : "http://linkdata.org/",
		acceptPropLabelPrefix : "label:"
	},
	
	_init : function(containerId, options) {
		this._containerId = containerId;
		this._options = $.extend({}, this._default, options);
		this._workId = this._options.workId;
		this._fileName = this._options.fileName;
		this._subject = this._options.subject;
		this._property = this._options.property;
		var date = new Date();
		this._highChartContainerId = "gene_chart_" + date.getTime();
		this._initAppProperty(this._options);
		this._initView();
		this._drawHighChart(this._subject, this._property);
	},
	
	_initAppProperty : function(opts) {
		var obj = {
			workId : opts.workId,
			fileName : opts.fileName
		};
		this._appProperty = new Application.motifProperty(obj);
	},
	
	_initView : function() {
		var self = this;
		var sb = [];
		sb[sb.length] = "<div id='" + self._highChartContainerId + "'></div>";
		$("#" + self._containerId).html(sb.join(""));
	},
	
	_ignore : function(label) {
		var self = this;
		if (label.indexOf(self._default.acceptPropLabelPrefix) > -1) {
			return false;
		}
		return true;
	},
	
	_getDisplayLabel : function(value) {
		var self = this;
		var propLabel = value;
		var arr = value.split(self._default.acceptPropLabelPrefix);
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
		}
		return propLabel;
	},
	
	_drawHighChart : function(subject, highlightProperty) {
		var self = this;
		var getDataArray = function(tripleList) {
			var dataArray = [];
			var dataObject = {};
			var array = [];
			var duplicateProperty = [];
			$.each (tripleList, function(tKey, tValue) {
				var property = tValue.property;
				if (property.indexOf(self._options.filterNamespace) == -1) {
					return;
				}
				if ($.inArray(property, duplicateProperty) > -1) {
					return;
				}
				var label = self._getLabelAfterHash(property);
				if (!self._ignore(label)) {
					var val = parseFloat(tValue.object);
					if (highlightProperty === property) {
						val = self._getHighLightColumn(parseFloat(tValue.object));
					}
					array.push(val);
					duplicateProperty.push(property);
				}
			});
			dataObject.name = self._getLabel(subject);
			dataObject.data = array;
			dataArray.push(dataObject);
			self._getXCategory(tripleList, dataArray, highlightProperty);
		}
		LinkData.getTriplesBySubject(self._workId, self._fileName, subject, getDataArray);
	},
	
	_getXCategory : function(tripleList, dataArray, highlightProperty) {
		var self = this;
		var array = [];
		var duplicateProperty = [];
		var hLabel = self._getLabelAfterHash(highlightProperty);
		$.each (tripleList, function(tKey, tValue) {
			var property = tValue.property;
			if (property.indexOf(self._options.filterNamespace) == -1) {
				return;
			}
			if ($.inArray(property, duplicateProperty) > -1) {
				return;
			}
			var label = self._getLabelAfterHash(property);
			if (!self._ignore(label)) {
				var displayLabel = self._getDisplayLabel(label);
				var hDisplayLabel = self._getDisplayLabel(hLabel);
				if (displayLabel === hDisplayLabel) {
					displayLabel = "<span style=\"color:#FB3B44\">" + hDisplayLabel + "</span>";
				}
				array.push(displayLabel);
				duplicateProperty.push(property);
			}
		});
		self._drawChart(self._highChartContainerId, dataArray, array);
	},
	
	_getHighLightColumn : function(val) {
		var obj = {};
		obj.y = val;
		obj.marker = {
			lineWidth: 3,
			lineColor: "#FB3B44",
			fillColor: "#FB3B44"
		};
		return obj;
	},
	
	_drawChart : function(containerId, dataArray, xCategory) {
		var self = this;
		var chart = new Highcharts.Chart({
			chart: {
				renderTo: containerId,
				type: 'line',
				marginRight: 130,
				marginBottom: 125
			},
			title: {
				text: self._fileName
			},
			xAxis: {
				categories: xCategory,
				labels : {
					rotation: 315
				}
			},
			tooltip: {
				formatter: function() {
					return '<b>'+ this.series.name + '</b><br/>' + this.x + ' [' + this.y + ']';
				}
			},
			legend: {
				layout: 'vertical',
				align: 'right',
				verticalAlign: 'top',
				x: -10,
				y: 100,
				borderWidth: 0
			},
			series: dataArray
 		});
	},
	
	_getLabel : function(value) {
		var self = this, label;
		if (value.indexOf("#") > -1) {
			label = self._getLabelAfterHash(value);
		} else {
			label = self._appProperty.getGeneBySubject(value);
		}
		if (!label) {
			label = value;
		}
		return label;
	},
	
	_getPropertyLabel : function(value) {
		var propLabel = value;
		var arr = value.split("#");
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
			propLabel = this._appProperty.getPropertyNameByLabel(propLabel);
		}
		return propLabel;
	},
	
	_getLabelAfterHash : function(value) {
		var propLabel = value;
		var arr = value.split("#");
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
		}
		return propLabel;
	}
	
};

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

Application.motifProperty.prototype = {

_options : null,
	_propMap : null,
	_nameMap : null,
	_optionArray : null,
	
	_default : {
		acceptPropLabelPrefix : "label:",
		subjectATTEDUriPhrase : "http://atted.jp/data/locus/",
		subjectPPDBUriPhrase : "http://ppdb.agr.gifu-u.ac.jp/ppdb/cgi-bin/display.cgi?organism=At&gene="
	},
	
	_init : function(options) {
		this._options = $.extend({}, this._default, options);
		this._propMap = [];
		this._nameMap = [];
		this._initPropMap(this._options);
	},
	
	_initPropMap : function(opts) {
		var self = this, workId = opts.workId, fileName = opts.fileName;
		var method = function(properties) {
			self._fillPropMap(self, properties);
			self._initOptionArray(properties);
		}
		LinkData.getProperties(workId, fileName, method);
	},
	
	_fillPropMap : function(self, properties) {
		$.each(properties, function(key, value) {
			var label = self._getLabel(value);
			if (!self._propMap[label]) {
				self._propMap[label] = value;
			}
		});
	},
	
	_initOptionArray : function(propertyList) {
		var self = this, list = new Object();
		var workId = self._options.workId, fileName = self._options.fileName;
		self._optionArray = [];
		$.each(propertyList, function(key, value) {
			var propLabel = self._getLabel(value);
			if (!self._ignore(propLabel)) {
				var obj = {};
				obj.key = propLabel;
				obj.value = self._getDisplayLabel(propLabel);
				self._optionArray.push(obj);
			}
		});
	},
	
	_ignore : function(label) {
		var self = this;
		if (label.indexOf(self._default.acceptPropLabelPrefix) > -1) {
			return false;
		}
		return true;
	},
	
	_getDisplayLabel : function(value) {
		var self = this;
		var propLabel = value;
		var arr = value.split(self._default.acceptPropLabelPrefix);
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
		}
		return propLabel;
	},
	
	_getLabel : function(value) {
		var propLabel = value;
		var arr = value.split("#");
		if (arr.length > 1) {
			propLabel = decodeURIComponent(arr[1]);
		}
		return propLabel;
	},

getOptionArray : function() {
		return this._optionArray;
	},
	
	getPropertyByLabel : function(label) {
		return this._propMap[label];
	},
	
	getGeneBySubject : function(subject) {
		var self = this, htmlExt = ".html", geneLabel;
		if (subject.indexOf(self._default.subjectATTEDUriPhrase) > -1) {
			geneLabel = subject.replace(self._default.subjectATTEDUriPhrase, "");
		} else if (subject.indexOf(self._default.subjectPPDBUriPhrase) > -1) {
			geneLabel = subject.replace(self._default.subjectPPDBUriPhrase, "");
		}
		if (geneLabel && geneLabel.indexOf(htmlExt) > -1) {
			geneLabel = geneLabel.replace(htmlExt, "");
		}
		return geneLabel;
	}
	
};

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

Application.sequence.prototype = {
	
	CHAR_SEQ_EMPTY : "-",
	
	_options : null,
	_workId : null,
	_fileName : null,
	_seqProperty : null,
	_posProperty : null,
	_baseSequence : null,
	_sequenceList : null,
	_positionList : null,
	_containerId : null,
	_errorContainerClass : null,
	_outOfRangeArray : null,
	
	_default : {
		msgInvalidSequence: "invalid sequence.",
		msgOutOfRangeSequence: "out of range sequence : {0}",
	},
	
	_init : function(options) {
		this._options = options;
		this._workId = this._options.workId;
		this._fileName = this._options.fileName;
		this._seqProperty = this._options.motifSequenceProperty;
		this._posProperty = this._options.motifPositionProperty;
		this._baseSequence = this._options.baseSequence;
		this._containerId = this._options.containerId;
		this._errorContainerClass = this._options.errorMessageClass;
	},
	
	_getCustomSequenceHtml : function(baseSequence, sequence, position) {
		var seqLen = sequence.length;
		var tHold = Math.floor(seqLen / 2) + 1;
		var pos = parseInt(position);
		var baseSeqLen = baseSequence.length;
		var suffixLen = baseSeqLen - tHold - pos;
		var sb = [];
		if (pos > this._options.baseSequenceMinLength && suffixLen > 0) {
			for (var i = 0; i < suffixLen; i++) {
				sb.push(this.CHAR_SEQ_EMPTY);
			}
			sb.push("<a href='javascript:void(0)' class='motifSequence'>" + sequence + "</a>");
			sb.push("<input type='hidden' class='hdnSequence' value='" + sequence + "'/>");
			sb.push("<input type='hidden' class='hdnPosition' value='" + pos + "'/>");
		} else {
			//_showError($appContainer, opts.msgOutOfRangeSequence.replace("{0}", sequence));
			this._outOfRangeArray.push(sequence + "[" + pos + "]");
			this._showError(this._default.msgOutOfRangeSequence.replace("{0}", this._outOfRangeArray.join(", ")));
		}
		return sb.join("");
	},
	
	_isValidSequenceList : function(seqs) {
		var count = seqs.length;
		var maxlength = 0;
		for (var i = 0; i < count; i++) {
			if (seqs[i].length > maxlength) {
				maxlength = seqs[i].length;
			}
		}
		var result = true;
		for (var i = 0; i < maxlength; i++) {
			var chars = [];
			for (var j = 0; j < count; j++) {
				chars.push(seqs[j].charAt(i));
			}
			if (! this._isValidChars(chars.join(""))) {
				result = false;
				break;
			}
		}
		return result;
	},
	
	_isValidChars : function(charString) {
		var charLen = charString.length;
		var result = true;
		var first = null;
		for (var i = 0; i < charLen; i++) {
			if (charString.charAt(i) == this.CHAR_SEQ_EMPTY) {
				continue;
			}
			if (! first) {
				first = charString.charAt(i);
			}
			var current = charString.charAt(i);
			if (current && first != current) {
				result = false;
				break;
			}
		}
		return result;
	},
	
	_getReplacedCustomSequence : function(seqs) {
		var mergeSequence = this._getmergeCharSequence(seqs);
		var maxlength = this._baseSequence.length;
		
		var sb = [];
		for (var i = 0; i < maxlength; i++) {
			var bChar = this._baseSequence.charAt(i);
			var mChar = mergeSequence.charAt(i);
			if (mChar !== this.CHAR_SEQ_EMPTY) {
				// replaced
				sb.push(mChar);
			} else {
				sb.push(bChar);
			}
		}
		
		return sb.join("");
	},
	
	_getmergeCharSequence : function(seqs) {
		var count = seqs.length;
		var maxlength = this._baseSequence.length;
		var sb = [];
		for (var i = 0; i < maxlength; i++) {
			var chars = [];
			for (var j = 0; j < count; j++) {
				chars.push(seqs[j].charAt(i) ? seqs[j].charAt(i) : this.CHAR_SEQ_EMPTY);
			}
			sb.push(this._getMergeChar(chars.join("")));
		}
		return sb.join("");
	},
	
	_getMergeChar : function(charString) {
		var charLen = charString.length;
		var result = null;
		for (var i = 0; i < charLen; i++) {
			if (charString.charAt(i) !== this.CHAR_SEQ_EMPTY) {
				result = charString.charAt(i);
				break;
			}
		}
		if (!result) {
			result = this.CHAR_SEQ_EMPTY;
		}
		return result;
	},
	
	_wrappedReplacedSequenceHtml : function(replaceSequence, seqs) {
		var mergeSequence = this._getmergeCharSequence(seqs);
		var length = this._baseSequence.length;
		var sb = [];
		for (var i = 0; i < length; i++) {
			var bChar = this._baseSequence.charAt(i);
			var rChar = replaceSequence.charAt(i);
			var mChar = mergeSequence.charAt(i);
			var seqChar = (bChar !== rChar) ? "<span class='replace'>" + rChar + "</span>" : rChar;
			if (mChar !== this.CHAR_SEQ_EMPTY) {
				sb.push("<span class='highlight-sequence'>" + seqChar + "</span>");
			} else {
				sb.push(seqChar);
			}
		}
		return sb.join("");
	},
	
	_showError : function(message) {
		$errorMessageContainer = $("#" + this._containerId + " ." + this._errorContainerClass);
		$errorMessageContainer.html(message);
		$errorMessageContainer.show();
	},
	
	getSequenceHtml : function(subject, drawSequence) {
		var self = this;
		self._outOfRangeArray = [];
		var sb = [], baseSequence = self._baseSequence;
		var getTriplesBySequenceProperty = function(sequenceList) {
			self._getTriplesBySequenceProperty(subject, drawSequence, sequenceList);
		}
		LinkData.getObjects(self._workId, self._fileName, subject, self._seqProperty, getTriplesBySequenceProperty);
	},
	
	_getTriplesBySequenceProperty : function(subject, drawSequence, sequenceList) {
		var self = this;
		var getTriplesByPositionProperty = function(positionList) {
			self._drawSequenceList(drawSequence, sequenceList, positionList);
		}
		LinkData.getObjects(self._workId, self._fileName, subject, self._posProperty, getTriplesByPositionProperty);
	},
	
	_drawSequenceList : function(drawSequence, sequenceList, positionList) {
		var self = this, sb = [];
		if (!sequenceList || sequenceList.length == 0) {
			return;
		}
		for (var i = 0; i < sequenceList.length; i++) {
			var customSeqString = self._getCustomSequenceHtml(self._baseSequence, sequenceList[i], positionList[i]);
			if (customSeqString.length > 0) {
				sb.push("<div class='userSequence'>" + customSeqString + "</div>");
			}
		}
		drawSequence(sb.join("\n"));
	},
	
	replace : function(seqs) {
		var isValid = this._isValidSequenceList(seqs);
		if (isValid) {
			if (seqs.length > 0) {
				var replaceSeq = this._getReplacedCustomSequence(seqs);
				var replaceSeqHtml = this._wrappedReplacedSequenceHtml(replaceSeq, seqs);
				return replaceSeqHtml;
			}
		} else {
			this._showError(this._default.msgInvalidSequence);
		}
	},
	
	replaceWith : function(seq, pos, extraCopies, basePairs) {
		var main = [];
		var seqLen = seq.length;
		var tHold = Math.floor(seqLen / 2) + 1;
		var pos = parseInt(pos);
		var baseSeqLen = this._baseSequence.length;
		var len = baseSeqLen - tHold - pos;
		for (var j = 0; j < extraCopies + 1; j++) {
			var array = [];
			for (var i = 0; i < len; i++) {
				array.push(this.CHAR_SEQ_EMPTY);
			}
			array.push(seq);
			main.push(array.join(""));
			len = len - seqLen - basePairs;
			if (len < 0) {
				break;
			}
		}
		return this.replace(main);
	},
	
	hideError : function() {
		$errorMessageContainer = $("#" + this._containerId + " ." + this._errorContainerClass).hide();
	}
	
};

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

Application.heptamer.prototype = {
	
	_heptamerMap : null,
	_motifSequenceProperty : null,
	_appropriatePositionProperty : null,
	
	_default : {
		heptamerTag : "heptamer",
		filterSequencePropertyPhrase : "motif_sequence",
		filterMaxCEGPropertyPhrase : "maxCEG",
		filterAppropriatePosition : "Appropriateposition(%C2%B1%2040%20bp)"
	},
	
	_init : function() {
		this._heptamerMap = [];
		this._initHeptamerList();
	},
	
	_initHeptamerList : function() {
		var self = this;
		var getFilesByTag = function(result) {
			$.each(result, function(workId, fileList) {
				$.each(fileList, function(fileKey, fileName) {
					self._initHeptamer(workId, fileName);
					return false;
				});
			});
		}
		LinkData.getFilesByTag(null, self._default.heptamerTag, getFilesByTag);
	},
	
	_initHeptamer : function(workId, fileName) {
		var self = this;
		var getPropertyList = function(propertyList) {
			self._initProperty(propertyList);
			self._getSequenceTriple(workId, fileName);
		}
		LinkData.getProperties(workId, fileName, getPropertyList);
	},
	
	_initProperty : function(propertyList) {
		var self = this;
		$.each(propertyList, function(propKey, propValue) {
			if (propValue.indexOf(self._default.filterSequencePropertyPhrase) > -1) {
				self._motifSequenceProperty = propValue;
			} else if (propValue.indexOf(self._default.filterAppropriatePosition) > -1) {
				self._appropriatePositionProperty = propValue;
			}
		});
	},
	
	_getSequenceTriple : function(workId, fileName) {
		var self = this;
		var getSequenceTripleList = function(sequenceTripleList) {
			self._fillHeptamerMap(workId, fileName, sequenceTripleList);
		}
		LinkData.getTriplesByProperty(workId, fileName, self._motifSequenceProperty, getSequenceTripleList);
	},
	
	_fillHeptamerMap : function(workId, fileName, sequenceTripleList) {
		var self = this;
		var getPositionTripleList = function(positionTripleList) {
			for (var i = 0; i < sequenceTripleList.length; i++) {
				var seqTriple = sequenceTripleList[i];
				var posTriple = positionTripleList[i];
				var seqEl = new Application.seqElement();
				seqEl.setExternalUrl(seqTriple.subject);
				seqEl.setSequence(seqTriple.object);
				seqEl.setAppropriatePos(posTriple.object);
				self._heptamerMap[seqTriple.object] = seqEl;
			}
		}
		LinkData.getTriplesByProperty(workId, fileName, self._appropriatePositionProperty, getPositionTripleList);
	},
	
	getBySequence : function(sequence) {
		return this._heptamerMap[sequence];
	}
	
};

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

Application.octamer.prototype = {
	
	_octamerMap : null,
	_motifSequenceProperty : null,
	_appropriatePositionProperty : null,
	
	_default : {
		octamerTag : "octamer",
		filterSequencePropertyPhrase : "sequence",
		filterAppropriatePosition : "Appropriate%20position"
	},
	
	_init : function() {
		this._octamerMap = [];
		this._initOctamerList();
	},
	
	_initOctamerList : function() {
		var self = this;
		var getFilesByTag = function(result) {
			$.each(result, function(workId, fileList) {
				$.each(fileList, function(fileKey, fileName) {
					self._initOctamer(workId, fileName);
					return false;
				});
			});
		}
		LinkData.getFilesByTag(null, self._default.octamerTag, getFilesByTag);
	},
	
	_initOctamer : function(workId, fileName) {
		var self = this;
		var getProperties = function(propertyList) {
			self._initProperty(propertyList);
			self._getSequenceTriple(workId, fileName);
		}
		LinkData.getProperties(workId, fileName, getProperties);
	},
	
	_initProperty : function(propertyList) {
		var self = this;
		$.each(propertyList, function(propKey, propValue) {
			if (propValue.indexOf(self._default.filterSequencePropertyPhrase) > -1) {
				self._motifSequenceProperty = propValue;
			} else if (propValue.indexOf(self._default.filterAppropriatePosition) > -1) {
				self._appropriatePositionProperty = propValue;
			}
		});
	},
	
	_getSequenceTriple : function(workId, fileName) {
		var self = this;
		var getSequenceTripleList = function(sequenceTripleList) {
			self._fillOctamerMap(workId, fileName, sequenceTripleList);
		}
		LinkData.getTriplesByProperty(workId, fileName, self._motifSequenceProperty, getSequenceTripleList);
	},
	
	_fillOctamerMap : function(workId, fileName, sequenceTripleList) {
		var self = this;
		var getPositionTripleList = function(positionTripleList) {
			for (var i = 0; i < sequenceTripleList.length; i++) {
				var j = Math.floor(i / 2);
				var seqTriple = sequenceTripleList[i];
				var posTriple = positionTripleList[j];
				var seqEl = new Application.seqElement();
				seqEl.setExternalUrl(seqTriple.subject);
				seqEl.setSequence(seqTriple.object);
				seqEl.setAppropriatePos(posTriple.object);
				self._octamerMap[seqTriple.object] = seqEl;
			}
		}
		LinkData.getTriplesByProperty(workId, fileName, self._appropriatePositionProperty, getPositionTripleList);
	},
	
	getBySequence : function(sequence) {
		return this._octamerMap[sequence];
	}
	
};

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

Application.seqElement.prototype = {
	
	_externalUrl : null,
	_sequence : null,
	_appropriatePos : null,
	
	_init : function() {},
	
	getExternalUrl : function() {
		return this._externalUrl;
	},

setExternalUrl : function(externalUrl) {
		this._externalUrl = externalUrl;
	},
	
	getSequence : function() {
		return this._sequence;
	},
	
	setSequence : function(sequence) {
		this._sequence = sequence;
	},
	
	getAppropriatePos : function() {
		return this._appropriatePos;
	},
	
	setAppropriatePos : function(appropriatePos) {
		this._appropriatePos = appropriatePos;
	}
	
};

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.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;
	}
	
};

$(document).ready(function() {
	var fillDatabase = function(resultList) {
		$(".motifMaxDatabase").append("<option value='-1' selected='selected'>-- Select Database --</option>");
		$.each(resultList, function(workId, fileList) {
			$.each(fileList, function(fileKey, fileName) {
				$(".motifMaxDatabase").append("<option value='" + workId + "|" + fileName + "'>" + fileName + "</option>");
			});
		});
		$(".motifMaxDatabase").change(function() {
			var dbKey = $("option:selected", $(this)).val();
			if (dbKey == -1) {
				$("#container").html("");
				return;
			}
			var array = dbKey.split("|");
			var containerId = "container";
			var options = {
				workId : array[0],
				fileName : array[1],
				baseSequence : "GAAAAAAGACGTTCCAACCACGTCTTCAAAGCAAGTGATTGGATTAAGGTTCTTCCACACGGTAAGGGATGGCACTAACACCTACCATCCTTCGCAAGACCCTTCCTCTATATAAGGAAGTTCATTTCATTTGGAGAGGACCTCGAC"
			};
			new Application.motifMax(containerId, options);
		});
	}
	LinkData.getFilesByTag(null, "database", fillDatabase);
});

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

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

.hidden {
	display:none;
}

.left {
    float: left;
}

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

.row {
    padding: 5px 0;
}

.row:after {
    content: "";
    clear: left;
    display: block;
}

.row input[type="text"] {
    width: 200px;
}

.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;
}
.replaceSequence {
    background-color: #FFFFFF;
    border: 1px solid #DDDDDD;
    margin: 10px 0 0;
	font-family: "Courier New","Lucida Console";
	width: 100%;
	overflow: auto;
}

.replace {
    color: #E80010;
}

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

.databaseInfo .motif {
	width: 70%;
}

/**
 * button css
 */
.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;
}

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

.motifViewDialog .basePairs,
.motifViewDialog .extraCopies,
.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;
}

Select Input Data

LinkData Work	Table Data
Circadian Coexpression (DIURNAL + ATTED-II promoter motif) Full	DiurnalHours_ATTED_COL_LDHH DiurnalHours_ATTED_COL_SD DiurnalHours_ATTED_DD_DDHC DiurnalHours_ATTED_LDHC DiurnalHours_ATTED_LDHH_SM DiurnalHours_ATTED_LDHH_ST DiurnalHours_ATTED_LER_SD DiurnalHours_ATTED_LIGHT5_HIF138_13 DiurnalHours_ATTED_LIGHT5_HIF138_8 DiurnalHours_ATTED_LIGHT5_znknOX DiurnalHours_ATTED_LL12_LDHH DiurnalHours_ATTED_LL23_LDHH DiurnalHours_ATTED_LLHC DiurnalHours_ATTED_LL_LDHC DiurnalHours_ATTED_LL_LLHC DiurnalHours_ATTED_lhyox_SD DiurnalHours_ATTED_longday DiurnalHours_ATTED_lux_2_LDHH DiurnalHours_ATTED_phyB9_SD DiurnalHours_ATTED_shortday
Circadian Genomic (DIURNAL + PPDB promoter motif) Full	DiurnalHours_PPDB_COL_LDHH DiurnalHours_PPDB_COL_SD DiurnalHours_PPDB_DD_DDHC DiurnalHours_PPDB_LDHC DiurnalHours_PPDB_LDHH_SM DiurnalHours_PPDB_LDHH_ST DiurnalHours_PPDB_LER_SD DiurnalHours_PPDB_LIGHT5_HIF138_13 DiurnalHours_PPDB_LIGHT5_HIF138_8 DiurnalHours_PPDB_LIGHT5_znknOX DiurnalHours_PPDB_LL12_LDHH DiurnalHours_PPDB_LL23_LDHH DiurnalHours_PPDB_LLHC DiurnalHours_PPDB_LL_LDHC DiurnalHours_PPDB_LL_LLHC DiurnalHours_PPDB_lhyox_SD DiurnalHours_PPDB_longday DiurnalHours_PPDB_lux_2_LDHH DiurnalHours_PPDB_phyB9_SD DiurnalHours_PPDB_shortday
Developmental Coexpression (AtGenExpress + ATTED-II promoter motif) Full	AtGenExpress_ATTED_Flowering AtGenExpress_ATTED_Fruit_Seeds AtGenExpress_ATTED_Leaf AtGenExpress_ATTED_Root AtGenExpress_ATTED_Seedling AtGenExpress_ATTED_Stem AtGenExpress_ATTED_Whole_Plant Heptamer_elements PPDB_position
Speedup Lists of Developmental Genomic (AtGenExpress + PPDB promoter motif) Gene	AtGenExpress_PPDB_all AtGenExpress_PPDB_bottom AtGenExpress_PPDB_top
GenoCon2 Challenge A - Sequence Function Plugins	Application_Plugins_for_Synthetic_Promoter_Design
Speedup Lists of Developmental Coexpression (AtGenExpress + ATTED-II promoter motif) Gene	AtGenExpress_ATTED_all AtGenExpress_ATTED_bottom AtGenExpress_ATTED_top
Developmental Genomic (AtGenExpress + PPDB promoter motif) Full	AtGenExpress_PPDB_Flowering AtGenExpress_PPDB_Fruit_Seeds AtGenExpress_PPDB_Leaf AtGenExpress_PPDB_Root AtGenExpress_PPDB_Seedling AtGenExpress_PPDB_Stem AtGenExpress_PPDB_Whole_Plant Octamer_elements

Add LinkData work(LinkData)

Click the Browse button or drag and drop to choose files to upload

The Maximum upload size is 1MB.(bmp,gif,jpeg,jpg,png)

Edit Application

Please enter information for the application to be registered.

*Required field

Account Name

Application Name*: Remove; Add name for another language

Collaborators

Image: Change image

You can upload jpg, gif, png file formats

Website: x

Add website

Tag

License

API version

Initial Cost: ￥

Annual Cost: ￥

Description: <b> This is a plug-in function to <a href="http://app.linkdata.org/app/app1s94i" target="_blank">the DNA CAD program for Challenge A</a>.</b> <br> <br> <br> <i> To make your own function, copy this sample function using the “Fork this app as your new one” button at the bottom. You can modify and make new functions as plugins to the CAD Application. </i> <br> <br>For more information see: <a href="http://genocon.org/assignment-2012/assignment-a/manuals-a/" target="_blank">http://genocon.org/assignment-2012/assignment-a/manuals-a/</a> <br> <br> <br> <p><i>For guidelines for submitting your own program, please see the "ReadMe" tab special programing Challenge A sample report.</i> </p> <br> <br> Remove; Add description for another language

Security Level: public limited private

: finish Editing

Select Input Data

Edit Application

Please enter information for the application to be registered.

History