function CUSTOM(){};

CUSTOM._VAR_VALUE = function(){};
	
	CUSTOM._VAR_VALUE._IS_BLANK = function(TO_CHECK)
	{
		var RESULT = false;
		// 
		if(CUSTOM._ELEMENT._IS_TRUE(TO_CHECK))
		{
			if(JSOC_ELEMENT.VAR_VALUE(TO_CHECK) == "") 
				RESULT = true;

			return RESULT;
		}

		if(TO_CHECK == "" || TO_CHECK == undefined)
			return true;
		
		return RESULT;	
	}
/*---------------------------------------------------------------------
 * Customize functions for the CSS.
 ---------------------------------------------------------------------*/
CUSTOM._CSS =function(){};

	CUSTOM._CSS._SET_CURSOR = function(ELEMENT_ID, TYPE)
	{
		var CURSOR = "";
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		var TYPE_1 = "pointer";

		if(TYPE == 1)
		{
			CURSOR = TYPE_1;
		}

		ELEMENT.style.cursor = CURSOR;
		return;
	}

	CUSTOM._CSS._SET_DISABLED = function(ELEMENT_ID, STATUS)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		ELEMENT.disabled = STATUS;
		return;
	}

	CUSTOM._CSS._SET_VISIBILITY = function(ELEMENT_ID, STATUS)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		if(STATUS)
		{
			ELEMENT.style.display = "block";
		}
		else
		{
			ELEMENT.style.display = "none";
		}

		return;
	}

	CUSTOM._CSS._SET_BORDERCOLOR = function(ELEMENT_ID, COLOR)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		ELEMENT.style.borderColor = COLOR;
	}

/*---------------------------------------------------------------------
 * Customize functions for the Element.
 ---------------------------------------------------------------------*/
CUSTOM._ELEMENT = function(){};
	
	CUSTOM._ELEMENT._IS_TRUE = function(ELEMENT_ID)
	{
		var RESULT = false;

		if(document.getElementById(ELEMENT_ID) != null)
		{
			RESULT = true;
		}

		return RESULT;
	}	

	/**
	 * =================================================================================
	 * this created new element
	 * ELEM_TYPE - element type to be created
	 * ELEM_ID - element id (optional)
	 * ELEM_TXT - element text(optional)
	 * ELEM_VAL - element value(optional) 
	 * =================================================================================
	 */
	CUSTOM._ELEMENT._CREATE = function(ELEM_TYPE, ELEM_ID, ELEM_TXT, ELEM_VAL)
	{
		var CREATED_ELEMENT = "";

		if(CUSTOM._VAR_VALUE._IS_BLANK(ELEM_TYPE))
		{
			return;
		}

		CREATED_ELEMENT = document.createElement(ELEM_TYPE);

		if(!CUSTOM._VAR_VALUE._IS_BLANK(ELEM_ID))
			CREATED_ELEMENT.setAttribute("id", ELEM_ID);
		if(!CUSTOM._VAR_VALUE._IS_BLANK(ELEM_TXT)) 
			JSOC_ELEMENT.VAR_INNER_HTML(CREATED_ELEMENT, ELEM_TXT);
		if(!CUSTOM._VAR_VALUE._IS_BLANK(ELEM_VAL)) 
			JSOC_ELEMENT.VAR_VALUE(CREATED_ELEMENT, ELEM_VAL);

		return CREATED_ELEMENT;
	}

	/**
	 * =================================================================================
	 * this checks if the element given keep its existing innerHTML or not.
	 * ELEMENT_ID - the element's id.
	 * NEW_HTML - variable containing the innerHTML.
	 * KEEP_RECORDS - boolean condition if the existing innerHTML still remains or not. 
	 * =================================================================================
	 */
	CUSTOM._ELEMENT._KEEP_INNER_HTML_RECORDS = function
	(
		ELEMENT_ID, 
		NEW_HTML, 
		KEEP_RECORDS
	)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		if(KEEP_RECORDS === false)
		{
			ELEMENT.innerHTML = NEW_HTML;
		}
		else
		{
			ELEMENT.innerHTML += NEW_HTML;
		}

		return;
	}

	/*---------------------------------------------------------------------
	 * Customize functions for the CMB Element.
	 ---------------------------------------------------------------------*/
	CUSTOM._ELEMENT._CMB = function(){};

		/**
		 * =================================================================================
		 * this adds a value/innherHTML in a CMB from a JSON_OBJECT. 
		 * Optional, it can be ARRAY for its text
		 * ELEMENT_ID - the element's id.
		 * DATA_SET - JSON_OBJECT containing the values.
		 * SET_KEY - field for the CMB value.
		 * SET_TEXT - field for the CMB innerHTML/text. It can be in array form for multiple text.
		 * KEEP_RECORDS - keeping the existing record or not.
		 * WITH_COMMA - this is usually use for the set text if it is in an array. 
		 * =================================================================================
		 */
		CUSTOM._ELEMENT._CMB._VAR_ADD_FROM_JSON = function
		(
			ELEMENT_ID,
			DATA_SET,
			SET_KEY,
			SET_TEXT,
			KEEP_RECORDS,
			WITH_COMMA,
			CALLBACK_ADDRESS
		)
		{
			var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);
			var CTR = 0;
			var COUNTER = 1;
			var JSON_OBJECT = DATA_SET;
			var JSON_COUNT = JSRC_JSON.REF_READ(JSON_OBJECT, "JSON_COUNT");
			var NEW_HTML = "";
			var TEMP_SET_TEXT = SET_TEXT;

			while(CTR < JSON_COUNT)
			{
				SET_TEXT = "";

				if(CUSTOM._VALIDATE._IS_ARRAY(TEMP_SET_TEXT))
				{
					for(var i = 0; i < TEMP_SET_TEXT.length;  i++)
					{
						SET_TEXT += JSRC_JSON.REF_READ(JSON_OBJECT, TEMP_SET_TEXT[i], COUNTER);

						if(WITH_COMMA)
						{
							SET_TEXT += ", ";
						}
						else
						{
							SET_TEXT += " ";
						}
					}
				}
				else
				{
					SET_TEXT = JSRC_JSON.REF_READ(JSON_OBJECT, TEMP_SET_TEXT, COUNTER)
				}

				NEW_HTML += '<option value='+JSRC_JSON.REF_READ(JSON_OBJECT, SET_KEY, COUNTER)+'>'+SET_TEXT+'</option>';

				CTR++;
				COUNTER++;
			}

			CUSTOM._ELEMENT._KEEP_INNER_HTML_RECORDS(ELEMENT_ID, NEW_HTML, KEEP_RECORDS);

			if(CALLBACK_ADDRESS != "")
			{
				CALLBACK_ADDRESS();
			}
			return;	
		}
		
		/*
		*=================================================================================
		* this selects a given index number into a CMB element.
		* ELEMENT_ID - the CMB element ID.
		* SELECTED_INDEX - the given selected Index.
		*=================================================================================
		*/
		CUSTOM._ELEMENT._CMB._SELECTED_INDEX = function
		(
			ELEMENT_ID,
			SELECTED_INDEX
		)
		{
			var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

			ELEMENT.selectedIndex = SELECTED_INDEX;

			return;
		}
	/*---------------------------------------------------------------------
	 * Customize functions for Table/DGV.
	 ---------------------------------------------------------------------*/
	CUSTOM._ELEMENT._TABLE = function(){}

		CUSTOM._ELEMENT._TABLE._CLEAR = function(TABLE_NAME)
		{
			var TABLE = JSOC_ELEMENT.VAR_GET(TABLE_NAME);
			var tableRows = TABLE.getElementsByTagName('tr');

			for(var i = TABLE.rows.length-1; i > 0; i--)
			{
				 TABLE.deleteRow(i);
			}
		}

	/*-----------------------------------------
		Create a table its row and cells.
	 -----------------------------------------*/
	
	CUSTOM._CREATE_TABLE = function(TABLE_NAME)	
	{
		return 0;
	}

	CUSTOM._CREATE_ROW = function(TABLE_NAME, ROW_INDEX)
	{
		var TABLE_NEW_ROW = "";
		var TABLE_ELEMENT = JSOC_ELEMENT.VAR_GET(TABLE_NAME);

		if(TABLE_NAME == "")
		{
			alert("No table name.");
			return;
		}

		if(JSOC_ELEMENT.VAR_ELEMENT_EXISTS(TABLE_NAME)==false)
		{
			alert("No table exist.");
			return;
		}

		if(ROW_INDEX == "")
		{
			ROW_INDEX = 0;
		}

		TABLE_NEW_ROW = TABLE_ELEMENT.insertRow(ROW_INDEX);

		return TABLE_NEW_ROW;
	}

	CUSTOM._CREATE_CELL = function(TABLE_ROW, CELL_INDEX)
	{	
		if(TABLE_ROW == "")
		{
			return;	
		}

		var TABLE_NEW_CELL = "";

		TABLE_NEW_CELL = TABLE_ROW.insertCell(CELL_INDEX);

		return TABLE_NEW_CELL;
	}

	CUSTOM._CLEAR_TABLE = function(TABLE_NAME)
	{
		var TABLE = JSOC_ELEMENT.VAR_GET(TABLE_NAME);

		for(var i = 1; i < TABLE.rows.length-1; i++)
		{
			TABLE.deleteRow(i);
		}
	}

	/*----------------------------------------------------
		Add an event when an element has been clicked.
	 -----------------------------------------------------*/

CUSTOM._CLICK = function(){};
	
	CUSTOM._CLICK._HIGHLIGHT = function(ELEMENT_ID, STATUS, COLOR)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		if(COLOR == "" || COLOR == undefined)
		{
			COLOR = "#d9d9d9"
		}

		if(STATUS == false)
		{
			COLOR = ""
		}
		else if(STATUS == "both")
		{
			if(ELEMENT.style.backgroundColor != "")
			{
				COLOR = "";
			}
		}

		ELEMENT.style.backgroundColor = COLOR;
		
		return;
	}

	CUSTOM._CLICK._ELEMENT_CHECK = function (ELEMENT_ID, STATUS)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);
		var BOOLEAN = true;

		if(STATUS != undefined)
		{
			BOOLEAN = STATUS;
		}
		else
		{
			if(ELEMENT.checked == true)
			{
				BOOLEAN = false;
			}
			else
			{
				BOOLEAN = true;
			}
		}

		ELEMENT.checked = BOOLEAN;
		return;
	}
	CUSTOM._CLICK._ELEMENT_DISABLE = function(ELEMENT_ID)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		if(ELEMENT.disabled)
		{
			CUSTOM._CSS._SET_DISABLED(ELEMENT, false);
		}
		else
		{
			CUSTOM._CSS._SET_DISABLED(ELEMENT, true);
		}

		return;
	}

	CUSTOM._CLICK._ELEMENT = function (ELEMENT_ID)
	{
		JSOC_ELEMENT.VAR_GET(ELEMENT_ID).click();
	}

	/*-----------------------------------------
	
	 -----------------------------------------*/
CUSTOM._VALIDATE = function(){};
	
	CUSTOM._VALIDATE._ELEMENT_IS_CHECKED = function(ELEMENT_ID)
	{
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);
		var IS_CHECKED = ELEMENT.checked;

		return IS_CHECKED;
	}

	CUSTOM._VALIDATE._IS_ARRAY = function(VARIABLE)
	{
		var IS_ARRAY = Array.isArray(VARIABLE);

		return IS_ARRAY;
	}

	CUSTOM._VALIDATE._IS_EMPTY = function(ELEMENT_ID)
	{
		var IS_EMPTY = false;
		var ELEMENT = JSOC_ELEMENT.VAR_GET(ELEMENT_ID);

		if(ELEMENT.value  == "")
		{
			IS_EMPTY = true;
		}

		return IS_EMPTY;
	}

	/*-----------------------------------------
		
	 -----------------------------------------*/
CUSTOM._MODAL = function(){};

	CUSTOM._MODAL._VISIBLE = function(MODAL_ID, IS_SHOWN)
	{
		var SUB_PANEL_ID = 'JSOC_DIALOG_' + MODAL_ID + '_DIV';
		var SUB_INNER_ITEM_ID = MODAL_ID;
		var MODAL_BOX = null;

		SUB_PANEL_CONTROL = JSOC_ELEMENT.VAR_GET(SUB_PANEL_ID);
		MODAL_BOX = JSOC_ELEMENT.VAR_GET(SUB_INNER_ITEM_ID);

		// Display Progress
		// _______________________________________________________________________
		if(IS_SHOWN == true)
		{
			JSOC_DIALOG.VAR_BASE_BG('MODALBOX', true);
            JSOC_STYLE.VAR_VISIBILITY(SUB_PANEL_CONTROL, 'VISIBLE');       
            JSOC_STYLE.VAR_VISIBILITY(MODAL_BOX, 'VISIBLE', 'FADE');	
            SUB_PANEL_CONTROL.scrollTop = 0;
		}
		else
		{
			JSOC_DIALOG.VAR_BASE_BG('MODALBOX', false);
            JSOC_STYLE.VAR_VISIBILITY(SUB_PANEL_CONTROL, 'HIDDEN');       
            JSOC_STYLE.VAR_VISIBILITY(MODAL_BOX, 'HIDDEN', 'FADE');		
		}	
	}

	CUSTOM._MODAL._ALTERNATE_VISIBLE = function(MODAL_TO_BE_HIDDEN, MODAL_TO_BE_SHOWN)
	{
		if(CUSTOM._VALIDATE._IS_ARRAY())
		{
			var MODAL_LENGTH = MODAL_TO_BE_HIDDEN.length;
			for(var i = 1; i < MODAL_LENGTH; i++)
			{
				CUSTOM._MODAL._VISIBLE(MODAL_TO_BE_HIDDEN[i], false);
			}
		}
		else
		{
			CUSTOM._MODAL._VISIBLE(MODAL_TO_BE_HIDDEN, false);
		}

		CUSTOM._MODAL._VISIBLE(MODAL_TO_BE_SHOWN, true);
	}	