My peaceful tree

I hope we can code this scene in my high school class next week. This version is SVG. We can convert it to HTML5, then finally create a Swift app.

Reno Erat Rudolphus: Christmas CD 2013

This one has classical, pop, techno, piano, children, and even bluegrass.

Nicolaus Esterhazy Sinfonia	1	The Virgin Mary Had A Baby Boy
Andy Williams	2	Kay Thompson's Jingle Bells
Golden Guitar Project	3	White Christmas
DJ Santa Claus	4	Silent Night
Nicolas Spencer	5	My Favorite Things/Carol of the Bells
Straight No Chaser	6	12 Days of Christmas
Jack Jezzro	7	Deck the Halls
Nicolaus Esterhazy Sinfonia	8	Carol of the Bells
Stephen Miller	9	O Come O Come Emmanuel
Nicolas Spencer	10	The First Noel
The Clarke Family	11	Angels We Have Heard On High
The Cedarmont Kids	12	The Virgin Mary Had A Baby Boy
Nicolas Spencer	13	Thou Didst Leave Thy Throne
Simhah Chamber Collegium	14	Angels We Have Heard On High
Ray Conniff	15	The Little Drummer Boy
James Beuregard and Keri Taylor	16	I Cannot Tell
Jason Gray	17	Easier (Song of the Wisemen)
James Beuregard and Keri Taylor	18	Infant Holy, Infant Lowly
Nicolas Spencer	19	Brahms Lullaby

A Red-Nosed Christmas: Playlist 2002

This playlist has some 60's artists like Percy Faith, Ray Conniff, and Andy Williams interspersed with techno tracks, comedy, and (I hope) food for thought.

Percy Faith	1	Joy to the World
Percy Faith	2	Do You Hear What I Hear
Guitar	3	It Came Upon A Midnight Clear
Ray Conniff	4	Little Drummer Boy
Andres Segovia	5	Greensleeves
Trans-Siberian Orchestra	6	Christmas Canon
Anne Murray	7	Christmas in Killarney
Trans-Siberian Orchestra	8	Revenge of the Sugar Plum Fairy
Techno Mix	9	Jingle Bells
Dean Martin	10	Rudolph the Red-Nosed Reindeer
Jimmy Buffett	11	Run Rudolph Run
Big Bad Voodoo Daddy	12	Rockabilly Christmas
Elvis Presley	13	Santa Bring My Baby Back
Roy Zimmerman	14	I Tawt I Taw Ol' Tanty Claus
The Chipmunks	15	The Chipmunk Song
Cheech and Chong	16	Santa Claus and His Old Lady
Nat King Cole	17	Chestnuts Roasting
The Foremen	18	Buy War Toys For Christmas
Andy Williams	19	Some Children See Him
Randy Stonehill	20	Christmas Song for All Year 'Round

Quirky Christmas: Christmas Playlist 2001

Only my family and closest friends know that many years, I like to create a Christmas CD to share. This playlist is the first Christmas CD I put together (and arguably the best). I believe it is from 2001, because it seems to reflect the events of 2001.

https://www.youtube.com/playlist?list=PLoqipQPAfFOoNm0QNCGVpDA29emp9ukKS

Larry Norman	1	Christmastime
Tom Lehrer	2	A Christmas Carol
Frederick Fennell	3	Sleigh Ride (Leroy Anderson)
LA Guitar Quartet	4	Nutcracker - Overture (Tchaikovsky)
LA Guitar Quartet	5	Nutcracker - March (Tchaikovsky)
LA Guitar Quartet	6	Nutcracker - Russian Dance (Tchaikovsky)
The Roches	7	Hallalujah Chorus (Handel)
Handel	8	Concerto a Due Cori
John McCutcheon	9	For Unto Us A Child Is Born (Handel)
Mannheim Steamroller	10	Do You Hear What I Hear
Mannheim Steamroller	11	Away In A Manger
Pierce Pettis	12	Miriam
Bruce Cockburn	13	Cry of a Tiny Babe
Kathy Mattea	14	Straw Against the Chill (Bob Franke)
Dennis Lee	15	Jesu, Joy of Man's Desiring
David Massengill	16	Jesus the Fugitive Prince
John McCutcheon	17	Christmas in the Trenches
John Lennon	18	Happy Xmas Was Is Over
Bing Crosby & David Bowie	19	Peace On Earth / Little Drummer Boy

Animated Adobe Icons

We are doing these icons in the high school class. We have not finished the last icon yet. We are drawing them in SVG. We are animating them using JavaScript.

Reformation Day

A long time ago, my company sent me on business trips to western Minnesota to install electrical equipment. On one of those trips, I met a nice gal of good Minnesota Norwegian stock and asked her out to a music concert at the college in Fargo, North Dakota.

Being a good Minnesota Lutheran, she told me about her church in Moorhead. (There are so many Lutheran churches in Fargo and Moorhead, I'd never be able to remember now which one it was.) I had the privilege of visiting there the following Sunday, the last Sunday of October.

Reformation Sunday is not only a day to remember the events of 1517 Wittenberg, but also a time to celebrate with a grand midwestern potluck. Had I known ahead of time, well, I'd still not have been able to cook up anything in the motel room. But the little old ladies of the church welcomed me warmly and introduced me to their favorite potluck dish: lutefisk. "You'll either love it or hate it," they said. "It's like fish flavored jello," they said. How could I possibly turn this down? Fortunately, they didn't give me a lot!

After the potluck, I visited this nice gal and her family at her home, and we took turns playing the piano. It was a wonderful afternoon.

On another occasion, one of the electrical workers invited me to his home for lunch, and they served me corn freshly cut from their very own property.

After visiting Minnesota several times, I decided that the good Lutherans of Minnesota are far and away the friendliest people I've ever met. If they have any of the Lake Wobegon quirks, I never noticed.

Random Artwork

Refresh the page to see a different design (or click the button below).

This one uses HTML5 Canvas, so it works on iPad. In class, we used SVG, which doesn't render properly on iOS devices using Safari.

Ten Commandments of Human Relations

1. Speak to people. 
There is nothing as nice as a cheerful word of greeting.

2. Smile at people.
It takes 72 muscles to frown, only 14 to smile.

3. Call people by name.
The sweetest music to anyone's ears is the sound of his own name.

4. Be friendly and helpful.
If you want friends, you must be one.

5. Be cordial.
Speak and act as if everything you do is a joy to you.

6. Be genuinely interested in people.
You can like almost everybody if you try.

7. Be generous with praise...
and cautious with criticisms.

8. Be considerate with the feelings of others.
There are usually three sides to a controversy: Yours, the other person's, and the right side.

9. Be eager to lend a helping hand.
Often it is appreciated more than you know.

10. Add to this:
a good sense of humor, a huge dose of patience and a dash of humility. This combination will open many doors and the rewards will be enormous.

Connect the Dots

One of my high school students did paper-and-pencil artwork that looks like this. I wrote this program that we may code together in class. When you connect the dots, the result is a parabola curve along the bottom edge. 

The SVG version does not work with iPad because Safari iOS does not like inline SVG elements. So the following code uses HTML5 canvas. The JavaScript calculations are the same, but the drawing routines are different.

How many lines?
What color?

How to start learning computer programming

People often ask me, "How should I start learning computer programming?" Specifically, what programming language should one start with?

Many programming languages are difficult to learn. C++ is a powerful and widely-used programming language, but I would seldom suggest that someone learn C++ first. Some do, and some do it well, but there are easier languages. Java is similarly difficult. Objective-C is a nightmare; I'm glad Apple replaced it with Swift, but don't let the name fool you ... you won't learn even Swift quickly unless you already know another programming language.

Resistor Standard Values

Suppose we want to establish a sensible set of standard values for resistors. Of course, this was done many years ago. But sometimes it is instructive to recreate the thought process of engineers from the past. We learn something about their thought process that we might apply to our own engineering challenges today.

Supposed we want to establish a set of standard resistor values between 10 ohms and 100 ohms. Our first thought might be to space them out equally: 10 ohms, 20, 30, 40, 50, 60, 70, 80, 90, and finally 100 ohms. This way we cover all the values between 10 and 100 with equal tolerance: 10 ohms either way.

But is it really equal spacing? The difference between 10 ohms and 20 ohms is 100 percent! 20 ohms is twice as big as 10 ohms. Don't we need another resistor in between those? Like maybe 15 ohms?

Resistor Color Code Calculator

Select the three color bands that appear on your resistor:

Efficiency

One of my favorite books was always Cheaper by the Dozen. (It inspired a hit 1950 movie, but the book had no relation to the recent Steve Martin comedy.) The book is about Frank and Lillian Gilbreth and their 12 children. The Gilbreth parents were efficiency experts who examined the smallest movements of even their own children, looking for ways to reduce the number of motions. This was decades before the recognition of repetitive motion injuries caused by computer use and other fine muscle movements.

One story I found particularly interesting was about how Frank had courted Lillian. Frank apparently encountered bricklayers at the home of Lillian's parents, and suggested how they might do their work more efficiently. The skeptical workmen watched as Frank quickly laid out a row of bricks and mortar in expert fashion.

SVG code template

Use this code to get started using SVG:

<svg width='600' height='400' viewBox='0 0 600 400'
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink= "http://www.w3.org/1999/xlink">

    <!-- the clipping paths and masks will go here -->

    <defs>
    </defs>

    <!-- the shapes and stuff will go here -->

    <rect x='0' y='0' width='600' height='400' fill='beige' />

</svg>

Radial gradients:

http://www.w3schools.com/svg/svg_grad_radial.asp

HTML code template

Here is a template for the minimal complete HTML page. If your page doesn't have all these elements, you should edit your page to include all of them. When you start a new page, you can copy and paste this code to get started.

(Originally posted in 2015. Revised 16 Aug 2022 to reflect the latest HTML validator settings.)

<!DOCTYPE html>
<html lang="en">
<head>
    <!--
    YOUR NAME HERE, date, project name, class, etc.
    -->
    <meta charset='utf-8' />
    <meta name="viewport" content="width=device-width" /> 
    <title>My Web Page</title>
    <style>
    /* styles go here */

    </style>
</head>

<body>
    <h1>My Web Page</h1>
    <!-- page content will go here -->

    <script>
    // scripts will go here

    </script>
</body>
</html>

Here is the code for a bullet list:

<ul>
    <li>Mission College</li>
    <li>Ohlone College</li>
    <li>Gavilan College</li>
    <li>Cabrillo College</li>
</ul>

Here is the code for a table:

<table>
    <tr>
        <th>Key</th>
        <th>Command</th>
    </tr>
    <tr>
        <td>Cmd-Space</td>
        <td>Spotlight</td>
    </tr>
    <tr>
        <td>Cmd-S</td>
        <td>Save</td>
    </tr>
</table>

Here is an excellent tutorial on HTML tables (thank you to the student who linked this to your page):

http://www.w3schools.com/html/html_tables.asp

String Functions

Strings are sequences of characters. They are useful for storing data and also for accepting user input, whether it be from a terminal command line or a web form.

I find these particular string functions indispensable in my own web programming. I'm sure there are many other frequently-used string functions.

Action	C++	PHP	JavaScript
Split a string into an array of strings	–	explode	split
Compare strings	compare	strcmp	< or >
Find a character within a string	find	strchr	indexOf
Get length of string	size	strlen	length
Find a string within a string	strstr	strstr	indexOf
Convert a string to hexadecimal	std::hex	–	toString(16)
Get a substring	substr	substr	substring
Convert string to floating point	atof	floatval	parseFloat
Convert string to integer	atoi	intval	parseInt
Upper case first character	toupper	ucfirst	toUpperCase
Trim white space	–	trim	trim
Replace	replace	str_replace	replace
Regular expression replace	c	preg_replace	replace
Determine if string is a number	–	is_numeric	!isNan

There are also a few useful functions that relate to single characters only, but they are usually used in the context of string processing.

Action	C++	PHP	JavaScript
Get the ASCII value of a character	–	chr	fromCharCode
Determine if character is a digit	isdigit	ctype_digit	parseInt and slice
Determine if a character is upper case	isupper	ctype_upper	compare with toUpperCase

ASCII Character Set

Hex Decimal Octal

Decisions Using the Switch Statement

You can also make decisions using the switch statment. It looks like this:

switch (exponent) {
    case 0 :
        // do nothing
        break;
    case 1 :
        input = input * 10;
        break;
    case 2 :
        input = input * 100;
        break;
    case 3 :
        input = input * 1000;
        break;
    default :
        // do nothing
        break;
}

The above code implements simple exponentiation for languages that do not support it natively. Note that each case is an integer. The general rule is that the different cases must be types that can be converted to integer at compile time. The computer science term for such types is "enumerable." Integers, characters, and enumerations would be valid here. (An enumeration is just a way of giving names to different integers, like constant literals.) Characters are valid enumerable types because they can be considered a restricted set of integers. For example, the letter 'A' evaluates to the integer 65. See the ASCII character set for more information.

Programmer's Code Editor

It is always a good idea to use a good programmer's text editor for any kind of code development. Important features of a programmer's text editor include:

• Syntax code coloring
• Language-aware auto indent and formatting
• Strict text file save with line ending options

If you are doing PHP or JavaScript programming and you don't need an IDE but you do need an editor, I recommend NotePad++ for Windows, TextMate for Mac, and Brackets for either Windows or Mac. I no longer recommend TextWrangler because it does not have language-aware formatting.

Please, never use a program like NotePad, WordPad, Microsoft Word, or TextEdit to edit code. They do not have the proper options to safely save your files as strict text. They also do not have code coloring or auto indent.

Integrated Development Environment (IDE)

If you are learning C++, Java, Swift, iOS programming, or Android programming, it is helpful, and maybe necessary, to use an integrated development environment (IDE) to write, debug, and test your programs.

An IDE contains all the traditional programming needs in one package:

• Code editor
• Debugger
• Simulator
• Project management
• User interface development

HTML Entities

These are some HTML entities I have used on this blog or use from time to time. This is not an exhaustive reference. These are just the ones I found most useful.

Beware: not all browsers support all these entities, especially the UTF-8 shapes. I have found this particularly true on mobile browsers.

Entity	Appearance	Name

Decisions and Branching

We must have a way for the program to make a decision, and then execute different code based on the decision. If the number is less than 10, we do one thing, otherwise we do something else. If the object is a rectangle, we obtain the area by multiplying its width by its height; but if the object is a circle, we obtain its area by multiplying its diameter by π.

Indeed, I would venture a guess that the majority of the time, popular computer programs are making decisions. (This is less so for scientific programs that do extensive numerical computations.)

The Resistor Color Code

I use this color code as an example in my classes for writing branching clauses, loops, and functions.

0	Black
1	Brown
2	Red
3	Orange
4	Yellow
5	Green
6	Blue
7	Violet
8	Gray
9	White

The color code works like this: there are (at least) three color bands on the resistor. The first band indicates the first digit in the resistance. The second band indicates the second digit. The third digit is a multiplier. 

So, for example, if the bands were Yellow, Violet, and Orange, this translates to 4, 7, and 3. The  resistance value would be 47 × 1000 or 47 K Ω.

The computation would look like this:

R = ((10 * a) + b) * 10 ^c

where a, b, and c are the translated values of the three color bands, in order.

Foundational Programming Concepts

I teach three programming classes. There are several concepts that I must teach in all my classes because they are so foundational. Once you have mastered these concepts in any programming language, it is easy to transfer the knowledge to other languages.

• Decisions and Branching
• Loops
• Arrays
• Functions
• Strings
• Data

Typing the Apple Symbol

After seeing my post how to type the command key / cloverleaf symbol, someone asked for a similar post how to draw the Apple symbol.

As a digression, this is a story I heard. In the early days of Apple, when Susan Kare was designing icons for the first Macintosh operating system, they used the Apple symbol on the keyboard command key, so she put the Apple symbol in all the menus for keyboard shortcut. When Steve Jobs saw this, he something to the effect of "Apples everywhere, too many apples!"

Look now in the File or Edit menu of your Mac, and see all the keyboard shortcuts there. Imagine if these were all Apple symbols! Now you can imagine why SJ was taken aback.

So Susan Kare looked for a distinctive but non-threatening symbol, and she found the cloverleaf symbol in a book of symbols used on Swedish maps to indicate a point of interest while traveling.

Anyway, beware how you use the Apple symbol. As a solid symbol, instead of an outline, it can be imposing. In an HTML document (web page), you can type the Apple symbol by adding this HTML entity to your code:



It should look like this:



If you need to type the Apple symbol into a word processing document or other document on your Mac, the keyboard shortcut is Option-Shift-K.

Creating Colors with UIColor

The UIColor object lets you store colors and also set colors on objects in your storyboard. The UIColor object comes with some colors built in:

Color	RGB Hex	Sample
UIColor.blackColor()	000000
UIColor.darkGrayColor()	555555
UIColor.lightGrayColor()	aaaaaa
UIColor.whiteColor()	ffffff
UIColor.grayColor()	808080
UIColor.redColor()	ff0000
UIColor.greenColor()	00ff00
UIColor.blueColor()	0000ff
UIColor.cyanColor()	00ffff
UIColor.yellowColor()	ffff00
UIColor.magentaColor()	ff00ff
UIColor.orangeColor()	ff8000
UIColor.purpleColor()	800080
UIColor.brownColor()	996633

However, there is also a UIColor method init() that lets you specify a custom color that is not in the list above. For example, supposed you wanted to use the color Chocolate, which is not in the above list. The RGB hex values for Chocolate are #D2691E. You could create this color with the following method call:

view.backgroundColor = UIColor.init (
    red: 0.82, green: 0.41, blue: 0.12);

Note that we have to convert the hex numbers to equivalent floating point numbers in the range 0.0 to 1.0 first. If you have the hex colors but not the floating point equivalents, you can build the math into your function call:

view.backgroundColor = UIColor.init (red: CGFloat(0xD2)/255, 
                                   green: CGFloat(0x69)/255, 
                                    blue: CGFloat(0x1E)/255);

Here is a link to the Apple documentation of UIColor.

Boolean Logic

Boolean logic is a way of describing relationships between ideas that can have the truth values TRUE and FALSE. We describe these relationships in a diagram called a truth table:

x	y	x OR y	x AND y
False	False	False	False
False	True	True	False
True	False	True	False
True	True	True	True

Here is an example of boolean logic. Suppose we have a set of colored shapes. We might ask two kinds of questions. If we choose one of the colored shapes, we might ask: is it blue and a circle? If we choose a blue circle, it is blue and also a circle. If we choose a yellow circle, it is not blue and a circle, because it is yellow (not blue). If we choose a blue square, it is not blue and a circle, because it is a square (not a circle). So whatever shape we choose must satisfy both the requirements, that it be both blue and also a circle.

Useful Keyboard Shortcuts

These keyboard shortcuts are useful when working on the Mac. You can avoid using the mouse or trackpad, and save your wrists a lot of pain.

Windows has similar shortcut keys, but they use the Control key instead of the Command key.

⌘ Space	Spotlight
⌘ Tab	Switch application
⌘ S	Save
⌘ D	Desktop
⌘ Z	Undo
⌘ X	Cut
⌘ C	Copy
⌘ V	Paste
⌘ ,	Preferences
⌘ R	Refresh
⌘ W	Close Window
⌘ L	Edit URL
⌘ N	New file
⌘ F	Find/Search
⌘ G	Search again

Blogger lets you type HTML tables into the HTML tab, and it lets you add styles to your tables too.

Typing the Command Key (Cloverleaf) symbol

In an HTML document (web page), you can type the cloverleaf symbol by adding this string to your code:

⌘

It should look like this:

⌘

Make sure you include the ampersand, the hash (pound or sharp sign), and the semicolon at the end.

In a word processing document, such as Microsoft Word or Apple Pages, you need to go to the symbol insert function, and look for "point of interest" symbol. It is unfortunately not called the cloverleaf symbol, and you can't search for it within a word processing document that way.

In a pinch, you can always just search Google for cloverleaf symbol to get this information.

Running Windows on Mac

Running Windows on Mac is frustrating for two reasons. One, Windows itself is inherently frustrating if you are a Mac user. Two, the emulation software (Parallels, Fusion, Virtual Box) is slow.

Don't forget that in order to run Windows on a Mac, you must pay for the emulation software, and you must also pay for a legal copy of Windows. For the same price, you may be able to buy an inexpensive Windows laptop.

Which is more frustrating? Running Windows on a Mac, or running Windows on an inexpensive and possibly underpowered machine? Only you can decide. But be aware that you do have options.

If you use Windows relatively infrequently, running it on you Mac may be more economical.

Here are some reasons why I have Windows installed on my Mac:

• To test my web sites on Internet Explorer.
• To use Excel and PowerPoint functions that are not available in the Mac versions.
• To compile C# code on Visual Studio.
• To help my students who are running Visual Studio or WAMP on their Windows computers.

Here is some software you can run without actually installing Windows:

• The Mac versions of Word, Excel, PowerPoint, and Outlook.
• MAMP (the Mac equivalent of WAMP).
• Eclipse or ADT for compiling Java programs and Android apps.
• Mono for running C# code from the shell.

Blogger lets you insert styles and scripts

Click a color well to change the color of this text.

Red	#ff0000
Orange	#ff8000
Yellow	#ffff00
Green	#00ff00
Cyan	#00ffff
Teal	#008080
Blue	#0000ff
Violet	#ff00ff
Purple	#008080
Black	#000000
White	#ffffff
Gray	#808080

 

Macs I've known and loved

Purchased	Model	Comments
1985	Mac 512K	My first Mac. Later upgraded to 512KE then Mac Plus.
1991	Mac IIsi	SJSU bookstore.
1992	Powerbook 100	Price Club (Costco).
1994	Powerbook 165c	MacWarehouse.
1997	Performa 6400	Ugly computer. Bought from Small Dog Electronics.
2003	Power Mac G4 MDD	Powerful computer at the time. Bought from Mac Pro in San Jose.
2005	Powerbook G4 Aluminum	Beautiful computer. Mac Pro in San Jose?
2009	MacBook Pro 15”	Tech Restore in Concord. My first Intel Mac. I needed it to run Windows.
2012	Mac Mini	A little powerhouse.
2013	MacBook Pro Retina 13”	I use it for PowerPoint and teaching my classes.
2014	iMac Retina	The retina screen is beautiful.

This cool Tableizer web site lets you create an HTML table from spreadsheet data or tab-delimited data and you can then insert the HTML into your web site. In Blogger, you must paste the resulting HTML into the HTML tab on your post, not the Compose tab.

My advice for buying a Mac

(updated late 2017)

I first compiled this information in 2012 to help some friends who wanted to buy Macs. I updated it in early 2014 to help some students who were taking a class in Mac/iOS programming. (Such requires use of a Mac; it cannot be done on a PC.) Now I'm updating it again.

This is what entitles me to give this advice: I have used many different Macs since 1985, and I buy about one every other year, so I've been doing this for a long time. I have bought both brand new and refurbished. I have opened almost every Mac I've ever owned to upgrade it (except the new ones that can't be opened.) I am stingy, so I always look for the best deal and the best strategy.  

[1] Your friend who works at Apple may be able to get you a discount. However, Apple employees are inundated with such requests from their friends, and they have a limited number of discounts to use, so employees usually reserve the discounts for their family members.

[2] Don't be afraid to buy a refurbished Mac. Apple sells them for about 15% less than list price. A refurbished computer has been returned to a tech who checks everything and fixes what may be broken. Many new computers ship with problems or even DOA. A refurbished computer has been checked a second time beyond the normal factory testing. (This is true of other computer brands besides Apple too.) Be careful: you may be buying last year's model.

SVCTE

Today I started my third week teaching a high school class at Metro Ed / Silicon Valley CTE (Career and Technical Education). I am teaching Mobile App Design and Coding to high school junior and seniors. We have a classroom full of brand new iMacs and other Apple equipment. We'll be writing iPad and iPhone apps. 

We're starting out by learning about color, fonts, and layout. We're doing some practice coding by making small web pages with a little JavaScript.

The students are sharp and most of them seem to be having fun. I met some of their parents tonight at back to school night.

The position is currently only half-time, but I also teach two other programming classes in community colleges.

Looking for a web hosting service

I'm looking for a web hosting service that has available all these facilities: PHP, Perl, Python, Ruby, C++, Java, C#, Swift, Golang, and MySQL available from all those languages. I've written a tutorial that shows how to do web programming in all those languages, but there is no hosting service that has them all available out of the box, and it's hard to find a custom installation that will handle both C# (a Windows technology) and Swift (a Mac technology). My Mac can do it all, but its connection to the net is slow. Dreamhost and A Small Orange say they can handle this with a VPS, which I'd have to set up myself, but I'm skeptical that Ubuntu could run Swift or xcrun, even if C# can be executed by Mono, so it's hard to see how I could get both those languages running together on the same server unless it's a Mac. Any other suggestions?

Caprese Salad

Caprese salad for the potluck. Yum!