Categories
Technology

X-Objects: Element Width and Height

Copy found at Wayback Machine archive.

In addition to being able to change an HTML element’s position within a page, or hide or show the element, you can also use the X-Objects to change the HTML element’s width and height. The X-Objects interface methods to control width and height are:

  • objSetWidth: set an element’s width
  • objGetWidth: get an element’s width, if set
  • objSetHeight: set an element’s height
  • objGetHeight: get an element’s height, if set
  • objResizeBy: resize an element with a given height and width

As with the movement interface methods, Navigator 4.x has unique method implementations for all but the objResizeBy method. Unlike those for the DOM compatible browsers (IE and Mozilla/Navigator 6.0), the Navigator 4.x object methods set width properties directly on the objects rather than through the use of a Style object:

// get element's width
function nsobjGetWidth() {
	return this.css2.clip.width;
}

// get element's height
function nsobjGetHeight() {
	return this.css2.clip.height;
}

// set element's width
function nsobjSetWidth(width) {
	this.css2.clip.width = width;
}

// set element's height
function nsobjSetHeight(height) {
	this.css2.clip.height = height;
}

IE and Mozilla/Navigator 6.0 apply width and height changes directly to the Style object associated with the object:

// get element's width
function domGetWidth() {
        var wd = parseInt(this.css2.style.width);
	return wd;
}

// get element's height
function domGetHeight() {
        var ht = parseInt(this.css2.style.height);
	return ht;
}

// set element's height
function domSetHeight(height) {
	this.css2.style.height = height + "px";
}

// set element's width
function domSetWidth(width) {
	this.css2.style.width = width + "px";
}

All of the X-Objects use the same implementation for the method objResizeBy:

function domResizeBy(wincr,hincr) {
   var wdth = this.objGetWidth();
   wdth += wincr;
   this.objSetWidth(wdth);

   var ht = this.objGetHeight();
   ht += hincr;
   this.objSetHeight(ht);
}

 

Testing Element Sizing

I created a Web page that uses the X-Object width and height methods. The page has a Web form and a test block created within a CSS Positioned DIV block. In the form, buttons are used by the client to shrink or grow the test block horizontally (through the width methods), or vertically (through the height methods).

The BODY contents of the test page has the following:

<DIV style="position:absolute; left:10;
        top:10; background-color: yellow;
layer-background-color: yellow; padding-top: 20px;
width: 500; height:150; clip: rect(0,500,150,0)">
<form action="">
<center>
<INPUT type="button" value="Shrink Block Horizontally"
    onclick="decr_width()"> 
<INPUT type="button" value="Grow Block Horizontally"
    onclick="incr_width()"><p>
<INPUT type="button" value="Shrink Block Vertically"
    onclick="decr_height()"> 
<INPUT type="button" value="Grow Block Vertically"
    onclick="incr_height()"><p>
</center>
</FORM>
</DIV>

<DIV id="info" style="position:absolute;
left: 250; top: 180; width: 300;
height: 300;  background-color:red;
layer-background-color: red">
<H1>Block with info</H1>
<p>
This is a block that contains two HTML elements:
   a header and a paragraph
</p>
</DIV>

The JS to perform the DHTML effects based on the choices the user makes from the form elements is:

<SCRIPT language="javascript"
type="text/javascript">
<!--
// increase width
function incr_width() {
   var wdth = theobjs["info"].objGetWidth();
   wdth+= 10;
   theobjs["info"].objSetWidth(wdth);
}

function decr_width() {
   theobjs["info"].objResizeBy(-10,0);

}
// move element up and down
function incr_height() {
   var top = theobjs["info"].objGetHeight();
   top+= 10;
   theobjs["info"].objSetHeight(top);
}

function decr_height() {
   theobjs["info"].objResizeBy(0,-10);
}

//-->
</script>

As you can see from the code, the DHTML effects based in this example are created using a combination of objGetWidth and objSetWidth, objGetHeight and ObjSetHeight, and objResizeBy. Access the Sizing example for yourself.

Categories
Technology

X-Objects: Movement and Visibility

Copy found at Wayback Machine.

All of the X-Objects have several methods for handling visibility and movement:

  • objSetLeft: set the left position of the element
  • objSetTop: set the top position of the element
  • objGetLeft: get the current left position of the element, if set
  • objGetTop: get the top position of the element, if set
  • objMoveRelative: move the object by a given horizontal and vertical change, relative to current position
  • objMoveAbsolute: move the object, absolutely, by given horizontal and vertical values
  • objHide: hide the object
  • objShow: show the object
  • objGetVisibility: show the object’s current visibility

The Navigator 4.x implementations of all of these interface methods is unique to this browser and version except for objMoveRelative and objMoveAbsolute, which are shared with the DOM and IE implementations.

The Navigator 4.x implementations of the movement and visibility methods are:

// hide element
function nsobjHide() {
	this.css2.visibility = "hidden";
}

// show element
function nsobjShow() {
	this.css2.visibility = "inherit";
}

// element's left position
function nsobjGetLeft() {
	return this.css2.left;
}

// element's top position
function nsobjGetTop () {
	return this.css2.top;
}

// set element's top position
function nsobjSetTop(top) {
	this.css2.top = top;
}

// set element's left position
function nsobjSetLeft(left) {
	this.css2.left = left;
}

 

As stated in the introduction, the IE-specific and the DOM objects (which Mozilla/Navigator 6.0 use) share much of the same interface implementations. The reason this can occur is because of a key shared concept between both browsers — all CSS properties are set through one specific object, the style object. Each HTML element has a property “style”, a reference to the Style object associated with that element and which contains all CSS settings for the element. Based on this, the implementations for movement and visibility for DOM-compatible browsers are:

// element's left position
function domGetLeft() {
      var lt = parseInt(this.css2.style.left);
	return lt;
}

// element's top position
function domGetTop () {
      var tp = parseInt(this.css2.style.top);
	return tp;
}

// set element's top position
function domSetTop (top) {
	this.css2.style.top = top + "px";
}

// set element's left position
function domSetLeft(left) {
	this.css2.style.left = left + "px";
}

// hide element
function domHide() {
   this.css2.style.visibility = "hidden";
}

// show element
function domShow() {
   this.css2.style.visibility = "visible";
}

The DOM compliant methods need to specify a unit of measurement as well as the numeric value for the new values. The X-Objects use pixels (px) for all of the DHTML effects.

The Navigator 4.x and the DOM-compatible browsers (IE and Mozilla/Navigator 6.0) share two method implementations, domMoveRelative and domMoveAbsolute, as these methods are higher-level implementations that call existing lower-level object methods to perform the actual movements:

// make absolute move
function domMoveAbsolute(newleft, newtop) {
   this.objSetLeft(newleft);
   this.objSetTop(newtop);
}

// move relative to current location
function domMoveRelative(left, top) {
   this.objSetLeft(left + this.objGetLeft());
   this.objSetTop(top + this.objGetTop());
}

By calling the exposed interface methods within the X-Object implementation, the correct version of the interface implementation is used for the movement. So, from Navigator 4.x, the left and top methods invoked when using objSetLeft and objSetTop are nsobjSetLeft and nsobjSetTop; from DOM-compatible browsers, the methods invoked are domSetLeft and domSetTop.

Now that we’ve provided the interface implementations for movement and visibility, let’s try them out.

Testing the implementations

I created an HTML page that contains a form with several buttons and a test block that is moved or hidden based on the user pushing the form buttons. The Body of the page contains the form and the test block:

<BODY onload="create_objects()">
<DIV style="position:absolute; left:10;
    top:10; background-color: yellow;
layer-background-color: yellow; padding-top: 20px;
width: 500; height:150; clip: rect(0,500,150,0)">
<form action="">
<center>
<INPUT type="button" value="Move Block Left"
        onclick="move_left()"> 
<INPUT type="button" value="Move Block right"
        onclick="move_right()"><p>
<INPUT type="button" value="Move Block Up"
        onclick="move_up()"> 
<INPUT type="button" value="Move Block Down"
        onclick="move_down()"><p>
<INPUT type="button" value="Hide Block"
        onclick="hide()"> 
<INPUT type="button" value="Show Block"
        onclick="show()"> 
<INPUT type="button" value="Show Visibility"
        onclick="get_visibility()">
</center>
</FORM>
</DIV>

<DIV id="info" style="position:absolute;
    left: 250; top: 180; width: 300;
height: 200;  background-color:red;
layer-background-color: red; clip: rect(0,300,200,0)">
<H1>Block with info</H1>
<p>
This is a block that contains two HTML elements:
        a header and a paragraph
</p>
</DIV>
</BODY>

Notice that the test block is positioned using absolute CSS positioning. This is necessary to access the DIV block with Navigator 4.x. Also, notice that the block has a reference to a CSS attribute, layer-background-color, that is not a valid CSS attribute. This is again necessary for Navigator 4.x in order for the background color to fit the block width and height, rather than just being background for the block contents.

Notice in the example that I’m not using units with the positional elements (i.e. using top: 180 instead of top: 180px) in the stylesheet settings. This was a bad habit I got into and one you shouldn’t get into.

You’ll find that this can cause problems with IE 6.0. You’ll also find that if you use standard mode with Mozilla (using a particular doctype of HTML strict or HTML transitional), that the examples won’t work at all.

Read more on Mozilla’s standard and “quirky” modes at Mozilla – reporting a bug.

The HTML page’s HEAD section contains the reference to the X-Objects script file and the DHTML code to implement the functions of the form buttons. These functions move the test block to the right or left, up or down, or show and hide the block. One last form button retrieves the current visibility setting for the block. The implementations of these functions are:

<SCRIPT src="cbobjects.js" language="javascript"
    type="text/javascript">
</SCRIPT>

<SCRIPT LANGUAGE = "JAVASCRIPT"
                   type="text/javascript">
<!--
// move element left
function move_left() {
   var lft = -10;
   theobjs["info"].objMoveRelative(lft,0);
}

// move element right
function move_right() {
   var lft = theobjs["info"].objGetLeft();
   lft += 10;
   theobjs["info"].objSetLeft(lft);

}

// move element up
function move_up() {
   var top = theobjs["info"].objGetTop();
   top+= -10;
   theobjs["info"].objSetTop(top);
}

// move element down
function move_down() {
   var top = theobjs["info"].objGetTop();
   top += 10;
   var lft = theobjs["info"].objGetLeft();
   theobjs["info"].objMoveAbsolute(lft,top);
}

// hide element
function hide() {
   theobjs["info"].objHide();
}

// show element
function show() {
   theobjs["info"].objShow();
}

function get_visibility() {
   alert(theobjs["info"].objGetVisibility());
}
//-->
</script>

You can access the Movement and Visibility testing page, using Internet Explorer 4.x and up, Navigator 4.x and up, and Mozilla.

I converted one of my existing DHTML pages to use the X-Objects. This page contains an Animated Menu using both the movement and visibility methods, and a timer to create the animation effect. Once you open the page, the menu animation starts. To see the code used, View source once the example is opened.

Another existing DHTML example is relatively simple, using hidden DIV blocks to create a “shadow” effect for Web page text. The example moved as is to the new X-Objects (as did the animated menu, above) without any modifications. Check out the Shadow Effect example, using View source once the example is opened to see the script.

Categories
Technology

X-Objects: Creating the new X-Objects

Copy found on Wayback Machine.

The original cross-browser objects encapsulated browser-specific DHTML implementation behind a set of exposed interfaces, making it easier to change the implementation if needed, and easier to create and maintain my DHTML pages. When a new browser version (or browser) releases, I can make changes to handle the new implementation details in one place, the cross-browser object file, rather than within each page that uses DHTML.

So, instead of doing something similar to the following:

   if (navigator.appName == "Microsoft Internet Explorer") {
	document.all.div2.style.posLeft=incr;
	document.all.div1.style.posLeft=incr;
	}
   else {
	document.div2.left=incr;
	document.div1.left=incr;
	}

I can instead use:

   theobjs["div2"].objSetLeft(incr);
   theobjs["div1"].objSetLeft(incr);

If a browser changes its implementation, then all I need to do is modify the interface method, such as objSetLeft from the example, rather than have to modify the DHTML in each page where I set the element’s leftmost position using DHTML.

The cross-browser objects became cross-version when they provided support, with little modification, for the release of IE 5.x — a mark of a successful use of a technology. However, the true test for these beasties is the release of Mozilla/Netscape 6.0. We’ll find in this section, and the ones to come, that the cross-browser objects did require some modifications, though not to the existing interface methods. Instead, new methods have been added to handle new functionality, as well as changed functionality. Because of these changes, and the fact that the objects are now cross-browsercross-version, and cross-DOM, I’ve renamed the objects to X-Objects.

We’ll take a look at how the X-Objects are created, and then in the following sections we’ll look at the browser-specific implementations of the X-Object interface, and examples using the new X-Objects.

X-Objects: object constructors

My old cross-browser objects are an array of DIV objects. I focused on DIV objects as both Netscape 4.x and IE 4.x supported pulling all CSS-positioned DIV blocks from a page. Additionally, I could create most DHTML effects just by manipulating DIV blocks. To maintain backwards-compatibility with Netscape 4.x, my new X-Objects are still pulling in absolutely positioned DIV blocks as DHTML objects. You’ll see later on in the examples that this still gives us considerable room to create our DHTML effects.

Every page that uses the X-objects to create DHTML includes an external Javascript file, pulled into the page using the following tag:

<SCRIPT src="cbobjects.js" type="text/javascript"
language="javascript">
</SCRIPT>

Additionally, the x-objects are created by calling a constructor method from this file: create_objects. The create_objects function tests to see what browser is accessing the page, and calls a browser-specific version of a DHTML object constructor function based on the browser. The X-Objects create_objects tests for the navigator name of “Microsoft Internet Explorer” and calls create_ie_objects if found. The code could be modified to test for version and call the function create_ie_objects function for IE 4.x, and create_dom_objects for 5.x and up. If the browser is Mozilla or Netscape, create_dom_objects is called if the version is newer; else the function create_ns_objects is called for Netscape Navigator 4.x:

function create_objects() {

    // Internet Explorer 4.x, 5.x, 6.x
    if (navigator.appName == "Microsoft Internet Explorer")
	   create_ie_objects();
    else // Navigator or Mozilla
        if (navigator.appName == "Mozilla" ||
                navigator.appName == "Netscape")
           if (navigator.appVersion.indexOf("4.") == -1)
	      create_dom_objects();
           else
  	      create_ns_objects();
}

The create_ns_objects method pulls the CSS positioned DIV blocks from the Layers collection and loads into an array, theobjs. This array is then accessed by the page creating the DHTML effect:

// For Navigator 4.x, pull all DIV blocks into object array
function create_ns_objects(newarray) {
   theobjs = new Array();
   for (i = 0; i < document.layers.length; i++){
     if (document.layers[i].name != "")
   	 theobjs[document.layers[i].name] =
            new ns_object(document.layers[i]);
     }
}

The create_dom_objects uses the getElementsByTagName method exposed with DOM Level 1, and pulls in all DIV blocks:

// For W3C DOM (Netscape 6.x, Mozilla), pull
// all named DIV blocks into an array
function create_dom_objects() {
  theelements = document.getElementsByTagName("DIV");
  theobjs = new Array();
  for (i = 0; i < theelements.length; i++) {
      var obj = theelements[i];
      if (obj.id != "")
         theobjs[obj.id] = new dom_object(obj);
      }
}

As you can see with both the Navigator and the DOM objects, only named DIV blocks are pulled into the DHTML object array.

The IE objects could also use the getElementsByTagName method, but I want the objects to be compatible with IE 4.x, which doesn’t support the DOM Level 1 release, so I’ll use Microsoft’s proprietary document.all collection to pull in the DIV elements:

// For IE, pull all DIV blocks into object array
function create_ie_objects() {
   theelements = document.all.tags("DIV");
   theobjs = new Array();
   for (i = 0; i < theelements.length; i++){
      if (theelements[i].id != "") {
	   theobjs[theelements[i].id] =
             new ie_object(theelements[i]);
	   }
      }
}

The DHTML array contains references to the X-objects created specifically for the browser. Each of these objects consists of the exact same interfaces, but pointing to different implementations of the functionality.

The Navigator object and it’s associated interface is:

// The Navigator DOM Object
//
//************************************************
function ns_object(obj) {
   this.css2 = obj;
   this.name = obj.name;
   this.objResizeBy = domResizeBy;
   this.objHide = nsobjHide;
   this.objShow = nsobjShow;
   this.objDisplay = nsobjDisplay;
   this.objGetLeft = nsobjGetLeft;
   this.objGetTop = nsobjGetTop;
   this.objSetTop = nsobjSetTop;
   this.objSetLeft = nsobjSetLeft;
   this.objMoveAbsolute = domMoveAbsolute;
   this.objMoveRelative = domMoveRelative;
   this.objGetWidth = nsobjGetWidth;
   this.objGetHeight = nsobjGetHeight;
   this.objSetHeight = nsobjSetHeight;
   this.objSetWidth = nsobjSetWidth;
   this.objSetZIndex = nsobjSetZIndex;
   this.objGetZIndex = nsobjGetZIndex;
   this.objSetClipRect = nsobjSetClipRect;
   this.objGetClipRect = nsobjGetClipRect;
   this.objGetClipLeft = nsobjGetClipLeft;
   this.objGetClipRight = nsobjGetClipRight;
   this.objGetClipTop = nsobjGetClipTop;
   this.objGetClipBottom = nsobjGetClipBottom;
   this.replace_html = nsreplace_html;
   this.objReplaceHTML = nsParamReplaceHTML;
   this.objReplaceText = nsReplaceText;
   this.objGetVisibility = nsVisibility;
}

If you’ve used my previous version of the cross-browser objects, you’ll see that the X-Object interface is the same as the cross-browser interface, with the addition of a few new interface methods. This highlights one very important point: the key to a successful use of object-based technology is never to remove or take away from an interface — new changes should result in growth not destruction.

The parameter to the object constructor is the actual browser-implemented object, which is then assigned to the X-Object’s css2 property. This property wrapping is necessary in order to be able to use the properties and methods supplied by the browser-specific object.

The dom_object and the ie_object point to the same method implementations for most of the exposed interface functionality:

// The W3C DOM Object
//
//****************************************************
function dom_object(obj) {
   this.css2 = obj;
   this.name = obj.id;
   this.objResizeBy = domResizeBy;
   this.objHide = domHide;
   this.objShow = domShow;
   this.objDisplay = domDisplay;
   this.objGetLeft = domGetLeft;
   this.objGetTop = domGetTop;
   this.objSetTop = domSetTop;
   this.objSetLeft = domSetLeft;
   this.objMoveAbsolute = domMoveAbsolute;
   this.objMoveRelative = domMoveRelative;
   this.objGetWidth = domGetWidth;
   this.objGetHeight = domGetHeight;
   this.objSetHeight = domSetHeight;
   this.objSetWidth = domSetWidth;
   this.objSetZIndex = domSetZIndex;
   this.objGetZIndex = domGetZIndex;
   this.objSetClipRect = domSetClipRect;
   this.objGetClipRect = domGetClipRect;
   this.objGetClipLeft = domGetClipLeft;
   this.objGetClipRight = domGetClipRight;
   this.objGetClipTop = domGetClipTop;
   this.objGetClipBottom = domGetClipBottom;
   this.replace_html = domReplaceHTML;
   this.objReplaceHTML = domParamReplaceHTML;
   this.objReplaceText = domReplaceText;
   this.objGetVisibility = domGetVisibility;
}


// The IE 4.x and 5.x DOM Object
//
//***************************************************
function ie_object(obj) {
   this.css2 = obj;
   this.name = obj.id;
   this.objResizeBy = domResizeBy;
   this.objHide = domHide;
   this.objShow = domShow;
   this.objDisplay = domDisplay;
   this.objGetLeft = domGetLeft;
   this.objGetTop = domGetTop;
   this.objSetTop = domSetTop;
   this.objSetLeft = domSetLeft;
   this.objMoveAbsolute = domMoveAbsolute;
   this.objMoveRelative = domMoveRelative;
   this.objGetWidth = domGetWidth;
   this.objGetHeight = domGetHeight;
   this.objSetHeight = domSetHeight;
   this.objSetWidth = domSetWidth;
   this.objSetZIndex = domSetZIndex;
   this.objGetZIndex = domGetZIndex;
   this.objSetClipRect = domSetClipRect;
   this.objGetClipRect = domGetClipRect;
   this.objGetClipLeft = domGetClipLeft;
   this.objGetClipRight = domGetClipRight;
   this.objGetClipTop = domGetClipTop;
   this.objGetClipBottom = domGetClipBottom;
   this.replace_html = domReplaceHTML;
   this.objReplaceHTML = ieParamReplaceHTML;
   this.objReplaceText = domReplaceText;
   this.objGetVisibility = domGetVisibility;
}

The main reason why I’m sharing implementations is that the functionality to make the DHTML effect is the same with a DOM-compliant browser as it is for IE — with some minor differences, that we’ll get to in later sections.

We’ll look at the implementation of these interface methods and test them out in the next pages.

Categories
Just Shelley

X-Objects Introduction

Copy found on Wayback Machine.

Since Dynamic HTML was first introduced in 1997, I’ve always provided code that allows DHTML to be used with the two most popular browsers: Netscape’s Navigator and Microsoft’s Internet Explorer. To make cross-browser DHTML easier to work with, I created a set of cross-browser objects, which I’ve used for all of my DHTML effects.

These objects have now been updated to work with IE 6.0, Netscape 6.x, and the DHTML that should be supported with Mozilla 1.0 when it releases in 2002.

Cross-Browser out…cross-DOM in

Netscape 6.x is a complete re-architecture of the older 4.x browser. Originally the Netscape folks were incorporating new technologies such as CSS and XML into the existing Navigator, and were planning on rolling this out as Navigator 5.0. However, last year these same folks decided not to try and hold onto an architecture that just wasn’t compatible with new Web standards. Instead, they, and the Mozilla Group, started fresh, re-building the browser layout engine from the ground up.

Because Netscape 6.x is built from the ground up, and based on current and upcoming standards, you’re going to find that many of the features supported in Navigator 4.x are no longer supported. This includes the use of layers as well as JavaScript styles (JSS). Instead, Netscape 6.x embraces CSS (both CSS1 and CSS2), as well as XML, and the DOM Levels 0 and 1 (and partially DOM 2 from what I can see) releases from the W3C.

As you can imagine, this is going to have an impact of your Navigator-only or cross-browser DHTML effects. How much so could surprise you.

Changes…

The implementations for DHTML for the new DOM-compliant browsers (Mozilla/Netscape 6.x) is the same as that for IE 4.x and up — for most of the functionality. This includes hiding and showing an element using the visibility CSS attribute, as well as moving an element and changing the element’s width, using the respective CSS2 attributes. In fact, Netscape 6.x is going to be closer in functionality to IE than it will be to Navigator 4.x. Read more on shared functionality in the sections “Movement and Visibility”, “Element Height and Width”, and “Layering and Z-Order”, found at the bottom of this page.

One nice surprise is that event handling with Mozilla/Navigator 6.x is quite easy to incorporate into your DHTML effects, thanks to the new Event-based objects in the DOM Level 2. Very little code had to change in my DHTML applications based on event handling, though each DHTML page did have to change (event handling is not part of the X-Object implementation — See the article section titled “Events”).

We’ll explore the changes between Navigator 4.x and 6.x, as well as the new DOM functionality, as we convert my existing cross-browser objects to the new, improved X-Objects.

Categories
Technology

In celebration of technology

Recovered from the Wayback Machine.

It seems everywhere you look within the high tech industry, all you see is doom and gloom — closed companies, laid off employees, crashing Internet stock. I feel as if I should stand on top of a tall mountain, shouting out, “Is anyone still left in the technology industry!?!”

At the bottom of some of my emails I’ve posted the following:

Will the last person leaving the Internet, please turn off the router?

Have we all forgotten why we’re in this industry? Have we forgotten the joy and satisfaction over mastering a new technology, creating something from nothing? If you look around, you’ll see that not only is the high tech industry NOT dead — there’s an incredible wealth of wonderful new technology out there, most of it free or at least freely available. As poor as we are financially, now, we’ve never been richer when it comes to sheer capacity for technical advancement.

So, we’re heading into a recession. Well, in the last recession, back in the early 90’s, a gentleman named Tim Berners-Lee brought together some disparate technologies into this new thing called “the Web”. And he didn’t have the huge volume of “tech toys” to play with we do now.

Instead of looking back on what once was, we should be looking forward with eagar anticipation to what will be — the next great technical innovation, the next Web, the next revolution, the next reason why most of us entered this field for the first place.

Did I get a computer degree because I wanted to be rich and drive a BMW? When I got my degree in 1987, there weren’t many jobs in the computer field. Those that existed were, for the most part, already filled by old time engineers (no offense). There certainly wasn’t a web, though the Internet existed and was publicly accessible.

I ended up in this field because one day I sat down at an old green on black monitor and typed in a few commands in this language called “basic”, on this OS called Vax VMS, and the computer responded. I wasn’t a computer geek — I was studying law of all things. I only took the computer class because my logic teacher suggested I do so because I liked logic, and had a knack for it. However, when that computer responded, all bets were off, and I started my oddessey into, and my love, of technology that I continue to this day.

So, am I going to run away because we’ve hit another recession? No. No. Again, I say, No.

My current contract ends shortly and there are few contracts in San Francisco, at least until next year (end of the year is bad in the best of times). Rather than panic, I’m going to take this time to work with all these new technologies in a way I haven’t since I worked at Skyfish, my one and only foray into the world of dot coms.

(See article Death of a Dot Com at O’Reilly.)

Yes, I’m dipping into my reserves, and I may not find work next year, and may be out on the street (at least San Francisco has mild weather). Every time I receive a bill in the mail or pay my outrageous San Francisco rent, I am concerned.

BUT (big but here), I’m not going to throw my hands in to the air saying “Well, the dot coms have busted. It’s all over. I’m packing it in, and giving up”. I will not run because times are difficult; I will not give up because being in this field is no longer easy.

And I’m definitely not going to let some gutless wonder with a cult fixation on the other side of the world take away something that’s meant so much to me for so many years, as he’s taken away so much — including life — from so many others.