Date

Implementing Timer

The basic function of the timer is to select a time and display an alarm after the specified time. In the example, we will implement a simple timer operation.

Example

Select a time in the Combo component and click the button to start the timer.

sample_date_01.xfdl

Core features used in the example

Date

Creates the Date object and processes the time notation to process date or time values.

How to implement an example

1

Configuring Form Screen

Place the Combo, Button, and Static components on the screen. The Static component is responsible for displaying the timer time.

2

Setting Combo Component innerdataset

The Combo component is used to specify the timer time. The example provides only 5 views. If you click the button marked [...] next to the innerdataset property item, the window for entering InnerDataset appears.

3

Writing Button onclick Event Function

Calculate the timing of timer operation based on the value selected in the Combo component. Convert the value to milliseconds for calculation and convert it back to the time that can be shown to the user before displaying the time.

this.session_Endtime= null;
this.curTime = null;

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	var holding_time = this.Combo00.value*60*1000;
	this.session_time = new Date().valueOf();
	this.session_Endtime = new Date(this.session_time + holding_time);  
	var millis = this.session_Endtime- this.session_time;
	var t = this.millisToTime(millis);
	this.Static00.text = "It will be logout after " + t[1]+"Minute and "+t[2]+ " Seconds automatically.";     
	this.setTimer(100,1000);
};

this.millisToTime =  function (millis)
{
	//Hour
	var hours = Math.floor(millis/(1000*60*60), 0);
	//Minute
	var minutes = Math.floor(millis/(1000*60) % 60, 0);
	//Seconds
	var seconds = Math.floor((millis/1000) % 60, 0);
	return [hours,minutes,seconds];
};

4

Writing ontimer Event Function of Form Object

Whenever the ontimer event occurs, it changes the time displayed in the Static component. When there is no more time to display, (if(t[2] <= 0)) indicates that the timer has expired.

this.sample_date_01_ontimer = function(obj:nexacro.Form,e:nexacro.TimerEventInfo)
{
	if(e.timerid == 100)
	{
		this.session_time = new Date().valueOf();
		var millis = this.session_Endtime- this.session_time;
		var t = this.millisToTime(millis);
		if(t[2] <= 0 )
		{
			this.Static00.text = "Session is terminated, it is logout automatically. ";
			return;
		}
		this.Static00.text = "It will be logout after " + t[1]+" Minute and "+t[2]+ " Seconds automatically.";
	}
};

5

Checking with QuickView

Run QuickView (Ctrl + F6) and run the timer by selecting the timer time in the Combo component.

Getting Information from Date Entered

Convert the date input as the character string into the Date object and extract related information.

Example

Enter the date and click the button to output the relevant information.

sample_date_02.xfdl

Core features used in the example

addDate

This is the method that adds up to the specified date. If it is specified as a negative number, it can be subtracted by the specified date.

getDay

Returns the weekday value corresponding to the date of the Date object. Since the index value from 0 to 6 is returned, the corresponding string is matched and processed when displayed as text.

How to implement an example

1

Configuring Form Screen

Place the MaskEdit component, Button component, and TextArea component. Set the format property value of the MaskEdit component to "####/##/##" and the type property value to "string".

2

Writing onclick Event Function

Since multiple information is processed and displayed in the TextArea component, Separate and process functions that process information.

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.TextArea00.value = "lastDay: "+this.fn_lastDay(this.MaskEdit00.value)+"\n"
		+"day of the week: "+this.fn_hanGulWeek(this.MaskEdit00.value);
};

3

Finding Last Date Function

Set the input date string to the Date object. If there is no inputted value, then it is processed based on today's date. The value corresponding to Month is processed from 0 to 11. For example, the new Date (2000,11,1) is December 1st, 2000.

this.fn_lastDay = function(sDate) 
{
    var dDate = "";
	
	if (sDate == null || sDate == "" || sDate == "undefined")  
	{
		dDate = (new Date()).addMonth(1);
	    dDate.addDate((new Date(dDate)).getDate()*-1);
    }
    else 
    {
	    dDate = new Date(parseInt(sDate.substr(0,4)), parseInt(sDate.substr(4,2)), 1);
	    dDate.addDate(-1);	
    }
	
    var sRtn =  dDate.getFullYear()
	+ (dDate.getMonth()+1).toString().padLeft(2, "0")
	+ dDate.getDate().toString().padLeft(2, "0");  
	
	return sRtn;
};

4

Finding Day of the Week Function

Create an array of the day of the week string to be displayed, and specify the value obtained by the getDay() method as the index of the array.

this.fn_hanGulWeek = function(sDate) 
{
    var dDate    = new Date(parseInt(sDate.substr(0,4))
						  , parseInt(sDate.substr(4,2))-1
						  , parseInt(sDate.substr(6,2)));
    var sDay     = dDate.getDay();
	var arrweek  = new Array("Sun.", "Mon.", "Tue.", "Wed.", "Thu.", "Fri.", "Sat.");
	var sRtn     = arrweek[sDay];

	return sRtn;
};

5

Checking with QuickView

Run QuickView (Ctrl + F6) and enter the date string to check the result.