This bungalow-style building is located on the highway in a small hamlet outside Middletown, NY. It might have been a store with owner's residence on the second floor.

It definitely looks as if it were designed and built by the owner.

Scotchtown (near Middletown), NY, c. 1920.

Bungalow-style commercial building.

Edges to Rubies The Complete SketchUp Tutorial


The Documentation Frameset.

Chapter 17—Reference Resources

Want a break from coding? This is it! You just download and install my stuff. Is this too easy? Well, you really need full docs for the SketchUp API, Ruby, HTML, CSS and JavaScript. (Actually, if you don't plan to go right on to WebDialog work, you'll only need the first two, so you can skip the rest. We'll have a mid-chapter end point.)

Begin by creating a folder where you'll store SketchUp stuff, if you haven't already made one. I'm using c:/models. You might prefer /home/your_name/desktop/sketchup_stuff. Under that folder, create a subfolder named "doc" or "reference" or whatever.

Download the Tutorial Companion Package for this chapter. Extract it into your "doc" or other subfolder. There's a lot of stuff here! The most extensive (by file count) group is my cover for the Google API docs.

The Google API Docs

Poor frames. They are so in disfavor. The reason they are in disfavor is that they do not play nicely with browsers designed for the visually impaired. Therefore, some conclude, we should not have frames.

I've seldom heard a dumber argument. Charts (stock market and other financial charts, not navigation charts) are a way of showing numeric series visually, to aid sighted persons. Imagine this argument: "Charts are for sighted persons. They are not helpful for the visually impaired. We should not have charts." (Navigation charts discriminate against visually impaired pilots. Therefore we should not have navigation charts?)

How about, "Google SketchUp is a way to display 3D models for sighted persons. It is not for the visually impaired. We should not have SketchUp." Dumb, dumber or dumbest? You choose.

Frame-based websites are a wonderful navigation vehicle for sighted persons. Google's API docs would be better if they had been done with frames. I redid them with frames. You judge the results.

Open a browser, but not your everyday browser. I use Google Chrome for my reference browser. Then File/Open (in Chrome, press Ctrl+O) your /models/doc/api-doc.html. (Choose your folder, not mine.) You'll see something like this:

Summary table, all API classes.

The default opening implies a click on the "All" topic (frame across the top). In the top frame, click the "Geom" link. You'll see this:

Geom category clicked.

Individual classes are shown in the left-side frame. The main frame is still showing the "All" page. Click "Transformation" in the left frame and you get here:

Transformation class Google documentation.

You may have noticed a slight delay in loading this one. This is actual Google doc from Google's servers. It's not as quick as loading HTML from your local disk. When you click "rotation", you're back to full speed as you are looking down the loaded page for the "#rotation" link.

Transformation class, rotation method.

If you knew that the Transformation class was in the Geom category, you could have got here with one less click, using the All page:

Geom, Transformation from the All page.

Clicking any category along the top loads the left frame with the list of classes in that category and loads the main frame with the "All" page. Clicking any class in the "All" page loads that class's category list in the left frame and the selected class in the main frame. (Mixing frames and a wee bit of JavaScript lets you select links in two frames at once.)

And with that, I will withdraw from the "explaining the Sketchup Ruby API" business. You are on your own. But first, a hint: it is not easy to get started with the API. Posting a basic question in the SketchUcation Developer's Forum is highly, highly recommended! "Hi, I'm looking to write my first tool. What classes do I need to use? Martin told me to ask here."

Actually, don't post that question. Google your question first. You'll find that one already answered. I posted the question (among hundreds of others).

Sketchup.send_action() Reduced

There's one special page here that I've created. Click "SketchUp" in the "App Level" classes. (It's really "Sketchup", but I've built my pages from the Google docs.) Then click the send_action() method. That will lead here:

Partial send_action() method list.

This list (it's four times longer than the image shows) is unsorted and substantially unhelpful. I've organized it. You can pick it from the list of App Level classes in the left frame, or from the All page in the main frame.

Sketchup.send_action() Reduced.

From this sorted list you can easily choose, for example, a tool if you know the tool's name. 'selectMoveTool:' will do just what the name suggests. (And, on a less cheerful note, you can easily see that there is no support here for File menu actions.)

Ruby Reference Material

Why did I suggest that you use a browser that you do not otherwise use every day? Tabs.

All modern browsers support a tabbed interface. Most have for years. All have an option to open the tabs that were open when you last closed the browser. My Chrome browser has, from left to right, a tab for the API, another for Ruby, then JavaScript, my JavaScript console application, an HTML reference and last, CSS.

For Ruby I prefer ruby-doc.org. It's main menu is this:

Ruby reference.

You can see that the ruby-doc people like frames, too. The top-left frame lists the source code files. This is useful if you are truly Ruby hardcore, want the exact details and speak fluent C, which I doubt describes many of us.

The middle-top panel is the one I start in. It lists all the Ruby classes. Need to throw together a Ruby regular expression? Click Regexp. That gets to the class doc, including an all-too-brief explanation of what the class is, a list of methods, another of constants and documentation of each method.

The right frame lists all the methods, alphabetically. I don't find this particularly helpful. In the case of Regexp, for instance, clicking "match" within the Regexp class gets to the regular expression match method reasonably quickly. Scrolling the method list to "match" gives you lots of choices, and most are irrelevant to Regexp's match method.

If you are new to Ruby, this is probably too deep. Your assignment (just when you thought you were going to breeze through this short chapter!) is to Google "Ruby tutorial" and find one that is targeted at your level.

My choice is at ruby-doc.org/core/.

The rest of this chapter is for those who want to go on to WebDialog work, in which fancy user interfaces combine web pages with Ruby. If you'd like to spend some time with all you've learned so far (or you can't wait to program that wicked roller coaster ride) this would be a good time to a) close this chapter and this tutorial, or b) return to the Table of Contents to find your favorite topic. This material will wait patiently for your return.

JavaScript Reference Material

Before we go to JavaScript, I see a question. "What browser do I prefer?" I use three regularly. In alphabetical order: Now on to JavaScript, where I prefer the w3schools tutorial.

Oddly, I asked Google for "JavaScript reference" and it comes up with a tutorial. More oddly, I agree! This tutorial makes excellent reference material. When your for ... in loop doesn't work as you want you can find it quickly in the left-hand column:

w3chools JavaScript tutorial.

Again, try Google for "javascript tutorial" (generally the more beginner-friendly sources) or "javascript reference" (an "I know what I'm doing—I just don't do it often enough to keep it in memory" source). Choose one that works for you.

Mine is at www.w3schools.com/js/.

JavaScript Console Application

Next is a JavaScript program I wrote, the JavaScript Console. It provides a console, not unlike the Ruby Console, where you can type some JavaScript and get an answer. 2+2 in the input window returns 4 in the output window. In the screenshot below, please explain the last result:

The JavaScript Console in operation.

To open this one, open js_console.html in your doc/ subfolder.

Oh yes, the last result. ( NaN == NaN ) is false. NaN (Not a Number) is not equal to anything, not even itself. To test for JavaScript's NaN you use the isNaN() function.

HTML Reference Material

There are two front doors to the Web Design Group's HTML doc. One is the alphabetical list of HTML tags:

Web Design Group alphabetical index.

That is at htmlhelp.com/reference/html40/alist.html. The other front door is the organizational list at htmlhelp.com/reference/html40/olist.html:

Web Design Group organizational index.

CSS Reference Material

The final reference I keep at hand is the w3schools (after the World-Wide Web Consortium, universally known as W3C) CSS reference.

w3schools.com CSS reference. I know enough CSS to know that a single border property can set size, style and color, but I use it infrequently enough to never remember the right order. I do remember that the wrong order will set absolutely nothing—the renderer will see the property value, say to itself "What's this?", give up and discard the thing.

One click here on "border" and I've got the exact information I need:

CSS border property.

This lets you dress up your HTML with CSS styles, without ever troubling to learn the myriad properties and values. (Border styles can be dotted, dashed, solid, double, groove, ridge, etc. Are you going to remember even a few of them?)

Find this data at www.w3schools.com/css. Ask Google for a little help finding alternatives.

Bookmark the Front Doors

After a little bit of use, you will be someplace like this:

Category UI, PickHelper class, PickHelper.test_point() method.

That's great. You found out what you needed to know about PickHelper.test_point(). But the next time you come here, you will be looking for something else: Geom::Transformation.new() has ten different sets of arguments, for example. It's important that you be able to get do the SketchUp Ruby API front door with a single click:

SketchUp Ruby API, All page.

In the next chapter, we'll get on to HTML and CSS so you can do the slickest WebDialogs ever, providing the front ends for your ever-so-fabulous Ruby plugins. You'll be glad you have your reference browser set up.


Biplane, star of Airshow!. View of apartment contents. The axes box in the Lumberman WebDialog.