Bits & Bytes

Posts Tagged ‘programming’

A Simple JavaScript Code Example

To begin, create an HTML file and copy the code from our post A Basic HTML Page Template, and we will paste our JavaScript into it. You can use a simple text editor, like Notepad, to create the file. I will use “SimpleJavascriptExample.html” as the name of my file and paste this code inside the body tags:

<script type="text/javascript">
  document.write("Welcome to XoaX.net!");
</script>

After pasting the JavaScript code above into the HTML file, the code in the file should look like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  <title>XoaX.net</title>
</head>
<body>

<script type="text/javascript">
  document.write("Welcome to XoaX.net!");
</script>

</body>
</html>

Now, if we open the file with a browser, we will see the message “Welcome to XoaX.net!” printed out. This exact message could be written without JavaScript by just putting the message inside the body tags by itself. However, we are preparing the way to write more complex JavaScript examples.

In this example, we have one line of JavaScript code inside of the script tags. The script tags, along with the type designation “text/javascript,” tell the browser that the enclosed code is JavaScript. The single line of JavaScript code inside the tags tells the browser to call the write() function on the document object with the argument “Welcome to XoaX.net!”. The semicolon at the end of the line signals the end of the command.

Loading and Playing a Sound File in Actionscript 3.0

This program loads an mp3 file and plays it. The entire program is given below and the compiled SWF is shown above. To hear the file play, left-click the window above.

The code begins with three lines that tell the user to click the screen. Then we create a String for the URL, which could also be a local file. Next, we set our function as the callback for mouse clicks. Inside the function OnClick(), we create a Sound object, load the sound file, and then play it.

// Output the initial instructions to user
var qInstructions:TextField = new TextField();
qInstructions.text = "Click To Play";
addChild(qInstructions);

const ksXoaXDotNet:String = "http://www.xoax.net/public/XoaXDotNet.mp3";

// Play the mp3 when the screen is clicked
stage.addEventListener(MouseEvent.CLICK, OnClick);

function OnClick(e:MouseEvent): void {
	var qSound:Sound = new Sound();
	qSound.load(new URLRequest(ksXoaXDotNet));
	qSound.play();
}

Responding to Mouse Click Events in Actionscript 3.0

To respond to mouse events of any kind, we create a callback function that takes a MouseEvent and returns void. Then we call addEventListener() with the event and the callback function. Below, we show how this is done for MOUSE_DOWN and MOUSE_UP events, but the same method can be used for all of the mouse event types.

Inside the callback functions, we change the message that is displayed by the TextField and position the message to be displayed where the event occurred. If you click in the box above, you will see the message change and move as you press and release the left mouse button. In this example, we position the message using the stage coordinates. However, we can also use the members localX and localY to get the position based on the object that is listening for the events.

var qMessage:TextField = new TextField();
qMessage.text = "Click In Here";
addChild(qMessage);

stage.addEventListener(MouseEvent.MOUSE_DOWN, OnPress);
function OnPress(e:MouseEvent): void {
	qMessage.text = "Down";
	qMessage.x = e.stageX;
	qMessage.y = e.stageY;
}

stage.addEventListener(MouseEvent.MOUSE_UP, OnRelease);
function OnRelease(e:MouseEvent): void {
	qMessage.text = "Up";
	qMessage.x = e.stageX;
	qMessage.y = e.stageY;
}

Categories

Recent Posts

Bits & Bytes

Posts Tagged ‘programming’

A Simple JavaScript Code Example

Loading and Playing a Sound File in Actionscript 3.0

Responding to Mouse Click Events in Actionscript 3.0