Background

Eight years ago, Becky really wanted a new coffee table.  In my bachelorhood I had purchased the old coffee table with 2 “matching” end tables for $50.  They didn’t really work in our 1100 sq ft condo in the city.  In our suburban pad – comical.  Picture Lego dinner table in the middle of Staples arena.

So we went to Berkeley Mills, and Beck found a table she loved.   I’ll admit – it was beautiful…and $5,000.  For a table.  $5,000 table.  Seriously.

Here is a 10 year old *car* I just found when I Googled “$5000 car”. Its $4900, btw

So I justified buying some toys for the garage.  I already had a decent table saw (a contractor saw w/ good tolerances).  I bought a planer.  $500 in.  That’s 10% of the cost of the Berkeley mills table.  I’m ahead of the game.

Anyway, 2 months, lots of cursing and mallet-pounding later Becky has her coffee table.  See Joey below next to the object in question 8 years later.

…waiting for food to fall…

The table has been with us for years.  We taped “bumpers” on the corners when Emma was little.  When Ryan was a toddler we were experienced/tired parents so we just kept an eye on him.  Both kids teethed on it (I’ll remind them of that offense someday when they are changing my “Depends”) but it is now part of our home.

After I competed the table, Becky next request was naturally “….when do I get the end tables?”.   My promise was “next week”.

Fast forward nearly a decade, another kid…no end table.  Now I’m changing jobs and am going to steal a week to refurbish the workshop and make those end table(s).

Basic Design

Beck and I disagree, but with custom furniture I think it all should be custom – so I’m going to make only one.   The effort to make 2 vs. 1 is like an extra 25% – but I’m moderately confident in my position

I wanted the end table to feel like it is part of the same “set” as the coffee table.  The aspect ratio and other design elements would have to change, but not the basic “cherry frame with contrasting maple inside” idea.   The coffee table design (totally stolen from Berkeley Mills) was very rectilinear, so I’d have to avoid curves.   The basic idea was the have a single maple “box” in the middle of a cherry frame.  I thought it’d be cool to have the box appear “too deep” yet not reveal the maple when viewed from anything but a <45 angle.   I sketched some things on paper, tried to figure out either multiple dimensions (the “hole” is 2x the width of the sides), or creative use of the golden rectangle.  Rather than scan in these sketches, I’ve reproduced the basic idea in MS Paint:

Dude – what did you expect from an attempted isometric drawing in Paint?

Getting Started

I won’t show you the “before” and “after pictures of the garage.  Think “Hoarders” but with kid crap,  bikes, and camping gear.  Below is the wood, planed and joined sitting on plastic (at this point, scratches and dirt are the enemy.  I only put the wood on surfaces of plastic or cloth).

The cherry I planed until it had the ~ dimensions from my original sketches.  For the maple, I had to be more precise (more on that later).  I planed until it was clean/flat, then put the dado on the tablesaw and tried to match the thickness.  After one or two more passes (it is way easier to remove wood than tweak the dado shims), I had a dado cutting the exact thickness of the maple.

This really isn’t part of the discussion, but I just wanted to show off how huge the shavings pile was in the end

Right before I was about to cut the maple for the inner-box, it occurred to me to sand the sides.  It is way easier to do this when it is still  an 8′ board vs. a bunch of cut pieces.  Note I sanded vs. planed because I suck at finish planing.

Tip – make every fixed surface in your garage the same height – usually the height of the table saw. Then, you can do goofy things like shown above.

So I cut the 4 maple boards to a larger dimension than I’d need.   Dado time.  After the first cut, I used a scrap of the same maple to lock the two boards together.  The distance between the dado cuts has to be the same on each pair of boards in the box.  The scrap “key” is very handy.

Note due to the bevel (you’ll see shortly), the depth of the cut in each of the board pairs wasn’t the same.  Repeat and hope like hell you got the height right.  Even if you leave extra material, you’ll never get completely into the same slot on the dado.

Dead nuts!  Note “dead nuts” is a machinist expression I learned at my first job meaning “very precise”.   It doesn’t have anything to do with, as my kids would say, someone’s “ding ding”.

Now I have a box.  Kind of cool.  Time to remove ~ 3/4″ of the protruding arms of the box.

This is one of those tricky cuts where you don’t have a natural surface to butt up against.  It has to be eyeballed.   Note below I’m still using that scrap “key” to ensure the boards are perfectly aligned.

To keep the dado from tearing out the back on each pass, I had a sacrificial backing board clamped between the work pieces and the miter guide.   After a bunch of passes, it looks like that thing ‘Kicking Bird’ gave to Kevin Costner at the end of “Dances with Wolves”.

“…hmmm…but how does it smoke?” “I’ve never smoked it…”

Bunch more easy dado cuts (only one of the boards was a challenge to align), and we have our roughed box.

Below is the corner I was going for.  So far, so good.

Miter the corners.  This was also tricky to align, but if they aren’t exactly the same no one will really notice.  Note the sacrificial scrap under the work piece.

The basic maple “chassis” is shown below.  It was kind-of cool to be able to dry-fit it and pull it apart again.  Like Lincoln logs or something else Ryan would play with.  Except those cost $10 and this cost more in raw wood and took me 2 days.

Now its time to cut the frame pieces from cherry.  One more quick “measure-twice, cut once” exercise I somehow remembered to do:

Oh shi….

Somehow in all the excitement, I somehow measured the inside (or outside) of something and added 2x the width of the sides.    The cherry wasn’t wide enough to still accommodate my original design (“…hole is twice the width of the sides…”) but fortunately I had enough length to cover the perimeter.    So much for my “multiples of dimensions, golden ratio” flacknoge.

“Bill – you suck at this ‘pleasing design’ stuff” – Pythagoras

I’ve been using github for some time to host code.  What I never knew was that I could create html pages (a “site”) for each project, as well as my account as a whole.  I got on the trail of this feature when I noticed my favorite game, 2048, was hosted on a “github” domain.

There is a reserved branch name (“gh-pages”)  which is the root of your project’s site.  Anything in that branch will be served-up from the “<your_user>.github.io/<project>” sub-domain.  For example, today I registered “billsco” as a user (ditching my old, crufty github junkyard).  I now have billsco.github.io as the page for my account (in the specially named “billsco.github.io” repository I created).  For the “Dot Game”, I now have billsco.github.io/dotGame.  All are addressable from the browser, and don’t show the contents as a repository but rather as a web site.  Neat.

What I could not work out was how to keep my apps on “master” yet serve them up from github.io.  I’ve decided to just do development out of “gh-pages” so my changes are instantly visible after a push.   I used my landing “billsco.github.io” page as a holder for links to those apps.

As a reminder for myself and pointer to others, here is the recipe such that a “master” isn’t created for a repo (minimizing the chances of screwing-up and not committing to “gh-pages”).

• Create a new repo (“foo”) using the github UI.  Don’t add the “README.md” or any other files.
• On your local machine, create a repo with the same name, and create the “gh-pages” branch:

$ mkdir foo;cd foo
$ git init
$ git commit --allow-empty -m "Something to branch from"
$ git checkout -b gh-pages
$ git remote add origin https://github.com/<your_user>/foo.git
$ git push -u origin gh-pages

• From now on when you clone, you should automagically be in the “gh-pages” branch.

I decided to add “Log in with…” functionality to a portion of the site.  You’ve seen it – a set of buttons “Log in with Facebook”, “Log in with Google +”, etc.  What am I protecting?  Nothing right now.  Just wanted to see how it worked.

So I started like I do all projects and Googled for what I wanted:

Googling “log in with Google” gave me the above results.  I clicked on the first link which brought me to a page which instantly declared that it was presenting deprecated information:

I’m not trying to knock Google.  They are a great company, and their search engine is an indispensable tool.   As a developer, I can search arcane error messages or phrases involving code and always get an answer.  It’s just funny that the first time I use Google to search for how to develop against Google it falls short.

btw: The right answer was only a few clicks away.

Only a subset of developers suffer from this – but I’m one of them.  I always create bugs involving fence post problems.  You know the fence post problem?  You’ve got 100 feet to be fenced-in.  Fence posts are to be spaced 10 feet apart.  How many fence posts do you need?  100/10=10, right?  Wrong.  You need 11.

As background, I just created a new game.  It’s based on a paper game every parent who has ever been to a chain restaurant knows.  You enter “Chotskie’s” and your kids are dutifully issued their paper menu and crayons.  Often the back of the menu contains a game with a matrix of dots.  The objective of the game is to connect dots, forming boxes.  Each player must create a new connection between adjacent dots during their turn.   If the player completes a square they color that square with “their” crayon, and create one more line.  If another box is closed – repeat.  The object is to close more boxes than your opponent (brother, sister, mean-dad, etc).

So back to fence post problems.  Developers are used to dealing with arrays.  Arrays start at 0?  No sweat.  We warped our brains into starting at “0” years ago.  But consider the sophisticated mock-up of the game below:

In “dot units”, it is 2×2.  That’s the rub.  Describing the system in terms of the intersections vs. the lines messes with traditional array thinking (at least for me).  I also decided to record lines (to tell if someone can create a new line) in arrays.  Since the lines aren’t directional in this game, I decided on the convention of “Left to Right” (horizontal) and “Top to Bottom” (vertical).  Connecting the first horizontal dot with the second (or vice versa) would be recorded at index “0”.   So for the above picture I need a 2×2 array?  Nope:

So my puny brain needs a 3×3 array to handle a “2×2” game.  Auggg.  After a few “+1”, “-1” bugs, I did get it working.  Emma actually sought me out to play a few rounds last night.  Nice.

A few weeks back I decided I needed to create a game to delight my kids.  That made the problem not technical but one of inspiration.  I decided to stew on this for a few days.  Then someone showed me 2048.  This set me back.

First off, it is massively addicting.  When I got the “2048” tile I was momentarily proud then realized I needed to stop (“…what the hell happened to the last 4 hrs?”).   Beyond cycles lost to arranging ^2 tiles, I was floored by the game’s simplicity.   One “level”, no “achievement”.  Just a simple model like “tetris” or Rubik’ Cube.  That’s when I realized my hubris.  Just because I decided to devote some nocturnal cycles to JavaScript doesn’t mean I can instantly entertain.  This may take some time.

So the exercise is mental – examine what I see in things (games, designs, nature) and think of how they may entertain.  In the mean time, I created a simple game to continue to improve my technical skills.  It is more complete than my last effort, but still something of a boring idea (moving a little sprite trying to avoid green balls, eat bacon).   It was nice to work on it with the kids.  Emma spent some real time with me designing the sprite in Inkscape, and Ryan with me on the code.

“Dad – why doesn’t the person fall when they get hit?”

“I think I need to add ‘gravity’ but I need to figure out how to do that”

“I think I saw ‘gravity’ on that page you were looking at [the documentation].  Here [grabs the mouse] I think it was back one page…”

He’s really into it.   He also came up with the name – “attack of the green tomatoes”.

It is now posted, as well as the source on github.  It is totally too big (didn’t really work to reduce images).  I had some fun creating a pattern for “levels”, and parameterized the input to the level class so it could be reused with “harder” arguments as a more advanced level.   Maybe I’ll add a few more level types, or perhaps call it quits and move onto something more interesting.

#!/bin/bash
while [ 1 ]; do
  espeak "ryan eat" > /dev/null 2>&1
  sleep 10
done

Anyone with a fussy eater and a Linux laptop near the dinner table will appreciate this.