Bitmap/Object Script

Fernando Rios Nov 3, 2007

General

This script demonstrates the use of bitmasking to store values in a single variable and how to use objects with JavaScript.

Notes

Created by: Fernando Rios
Web Site: http://www15.brinkster.com/hxedit
Posted: November 3, 2007

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: bitmapObject.js

/* This script and many more are available free online at The JavaScript Source!! http://www.javascriptsource.com Created by: Fernando Rios | http://www15.brinkster.com/hxedit */ // These will be the bitmask values. They must be powers of 2 var ram128=1; var ram256=2; var ram512=4; var cpu1000=64; var cpu2000=128; var cpu3000=256; var hd20=2048; var hd40=4096; var hd80=8192;  // This will be our 'computer' object  function Computer (f){   var features=f;//private variable of computer. stores the features    /* Priviliged methods of computer. Can be accessed from the outside but      also has access to private variable 'features' */   this.getFeatures=function(){   var ret="";//return string    /* This is where the bitmask operations occur.   It will do a bitwise comparison of the features value with the   value that were testing against. If the result is equal to the value   were testing, the value was set. Remember to use a bitwise & instead of && */    if((features & cpu1000) == cpu1000)     ret+="CPU: 1Ghz\n";   if((features & cpu2000) == cpu2000)     ret+="CPU: 2Ghz\n";   if((features & cpu3000) == cpu3000)     ret+="CPU: 3Ghz\n";   if((features & ram128) == ram128)     ret+="RAM: 128MB\n";   if((features & ram256) == ram256)     ret+="RAM: 256MB\n";   if((features & ram512) == ram512)     ret+="RAM: 512MB\n";   if((features & hd20) == hd20)     ret+="HD : 20GB\n";   if((features & hd40) == hd40)     ret+="HD : 40GB\n";   if((features & hd80) == hd80)     ret+="HD : 80GB\n";   return ret;   	};    this.setFeatures=function (feat){     this.features=feat  	}; }

Head

Paste this code into the HEAD section of your HTML document.

 <script type="text/javascript" src="bitmapObject.js"></script>

Body

Paste this code into the BODY section of your HTML document

 <form name="theForm"> Select desired features<br/> CPU: <select style="width=125" name="cboCPU">   <option value=64>1Ghz (1000Mhz)</option>   <option value=128>2Ghz (2000Mhz)</option>   <option value=256>3Ghz (3000Mhz)</option> </select><br/> RAM: <select style="width=125" name="cboRAM">   <option value=1>128MB</option>   <option value=2>256MB</option>   <option value=4>512MB</option> </select><br/> HD:    <select style="width=125" name="cboHD">   <option value=2048>20GB</option>   <option value=4096>40GB</option>   <option value=8192>80GB</option> </select><br/>  <!--remember to use | (bitwise OR) when setting the bitmask--> <input type="button" value="1. Set Attributes" onclick="Javascript:aComputer=new Computer(cboCPU.options[cboCPU.selectedIndex].value | cboRAM.options[cboRAM.selectedIndex].value | cboHD.options[cboHD.selectedIndex].value);"> <input type="button" value="2. Get Attributes" onclick="Javascript:alert(aComputer.getFeatures());")<br/> <input type="reset" value="3. Reset"> </form>

Leave a Response

(0 comments)

Alphabetical Listing

Tutorials

Ajax Tutorials

Ajax

Buttons

Cookies

CSS

Forms

Games

Generators

Image Effects

Math Related

Miscellaneous

Multimedia

Navigation

Page Details

Password

Snippets

Text Effects

Time & Date

User Details