/************************************
  REVISION LOG ENTRY
  Revision By: Mihai Filimon ( mfl@exontrol.com )
  Created on 2/27/2018 2:00:00 PM
  Revised on 12/08/20208 10:00:00 AM

  Comments: howto.js, howto.css
 
  This code may be used in compiled form in any way you desire. This
  file may not be redistributed modified or unmodified without the authors
  written consent.
  ************************************/

var oDEF = oDEF ||
		{
			FR:	"FR",																			// {string} specifies the filter-parameter for the frames
			F: "F",																				// {string} specifies the filter-parameter for the document
			Q: "Q",																				// {string} specifies the question-only parameter (the filter matches the questions-only)
			W: "W",																				// {string} specifies the word-only parameter (the filter matches for word-only)
			ONLY: "only",																	// {string} indicates the value of `Q`or `W` parameter (for instance W=Only ~ word-only)
			E: "E",																				// {string} specifies the expand parameter (specifies the index of the question to expand)
			QOCLS: "question-only",												// {string} specifies the class to add to `Full` option when it is not checked
			WOCLS: "word-only",														// {string} specifies the class to add to `Word` option when it is checked
			QID: "question",															// {string} indicates the `question` identifier
			EXP: "expand",																// {string} specifies the class to add to <TR> question so it is displayed as expanded
			HGQ: "header-group-questions",								// {string} specifies the class to add to <TR> question so it is displayed as expanded
			CHM: !document.URL.toString().indexOf("mk:@")	// {boolean} runs the CHM file (IE7)
		},
		oe2A;																						// {object} holds an object of 

window.onload = loadW;
window.onclick = clickW;
window.onmousemove = moveW;
window.onresize = sizeW;
window.onscroll = scrollW;
window.onkeypress = keyW;
!hasFilter() && (document.onreadystatechange = showBody);

/**
 * @description The trim() method removes whitespace from both sides of a string (!!! required by CHM (running under IE))
*/
!String.prototype.trim && (String.prototype.trim = function()
{
	return this.replace(/^\s+|\s+$/g, '');
});

/**
 * @description The getElementsByClassName method of Document interface returns an array-like object of all child elements which have all of the given class name(s) // !!! required by CHM (running under IE)
*/
!document.getElementsByClassName && (document.getElementsByClassName = function(search)
{
	var d = document, elements, pattern, i, results = [];
	if (d.querySelectorAll) { // IE8
		return d.querySelectorAll("." + search);
	}
	if (d.evaluate) { // IE6, IE7
		pattern = ".//*[contains(concat(' ', @class, ' '), ' " + search + " ')]";
		elements = d.evaluate(pattern, d, null, 0, null);
		while ((i = elements.iterateNext())){
			results.push(i);
		}
	} else {
		elements = d.getElementsByTagName("*");
		pattern = new RegExp("(^|\\s)" + search + "(\\s|$)");
		for (i = 0; i < elements.length; i++) {
			if ( pattern.test(elements[i].className) ) {
				results.push(elements[i]);
			}
		}
	}
	return results;
});

/**
 * @description The forEach() method executes a provided function once for each array element (!!! required by CHM (running under IE))
*/
!Array.prototype.forEach && (Array.prototype.forEach = function(callback, thisArg)
{
	for ( var i = 0, l = this.length; i < l; i++ )
		callback.call(thisArg, this[i], i, this);
});

/**
 * @description The firstElementChildOf() method returns the object's first child Element, or null if there are no child elements // !!! required by CHM (running under IE)
 * @param {object} oElement Indicates the element to start searching for the first child element from
 * @returns {object} Returns the object's first child Element, or null if there are no child elements
*/
function firstElementChildOf(oElement)
{
	return oElement && oElement.firstElementChild || (function()
	{
		var node,
				nodes = oElement.childNodes,
				i = 0;
		while (node = nodes[i++])
			if (node.nodeType === 1 /*Node.ELEMENT_NODE	1	An Element node like <p> or <div>.*/)
				return node;
	})();
}

/**
 * @description The feU/forEachUntil() method enumerates the elements of a HTMLCollection or Array object (!!! required by CHM (running under IE))
 * @param {object} collection Indicates a HTMLCollection or Array object
 * @param {callback} callback Specifies the callback to invoked for each element
 * @returns {any} Returns the value of the last callback
*/
function feU(collection, callback)
{
  var oResult;
  for ( var i = 0, l = collection.length; !oResult && i < l; i++ )
    oResult = callback(collection[i] /*Array*/ || collection.item(i) /*HTMLCollection*/);
  return oResult;
}

/**
 * @description eVV/EnsureVisibleVertical() method scrolls the view to ensures that the element fits the control's client area
 * @param {object} oElement Indicates the element to fit the view
*/
function eVV(oElement)
{
	oElement && oElement.scrollIntoView(
	{
		behavior: 'smooth',
		block: 'nearest'
	});
}

/**
 * @description The tryC() method calls the callback between a try/catch statement
 * @param {callback} callback Indicates a callback to call
 * @param {object} thisArg Specifies the value of "this" keyword during the callback
 * @returns {any} Returns the result of the callback
*/
function tryC(callback, thisArg)
{
	try
	{
		return callback.call(thisArg || this);
	}
	catch (error)
	{
		
	}
}

/**
 * @description The getDoc() method returns the window's document (requests it between a try/catch statement)
 * @param {object} window Indicates the window to get document for
 * @returns {object} Returns the window's document
*/
function getDoc(window)
{
	return tryC(function()
	{
		return window.document;
	});
}

/**
 * @description The getFrameDoc() method gets the document of the <iframe> element
 * @param {object} oFrame Indicates the <iframe> element
 * @returns {object} Retunrs the document of the <iframe> element
*/
function getFrameDoc(oFrame)
{
	return tryC(function()
	{
		return oFrame.contentDocument || oFrame.contentWindow.document;
	});
}

/**
 * @description The getSessionStorage() method returns the window's sessionStorage property (requests it between a try/catch statement)
 * @returns {object} Returns the window's sessionStorage property or undefined if it is unaccessible
*/
function getSessionStorage()
{
	return tryC(function()
	{
		return window.sessionStorage;
	})
}

/**
 * @description The hasSessionStorage() method indicates if the browser supports sessionStorage
 * @returns {boolean} Returns true if the browser supports sessionStorage
*/
function hasSessionStorage()
{
	return !!getSessionStorage();
}

/**
 * @description The getSessionItem() method gets the session value of the specified item (name)
 * @param {string} item Specifies the name of the item to request its session value
 * @returns {string} Returns the session value of the specified item (name)
*/
function getSessionItem( item )
{
	var sessionStorage = getSessionStorage();
	return sessionStorage && sessionStorage.getItem(item) || null;
}

/**
 * @description The setSessionItem() method sets the session value for specified item
 * @param {string} item Specifies the name of the item to change
 * @param {string} value Indicates the value of the item
 */
function setSessionItem( item, value )
{
	var sessionStorage = getSessionStorage();
	sessionStorage && sessionStorage.setItem(item, value);
}

/**
 * @description The delSessionItem() method deletes the item (and its value) from the current session
 * @param {string} item Specifies the name of the item to change
*/
function delSessionItem( item )
{
	var sessionStorage = getSessionStorage();
	sessionStorage && sessionStorage.removeItem(item);
}

/**
 * @description The getURLHash() method gets the value after hash(#) or null if not found
 * @param {string} sURL Specifies the URL to get its hash value
 * @returns {string} Returns the value after hash(#) or null if not found
*/
function getURLHash( sURL )
{
	var i = sURL.indexOf('#');
	return ~i ? sURL.substr( i + 1 ) : null;
}

/**
 * @description The delURLHash() method returns the URL within its hash(#) value
 * @param {string} sURL Specifies the URL to request
 * @returns {string} Returns the URL within its hash(#) value
*/
function delURLHash(sURL)
{
	var i = sURL.indexOf( "#" );
	return ~i ? sURL.substr( 0, i ) : sURL;
}

/**
 * @description The getURLParam() method gets the value of the giving parameter from the specified URL
 * @param {string} sURL Specifies the URL to request parameter from
 * @param {string} Param Specifies the name of the parameter to request
 * @returns {string} Returns null (no parameter found) or the value of the giving parameter
*/
function getURLParam(sURL, Param)
{
	if ( ~(sURL = delURLHash(sURL)).indexOf("?") )
	{
		var arrParams = sURL.split("?"),
				arrURLParams = arrParams[1].split("&"),
				arrParamNames = new Array(arrURLParams.length),
				arrParamValues = new Array(arrURLParams.length),
				i = 0;
		
		for (i = 0; i < arrURLParams.length; i++)
		{
			var sParam = arrURLParams[i].split("=");
			arrParamNames[i] = sParam[0];
			if (sParam[1] != "")
				arrParamValues[i] = unescape(sParam[1]);
			else
				arrParamValues[i] = "";
		}
		
		for ( i = 0 ; i < arrURLParams.length; i++)
			if (arrParamNames[i] == Param)
				return arrParamValues[i];
	}
	return null;
}

/**
 * @description The addURLParam() method adds a parameter/value to specified URL
 * @param {string} sURL Specifies the URL to add parameter to
 * @param {string} Param Specifies the name of the parameter to add
 * @param {string} Value Specifies the value of the parameter to add
 * @returns {string} Returns the updated URL
 */
function addURLParam(sURL, Param, Value)
{
	return updURLParam( sURL, Param, Value );
}

/**
 * @description The delURLParam() method deletes the parameter from the specified URL
 * @param {string} sURL Specifies the URL to change
 * @param {string} Param Specifies the name of the parameter to change
 * @returns {string} Returns the updated URL
*/
function delURLParam(sURL, Param)
{
	return updURLParam( sURL, Param, null );
}

/**
 * @description The updURLParam() method adds/deletes or updates the parameter and its value of the specified URL
 * @param {string} uri Specifies the URL to change
 * @param {string} key Specifies the name of the parameter to change
 * @param {string} value Specifies the value of the parameter (if null, the parameter is removed)
 * @returns {string} Returns the updated URL
*/
function updURLParam(uri, key, value)
{
	var i = uri.indexOf('#'),
			hash = i === -1 ? ''  : uri.substr(i);
	uri = i === -1 ? uri : uri.substr(0, i);

	var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i"),
			separator = uri.indexOf('?') !== -1 ? "&" : "?";
	if ( value )
	{
		value = value.trim();
		if (uri.match(re))
			uri = uri.replace(re, '$1' + key + ( value.length ? ("=" + value) : "" ) + '$2');
		else
			uri = uri + separator + key + ( value.length ? ("=" + value) : "" );
	}
	else
	{
		uri = uri.replace( new RegExp("[?&]?" + key + "=[^&]*", "i"), '' );
		if (uri.slice(-1) === '?')
			uri = uri.slice(0, -1);

		if (uri.indexOf('?') === -1)
			uri = uri.replace(/&/, '?'); // replace first occurrence of & by ? if no ? is present
	}

  return uri + hash;
}

/**
 * @description The getURL() method simplifies the URL in case it is used on exontrol.com domain
 * @param {string} sURL Specifies the URL to simplify
 * @returns {string} Returns the simplified URL
*/
function getURL( sURL )
{
	if ( sURL && ~sURL.indexOf("exontrol.com/content/products/") )
	{
		sURL = sURL.replace("?","&");
		sURL = sURL.replace("/content/products/","/howto.jsp?product=");
		sURL = sURL.replace("/howto/how_to_do_","&lang=");
		sURL = sURL.replace(".htm", "");
	}
	return sURL;
}

/**
 * @description The regCL/regClassList() method returns a regular expression to search for the specified token (word only)
 * @param {string} name Specifies the name of the token to find within the class list
 * @returns {object} Returns a RegEx object
*/
function regCL(name)
{
	name = name.trim();
	return new RegExp("\\b" + name + "\\b","gm");
}

/**
 * @description The hasCL/hasClassList() method checks whether the name is contained by specified class list
 * @param {string} className Specifies the class names of the object
 * @param {string} name Indicates the name of the class name to search for
 * @returns {boolean} Returns true if the className contains the specified name
*/
function hasCL(className, name)
{
	return regCL(name).test(className)
}

/**
 * @description The addCL/addClassList() method adds the specified name to the class-list, and returns the updated class name
 * @param {string} className Specifies the class names to change
 * @param {string} name Indicates the class name to add
 * @returns {string} Returns the updated class name
*/
function addCL(className, name)
{
	!hasCL(className, name) && (className += " " + name);
	return className.trim();
}

/**
 * @description The delCL/deleteClassList() method deletes the specified name from the class-list, and returns the updated class name
 * @param {string} className Specifies the class names to change
 * @param {string} name Indicates the class name to remove
 * @returns {string} Returns the updated class name
*/
function delCL(className, name)
{
	hasCL(className, name) && (className = className.replace(regCL(name), ""));
	return className.trim();
}

/**
 * @description The clickPage() method occurs once the user clicks a page within the document
 * @param {string} anchor Specifies the anchor page being clicked
*/
function clickPage(anchor)
{
	var vtFilter = document.getElementById("Filter"),
			f = vtFilter && vtFilter.value || "";
	f && (anchor.href = addURLParam(anchor.href, "F", f));
}

/**
 * @description The nextID() method gets the next element by identifier
 * @param {object} el Specifies the current element
 * @returns {object} Returns the next element by identifier
*/
function nextID(el)
{
	var c = el.nextElementSibling;
	if ( c )
	{
		while ( c && ( el.id != c.id ) )
			c = c.nextElementSibling;
		return c;
	}

	// !!! required by CHM (running under IE)
  c = el.nextSibling;
	while ( c && ( ( c.nodeType != 1 ) || ( el.id != c.id ) ) )
		c = c.nextSibling;

  return c;
}

/**
 * @description The isFrameFilterFor() method determines whether the current document is a filter-for <iframe> element
 * @returns {boolean} Returns true if the current document is a filter-for <iframe> element
*/
function isFrameFilterFor()
{
	return !!getURLParam( document.URL, oDEF.FR );
}

/**
 * @description The isFilterForQ() method determines whether the current document filters for questions-only
 * @returns {boolean} Returns true if the current document filters for questions-only
*/
function isFilterForQ()
{
	return getURLParam( document.URL, oDEF.Q ) == oDEF.ONLY;
}

/**
 * @description The isFilterForW() method determines whether the current document filters for words-only
 * @returns {boolean} Returns true if the current document filters for words-only
*/
function isFilterForW()
{
	return getURLParam( document.URL, oDEF.W ) == oDEF.ONLY;
}

/**
 * @description The getFilterFor() method gets the element's content as a text
 * @param {object} e Indicates the element to request its content as a text
 * @returns {string} Returns the element's content as a text
*/
function getFilterFor( e )
{
	return e.textContent || e.innerText;
}

/**
 * @description The getFilterForQ() method gets the element's content as a text
 * @param {object} e Indicates the element to request its content as a text
 * @returns {string} Returns the element's content as a text
*/
function getFilterForQ( e )
{
	return getFilterFor(e.children[0]) + getFilterFor( firstElementChildOf(e.children[1]) );
}

/**
 * @description The hasFilter() method checks whether the document contains any filter
 * @returns {boolean} Returns true if the document contains any filter
*/
function hasFilter()
{
    return getURLParam(document.URL, oDEF.F) || getURLParam(document.URL, oDEF.FR);
}

/**
 * @description The filterFor() method applies the filter on the current document
 * @param {string} text Specifies the filter to apply
 */
function filterFor(text)
{
	/**
	 * @description The collapseAll() method collapses all the items
	*/
	function collapseAll()
	{
		var rgExpanded = []
		feU(document.getElementsByClassName(oDEF.EXP), function(oQuestion)
		{
			rgExpanded.push(oQuestion);	// !!! collects the `expand` elements, as it is a LIVE collection
		});
		rgExpanded.forEach(function(oQuestion)
		{
			oQuestion.className = delCL(oQuestion.className, oDEF.EXP);
		});
	}

	/**
	 * @description The shortOf() method gets a shorter URL
	 * @param {string} sURL Indicates the URL to make it shorter
	 * @returns {string} Returns the shorter URL
	*/
	function shortOf(sURL)
	{
		var iQ = sURL.indexOf("(");
		if ( !~iQ )
			iQ = sURL.indexOf("?");
		if ( ~iQ )
			sURL = "..." + sURL.substr(iQ);
		return sURL
	}

	/**
	 * @description The getURLBase() method geturns the URL without parameters
	 * @returns {string} Returns the URL without parameters
	*/
	function getURLBase()
	{
		if ( oDEF.CHM )
			return "";
	
		var sURL = document.URL.toString(),
				sIndex = sURL.indexOf("?");
		if ( ~sIndex )
			sURL = sURL.substr(0, sIndex);
		return getURL( sURL );
	}


	collapseAll();
	miniHeader();

	var nResults = 0,
			o = document.getElementById(oDEF.QID),
			h = document.getElementById(oDEF.HGQ);

	if ( !text.length )
	{
		while ( o )
		{
			o.style.display = "";
			o = nextID(o);
		}

		while ( h )
		{
			h.style.display = "";
			h = nextID(h);
		}

		if ( !isFrameFilterFor() )
		{
			sPages(true);

			var c = document.getElementById("continue");
			if ( c )
			{
				c.innerHTML = "";
				c.style.display = "none";
			}
		}
	}
	else
	{
		// Shows only the items that match
		text = text.toLowerCase();
		
		var rgFilter = new Array(),
				rgAlternatives = text.split(","),
				aCount = rgAlternatives.length;

		for ( var a = 0; a < aCount; a++ )
		{
			var rgAlternative = new Array();

				var rgFields = rgAlternatives[a].split(" ");
				var fCount = rgFields.length;
				for ( var f = 0; f < fCount; f++ )
				{
					var sField = rgFields[f].replace(" ","");
					if ( sField.length )
						rgAlternative.push( sField );
				}

			if ( rgAlternative.length )
				rgFilter.push( rgAlternative );
		}

		var l = rgFilter.length;
		if ( l > 0 )
		{
			var bFilterForQ = isFilterForQ(),
					bFilterForW = isFilterForW();

			while ( o )
			{
				var s = bFilterForQ ? getFilterForQ(o) : getFilterFor(o);
				s = s.toLowerCase();
			
				var bVisible = false;
				for ( var j = 0; !bVisible && ( j < l ); j++ )
				{
					var i = 0, iCount = rgFilter[j].length;
					for ( i = 0; i < iCount; i++ )
					{
						var w = rgFilter[j][i];
						if ( bFilterForW )
						{
							if ( s.search("\\b" + w + "\\b") == -1 )
								break
						}
						else
							if ( s.indexOf(w) == -1)
								break;
					}
					bVisible = i == iCount;
				}
				o.style.display = bVisible ? "" : "none";
				
				bVisible && nResults++;

				o = nextID(o);
			}
		}

		while ( h )
		{
			h.style.display = "none";
			h = nextID(h);
		}

		//  Show additional information
		if ( !isFrameFilterFor() )
		{
			sPages(false);

			var c = document.getElementById("continue");
			if ( c )
			{
				var iFrame = "";
				{
					var f = Filter.value,
							iFrames = 0;
					if ( f.length != 0 )
					{
						var p = document.getElementById("page");
						while ( p )
						{
							if ( p.id == "page" )
							{
								var s = p.href;
								if ( s != 0 )
								{
									s += "?" + oDEF.FR + "=" + f;
									if ( isFilterForQ() )
										s += "&" + oDEF.Q + "=only";
									if ( isFilterForW() )
										s += "&" + oDEF.W + "=only";
									iFrame += "<iframe src=\"" + s + "\" frameborder=\"0\" style=\"overflow: hidden; width: 100%; height: 0; visibility: hidden;\" onload=\"loadF(this)\"></iframe>";
									iFrames++;
								}
							}
							p = nextID(p);
						}
						
						setSessionItem("mainSectionFrames", iFrames );
						startFilterFrames();
						!iFrames && endFilterFrames();
					}
				}
				c.innerHTML = iFrame;
				c.style.display = "";
			}
		}
	}

	var footer = document.getElementById("footerInfo");
	if ( footer )
	{
		var info = "", oInfo = "<div id=\"footerInfo\"><p><%INFO%></p></div>",
				nURL = getURLBase();
		
		if ( nURL.length )
		{
			nURL += ( nURL.indexOf("?") > 0 ) ? "&" : "?";
			nURL += "F="+ escape(text);
			if ( isFilterForQ() )
			{
				nURL += ( nURL.indexOf("?") > 0 ) ? "&" : "?";
				nURL += oDEF.Q + "=only";
			}
			if ( isFilterForW() )
			{
				nURL += ( nURL.indexOf("?") > 0 ) ? "&" : "?";
				nURL += oDEF.W + "=only";
			}
		}

		if ( text.length )
		{
			if ( !nResults )
				info = "<font id=\"error\">no results";
			else
				info += nResults.toString() + " result" + ((nResults > 1) ? "s" : "");

			if ( nURL.length )
				info += ", at <a href='" + nURL + "' " + " title='" + nURL + "'" +  " target=\"_blank\">" + shortOf(nURL) + "</a>";
		}
		oInfo = oInfo.replace( "<%INFO%>", info );
		footer.outerHTML = oInfo;

		addR(nResults);
	}

	if ( nResults && !getSessionItem("showFirstResult") )
	{
		setSessionItem("showFirstResult", "done");
		(nResults == 1) && ExpandCollapse(firstElementChildOf(firstElementChildOf(feU(document.getElementsByTagName("TR"), function(oQuestion)
		{
			return oQuestion.id == oDEF.QID && (oQuestion.style.display != "none") && oQuestion;
		}))));
	}

	miniHeader();
	toTop();
}

/**
 * @description The sPages/showPages() method shows or hides the pages (< 2 1 >)
 * @param {boolean} bVisible Specifies whether the pages are shown or hidden
*/
function sPages(bVisible)
{
	var p = document.getElementById("pages"),
			oResults = document.getElementById("results");

	if ( p )
		p.style.display = bVisible ? "" : "none";

	if (oResults)
	{
		oResults.className = window[bVisible ? "delCL" : "addCL"](oResults.className, "show");
		oResults.innerText = "";
		oResults.innerResult = 0;
	}
}

/**
 * @description The addR() method adds results to the master `results` element
 * @param {number} nResults Indicates the number of results to add
*/
function addR(nResults)
{
	var oParentDoc = getDoc(window.parent),
			oResults = oParentDoc && oParentDoc.getElementById("results") || document.getElementById("results");
	if ( oResults )
	{
		oResults.innerResult = (oResults.innerResult || 0) + nResults;
		oResults.innerText = (oResults.innerResult ? oResults.innerResult : "no") + " result" + (oResults.innerResult != 1 ? "s" : "");
		oResults.className = window[!oResults.innerResult ? "addCL" : "delCL"](oResults.className, "zero");
	}
}

/**
 * @description The loadF() method occurs once a <iframe> element is loaded
 * @param {object} oFrame Indicates the <iframe> element being loaded 
*/
function loadF(oFrame)
{
	if ( oFrame )
	{
		var oFrameDoc = getFrameDoc(oFrame),
				bHasSessionStorage = hasSessionStorage(),
				iFrames;

		if ( oFrameDoc )
			oFrame.style.height = getMSHeight(oFrameDoc);
		else
			if ( bHasSessionStorage )
				oFrame.style.height = getSessionItem("mainSectionHeight");

		oFrame.style.visibility = "visible";

		if ( bHasSessionStorage && (iFrames = getSessionItem("mainSectionFrames")) )
		{
			iFrames--;
			setSessionItem("mainSectionFrames", iFrames);
			!iFrames && endFilterFrames();
		}
	}
}

/**
 * @description The startFilterFrames() method is called once searching among <iframe> elements begins
*/
function startFilterFrames()
{
	var mainSection = document.getElementById("mainSection");
	if ( mainSection )
	{
		var bottomTable = document.getElementById("bottomTable"),
				wait = document.getElementById("wait"),
				newImage;

		if ( bottomTable && getSessionStorage() )
		{
			if ( !wait )
			{
				newImage = document.createElement("IMG");

					newImage.id = "wait";
					newImage.className = "wait";
					newImage.src = "wait.gif";
					newImage.style.top = Math.max( 32, mainSection.offsetTop ) + "px";

				mainSection.parentElement.insertBefore( newImage, mainSection );
			}
			else
			{
				wait.style.display = "block";
				wait.style.top = mainSection.offsetTop + "px";
			}
		}
	}
}

/**
 * @description The endFilterFrames() method is called once searching among <iframe> elements ends
*/
function endFilterFrames()
{
	resetFilterFrames();
}

/**
 * @description The resetFilterFrames() method hides the "wait" image once searching among <iframe> elements ends
*/
function resetFilterFrames()
{
	delSessionItem("showFirstResult");
	var wait = document.getElementById("wait");
	if ( wait )
		wait.style.display = "none";

	miniHeader();
}

/**
 * @description The getMSHeight() method gets the height of the document's mainSection element
 * @param {object} oDocument Indicates a HTML document
 * @returns {string} Returns the height of the document's mainSection element
*/
function getMSHeight( oDocument )
{
	var h = 0,
			e = oDocument.getElementById("mainSection");

	if ( e )
		h += e.clientHeight;

	return h + "px";
}

/**
 * @description The wRepURL/windowReplaceURL() method replaces the URL
 * @param {string} sURL Indicates the newly URL
*/
function wRepURL( sURL )
{
	tryC(function()
	{
		window.history.replaceState(null,null,sURL);
		sURL = getURL( sURL );
		window.parent.history.replaceState(null,null,sURL);
	})
}

/**
 * @description The wSelURL() method changes the window's location
 * @param {string} sURL Indicates the newly URL
*/
function wSelURL( sURL )
{
	sURL && tryC(function()
	{
		window.parent.parent.location = sURL;
	});
}

/**
 * @description The showFilterBoxInfo() method shows the filter-box note
*/
function showFilterBoxInfo()
{
	if ( !getSessionItem("showFilterBoxInfo") )
	{
		var filterFor = document.getElementById("Filter"),
				filterInfo;
				
		if ( (!filterFor || (filterFor != document.activeElement)) && ( filterInfo = document.getElementById("filter-arrow-box") ) )
		{
			setSessionItem("showFilterBoxInfo", "show");
			filterInfo.className = "arrow-box-show";
			setTimeout(function(){ hideFilterBoxInfo(); }, 6000);
		}
	}
}

/**
 * @description The hideFilterBoxInfo() method hides the filter-box note
*/
function hideFilterBoxInfo()
{
	var filterInfo = document.getElementById("filter-arrow-box");
	if ( filterInfo )
		filterInfo.className = "arrow-box-hide";
}

/**
 * @description The loadW() method occurs once the window's load the page (onload event)
 */
function loadW()
{
	/**
	 * @description The setFilterPlaceHolder() method updates the filter's place holder, adds the Full and Word buttons
	*/
	function setFilterPlaceHolder()
	{
		var vtFilter = document.getElementById("Filter"),
				btnFilter = document.getElementById("btnFilter"),
				btnClear = document.getElementById("btnClear"),
				btnAll = document.getElementById("all");
	
		if ( vtFilter && btnFilter )
		{
			btnAll && (btnAll.title = "Expand or collapse all items");

			btnFilter.title = "Apply the filter";
			btnFilter.onclick = function()
			{
				filterFor(vtFilter.value);
			};
	
			if ( btnClear )
			{
				btnClear.title = "Clear the filter";
				btnClear.onclick = function()
				{
					filterFor(vtFilter.value = "");
				};
			}
	
			vtFilter.placeholder = "Filter For...";
			vtFilter.title = "The space separator indicates AND between words, while comma specifies OR between words.";
			vtFilter.onkeypress = function(event)
			{
				event = event || window.event; // !!! required by CHM (running under IE)
				if ( event && (event.keyCode == 13) )
				{
					filterFor( this.value );
					onGo();
				}
			}
	
			var vtFilterQuestionOnly = document.getElementById("btnFilterQuestionOnly");
			if ( !vtFilterQuestionOnly )
			{
				vtFilterQuestionOnly = document.createElement("SPAN");
				vtFilterQuestionOnly.appendChild( document.createTextNode("Full") );
				vtFilterQuestionOnly.name = "btnFilterQuestionOnly";
				vtFilterQuestionOnly.title = "The filter is applied to the full content, else the filter is applied to the visible-content only.";
				vtFilterQuestionOnly.id = "btnFilterQuestionOnly";
				vtFilterQuestionOnly.className = ((isFilterForQ() ? "" : oDEF.QOCLS) + " tf").trim();
				vtFilterQuestionOnly.onclick = function( event )
				{
					var sURL = document.URL;
					if ( hasCL(vtFilterQuestionOnly.className, oDEF.QOCLS) )
					{
						sURL = addURLParam( sURL, oDEF.Q, oDEF.ONLY );
						vtFilterQuestionOnly.className = delCL(vtFilterQuestionOnly.className, oDEF.QOCLS)	
					}
					else
					{
						sURL = delURLParam( sURL, oDEF.Q );
						vtFilterQuestionOnly.className = addCL(vtFilterQuestionOnly.className, oDEF.QOCLS)	
					}
					wRepURL( sURL );
				};
	
				vtFilter.parentElement.insertBefore( vtFilterQuestionOnly, btnFilter );
			}
	
			var vtFilterWordOnly = document.getElementById("btnFilterWordOnly");
			if ( !vtFilterWordOnly )
			{
				vtFilterWordOnly = document.createElement("SPAN");
				vtFilterWordOnly.appendChild( document.createTextNode("Word") );
				vtFilterWordOnly.name = "btnFilterWordOnly";
				vtFilterWordOnly.title = "The filter searches for any, else it searches for the exact word.";
				vtFilterWordOnly.id = "btnFilterWordOnly";
				vtFilterWordOnly.className = ((isFilterForW() ? oDEF.WOCLS : "") + " tf").trim();
				vtFilterWordOnly.onclick = function( event )
				{
					var sURL = document.URL;
						if ( !hasCL(vtFilterWordOnly.className, oDEF.WOCLS) )
						{
							sURL = addURLParam( sURL, oDEF.W, oDEF.ONLY );
							vtFilterWordOnly.className = addCL(vtFilterWordOnly.className, oDEF.WOCLS)	
						}
						else
						{
							sURL = delURLParam( sURL, oDEF.W );
							vtFilterWordOnly.className = delCL(vtFilterWordOnly.className, oDEF.WOCLS)	
						}
					wRepURL( sURL );				
				};
				vtFilter.parentElement.insertBefore( vtFilterWordOnly, btnFilter );
			}
		}
	}

	/**
	 * @description The setFilterBoxInfo() method adds the filter-box note
	*/
	function setFilterBoxInfo()
	{
		var btnFilter = document.getElementById("btnFilter");
		if ( btnFilter )
		{
			var newSpan = document.createElement("SPAN"),
					textnode = document.createTextNode( "Enter here the keywords you are looking for, separated by spaces or commas, and then press Enter key or click the Go button." );
	
			newSpan.appendChild(textnode);  
			newSpan.className = "arrow-box";
			newSpan.id = "filter-arrow-box";
			btnFilter.parentElement.insertBefore( newSpan, btnFilter );
	
			document.getElementById("Filter") && setTimeout(function(){ showFilterBoxInfo(); }, 1000);
		}
	}

	var vtFilter = document.getElementById("Filter"),
			sF = hasFilter(),
			bShowBody = true,
			bApplyFilter = sF && sF.length && vtFilter,
			oParentDoc = getDoc(window.parent),
			ohr3;

	setFilterPlaceHolder();
	bApplyFilter && filterFor(vtFilter.value = sF);
	if (oDEF.CHM)
		document.onclick = clickW; // !!! required by CHM (running under IE)
	else
	{
		// adds the "results" <SPAN> element, as child of <TR id="headerTableRow3"><TD>
		if ( (ohr3 = document.getElementById("headerTableRow3")) && (ohr3 = firstElementChildOf(ohr3)) )
		{
			var oResults = document.createElement("SPAN");
				oResults.id = oResults.className = "results";
			ohr3.appendChild(oResults)
		}
		!bApplyFilter && setFilterBoxInfo();	// !!! required by CHM (running under IE)
	}
	isFrameFilterFor() && (bShowBody = !document.getElementById("error")) && ["header","footer"].forEach(function(o)
	{
		(o = document.getElementById(o)) && (o.style.display = "none"); // hides the header and footer
	})
	bShowBody && showBody();
	oParentDoc && (oParentDoc.body.onhashchange = eVHash);
	isFrameFilterFor() && setSessionItem("mainSectionHeight", getMSHeight( document ) );
	miniHeader();
	eVHash();
}

/**
 * @description The eVHash/ensureVisibleHash() method expands and ensures that the "E" param fits the window's client area
*/
function eVHash()
{
	var oParentDoc = getDoc(window.parent),
			sURL = oParentDoc && oParentDoc.URL || "",
			sHash = getURLHash(sURL),
			e = getURLParam( sURL, oDEF.E ),
			eID = null;

	if ( e )
		eID = "I" + e;
	
	if ( sHash )
	{
		var vtElementsHash = document.getElementsByName(sHash),
				bFound = false;

		if ( vtElementsHash && vtElementsHash.length )
		{
			var vtTR = vtElementsHash[0];
			while ( vtTR && vtTR.tagName != "TR" )
				vtTR = vtTR.parentElement;
			if ( vtTR )
				if ( vtTR.id == oDEF.QID )
				{
					var eIMG = firstElementChildOf(firstElementChildOf(vtTR));
					if ( oExpandItem = (eIMG && eIMG.tagName == "SPAN") )
						eID = eIMG.id;
				}
		}
		if ( !bFound && !e )
			eID = "I" + sHash;
	}

	eID && ExpandItem( document.getElementById( eID ) );
}

/**
 * @description The miniHeader() method minimalizes the header
*/
function miniHeader()
{
	var header,
			mainSection,
			pages;

	if ( (header = document.getElementById("header")) && (mainSection = document.getElementById("mainSection")) )
		if ( getSessionItem("pages") || window.pageYOffset || getURLParam( document.URL, oDEF.E ) || document.getElementById("Filter").value )
		{
			setSessionItem("pages","mini"); // once the header is displayed as mini, always get displayed as a "mini"

			header.className = addCL(header.className, "mini");
			(pages = document.getElementById("pages")) && (pages.style.marginBottom = "-" + (pages.clientHeight) + "px");
			mainSection.style.top = header.clientHeight + "px";
		}
}

/**
 * @description The sizeW() method occurs once the window is resized (window's resize event)
*/
function sizeW()
{
	miniHeader();
}

/**
 * @description The scrollW() method occurs once the window is scrolled (window's scroll event)
*/
function scrollW()
{
	miniHeader();
	hideFilterBoxInfo();
}

/**
 * @description The keyW() method occurs once the user presses a key (window's keypress event)
 * @param {object} event Indicates key event
 */
function keyW(event)
{
	var vtFilter = document.getElementById("Filter");
	if ( vtFilter && vtFilter != document.activeElement )
	{
		event && event.preventDefault();
		vtFilter.focus();
	}
}

/**
 * @description The showBody() method removes the "none" class from the document's body
*/
function showBody()
{
	document.body.className = delCL(document.body.className, "none"); // !!! removes the "none" class (do not use classList as it is not available for CHM)
}

/**
 * @description The e2A/eventToAction() method returns the action to perform from the event's position
 * @param {object} event Indicates the event (mouse event)
 * @returns {object} Returns undefined or an object of {t(ype),o(bject)} type as explained:
 * 
 * 	t(ype), {string} specifies the name of the function/action to perform
 * 	o(bject), {object} indicates the object to pass to the function
 * 
*/
function e2A(event)
{
	var target = event.target || event.srcElement,	// !!! required by CHM (running under IE)
			tag = target.tagName,
			oResult,
			o;

	if ( tag == "IMG" )
	{
		(o = target.parentElement.parentElement) && hasCL(o.className, "code") && (oResult = 
		{
			t: "toggleImg",
			o: target
		})
	}
	else
	{
		if ( event.offsetY < 8 )
		{
			if ( tag == "PRE" ) // select code
				oResult = 
				{
					t: "selectCode",
					o: target
				}
			else
				if ( tag == "P" ) // toggle preview
					oResult = 
					{
						t: "toggleImg",
						o: firstElementChildOf(target)
					}
		}
		else
			if ( tag == "PRE" )
			{
				if ( event.offsetY > target.clientHeight - 8 ) // copy code (TEMPLOCK as it could be shown outside of the <PRE> element)
					oResult = 
					{
						t: "copyCode",
						o: target
					}
			}
			else
				if ( tag == "DIV" ) // share code
					if ( event.offsetY > target.clientHeight )
						oResult = 
						{
							t: "shareCode",
							o: target
						}
	}	
	return oResult;
}

/**
 * @description The moveW() method occurs once the mouse is moved over the window (window's mousemove event)
 * @param {object} event Specifies the event (mouse event)
*/
function moveW(event)
{
	oe2A = e2A(event);
}

/**
 * @description The clickW() method occurs once the user clicks the window
 * @param {object} event Specifies the event (mouse event)
*/
function clickW( event )
{
	event = event || window.event;	// !!! required by CHM (running under IE)

	var bHideFilterBoxInfo = true,
			target = event.target || event.srcElement,	// !!! required by CHM (running under IE)
			tag = target.tagName;

	if ( tag == "INPUT" )
		switch (target.name)
		{
			case "btnFilter":
			{
				bHideFilterBoxInfo = false;
				onGo();
				break;
			}
			case "btnClear":
			{
				onClear();
				break;
			}
		}
	else
		if ( oe2A )
		 	window[oe2A.t].call(window, oe2A.o); // !!! calls "toggleImg", "selectCode", "shareCode", "copyCode" (!!!as saved during the mouse-move event)
		else
			if ( target.id == "all" )
				ExpandCollapseAll();
			else
				if ( tag == "TD" && hasCL(target.className, "c1") )
					ExpandCollapse(firstElementChildOf(target));
				else
					if ( target.id == "ask" )
						ExpandCollapse(firstElementChildOf(firstElementChildOf(target.parentElement.parentElement)));

	bHideFilterBoxInfo && hideFilterBoxInfo();
}

/**
 * @description The onGo() method occurs once the user clicks the Go button
*/
function onGo()
{
	var sURL = document.URL,
			sOURL = sURL,
			vtFilter = document.getElementById("Filter"),
			filterFor = vtFilter && vtFilter.value || "";

	if ( !filterFor || !filterFor.length )
	{
		showFilterBoxInfo();
		sURL = delURLParam(sURL, oDEF.F);
	}
	else
		sURL = addURLParam(sURL, oDEF.F, filterFor);
	
	sOURL != sURL && wRepURL( sURL );				
}

/**
 * @description The onClear() method occurs once the user clicks the Clear button
*/
function onClear()
{
	resetFilterFrames();
	toTop();

	var sURL = document.URL;

		sURL = delURLHash(sURL);
		sURL = delURLParam(sURL, oDEF.F);
		sURL = delURLParam(sURL, oDEF.E);

	wRepURL( sURL );				
}

/**
 * @description The toTop() method scrolls the window to the top
*/
function toTop()
{
	window.scrollTo(0,0);
}

/**
 * @description The shareCode() method occurs once the user clicks the share code button
 * @param {object} div Specifies an HTML element
*/
function shareCode( div )
{
	div && tryC(function()
	{
		var sURL = getURL( location.href.replace( oDEF.FR + "=",oDEF.F + "=" ) ), /*replace the FR with F*/
				sHash = null;

		sURL = delURLHash(sURL);

		// shares the hash, in case it contains <a name />
		if ( div.children.length )
		{
			var a = div.children[0];
			if ( a.tagName == "A" )
				if ( (sHash = a.getAttribute("name")) )
					sURL += "#" + sHash;
		}

		if ( sHash == null ) // shares the E instead
		{
			var sE = firstElementChildOf(div.parentElement.parentElement).innerText.replace(":","").replace(" ","");
			sURL = addURLParam( sURL, oDEF.E, sE );
		}

		if ( isFilterForQ() )
			sURL = addURLParam( sURL, oDEF.Q, oDEF.ONLY );

		if ( isFilterForW() )
			sURL = addURLParam( sURL, oDEF.W, oDEF.ONLY );

		wSelURL( sURL );
	})
}

/**
 * @description The toggleImg() method occurs once the user clicks the toggle preview button
 * @param {object} img Specifies the image being clicked
*/
function toggleImg( img )
{
	if ( img )
		img.className = !img.className ? "preview" : "";
}

/**
 * @description The addToggleImg() method method adds "preview" class to image
 * @param {object} img Indicates the image to change
*/
function addToggleImg( img )
{
	if ( img )
	{
		var p = img.parentElement;
		if ( p )
			if ( p.tagName == "P" )
				if ( !p.className )
					if ( img.height > 128 )
						p.className = "preview";
	}
}

/**
 * @description The selectCode() method selects the code
 * @param {object} e Indicates the HTML element element to select its code
*/
function selectCode( e )
{
	var sel = window.getSelection();
	if (sel)
	{
		sel.removeAllRanges();

		var range = document.createRange();
		try
		{
			var span = e.firstChild, s = span;
			if ( span )
				if ( span.tagName == "SPAN" )
					if ( span.className == "line-number" )
						s = span.nextSibling;
						
			range.setStartBefore(s);
			range.setEndAfter(e.lastChild);

		}
		catch( er )
		{
			var span = e.firstChild;
			if ( span )
				if ( span.tagName == "SPAN" )
					if ( span.className == "line-number" )
						span.style.display = "none";

			range.selectNodeContents(e);
		};
		sel.addRange(range);
	}
}

/**
 * @description The copyCode() method copies the code to the clipboard
 * @param {object} e Indicates the HTML element element to copy code
*/
function copyCode(e)
{
	var bSuccess = false,
			sel = window.getSelection();
	if (sel)
	{
		selectCode(e);
		if ( bSuccess = document.execCommand('copy') )
			sel.removeAllRanges();
	}
	return bSuccess;
}

/**
 * @description The ExpandItem() method expands the item
 * @param {object} oItem Indicates an item to expand
*/
function ExpandItem(oItem)
{
	function addLineNumber( oPre )
	{
		oPre.innerHTML = oPre.innerHTML.trim();
		var num = oPre.innerText.replace(/\s+$/g, "").split(/\n/).length,
				oEnsure;
		if ( num > 1 )
		{
			// adds the line-numbers
			oPre.innerHTML = '<span class="line-number"></span>' + oPre.innerHTML;
			for (var j = 0; j < num; j++)
				oPre.getElementsByTagName('span')[0].innerHTML += '<span>' + (j + 1) + '</span>';

			// scrolls the <pre> element show the highligted elements into the center
			if ( oEnsure = oPre.getElementsByTagName("B")[0] )
				oPre.scrollTop = Math.max( 0, (oEnsure.offsetTop - oPre.offsetTop) - oPre.clientHeight/2 );
		}
	}

	if ( oItem )
	{
		var oQuestion;

		if ( oItem.parentElement && (oQuestion = oItem.parentElement.parentElement) )
		{
			// adds the `expand` to <TR> question
			oQuestion.className = addCL(oQuestion.className, oDEF.EXP);

			if ( !oDEF.CHM ) // !!!prevents line-number and toggle-preview under CHM
			{
				// adds line numbers once the user expands section
				feU(oQuestion.getElementsByTagName("PRE"), function(oPre)
				{
					!hasCL(firstElementChildOf(oPre).className, "line-number") && addLineNumber( oPre );
				});

				// adds "preview" to <IMG> elements
				feU(oQuestion.getElementsByTagName("IMG"), function(oImg)
				{
					addToggleImg( oImg );
				})

				// ensures that the item fits the window's client-area
				eVV(oItem.parentElement.parentElement);
			}

			// notifies the document once an element has been expanded/collapsed
			onEC();
		}
	}
}

/**
 * @description The CollapseItem() method collapses the item
 * @param {object} oItem Indicates an item to collapse
*/
function CollapseItem(oItem)
{
	if ( oItem )
	{
		var oQuestion;
		if ( oItem.parentElement && (oQuestion = oItem.parentElement.parentElement) )
		{
			oQuestion.className = delCL(oQuestion.className, oDEF.EXP);
			onEC();
		}
	}
}

/**
 * @description The ExpandCollapse() method expands/collapses the item
 * @param {object} oItem Indicates an item to expand/collapse
*/
function ExpandCollapse(oItem)
{
	oItem && !hasCL(oItem.parentElement.parentElement.className, oDEF.EXP) ? ExpandItem( oItem ) : CollapseItem( oItem );
}

/**
 * @description The ExpandCollapseAll() method expands/collapses all the items
*/
function ExpandCollapseAll()
{
	function expandAll(oDocument, bExpanded)
	{
		oDocument && feU( oDocument.getElementsByTagName("TR"), function(oQuestion)
		{
			if ( oQuestion.id == oDEF.QID )
				oQuestion.className = bExpanded ? delCL(oQuestion.className, oDEF.EXP) : addCL(oQuestion.className, oDEF.EXP)
		})
	}

	var bExpanded = document.getElementsByClassName(oDEF.EXP).length;
	expandAll(document, bExpanded);
	feU(document.getElementsByTagName("IFRAME"), function(oFrame)
	{
		expandAll(oFrame.contentDocument, bExpanded);
		onEC(oFrame);
	})
}

/**
 * @description The onEC() method notifies the frame once an item has been expanded/collapsed
 * @param {object} oFrame Indicates the <iframe> element where expand/collapse occured
*/
function onEC(oFrame)
{
	if ( (isFrameFilterFor() && (oFrame = window.frameElement)) || oFrame )
		oFrame.style.height = getMSHeight(oFrame.contentDocument || document);
}