function grayOutIrrelevantBoxes(sAppVar, sActiveTerminology) {
		// gray out not relevant boxes by changing its class and appending Inactive
		var sTerminologyId = sAppVar + "-" + sActiveTerminology.substring("terminology".length);

		var oAppVarHierarchy = {
			"appvar2": ["appvar2", "appvar1", "base"],
			"appvar1": ["appvar1", "base"],
			"base": ["base"]
		};

		var oTerminologyHierarchy = {
			"appvar2-1": ["appvar2-1", "appvar1-1", "base-1"],
			"appvar1-1": ["appvar1-1", "base-1"],
			"base-1": ["base-1"],
			"appvar2-2": ["appvar1-2", "base-2"],
			"appvar1-2": ["appvar1-2", "base-2"],
			"base-2": ["base-2"]
		};

		var aAllAppVars = ["appvar2", "appvar1", "base"];
		var aAllTerminologies = ["appvar2-1", "appvar1-1", "base-1", "appvar1-2", "base-2"];

		function setClassToInvalid() {
			return function (sDependentId) {
				var oDom = domById("terminology-" + sDependentId);
				oDom.classList.add("Inactive");
			};
		}

		if (oAppVarHierarchy[sAppVar]) {
			aAllAppVars = aAllAppVars.filter(function (sAppVarId) {
				return oAppVarHierarchy[sAppVar].indexOf(sAppVarId) === -1;
			});
		}

		if (oTerminologyHierarchy[sTerminologyId]) {
			aAllTerminologies = aAllTerminologies.filter(function (sAppVarId) {
				return oTerminologyHierarchy[sTerminologyId].indexOf(sAppVarId) === -1;
			});
		}
		aAllAppVars.forEach(setClassToInvalid());
		aAllTerminologies.forEach(setClassToInvalid());
	}
Gray out unrelated boxes
@param {string} sAppVar appvar id, one of "base", "appvar1" and "appvar2"
@param {string} sActiveTerminology active terminology id, one of "none", "appvar1" and "appvar2"