Share the Love! Free Programming eBooks

Leave a comment Standard

GoalKicker.com is giving away these free programming books and I thought I would share the love for anyone who hasn’t seen them yet. There are more available from their website but these are the ones I was most interested in. Enjoy!

Screen Shot 2018-01-31 at 4.26.46 PM

Screen Shot 2018-01-31 at 4.26.54 PM

Screen Shot 2018-01-31 at 4.27.01 PM

Screen Shot 2018-01-31 at 4.27.11 PM

Screen Shot 2018-01-31 at 4.27.18 PM

Screen Shot 2018-01-31 at 4.27.24 PM

Screen Shot 2018-01-31 at 4.27.37 PM

Screen Shot 2018-01-31 at 4.27.44 PM

jQuery Tutorial: Hide or Display a Field Based on the Value of Another Field

Comments 10 Standard

Gah I know it’s been a while since I’ve posted something and I try to post every month but I’ve been busy programming games for myself and my clients (which is a good thing!). But here’s some yummy coding snippets to make your life easier.

Creating the Form

For this example let’s assume that we have a game which requires parental emails or parental permission to play if the member who is signing up is under 13 years of age* (good ole COPPA). Create an php file with the following contents:

<html>
<head>
    <title>Test Hide/Show Fields</title>
    <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script language="javascript" type="text/javascript" src="showhide.js"></script>
</head>
<body>
    <?php
        //this will show you the values in the form the data when you hit the submit button
        if ($_POST) {
            echo "Form was submitted, here are the form values: <pre>";
            print_r($_POST);
            echo "</pre>";
        }
    ?>
    <form method="POST">
        <p>Name: <input type="text" name="player_name" /></p>
        <p>Email: <input type="text" name="player_email" /></p>
        <p>Age: 
             <select id="age" name="age">
             <?php
                  //sorry but if you're over 30 you're too old to join, lol
                  for ($age = 6; $age <= 30; $age++)
                       echo "<option value=\"$age\">$age</option>
             ?>
             </select>
        </p>
        <div id="parentPermission">
                <p>Parent's Name: <input type="text" name="parent_name" /></p>
                <p>Parent's Email: <input type="text" name="parent_email" /></p>
                <p>You must have parental permission before you can play.</p>
        </div>
        <p align="center"><input type="submit" value="Join Game!" /></p> 
 </form>
</body>
</html>

Writing the jQuery Code

Now all that’s left is to write the code that will show (or hide) the fields we want to display when the user has selected a specific value in our selection drop down list. Create a file called showhide.js and save it to the same location as the form you created in the previous step.

/**
* File: js/showhide.js
* Author: design1online.com, LLC
* Purpose: toggle the visibility of fields depending on the value of another field
**/
$(document).ready(function() {
    toggleFields(); //call this first so we start out with the correct visibility depending on the selected form values
   //this will call our toggleFields function every time the selection value of our underAge field changes
    $("#age").change(function() { toggleFields(); });

});
//this toggles the visibility of our parent permission fields depending on the current selected value of the underAge field
function toggleFields()
{
    if ($("#age").val() < 13)
        $("#parentPermission").show();
    else
        $("#parentPermission").hide();
}

Summary

Now every time you select an age below 13 you will see the parent permission form fields displayed. If you select an age 13 or older the parent permission fields will disappear. This is useful if you have conditional data you want to collect based on a specific value or selection response. Hope it helps!

*Note

The age field in this example is just to show you how you can show/hide fields depending on the value selected. If you intend to store the age of a person in your database you need to store their date of birth since age changes every year.

Demo and working code

Try our JSFiddle demo to see this code in action!

Flash AS3 Tutorial: Callbacks or passing multiple parameters to event listeners

Comments 4 Standard

So one of the things I’ve found in developing my MMO is that there are numerous times when I need to pass back more information than just the event data when I’m using event listeners. One scenario that I run into a lot is when I want to use the same event handler on multiple objects or movie clips but some variations in event target changes how the event handler should respond making it  impossible to use a single event handler on multiple objects.

Callback Functions

So just like in Javascript you can create a callback function in AS3 which will put additional variables into scope for the event handler. This is an example of how you can pass width, height and color parameters  to an event handler using a callback function:

//the objects you want to use an event listeners on
var myObject1:Object = new MyObjectType();
var myObject2:Object = new MyObjectType();

var myColor:uint = 0xFF0000; //red
var myHeight:int = 100;
var myWidth:int = 100;

//it doesn't matter what type of event you put on this but your callback's event handler must
//take the same event parameter type. So for instance if you send MouseEvent.CLICK then your
//event handler nested inside your callback must use a MouseEvent parameter
myObject1.addEventListener(MouseEvent.CLICK, onObjectClickedHandler(myColor, myHeight, myWidth));
myObject2.addEventListener(MouseEvent.CLICK, onObjectClickedHandler(myColor, myHeight, myWidth));

//this is the callback function that takes multiple parameters and puts our
//parameters into scope for the event handler function
function onObjectClickedHandler(color:uint, height:int, width:int):Function { 

  //now let's change the color for some fun
  //the next time you click on an object with this event listener it will change to blue
  myColor = 0x0000FF; //blue

  //this is the nested event handler. Color, height and width variables are now in scope
  return function(e:MouseEvent):void {
     e.target.width = width;
     e.target.height = height;
     var myNewColor = new ColorTransform();
     myNewColor.color = color;
     e.target.transform.colorTransform = myNewColor;
   }
}

PHP Tutorial: Looping Through & Displaying A MySQL Result Set

Comments 6 Standard

Recently I’ve seen a lot of people using while loops to retrieve a single record. You only need to loop through your result set when you expect to get more than one row of data returned. If you use a loop even when you only expect one value back from your query then you’re wasting your server’s resources because the PHP interpreter has to do more work to process a loop than it does to return a single result. This assumes you have already connected to the database and have a table to work with.

Let’s say we have a table called members with the following information:

-----------------------------------------------------
| ID  | NAME       | EMAIL              | LOGGED_ON |
-----------------------------------------------------
| 1   | Sam Jones  | sjones@gmail.com   |  False    |
-----------------------------------------------------
| 2   | Dee Walter | deeman@gmail.com   |  True     |
-----------------------------------------------------
| 3   | John Doe   | jdoe@gmail.com     |  False    |
-----------------------------------------------------
| 4   | Lisa Wells | lwells@gmail.com   |  True     |
-----------------------------------------------------

Now our ID field is an auto_increment and unique. That means no two members will have the same ID number. It’s guaranteed that looking up a member by their ID number will return 1 record or no results. 1 record if a member with that ID number is found and no records if a member with that ID doesn’t exist. Anytime you expect to get 1 or fewer records returned there’s no reason to use a loop, instead find the row directly:

<?php

//run the query
$result = mysql_query("SELECT * FROM members WHERE id='1'")
    or die (mysql_error());

//fetch the results
$row = mysql_fetch_array($result);

//display the results
echo $row['id'] . " " . $row['name'] . " " . $row['email'] . " "  . $row['logged_on'];

?>

Since we know there is only one member with the ID equal to 1 we can run our query, fetch the results and then display the data returned from the result.

Now let’s say we want to display ALL of our members. In this situation we know our members table will have zero or more records at any time, especially as new members are added in the future. In this case we expect our result will always, with the exception of when we add our first member, have one or more member in it. Here it’s appropriate to use a loop to display the data.

<?php

//run the query
$loop = mysql_query("SELECT * FROM members")
   or die (mysql_error());

while ($row = mysql_fetch_array($loop))
{
     echo $row['id'] . " " . $row['name'] . " " . $row['email'] . " "  . $row['logged_on'] . "<br/>";
}
?>

SmartFoxServer, Actionscript (AS3), PHP & MySQL MMO References

Comments 3 Standard

I’ve been programming in AS3 and working with Flash a lot lately in an effort to get my first MMO up and running. I’ve found a lot of useful links I always forget to bookmark (or can’t find where I bookmarked them) so I’m posting them all here.

SmartFoxServer Related Links

Documentation Overview – http://www.smartfoxserver.com/docs/docPages/as3/html/index.html

AS3 API Documentation – http://www.smartfoxserver.com/docs/index.htm

Forums – http://www.smartfoxserver.com/forums/

“Building an MMO” – http://www.smartfoxserver.com/docs/index.htm?http://www.smartfoxserver.com/docs/docPages/articles/build_mmo_p1.htm

AS3 Related Links – General

Accessing variables from externally loaded swf – http://www.flashmorgan.com/index.php/2007/11/11/accessing-document-class-of-externally-loaded-swf-with-as3/

MySQL Driver – http://code.google.com/p/assql/

Loading Server Side Variables – http://www.gotoandplay.it/_articles/2003/06/dd_serverSide.php

XML Sockets Documentation – https://www.adobe.com/livedocs/flash/9.0/main/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00000318.html

Flash .SWF Obfuscation – http://www.amayeta.com/shop/

AS3 Related Links – Embedding & Loading Assets From Outside .SWFs

General Principals – http://www.bit-101.com/blog/?p=853

Adobe Docs – http://www.adobe.com/livedocs/flex/201/html/embed_082_8.html#175759

Asset Loader Class (see comments) – http://www.gskinner.com/blog/archives/2007/03/using_flash_sym.html

Embed Images/XML – http://dispatchevent.org/roger/embed-almost-anything-in-your-swf/

Game World/Level Editor Related Links

PHP Level Editor – http://www.gotoandplay.it/_articles/2004/05/levelEditor_p02.php

PHP Socket Related Links

Zend Tutorial – http://devzone.zend.com/article/1086

PHP.net Docs Reference – http://php.net/manual/en/ref.sockets.php and http://us3.php.net/stream

O’Reilly Tutorial – http://onlamp.com/pub/a/php/2001/03/29/socket_intro.html

Weberdev Tutorial – http://www.weberdev.com/ViewArticle/Socket-Programming-With-PHP

Security & Protection Related Links

Swf Decompiler Protection – http://www.gotoandplay.it/_articles/2004/04/swfProtection.php

In Game Advertising & Analytics

Mochi Media (pay per view & pay per click) – http://www.mochimedia.com/developers/

SWF Stats – http://www.swfstats.com/

Flash Games License – http://www.flashgamelicense.com

Google In-Game Adsense – https://services.google.com/events/adsense_games

Game Gum – http://www.gamegum.com/

CPM Star – http://www.cpmstar.com/

Hall Pass – http://www.hallpass.com/

Game Sponsors, Marketing & Publishing

ArmorGames – http://armorgames.com/

CrazyMonkeyGames – http://www.crazymonkeygames.com/

FlashRage – http://www.flashrage.com/

Ezone – http://www.ezone.com/

New Grounds – http://www.newgrounds.com/

Big Wig Media – http://bigwigmedia.com/

Game Brew – http://www.gamebrew.com/

Cloud Development

OToy – http://www.otoy.com

Miscellaneous Links

Horse Animations – http://www.horselocomotion.com/

Set a transparent background on .swf files – http://kb2.adobe.com/cps/142/tn_14201.html

HTML Tutorial: A Crash Course In Tables

Leave a comment Standard

It amazes me how many people proclaim to be programmers but they can’t even write simple HTML code. Sooo, this post is in response to all the would be web developers out there who don’t really know what in the hell they’re doing when it comes to tables.

FAQ: Why is it important to properly format and nest your tables?

Different browsers behave differently for code that is written improperly. To help ensure your table displays the way you intended it to always use correct nesting and ensure you have matching tags.

A Simple Table

<table>
   <tr>
     <td>hello there</td>
     <td>bye for now</td>
   </tr>
</table>

Simple Table (Visual)

hello there bye for now

This table has one row and two columns. A table always starts and ends with a <table> and </table> tag. If you forget to put the end </table> tag and start another table immediately following you’ll sometimes find that the browser will close your first table for you — but not always! It’s not safe to assume that your browser is smart enough to fix your HTML mistakes for you.

Now a table isn’t limited to a number of rows or columns but I find many people don’t know how to span rows or columns appropriately.

Spanning A Column

<table>
  <tr>
   <td>hello there</td>
   <td>bye for now</td>
  </tr>
  <tr>
   <td colspan="2">huh?</td>
  </tr>
</table>

Spanning A Column (Visual)

hello there bye for now
huh?

When you span a column the cell takes up the space of both columns. A lot of time I see people put in extra <td> and </td> tags even when they have a colspan set to the appropriate number. The colspan always equals the number of columns you want to span (if that isn’t obvious enough). There’s never any need to put a colspan of 1 because that’s the same thing as having a <td> and </td> without a colspan attribute.

Spanning A Row

<table>
  <tr>
   <td rowspan="2">Hey there</td>
   <td>bye for now</td>
  </tr>
  <tr>
    <td>huh?</td>
  </tr>
</table>

Spanning A Row (Visual)

Hey there bye for now
huh?

This does the opposite thing that a colspan does. Your table cells are now merged down instead of merged across. When you do a row span there is no need to include a <td> and </td> for the row you’re merging over. If you do you’ll end up with strange results and a misshappen table. The cell that has the rowspan attribute on it is always the one that merges into the cell that would have been beneath it.

Table Attributes

Here’s a list of attributes you can assign to the table tags. Ironically enough I’ve decided to put these in a table.

Attribute Description Example
Border this sets an outline around the tables <table border=”1″>
Cell Padding this puts space around the content inside of a table cell <table cellpadding=”2″>
Cell Spacing this puts space between the td cells <table cellpadding=”0″>
Width set the exact or relative width of the entire table or cell <td width=”20%”>
Height set the exact or relative height of the entire table or cell <td height=”22″>
Align sets the text alignment inside of the cell (left, right, middle, justify) <td align=”right”>
Valign sets the vertical alignment of the td cell (top, bottom, middle, abstop, absmiddle, absbottom, baseline) <td valign=”middle”>
Class used to setup a style on the cell <td class=”darkblue”>
Background set the background color of the table <table background=”#000000″>
Foreground set the text color in the table <td foreground=”#FFFFFF”>