analytics/webcontent/prompting/CClockIE5.js

/*
 *+------------------------------------------------------------------------+
 *| Licensed Materials - Property of IBM
 *| BI and PM: prmt
 *| (C) Copyright IBM Corp. 2002, 2018
 *|
 *| US Government Users Restricted Rights - Use, duplication or
 *| disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 *|
 *+------------------------------------------------------------------------+
*/


/*
CClockIE5.js

This script is used to provide an analog clock for the time picker
prompt component.
*/

//Constructor to create a clock component
//	oParent: the time picker control
//	sDate: string, date used to set the clock to the correct time
//	sRef: string, name of the instance of the object
//	iMode:	0 = static clock
//			1 = live clock
//	bShowSecondHand: true/false

function CClock(oParent, sDate, sRef, iMode, bShowSecondHand, sCVId)
{
	this.setCVId(sCVId);
	//Clock face height
	this.m_iFaceHeight=70;
	//Clock face width
	this.m_iFaceWidth=60;

	var iXPadding = 10;
	var iYPadding = 10;

	//instantiate the hands on
	//the clock face
	var sHourHand ='................';
	this.m_arHourHand = sHourHand.split(K_PRMT_sEMPTY);
	var sMinuteHand ='......................';
	this.m_arMinuteHand = sMinuteHand.split(K_PRMT_sEMPTY);
	var sSecondHand ='..........................';
	this.m_arSecondHand = sSecondHand.split(K_PRMT_sEMPTY);
	this.m_bShowSecondHand = bShowSecondHand;

	this.m_Y = this.m_iFaceHeight + iXPadding;
	this.m_X = this.m_iFaceWidth + iYPadding;

	this.m_iClockTicks=12;
	this.m_iClockTickDegrees=360/this.m_iClockTicks;

	//Date object used to control the clock
	if (sDate)
	{
		//use the given date/time
		this.m_dDate = new Date(sDate);
	}
	else
	{
		//initialize clock
		this.m_dDate = new Date();
		this.m_dDate.setHours(0);
		this.m_dDate.setMinutes(0);
		this.m_dDate.setSeconds(0);
		this.m_dDate.setMilliseconds(0);
	}

	this.m_oParent = oParent;

	this.m_sRef=sRef;

	//determine browser for DHTML type
	this.m_isNS7 = browserIsNS7();

	this.init();
	this.draw();

	this.m_iMode = iMode;

	if (this.m_iMode == 1)
	{
		this.funcInterval = setInterval( this.drawLiveTime.bind(this), 100 );
	}

}

CClock.prototype = new CPromptControl();


//initialize the clock
function CClock_init()
{
	//initialize the clock
	var oclsDivClock = document.createElement("DIV");
	oclsDivClock.className = "clsDivClock";
	this.m_oParent.appendChild(oclsDivClock);

	var oclsDivRelative = document.createElement("DIV");
	oclsDivRelative.className = "clsDivRelative";
	oclsDivClock.appendChild(oclsDivRelative);

	var i = 0;
	for (i=1; i < this.m_iClockTicks +1; i++)
	{
		var oClockDigitElement = document.createElement("DIV");
		oClockDigitElement.className = "clsClockDigits";
		oClockDigitElement.id = 'clockDigits'+this.m_sRef+ i;
		var oClockDigitElementLabel = document.createTextNode(i);
		oClockDigitElement.appendChild(oClockDigitElementLabel);
		oclsDivRelative.appendChild(oClockDigitElement);
	}

	for (i=0; i < this.m_arMinuteHand.length; i++)
	{
		var oClockMinuteElement = document.createElement("DIV");
		oClockMinuteElement.className = "clsMinuteHand";
		oClockMinuteElement.id = 'minuteHand'+ this.m_sRef+ i;
		oclsDivRelative.appendChild(oClockMinuteElement);
	}

	for (i=0; i < this.m_arHourHand.length; i++)
	{
		var oClockHourElement = document.createElement("DIV");
		oClockHourElement.className = "clsHourHand";
		oClockHourElement.id = 'hourHand' + this.m_sRef+ i;
		oclsDivRelative.appendChild(oClockHourElement);
	}

	if (this.m_bShowSecondHand==true)
	{
		for (i=0; i < this.m_arSecondHand.length; i++)
		{
			var oClockSecondElement = document.createElement("DIV");
			oClockSecondElement.className = "clsSecondHand";
			oClockSecondElement.id = 'secondHand' + this.m_sRef+ i;
			oclsDivRelative.appendChild(oClockSecondElement);
		}
	}
}

//render the clock on screen
function CClock_draw()
{
	// check if  a valid instance is being used
	var oId = 'clockDigits' + this.m_sRef + 1;
	var o = document.getElementById(oId);
	if (o == null) {
		return;
	}

	//draw the clock
	//this will draw the whole clock
	this.drawClockFace();
	this.drawHour();
	this.drawMinute();

	if (this.m_bShowSecondHand==true)
	{
		this.drawSecond();
	}

}

//render the clock face
function CClock_drawClockFace()
{
	//draw the face of the clock
	for (var i=0; i < this.m_iClockTicks; ++i)
	{
		var oId = 'clockDigits' + this.m_sRef + (i+1);
		var o = document.getElementById(oId);

		if (o != null)
		{
			if (this.m_isNS7 == true || window.edge == true)
			{
				o.style.top = this.m_Y +this.m_iFaceHeight*Math.sin(-1.045 +i *this.m_iClockTickDegrees*Math.PI/180) + 'px';
				o.style.left = this.m_X +this.m_iFaceWidth*Math.cos(-1.045 +i *this.m_iClockTickDegrees*Math.PI/180) + 'px';
			}
			else
			{
				o.style.pixelTop = this.m_Y +this.m_iFaceHeight*Math.sin(-1.045 +i *this.m_iClockTickDegrees*Math.PI/180);
				o.style.pixelLeft = this.m_X +this.m_iFaceWidth*Math.cos(-1.045 +i *this.m_iClockTickDegrees*Math.PI/180);
			}
		}
	}
}

//render the second hand
function CClock_drawSecond()
{
	var iSeconds = this.m_dDate.getSeconds();
	var iSecond = -1.57 + Math.PI * iSeconds/30;

	for (var i=0; i < this.m_arSecondHand.length; i++)
	{
		var oId = 'secondHand' + this.m_sRef + (i);
		var o = document.getElementById(oId);

		if (o != null)
		{
			if (this.m_isNS7 == true || window.edge == true)
			{
				o.style.top = (this.m_Y +i*2*Math.sin(iSecond)) + 'px';
				o.style.left = (this.m_X +i*2*Math.cos(iSecond)+5) + 'px';
			}
			else
			{
				o.style.pixelTop = this.m_Y +i*2*Math.sin(iSecond);
				o.style.pixelLeft = this.m_X +i*2*Math.cos(iSecond)+5;
			}
		}	
	}
}

//render the minute hand
function CClock_drawMinute()
{
	var iMinutes = this.m_dDate.getMinutes();
	var iMinute = -1.57 + Math.PI * iMinutes/30;
	for (var i=0; i < this.m_arMinuteHand.length; i++)
	{
		var oId = 'minuteHand' + this.m_sRef + (i);
		var o = document.getElementById(oId);
		if (o != null)
		{
			if (this.m_isNS7 == true || window.edge == true)
			{
				o.style.top = (this.m_Y +i*2*Math.sin(iMinute))+ 'px';
				o.style.left = (this.m_X +i*2*Math.cos(iMinute) + 5) + 'px';
			}
			else
			{
				o.style.pixelTop =this.m_Y +i*2*Math.sin(iMinute);
				o.style.pixelLeft=this.m_X +i*2*Math.cos(iMinute)+5;
			}
		}
	}
}

//render the hour hand
function CClock_drawHour()
{
	var iHours = this.m_dDate.getHours();
	var iHour = -1.57 + Math.PI * iHours/6 + Math.PI*parseInt(this.m_dDate.getMinutes(),10)/360;
	for (var i=0; i < this.m_arHourHand.length; i++)
	{
		var oId = 'hourHand' + this.m_sRef + (i);
		var o = document.getElementById(oId);
		if (o != null)
		{
			if (this.m_isNS7 == true || window.edge == true)
			{
				o.style.top = (this.m_Y +i*2*Math.sin(iHour)) + 'px';
				o.style.left = (this.m_X +i*2*Math.cos(iHour)+ 5) + 'px';
			}
			else
			{
				o.style.pixelTop = this.m_Y +i*2*Math.sin(iHour);
				o.style.pixelLeft = this.m_X +i*2*Math.cos(iHour)+5;
			}
		}	
	}
}

//set the clock time hours, minutes and seconds
function CClock_clockSetTime(iHour, iMinute, iSecond)
{
	var bUpdateHour = false;

	if (iHour != this.m_dDate.getHours())
	{
		this.m_dDate.setHours(iHour);
		bUpdateHour = true;
	}

	if (iMinute != this.m_dDate.getMinutes())
	{
		this.m_dDate.setMinutes(iMinute);
		this.drawMinute();
		bUpdateHour = true;
	}
	if (iSecond != this.m_dDate.getSeconds())
	{
		this.m_dDate.setSeconds(iSecond);
		if (this.m_bShowSecondHand == true)
		{
			this.drawSecond();
		}
	}
	if (bUpdateHour == true)
	{
		this.drawHour();
	}

}

//draw the live clock
function CClock_drawLiveTime()
{
	var dLiveDate = new Date();

	var thisTime = dLiveDate.getHours() + K_PRMT_sCOLON + dLiveDate.getMinutes() + K_PRMT_sCOLON + dLiveDate.getSeconds();
	if (thisTime == this.lastLiveTimeDraw)
	{
		// do not redraw the clock if it is the same thing as the last draw.
		return;
	}
	this.lastLiveTimeDraw = thisTime;

	this.m_dDate.setHours(dLiveDate.getHours());
	this.m_dDate.setMinutes(dLiveDate.getMinutes());
	this.m_dDate.setSeconds(dLiveDate.getSeconds());
	this.draw();
}

//stop the live clock
function CClock_stopLiveTime()
{
	if (this.m_iMode==1)
	{
		this.m_iMode = 0;
		clearInterval(this.funcInterval);
	}
}

//Prototypes to assign methods to new instances of the object
CClock.prototype.init = CClock_init;
CClock.prototype.draw = CClock_draw;
CClock.prototype.drawClockFace = CClock_drawClockFace;
CClock.prototype.drawHour = CClock_drawHour;
CClock.prototype.drawMinute = CClock_drawMinute;
CClock.prototype.drawSecond = CClock_drawSecond;
CClock.prototype.clockSetTime = CClock_clockSetTime;
CClock.prototype.drawLiveTime = CClock_drawLiveTime;
CClock.prototype.stopLiveTime = CClock_stopLiveTime;