Monday, January 31, 2011

Monday 1/31/2011


function setNumberOfSides() {
numSides = document.getElementById("numSides").value;
numSides = numSides + " sides per die";
var alertText = "";
var holderP = document.getElementById("numberOfSides");
alertText = document.createTextNode(numSides);

if (holderP.firstChild == null) {
holderP.appendChild(alertText);
}
else {
holderP.firstChild.nodeValue = numSides;
}
}

Here is something from the Shelley Powers book


<script type="text/javascript">
function init() {
var searchString = "Now is the time, this is the time";
var re = /t\w{2}e/g;
var replacement = searchString.replace(re, "place");
alert(replacement);
}
</script>

Here is another tutorial


<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Searching for Strings</title>
<style type="text/css">
#searchSubmit {
background-color:#ff0;
width: 200px;
text-align:center;
padding:10px;
border:2px inset #ccc;
}

.found
{
background-color: #ff0;
}

</style>
<script type="text/javascript">
window.onload=function() {
document.getElementById("searchSubmit").onclick=doSearch;
}

function doSearch() {
//get pattern
var pattern = document.getElementById("pattern").value;
var re = new RegExp(pattern, "g");

//get string
var searchString = document.getElementById("incoming").value;

// replace
var resultString = searchString.replace(re,"<span class='found'>$&</span>");

// insert into page
document.getElementById("searchResult").innerHTML = resultString;
}
</script>
</head>
<body>
<form id="textsearch">
<textarea id="incoming" cols="100" rows="10">

</textarea>
<P>
Search pattern: <input id="pattern" type="text" /></p>
</form>
<p id="searchSubmit">Search for a pattern


<div id="searchResult"></div>
</P>

</body>


Here is some more JavaScript


<script type="text/javascript">
var pieceOfHtml = "<p>This is a <span>paragraph</span

"
function convert(){
pieceOfHtml = pieceOfHtml.replace(/</g,"<");
pieceOfHtml = pieceOfHtml.replace(/>/g,">");
document.getElementById("searchResult").innerHTML = pieceOfHtml;
}
</script>

Sunday, January 30, 2011

Sunday, 1/30/11

Spent entirely too long on this:



function generate(){
var data = document.getElementById('inputText').value;
append(data);
}
function append(data){
var newP = document.createElement("p");
var mytext = document.createTextNode(data);
newP.appendChild(mytext)
document.getElementById("mydiv").appendChild(newP);
}

Friday, January 28, 2011

Monday 1/28/2011

"IN this simple example, you store each order record on a separate line in the file. Writing one record per line gives you a simple record separator in the newline character. Because newlines are invisible, you can represent them with the control sequence "\n".


<?php
// create short variable names
$tireqty = $_POST['tireqty'];
$oilqty = $_POST['oilqty'];
$sparkqty = $_POST['sparkqty'];
$address = $_POST['address'];
$DOCUMENT_ROOT = $_SERVER['DOCUMENT_ROOT'];
$date = date('H:i, jS F Y');
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Bob's Auto Parts - Order Results</title>
</head>
<body>
<h1>Bob's Auto Parts</h1>
<h2>Order Results</h2>

<?php
echo "<P>Order processed at " .date('H:i, js F Y')."</P>";
echo "<P>Your order is as follows: </p>";
$totalqty = 0;
$totalqty = $tireqty + $oilqty + $sparkqty;
echo "Items ordered " . $totalqty . "<br />";


// up to here is correct



if ($totalqty == 0) {
echo "You did not order anything on the previous page!<br/>";
} else {
if ($tireqty > 0) {
echo $tireqty . " tires<br />";
}
if ($oilqty > 0 ) {
echo $oilqty . " bottles of oil<br />";
}
if ($sparkqty > 0) {
echo $sparkqty . " spark plugs<br />";
}
}


// up to here is correct




$totalamount = 0.00;

define('TIREPRICE', 100);
define('OILPRICE', 10);
define('SPARKPRICE', 4);

$totalmount = number_format($totalamount, 2, '.', ' ');

echo "<P>Total of order is $" . $totalamount . "</p>";
echo "<P>Address to ship to is " . $address . "</p>";

$outputstring = $date . "\t" . $tireqty . " tires \t" . $oilqty . " oil\t" . $sparkqty . " spark plugs\t\$" . $totalamount . "\t" . $address . "\n";

// open file for appending
@ $fp = fopen("C:\inetpub\wwwroot\Practice\Book\orders.txt", 'ab');

flock($fp, LOCK_EX);

if (!$fp) {
echo "<p><strong>Your order could not be processed at this time. Please try again later.</strong></p></body></html>";
exit;
}

fwrite($fp, $outputstring, strlen($outputstring));
flock($fp, LOCK_UN);
fclose($fp);

echo "

Order written.

";

?>

</body>

Wednesday, January 26, 2011


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>canHaveChildren Property</title>
<script type="text/javascript">
function colorAll() {
var elems = document.getElementsByTagName("*");
for (var i = 0; i < elems.length; i++) {
elems[i].style.color = "red";
}
}

</script>
</head>
<body>
<h1>Color All</h1>
<hr />
<form name="input">
<input type="button" value="Color All Elements" onclick="colorAll()" /><br />
<input type="button" value="Reset" onclick="history.go(0)" />

</form>
<br />
<hr />
<form name="output">
<input type="checkbox" checked="checked" />Your Basic checkbox
</form>
<table id="myTable" cellpadding="10" border="2">
<tr>
<th>Quantity</th>
<th>Description</th>
<th>Price</th>
</tr>
<tbody>
<tr>
<td width="100">4</td>
<td>Primary Widget</td>
<td>$14.96</td>
</tr>
<tr>
<td>10</td>
<td>Secondary Widget</td>
<td>$114.96</td>
</tr>
</tbody>
</table>
</body>
</html>

Tuesday, January 25, 2011


<html>
<head>
<title>A Simple Page </title>
<script type="text/javascript">
function modify() {
var newElem = document.createElement("p");
newElem.id = "newP";
var newText = document.createTextNode("This is the second paragraph.");
newElem.appendChild(newText);
document.body.appendChild(newElem);
document.getElementById('emphasis1').childNodes[0].nodeValue = 'first';
}

function addSomething() {
var newEdition = document.createElement("div");
newEdition.id ="newDiv";
var addText = document.createTextNode("Here is another additional text.");
newEdition.appendChild(addText);
document.body.appendChild(newEdition);
}
</script>
</head>
<body>
<button onclick="modify()">Add/Replace Text
<button onclick="addSomething()">Add Something else
<

<p id="paragraph1">This is the <em id="emphasis1">one and only </em> paragraph on the page. </p>


</body>
</html>


Advanced XHTML is a time-eater. Learning jQuery looks interesting though.

Sunday, January 23, 2011

Sunday 1/23/11


<?Php
echo "

Order processed.

";
echo "order processed at " . date('H:i, jS F Y');
echo "

";
// create short variable names
$tireqty = $_POST['tireqty'];
$oilqty = $_POST['oilqty'];
$sparkqty = $_POST['sparkqty'];
echo "

Your order is as follows:

";
echo $tireqty . " tires
";
echo $oilqty . " bottles of oil
";
echo $sparkqty . " spark plugs
";

$totalqty = 0;
$totalqty = $tireqty + $oilqty + $sparkqty;
echo "

";

if ($totalqty == 0) {
echo '<p style="color:red">';
echo 'You did not order anything on the previous page!';
echo '

';
}

echo "Items ordered: " . $totalqty . "
";
$totalamount = 0.00;

define('TIREPRICE', 100);
define('OILPRICE', 10);
define('SPARKPRICE', 4);


$totalamount = $tireqty * TIREPRICE
+ $oilqty * OILPRICE
+ $sparkqty * SPARKPRICE;

echo "Subtotal: $" . number_format($totalamount, 2) . "
";

$taxrate = 0.10; // local sales tax is 10%
$totalamount = $totalamount * (1 + $taxrate);
echo "Total including tax: $" . number_format($totalamount, 2) . "
";

?>


Here is another tutorial

<?php
$distance = 50;
while ($distance <= 250) {
echo "<tr>";
echo $distance . "</td>";
echo "<td align = \"right\">" . ($distance/10) . "</td></tr>";
$distance += 50;
}
?>

Friday, January 21, 2011

Friday 1/21/11


<?php
echo fix_names("William", "henry", "gatES");

function fix_names($n1, $n2, $n3)
{
$n1 = ucfirst(strtolower($n1));
$n2 = ucfirst(strtolower($n2));
$n3 = ucfirst(strtolower($n3));
return $n1 . " " . $n2 . " " . $n3;
}
?>


Here is more PHP code from the book by Robin Nixon "Learning PHP, MySQL, and JavaScript"


<?php
$names = fix_names("WILLIAM", "henry", "gatES");
echo $names[0] . " " . $names[1] . " " . $names[2];

function fix_names($n1, $n2, $n3)
{
$n1 = ucfirst(strtolower($n1));
$n2 = ucfirst(strtolower($n2));
$n3 = ucfirst(strtolower($n3));
return array($n1, $n2, $n3);
}


?>


Here is another exercise from the Robin Nixon book


<?php
echo "Returning values from a function by reference";
echo "
";

$a1 = "William";
$a2 = "henry";
$a3 = "gatES";

echo $a1 . " " . $a2 . " " . $a3 . "
";
fix_names($a1, $a2, $a3);
echo $a1 . " " . $a2 . " " . $a3;

function fix_names(&$n1, &$n2, &$n3)
{
$n1 = ucfirst(strtolower($n1));
$n2 = ucfirst(strtolower($n2));
$n3 = ucfirst(strtolower($n3));
}

?>


Here is 5-9


<?php

if (function_exists("array_combine"))
{
echo "Function exists";
}
else
{
echo "Function does not exist - better write our own";
}

?>


Example 5-11



<?php
$object = new User;
print_r($object); echo"<br />";
$object->name = "Joe";
$object->password = "mypass";
print_r($object);
echo "
";

$object->save_user();

class User
{
public $name, $password;
function save_user()
{
echo "Save User code goes here";
}
}
?>



Here is another quick tutorial


<?php
$object1 = new User();
$object1->name = "Alice";
$object2 = $object1;
$object2->name = "Amy";
echo "object1 name = " . $object1->name . "
";
echo "object2 name = " . $object2->name;

class User
{
public $name;
}
?>


Here is another tutorial by Robin Nixon


<html>

<body>
<?php
echo "Inhereting and extending a class";
echo "

";
$object = new Subscriber;
$object->name = "Fred";
$object->password = "pword";
$object->phone = "012 345 6789";
$object->email = "fred@bloggs.com";

$object->display();


class User
{
public $name, $password;
function save_user()
{
echo "Save User code goes here";
}
}

class Subscriber extends User
{
public $phone, $email;

function display()
{
echo "Name: " . $this->name . "
";
echo "Pass: " . $this->password . "
";
echo "Phone: " . $this->phone . "
";
echo "Email: " . $this->email;
}

}

?>
</body>
</html>


Here is the final PHP tutorial for the day


<??php
$object = new Son;
$object->test();
$object->test2();

class Dad
{
function test()
{
echo "[Class Dad] I am your Father
";
}
}

class Son extends Dad
{
function test()
{
echo "[Class Son] I am luke
";
}

function test2()
{
parent::test();
}
}

?>


Here is a JavaScript tutorial from the Shelley Powers book. This is not all of it, I am not posting the HTML and CSS as it is not really relevant.


<script type="text/javascript">
//<![CDATA]

window.onload=function() {
document.getElementById("searchSubmit").onclick=doSearch;
}

function doSearch()

//only problem is that it is case-dependent.
{
// get pattern
var pattern = document.getElementById("pattern").value;
var regExpression = new RegExp(pattern, "g");


//get string
var searchString = document.getElementById("incoming").value;
var matchArray;
var resultString = "
";
var first=0; var last=0;

//find each match
while ((matchArray = regExpression.exec(searchString)) != null) {
last = matchArray.index;
// get all of string up to match, concatenate
resultString += searchString.substring(first, last);

// add matched, with class
resultString += "" + matchArray[0] + "";
first = regExpression.lastIndex;
}

// finish off string
resultString += searchString.substring(first, searchString.length);
resultString += "
";

// insert into page
document.getElementById("searchResult").innerHTML = resultString;
}



</script>


I have to admit, I got all of it typed in, got it to work, renamed a few of the variables even (I don't like short variable names) but...still not completely at ease with it, regular expressions are a bit complicated, I think.

Here is the code from Lab 4 of my JavaScript class




<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>



<!-- I decided not to embed the style sheet but rather link to it -->
<link rel="stylesheet" type="text/css" href="temperatureStyles.css" media="screen" />
<script type="text/javascript">
var convertToCelsius = false;
var convertToFaranheit = false;

// This function sets the conversion to Farenheit as well as creates a subtle visual effect by turning
// the Farenheit text next to the radio button blue
function blueF(){
document.getElementById("spanF").className = "blueLine";
document.getElementById("spanC").className = "blackLine";
convertToFahrenheit = true;
convertToCelsius = false;
}

//note to self: Fahrenheit spelled F a h r e n h e i t
function blueC(){
document.getElementById("spanC").className = "blueLine";
document.getElementById("spanF").className = "blackLine";
convertToFahrenheit = false;
convertToCelsius = true;
}


// This function checks to see that a radio button has been selected, that the text field is not blank, and that the text blank
// contains a number
function validateEntry(value){

if (convertToCelsius == false && convertToFahrenheit == false)
{
alert("Please select Faranheit or Celsius");
return false;
}
else if (value == "")
{
alert("Please enter a value");
return false;
}
else if (isNaN(value) == true)
{
alert("Please enter a numeric value");
return false;
}
else
{
return true;
}
}


// This function will branch into two different options using a conditional operator (provided that the data entered is valid)
function convertIt(){


var entryData = document.getElementById("temp").value;

// use a seperate function to validate the data
if (validateEntry(entryData))
{
document.getElementById("temp").value = "";
// I finally dared to write a conditional operator
convertToCelsius==true ? convertFromFahrenheit(entryData) : convertFromCelsius(entryData);
}
else
{
document.getElementById('results').innerHTML = "Please make sure your entry is correct.";
}

}


function convertFromCelsius(entryData) {
var conversionData = entryData
conversionData = ((entryData * 1.8) + 32);
document.getElementById('results').innerHTML = "The temperature is " + conversionData + " degrees Fahrenheit";
document.getElementById('results').innerHTML += "<P></P>The temperature you converted <i>from</i> was " + entryData + " degrees Celsius";
}

function convertFromFahrenheit(entryData)
{
var conversionData = entryData
conversionData = ((entryData - 32) * .55);
document.getElementById('results').innerHTML = "The temperature is " + conversionData + " degrees Celsius";
document.getElementById('results').innerHTML += "

The temperature you converted from was " + entryData + " degrees Fahrenheit";
}





</script>

</head>
<body>

<!-- This DIV will hold the site in the center of the screen. -->
<div id="main">


<!-- This div will float left and contain the textboxes for entering the data -->
<!-- We are about to learn about jQuery and rounded corners for our advanced XHTML class -->
<!-- but I figured I better not mess around with that for now -->

<div id="left">
<h1 class = "header">Enter Temperature Here</h1>
<form id="entryForm">
Temperature: <input type="text" id="temp"></input>
<BR>
Convert to:
<br>
<span id="spanF">Fahrenheit </span><input type="radio" name="rSelect" id="radio-1" value="1" onclick="blueF()"></input>

<span id="spanC">Celsius </span><input type="radio" name="rSelect" id="radio-2" value="1" onclick="blueC()"></input>
</form>
<input type="button" id="btnInput" value="Convert" onclick="convertIt()"></input>
</div>



<!-- This div will float right and present the output for data -->
<div id="right">
<h1 class = "header">View Converted Temperature Here</h1>
<div id="results">

</div>
</div>



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