<?php
//enable visitors to see the PHP source code of current file
$me basename($_SERVER['PHP_SELF']);
if(isset(
$_GET['showPHP'])){
    
show_source("$me");    
    die();
}
?>

<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Resistor color code calculator</title>
<link href="assets/css.css" type="text/css" rel="stylesheet"/>

<?php 
include("includes/header.inc.php");
?>

<!--This meta element defines a description of my page:-->
<meta name="description" content="Resistor color code calculator." /> 

<!--This meta element defines searched keywords:-->
<meta name="keywords" content="resistor, color, code, calculator, components" /> 

<!--This meta element identifies the document for search engines as being intended for EN="English" readers.-->
<meta http-equiv="Content-Language" content="en"/>

<meta name="author" content="Jonas Grolin" />

<style type="text/css">
#resistor {text-align:center}
</style>


<script language="JavaScript1.1">

// create array listing all the multiplier values
var multiplier = new Array()
multiplier[0] = 0
multiplier[1] = 1
multiplier[2] = 2
multiplier[3] = 3
multiplier[4] = 4
multiplier[5] = 5
multiplier[6] = 6
multiplier[7] = 7
multiplier[8] = 8
multiplier[9] = 9
multiplier[10] = -1
multiplier[11] = -2

// create array listing all tolerance values
var tolerance = new Array()
tolerance[0] = "+/-5%"
tolerance[1] = "+/-10%"
tolerance[2] = "+/-20%"

// format large values into kilo and meg
function format(ohmage) {
    if (ohmage >= 1e6) {
        ohmage /= 1e6
        return "" + ohmage + " Mohms"
    } else {
        if (ohmage >= 1e3) {
            ohmage /= 1e3
            return "" + ohmage + " Kohms"
        } else {
            return "" + ohmage + " ohms"
        }
    }
}

// calculate resistance and tolerance values
function calcOhms() {
    var form = document.forms["input"]
    var d1 = form.tensSelect.selectedIndex
    var d2 = form.onesSelect.selectedIndex
    var m = form.multiplierSelect.selectedIndex
    var t = form.toleranceSelect.selectedIndex
    var ohmage = (d1 * 10) + d2
    ohmage = eval("" + ohmage + "e" + multiplier[m])
    ohmage = format(ohmage)
    var tol = tolerance[t]
    document.forms["output"].result.value = ohmage + ", " + tol
}

// pre-load all color images into image cache
var colorArray = new Array("Black","Blue","Brown","Gold","Gray","Green","None","Orange","Red","Silver","Violet","White","Yellow")
var imageDB = new Array()
for (i = 0; i < colorArray.length; i++) {
    imageDB[colorArray[i]] = new Image(21,182)
    imageDB[colorArray[i]].src = colorArray[i] + ".gif"
}

function setTens(choice) {
    var tensColor = choice.options[choice.selectedIndex].value
    document.tens.src = imageDB[tensColor].src
    calcOhms()
}
function setOnes(choice) {
    var onesColor = choice.options[choice.selectedIndex].value
    document.ones.src = imageDB[onesColor].src
    calcOhms()
}
function setMult(choice) {
    var multColor = choice.options[choice.selectedIndex].value
    document.mult.src = imageDB[multColor].src
    calcOhms()
}
function setTol(choice) {
    var tolColor = choice.options[choice.selectedIndex].value
    document.tol.src = imageDB[tolColor].src
    calcOhms()
}
function showIntro() {
    window.open("javascript-resistor-color-code-calculator.php","","width=400,height=320,left=100,top=100")
}

window.onload = calcOhms;
</script>

<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

</head>
<body>
<div id="wrapper">
    <div id="center-box">

        <div class="menu bubplastic horizontal aqua">
            <ul>
                <li><span class="menu_r">
                <a href="/mobile/index.php" target="_self">
                    <span class="menu_ar">Mobile</span>
                </a></span></li>
                
                <li><span class="menu_r">
                <a href="?showPHP" target="_self">
                    <span class="menu_ar">Source code</span>
                </a></span></li>
                
                <li><span class="menu_r">
                <a href="sitemap.html" target="_self">
                    <span class="menu_ar">Site map</span>
                </a></span></li>

                <li><span class="menu_r">
                <a href="javascript-resistor-farvekode-regnemaskine-dk.php" target="_self">
                    <span class="menu_ar"><img src="image/dk-icon.png" alt="Dansk flag"/> Dansk</span>
                </a></span></li>
                
                <li><span class="menu_r">
                <a href="javascript-resistor-color-code-calculator.php" target="_self">
                    <span class="menu_ar"><img src="image/eng-icon.png" alt="English flag"/> English</span>
                </a></span></li>
            </ul>
          <br class="clearit" />
        </div>

<?php 
include("includes/header_img.inc.php");
?>
        <div id="left-right-padding">
<?php 
include("includes/navigation.inc.php");
?>
   
            <div style="clear: left;"></div> 
            <h1>Resistor color code calculator</h1>

            <h2>This is a JavaScript-based color code calculator</h2>
            
            <p>This page remains one of the most popular 
            destination within jonas-grolin.dk 
            &mdash; presumably as a resource for 
            students of electronics. Enjoy!</p>
            
            <p>Resistors are an electrical component that most 
            people don't think about in their daily lives, 
            in spite of that they are used in countless electrical apparatus.</p>
            
              <div id="resistor">
            
                <hr>
                
                <form name="input">
                <select name="tensSelect" onChange="setTens(this)">
                    <option value="Black" selectED> Black
                    <option value="Brown"> Brown
                    <option value="Red"> Red
                    <option value="Orange"> Orange
                    <option value="Yellow"> Yellow
                    <option value="Green"> Green
                    <option value="Blue"> Blue
                    <option value="Violet"> Violet
                    <option value="Gray"> Gray
                    <option value="White"> White
                
                </select>
                <select name="onesSelect" onChange="setOnes(this)">
                    <option value="Black" selectED> Black
                    <option value="Brown"> Brown
                    <option value="Red"> Red
                    <option value="Orange"> Orange
                    <option value="Yellow"> Yellow
                    <option value="Green"> Green
                    <option value="Blue"> Blue
                    <option value="Violet"> Violet
                    <option value="Gray"> Gray
                    <option value="White"> White
                
                </select>
                <select name="multiplierSelect" onChange="setMult(this)">
                    <option value="Black" selectED> Black
                    <option value="Brown"> Brown
                    <option value="Red"> Red
                    <option value="Orange"> Orange
                    <option value="Yellow"> Yellow
                    <option value="Green"> Green
                    <option value="Blue"> Blue
                    <option value="Violet"> Violet
                    <option value="Gray"> Gray
                    <option value="White"> White
                    <option value="Gold"> Gold
                    <option value="Silver"> Silver
                
                </select>&nbsp;&nbsp;&nbsp;&nbsp;
                <select name="toleranceSelect" onChange="setTol(this)">
                    <option value="Gold"> Gold
                    <option value="Silver"> Silver
                    <option value="None"> None
                </select>
                </form>
                <hr width="50%">
                <script language="JavaScript1.1">
                var form = document.forms["input"]
                var tensDigit = form.tensSelect.selectedIndex
                var tensColor = form.tensSelect.options[tensDigit].text
                var onesDigit = form.onesSelect.selectedIndex
                var onesColor = form.onesSelect.options[onesDigit].text
                var multDigit = form.multiplierSelect.selectedIndex
                var multColor = form.multiplierSelect.options[multDigit].text
                var tolDigit = form.toleranceSelect.selectedIndex
                var tolColor = form.toleranceSelect.options[tolDigit].text
                var table ="<table border=2 align=center><form name='output'>"
                table += "<tr><th align=middle>Resistance Value:</th>"
                table +=" <th align='middle'><input type='text' name='result' size=20 onFocus='this.blur()'>"
                table +="</th></tr><tr><td colspan=2>&nbsp;"
                table +="<img SRC='resleft.gif' width=127 height=182><img" +
                            " src='" + tensColor + ".gif' name='tens' width=21 height=182><img"+
                            " src='" + onesColor + ".gif' name='ones' width=21 height=182><img"+
                            " src='" + multColor + ".gif' name='mult' width=21 height=182><img"+
                            " src='spacer.gif' width=21 height=182><img"+
                            " src='" + tolColor + ".gif' name='tol' width=21 height=182><img"+
                            " src='resright.gif' width=127 height=182>"
                table += "&nbsp;</td></tr></form></table>"
                document.write(table)
                </script>
      
            </div>
        </div>

<?php 
include("includes/footer.inc.php");
?>

    </div>
</div>
</body>
</html>