AudioPlayer Introduction

AudioPlayer is the object that provides the required functions to play audio files. It can play various formats such as mp3, mp4, wav, ogg, and 3gp, and it also provides functions such as speaker balance adjustment, repeat play, and section repeat, as well as the basic play function. The user can implement the auto player in the desired form by combining the functions of the provided object.

Playing Audio

Implement the simple audio player using the AudioPlayer object function. The basic audio file play process can be largely divided into two stages, which are loading and playing the audio file.

For loading the audio file, the load method is used. Enter the file name of the audio file along with the path. Once the audio file is successfully loaded, the path information is automatically set in the URL property, and the play time is automatically set in the duration property.

For playing the audio file, the play, stop, pause, and resume methods are used. It configures the interface, and if it is used in appropriate combinations according to needs, then various functions required for play can be implemented. The interval time transmitted as the argument when calling the play method makes the onplaying event occur periodically during audio play.

${sample}

The following is an example of the simple audio player that loads and plays the audio file.

When the screen is displayed, the preset audio file is automatically loaded. You can operate the play function by using the Play, Pause, and Stop buttons at the bottom. When you touch the Play button, play starts and it is changed to the Pause button. When you touch the Pause button, play is paused, and when you touch the Stop button, play is stopped.

The progress of play is indicated by the progress bar and time.

${sample_element}

AudioPlayer > load

This is the method that loads AudioPlayer so that the audio file can be played. Enter the path and file name as the argument.

AudioPlayer > play

This is the method that plays the loaded audio file. The time value is set as the argument, and the onplaying event occurs periodically according to the time value. When the method is executed, the onplay event occurs, and the onplaying event occurs at the period of the set argument value. When the play starts, the e.reason property value is 1, and it becomes 3 during play.

AudioPlayer > stop

This is the method that stops playing the audio file. When the play is stopped, the onstop event occurs and the e.reason property value is 5.

AudioPlayer > pause

This is the method that pauses the audio file. When the pause method is called, the onstop event occurs and the e.reason property value is 6.

AudioPlayer > resume

This is the method that replays the paused audio file. When the method is executed, the onplay event occurs and the e.reason property value is 2.

AudioPlayer > url

This is the read-only property that contains the path information of the audio file loaded in AudioPlayer. The path of the audio file when the load method is called is automatically set.

${sample_step}

Add the AudioPlayer object. The added object can be checked in the Invisible Object window.

Place the current file path information as the Static component, the ProgressBar component to display the play progress, and the Button component to perform play/pause/stop functions appropriately as shown in the example figure.

Components and objects used to configure the screen are as follows.

Declare the global variable of enum type to manage the status information of the player.

eStatus = {
	LOAD: 0,
	PLAY: 1,
	RESUME: 2,
	PLAYING: 3,
	ENDOFPLAY: 4,
	STOP: 5,
	PAUSE: 6,
	SEEK: 7
};
var ePlayerStatus = eStatus;

Write the following method to convert the play time of the loaded audio file into minutes and seconds for the user to view easily.

this.convertTime = function(nTime)
{
	var nMin = parseInt((nTime / 1000) / 60);
	var nSec = parseInt((nTime / 1000) % 60);

	var strTime = nMin.toString() +"min "+ nSec.toString() +"sec";
		
	return strTime;
}

Write the following method to set the progress bar so that the current progress can be viewed at glance during play.

this.updateProgress = function(nCurrentTime, nTotalTime)
{
	var strPercentage = parseInt((nCurrentTime / nTotalTime) * 100);
		
	this.prb_time.set_pos(strPercentage);
}

Write the following method to initialize the progress bar that displays the progress when the play is stopped or completed.

this.initProgress = function()
{
	this.prb_time.set_pos(0);
	this.prb_time.set_text(this.convertTime(this.AudioPlayer00.duration));
}

Write the onload event function of Form as follows. When Form is loaded, the preset audio file path is loaded to the AudioPlayer object.

this.sample_audioplayer_01_onload = function(obj:nexacro.Form,e:nexacro.LoadEventInfo)
{
	var strFilePath = "%USERAPP%File/Dutch Swing College Band - Aux Champs Elysees.mp3";

	this.AudioPlayer00.load(strFilePath);
};

Write the onload event function that occurs after the audio file is loaded.

this.AudioPlayer00_onload = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{
	this.stt_filepath.set_text(this.AudioPlayer00.url);
	this.initProgress();	
};

Write the onplay event function that occurs when the audio file starts playing.

this.AudioPlayer00_onplay = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{
	ePlayerStatus = eStatus.PLAY;
	this.btn_play.set_text("Pause");
};

Write the onplaying event function that occurs periodically during the play of the audio file.

this.AudioPlayer00_onplaying = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{
	this.prb_time.set_text(this.convertTime(this.AudioPlayer00.currentpos) +" / "+ this.convertTime(this.AudioPlayer00.duration));
	this.updateProgress(this.AudioPlayer00.currentpos, this.AudioPlayer00.duration);
};

Write the onstop event function that occurs when the audio file stops playing.

this.AudioPlayer00_onstop = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{	
	switch(e.reason)
	{
		case 4: //End of play
			ePlayerStatus = eStatus.ENDOFPLAY;
			this.initProgress();
			
		case 5: //STOP
			ePlayerStatus = eStatus.STOP;
			this.initProgress();
			break;

		case 6:	//PAUSE			
			ePlayerStatus = eStatus.PAUSE;
			break;
	}
	
	this.btn_play.set_text("Play");
	
};

Write the onerror event function that occurs when the processing of the audio file in the AudioPlayer object fails.

this.AudioPlayer00_onerror = function(obj:nexacro.AudioPlayer,e:nexacro.AudioErrorEventInfo)
{
	var strResult = "["+ e.errortype +"] "+ e.statuscode +" "+ e.errormsg;
	
	trace(strResult);
};

Write the onclick event function that occurs when the Play/Pause button is touched. It processes which function to perform based on the current player status.

this.btn_play_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	var nIntervalTime = 1000;	//ms
	
	switch(ePlayerStatus)
	{
		case eStatus.PAUSE:
			this.AudioPlayer00.resume();
			break;
		case eStatus.PLAY:
			this.AudioPlayer00.pause();
			break;
		default:
			this.AudioPlayer00.play(nIntervalTime);
	}

Write the onclick event function that occurs when the Stop button is touched.

this.btn_stop_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.AudioPlayer00.stop();
};

When the Form is loaded, the audio file is automatically loaded and ready to play.

Use the Play, Pause, and Stop buttons at the bottom to check if the play, pause, and stop functions of the audio file are operating properly. When the play starts, the play time and progress are displayed on the progress bar.