Archive for January, 2010

Flash Tutorial 4: Fun with the Cursor!

Jan 29th

Posted by Thomas Palmer in Adobe Flash Basics

No comments

This tutorial is in action-script 2.0

First, lets make a cursor.
Draw a cursor and turn it into a movie clip.
open up the actions window for the movie clip and place this action-script in it:

this.startDrag("true");

now go into your first frame’s actions window and type:

Mouse.hide();

congratz! you now have a custom cursor!

but, lets do a little more now.

go into your cursor’s movie-clip and make two dynamic text boxes next to your cursor. now, give one box the instance name mousex and the other the instance name mousey.

now, select your cursor image (not the text boxes) and make it into a movie-clip again, so you have a movie-clip inside a movie-clip. in the actions of your new movie clip, type:

1
2
3
4
onClipEvent(enterFrame){
_parent.mousex.text = _root._xmouse;
_parent.mousey.text = _root._ymouse;
}

Now you can see the coordinates of your mouse!

Networking

Jan 23rd

Posted by Dennis Thompson in Tech Tips

No comments

Note: Some things are changed for ease of example.

For this tech tip, we’ll be looking at the different problems/consequences of handling wireless networks as well as looking at the benefits of a wireless network.

If you’re running windows vista then your gateway to the wireless and wired world for networking lays in the the dual computer icon like so: (the icon in the middle, parallel to "Friday").

If you right click on this icon, you’ll get an array of options you can choose. The most important option is the very last one entitled Network and Sharing Center. It will look like so:

The fist thing I would like to highlight is the first choice on the left side menu, View computers and devices option that enables you to see computers and other hardware connected to the network whether wirelessly or hard wired. If you click on the option, a window like the image below will appear:

This allows you to see all devices that your computer sees. This includes other computers on the same network as you (router or hard wire), shared printers, wireless router(s), and other devices. This particular option can be beneficial if you need to quickly know the IP address of your router (you can do this by right-clicking on your router and then selecting properties) or if you want to access your router via web you can right-click and it’ll take you to the necessary web page. If you have more than one computer on the same network you can explore them and share content between the two systems easily and you could also print wirelessly too.

This next part deals with the connections that you can potentially connect to. The networks that my computer picks up on are wifi signals from my router as well as my neighbor’s router. I have the choice to connect to either one if I wanted; however, If I wish to connect to my neighbor’s I would need a password in order to access his wireless internet hence, Security-Enabled Network.

 

The next part is vital to fixing a common problem encountered by many people that are new to a wireless networking system. If you ever get an error stating that you cannot connect due to previous internet settings for this network, your problem and your solution are in the same place. Example: Let us say that Jon is our best friend so we go over to his house a lot and we do all sorts of things and one of those things is that we enjoy looking for deals online. Jon, one day, decides to purchase a new router and cable modem and decides to set up a 128 bit encryption so no one steals his internet anymore. You help him set it up and later on he messes up on the settings so he resets the wifi router and starts from scratch. You come back the next day, like every other day, and you see how he’s doing along with the wife, kids, grandparents, etc. You try to connect but a window pops up stating that you cannot connect because you have previous settings for this particular wifi system. Your solution is to delete that particular wireless network that is saved on your computer by clicking on the Manage Wireless Networks option on the left hand menu of the Network and Sharing Center. Select the network that is giving you trouble (in this case Jon’s Network) and delete it. Go back to the Connect to a Network option and then select the proper one and enter the correct information and it’ll work like a charm! Note: "Security WEP" isn’t really lime green, it was highlighted to make it known that for these connections you must enter in a password, passphrase, or some type of code.

Setting up an internet connection and be done in various ways but it isn’t always necessary either. Depending on your needs, you can set up a home network with a broadband connection, wireless connection, setting up a router, wireless ad hoc connection, etc. These are all relative to your type of internet connection of course.. So here’s the down low on all of the options. Connect to a Network is the same procedure as connecting to a network through the connect to a network as mentioned previously; however you’ll need to specify wireless, broadband, or dial-up. If you choose wireless then you will follow the same procedure as mentioned before. For Broadband (PPoE), you will need to enter in the username and password that your ISP provides for you and enter in that information. For Dial-Up, you’ll need the phone number, username, and password your ISP gave you in order to connect to the internet. Note: For Dial-Up, you will need to enter some additional information before you setup the connection.

Connection types

PPoE Connection window

Dial-Up Connection window

The next option on our list is to Setup a wireless router or access point. The access point is usually for small businesses so the business can have printer and file sharing via the access point. For most folks, you’ll want to set a wireless router. Windows will provide you with the necessary information on setting up a wireless router and the security that is needed to protect your personal information.

Wireless and access point setup

You can manually connect to a wireless network by providing all the necessary information in order to connect to the wireless router. You’ll need the correct network name, the correct security type, encryption type (which is relative to the security type), and the Security Key/Phassphrase.

Manually connect to a Wireless network

The next option is something called an Ad Hoc network setup in which small businesses can be connected to the same network and be able to share info between them easily. The computers must be within 30 feet of each other, however…

Ad hoc network

The next and final option is setting up a network through a workplace. You’ll have to decide whether or not you wish to simply "dial into" your workplace or get through via a VPN (Virtual Private Network). A VPN is defined as a network that connects one or more computers to a large network, such as a business network, using the Internet. A VPN is encrypted, so only authorized people have access to it.

Basics of XHTML Part – #6

Jan 22nd

Posted by Dennis Thompson in HTML/XHTML Basics

No comments

Today we are going to talk about List types in HTML. There are three lists that HTML supports:

  • Unordered Lists
  • Ordered Lists
  • Definition Lists

Unordered Lists

An unordered List is a list that have bullets in front of the list item (normally little black circles). The Unordered List starts with a <ul> tag and each new item starts with an <li> tag. The syntax is as follows:

<ul>
     <li>Item 1</li>
     <li>Item 2</li>
     <li>Item 3</li>
</ul>

The browser output will look this:

  • Item 1
  • Item 2
  • Item 3

You can put unordered lists inside paragraphs, line breaks, links, images, lists, and other non-block level elements. We would use an unordered list if we wanted to create a list that didn’t have any specific order, like a grocery shopping list.

We can also change how the bullets look without using style sheets or inline css. Within the <ul> tag we simply add an attribute called type and add the value we want. Here are the values we can put:

  1. disc
  2. circle
  3. square

Here is the syntax:

<ul type="disc">
     <li>Item 1</li>
     <li>Item 2</li>
</ul>
<ul type="circle">
     <li>Item 1</li>
     <li>Item 2</li>
</ul>
<ul type="square">
     <li>Item 1</li>
     <li>Item 2</li>
</ul>

The browser output is like this:

  • Item 1
  • Item 2
  • Item 1
  • Item 2
  • Item 1
  • Item 2

Ordered List

An ordered list is a list that is marked with numbers instead of bullets. The ordered list starts with an <ol> tag and then each list item (like the unordered list) has the <li> tag around the item. The syntax is as follows:

<ol>
     <li>Item 1</li>
     <li>Item 2</li>
     <li>Item 3</li>
</ol>

The browser output will look this:

  1. Item 1
  2. Item 2
  3. Item 3

You can put unordered lists inside paragraphs, line breaks, links, images, lists, and other non-block level elements. We would use an ordered list if we wanted to create a list thathas a specific order. A good example would be if you were creating a step by step guide.

Like the unordered list, there is a way to change the list type without using styles or inline css to an ordered list. Here is the syntax:

<ol type="A"> <!--Upper Alpha-->
<li>Item 1</li>
<li>Item 2</li>
</ol>
<ol type="a"> <!--Lower Alpha-->
<li>Item 1</li>
<li>Item 2</li>
</ol>
<ol type="I"> <!--Upper Roman-->
<li>Item 1</li>
<li>Item 2</li>
</ol>
<ol type="i"> <!--Lower Roman-->
<li>Item 1</li>
<li>Item 2</li>
</ol>

The browser output will look like this:

  1. Item 1
  2. Item 2
  1. Item 1
  2. Item 2
  1. Item 1
  2. Item 2
  1. Item 1
  2. Item 2

Definition List

A definition list isn’t really a list but rather a list of items (terms) and each item (term) has a description.

The definition list begins with an <dl> (definition list) tag.

Each term starts with a <dt> (definition term) tag.

Each term description starts with a <dd> (definition description) tag.

The browser output will look like this:

Item 1
Description 1
Item 2
Description 2
Item 3
Description 3

Creating an .iso file

Jan 21st

Posted by Dennis Thompson in Tech Tips

No comments

In this tech tip, we will be looking at the iso files and how to create them and why .iso files are easy and convenient.In this process, I’ll be using a program called poweriso, which can be found here.

Step 1

In order to create our iso image, we need to gather the necessary folders and/or files that will make up the .iso. You want to drag the folders and files into the main window like the image below: Please note that you can insert a disc that already has information on it and compile the cd into an iso file by using the copy function or by saving the information as an iso file as discussed in step 2.

and then you’ll see a few things happening that we want to be aware of. The first thing is the blue bar at the bottom where it says the total size of the contents of the disc, which in our case is a CD that will have 608MB or 86% of that CD to be filled. If we happen to exceed 700MB, poweriso will automatically change to a DVD for storage.

Step 2

Once we have our necessary files, we can burn the iso image onto a CD or DVD (depending on the size of the data), insert the proper media into your disk drive and then we need to save the file as an .iso by going to file > save as > <filename>.iso. Once our iso is saved on our hard drive, click on the burn button and then you’ll see a dialogue box appear like the image below:

Using the .iso image that we just saved on our hard drive, if it is not already selected, select the image file, select the drive that you media is in, autodetect the media, burning speed is relative to the job (usually max is fine), and if you wish to verify the data thereafter then check the checkbox and then hit burn! For creating ad burning an .iso it is as easy as step 1 and step 2!

The benefits of having an .iso file is that it is popular for creating an image of a disc, it can be compressed and optimized, and it is very user friendly.

Basics of XHTML Part – #5

Jan 20th

Posted by Dennis Thompson in HTML/XHTML Basics

1 comment

Today we’re going to talk about HTML Tables! Tables were created in May of 1996 as in update to HTML 2.0. Since then, tables were a way for us to layout our websites and/or information in a document. Frames became popular with HTML 3.0, HTML 3.2, and especially HTML 4.0. After Framesets fizzled out tables became the preferred method of website creation.

Now, websites are being created with intricate server side programs and CSS that will write HTML for you. Despite these improvements for website creation, if you just do a simple google search for a website, you’ll see that some are still made using tables. You can read all about the History of HTML by reading the wiki article on it.

Tables is a good starting point to understanding site layout and the flow of the page, so it’s still good to know!

Tables

Tables are defined by creating a <table> tag and then a <tr> and then a <td> So the order is as follows:

  1. table
  2. tr (table row)
  3. td (table cell)

The general syntax for tables is as follows:

<html>
<head>
</head>
<body>
<table>
     <tr>
          <td>table cell</td>
          <td>table cell</td>
     </tr>
</table>
row 1 cell 1 row 1 cell 2
row 2 cell 1 row 2 cell 2

The example above in the form of HTML would be like the following:

<table border="1">
     <tr>
          <td>row 1 cell 1</td>
          <td>row 1 cell 2</td>
     </tr>
     <tr>
          <td>row 2 cell 1</td>
          <td>row 2 cell 2</td>
     </tr>
</table>

Border Attribute

The border attribute is an attribute that will display (or not display) a border around the <table>, <tr>, and <td> tags – basically around all elements of a table. If, for example, you wanted to create a table with no border then you would do the following:

<table border="0">
     <tr>
          <td></td>
          <td></td>
     </tr>
</table>

You can substitute the 0 for any integer that is wanted. Consider the table example we made before the Border Attribute title. That has a border=”1″.

row 1 cell 1 row 1 cell 2
row 2 cell 1 row 2 cell 2

This is the same table but with a border of 5.

Table Headings

Table Headings are defined by the use of <th> tags. These are usually used to title rows/columns in the table and are used in place of <td> to define the cell. Consider the following:

<table border="0">
     <tr> <!--Table headings-->
          <th>Table Heading</th>
          <th>Table Heading</th>
     </tr>
     <tr>
          <td>Table Cell</td>
          <td>Table Cell</td>
     </tr>
     <tr>
          <td>This is an example</td>
          <td>This is an example</td>
     </tr>
</table>

The code above would look like this:

Table Heading Table Heading
Table Cell Table Cell
This is an example This is an example

Cell Spanning

Sometimes you may need a single cell to span more than 1 column or row. For this we use the colspan and rowspan attributes on the td or th tags.

<table>
     <tr>
          <th rowspan="2">Name</th>
          <th colspan="2">Phone Number</th>
     </tr>
     <tr>
          <th>Home</th>
          <th>Mobile</th>
     <tr>
     <tr>
          <td>John Smith</td>
          <td>555-1234</td>
          <td>555-4321</td>
     </tr>
     <tr>
          <td>Bob Jones</td>
          <td>555-2943</td>
          <td>555-4929</td>
     </tr>
</table>

The above code would look like this:

Name Phone Number
Home Mobile
John Smith 555-1234 555-4321
Bob Jones 555-2943 555-4929

Cell Spacing and Cell Padding

Cell Spacing is used to create space between cells.
Cell Padding is used to create space between the cell content and the border of the cell.

Both cellspacing and cellpadding are attributes for the table tag. Here is an example of a table with a cellspacing=”10″:

Table Heading Table Heading
Table Cell Table Cell
This is an example This is an example

and here is a table with cellpadding=”10″:

Table Heading Table Heading
Table Cell Table Cell
This is an example This is an example

Alignment

The align attribute for td and th tags can be used with the values left, right, center or justify, to specify how the contents of the cell should be aligned. Justify spaces the words in the cell so that each line is an equal width. If an align attribute is not used, the default alignment is left, unless otherwise specified by the CSS.

« Older Entries