Skip navigation

Monthly Archives: August 2008

So, you want to center something in the viewport, and you need the browser window’s dimensions?

If you’re not using a library like prototype, this can be awkward a difficult.

Here’s some code that can help. What it does is get the width and height of the VIEWPORT so you can work with it.

function getWindowDims() {
  return {
  'width' : window.innerWidth ?
            window.innerWidth : //firefox
            ((document.documentElement.clientWidth == 0) ? // are we in quirks mode?
              document.body.clientWidth :  // yes we are, so this is width
              document.documentElement.clientWidth ), // no, so this is width
            
  'height': window.innerHeight ?
            window.innerHeight : //firefox
            ((document.documentElement.clientHeight == 0) ? // are we in quirks mode?
              document.body.clientHeight:  // yes we are, so this is width
              document.documentElement.clientHeight ), // no, so this is width
            
  'scrollTop' : window.pageYOffset ?
                window.pageYOffset : // ff
                (document.body.scrollTop != 0 ? //ie
                  document.body.scrollTop :  // quirks mode ie
                  (document.documentElement.scrollTop) ), // strict mode ie
                
  'scrollLeft': window.pageXOffset ?
                window.pageXOffset :
                (document.body.scrollLeft != 0 ? //ie
                          document.body.scrollLeft : // quirks mode ie
                          document.documentElement.scrollLeft ) // strict mode ie
  
  } ;
}

use:

var dims = getWindowDims(); alert( 'The current width of the viewport is ' + dims['width'] + ' and the height of the viewport is ' + dims['height'] + '\n' + 'The scroll from the top in px is ' + dims['scrollTop'] + ' and the scroll from left is ' + dims['scrollLeft'] );

I use this script all the time in js programs that I need to get the current mouse position in PAGE coordinates. For example, when I’m trying to create a context menu appear at the exact point of the mouse click.

If you just used the event.clientX and event.clientY properties of the event object, then you would get these weird offset coordinates if the page was scrolled to the right or scrolled from the top.

In firefox, the event object does have event.pageX and event.pageY which gets you the correct scroll. But IE has no such property.

Advertisements

why are some people obstinate and stubborn?

Obstinence and stubborness is a result of being raised to be dependent on mommy.

We are so dependent on mommy for so long that we go out into the world like that. And then we start to take doctors, teachers, and even peers to be mommy. Tell us what to do.

Then we start to find that all these other mommies don’t have our best interests at heart. In fact, they manipulate and deceive us. They cheat us and cut corners on us. And we trusted them.

So we become obstinate and stubborn: I won’t listen to anything you say. You’re not my mommy.

well, i recently heard about flock browser after being disappointed by firefox memory leaks.

Trying flock, it looks like:
Flock browser

Flock is based on the Mozilla engine. They basically took it and tweaked it so that it doesn’t leak as much.

Now, let’s look at memory usage, Firefox 3.1 vs Flock 1.2.4. Now I’m NOT sure if Flock 1.2.4 is based on Firefox 2 or firefox 3. but let’s compare anyway.

WELL I’m not going to bother. I visited a string of sites. When you first start up flock, its good with mem usage about 2/3 that of vanilla ff. however, after hitting a few sites, the browser racks up 80 then 100 then 200MB of mem usage, just like original firefox.

all in all there’s no point using flock if you’re trying to get away from memory leaks. firefox has deeply rooted problems that cause its leaks .. until someone gets in there and cleans it out, it will continue.

it turns out that there are 2 functions i didn’t know about all this time:

function sampleFunctionObject( p1, p2 )
{
    if( this.alert )
    {
    // if you use sampleFunctionObject( 'value', 'value2' ); or
    // sampleFunctionObject.call( null, 'value', 'value2' );
    // then you will end up executing this function,
    // but the 'this' variable will be bound to the global object.
    
    // WRONG INVOKATION STYLE!  I don't want to clobber
    // the global object with the new properties that
    // this function will attach to 'this'
        alert( '"this" is the Window object: ' + this );
        return ;
    }

    // Here you've made a call like

// sampleFunctionObject.call( obj, 'val1', 'val2' );

    // so the 'this' variable is a reference to obj, the first arg
    // to the call() method.
    this.property1 = p1;
    this.property2 = p2;

    this.print = function()
    {
      document.write( '<p>' + p1 + ' ' + p2 + '</p>' );
    };
}


var obj = { };  // make an empty object literal

// CALL sampleFunctionObject ON obj (basically,
// CALL sampleFunctionObject AS IF IT WERE
// A MEMBER FUNCTION OF obj.  WHEN we get
// to executing sampleFunctionObject, the FIRST
// parameter is going to be set as 'this' inside
// the body of that function.  The other following
// parameters get passed in order to the function's
// original parameter list ( p1, p2 )
sampleFunctionObject.call( obj, 'parameter 1', 'parameter 2' );
obj.print();

// the .apply() method is the same as .call(), except you pass
// the arguments inside an array instead of as separate
// arguments in a row.
sampleFunctionObject.apply( obj, ['paramt1', 'paramt2'] );
obj.print();

So this is what makes it possible to invoke a parent constructor assuming you’re using the pseudoclassical inheritance pattern as outlined by douglas crockford.

There are quite a few free bittorrent clients out there.

I’m in the process of choosing one for a private BT tracker that I need to set up.

Since I like to know about all the options, I’ve prepared this round up. I may be missing some — if you know of another one, add it to the list!

well, i kind of stumbled with this for a few minutes, but if you’re trying to capture the resize event, you have to attach the listener to the WINDOW object and NOT the body.

This is WEIRD because the way w3schools has it, they attach it seemingly to the body.

<body onresize=" alert('resized'); ">

</body>

That method actually works. But if you need to dynamically attach/detach the resize event handler, then you’ll need to use javascript to do it.

So, here’s how you do it:

    window.onresize = function() {
       alert('resized');   
    };

And here’s how you DON’T do it:

    document.body.onresize/*WRONG!!*/ = function() {
       alert('resized');   
    };

There’s a nice forum post @ bytes.com with some weird code.

http://gamedeveloper.texterity.com/gamedeveloper/2008careerguide/data/Careerguide2008_fall-dl.pdf

Well, MySQL 5.0 introduced stored procedures and functions.

Most people who are php programmers though, don’t know how to use them. nor will they ever bother. Why? The docs are simply to thin, scanty, and they definitely do not have enough examples. Some sections of the docs provide NO examples — for instance, check out the entry for declaring variables: You may declare and use variables within a routine.

That’s IT???

What’s annoying is when you go to the DECLARE variable section, all you see is:

DECLARE var_name[,...] type [DEFAULT value]

That’s ALL? What about a basic example?

Declaring and using variables in MySQL 5.0+

The first thing I’ll tell you that the docs don’t seem to is that YOU MUST DECLARE YOUR VARIABLES AT THE TOP OF THE BLOCK / ROUTINE THAT THEY ARE CONTAINED IN.

For instance, this stored function will work fine:

DELIMITER //
DROP FUNCTION IF EXISTS test //
CREATE FUNCTION test ( input_int int )
	RETURNS int
BEGIN
DECLARE var_returned int;

IF input_int > 20 THEN
	SET var_returned = 50;
END IF;

   return var_returned;
END //
DELIMITER ;

This one will NOT on account of the red line:

DELIMITER //
DROP FUNCTION IF EXISTS test //
CREATE FUNCTION test ( input_int int )
	RETURNS int
BEGIN
DECLARE var_returned int;

IF input_int > 20 THEN
	SET var_returned = 50;
END IF;

DECLARE second_var int;

   return var_returned;
END //
DELIMITER ;

But again this one will:

DELIMITER //
DROP FUNCTION IF EXISTS test //
CREATE FUNCTION test ( input_int int )
	RETURNS int
BEGIN
DECLARE var_returned int;
DECLARE second_var int;


IF input_int > 20 THEN
	SET var_returned = 50;
END IF;


   return var_returned;
END //
DELIMITER ;

BTW, you would try out the stored procedure listed above by:

mysql> SELECT test( 3 );
+-----------+
| test( 3 ) |
+-----------+
|      NULL |
+-----------+
1 row in set (0.00 sec)

mysql> SELECT test( 500 );
+-------------+
| test( 500 ) |
+-------------+
|          50 |
+-------------+
1 row in set (0.00 sec)

Another tip… there’s a wicked-awesome post that explains how to do updates with a join @ this post.

it seems like a lot of my friends from college are moving towards the management-consulting type. some claim to still ‘get their hands dirty.’

my question is, why not have your full time job be playing in the sand of technical development?

one friend (who is a dba) was asking another about web development.

“if i want to build a site and start my own company — should i learn to code it myself or should i try to hire others?”

the management consultant guy said “well, what you would do is plan your vision, then hire some guys to do the coding work for you.

some management consultants are idiots. i vehemently disagreed.

code it yourself. duh man

if you look around, any successful website was the vision of at least one of its coders, if not all. youtube, gmail, facebook, 280slides… you name it. sites that have the visionary as part of the development team in my opinion have a better chance to succeed than those that don’t.

why? because! in development is power. The power to realize that image you have in your head of how the site will work directly into lines of code that do it.

The power to shift things around in the space of an hour in a way that would take a “manager” 1 hour just to communicate to the developer what he wants done. Then the iterative process of “its not right yet” — going back and forth — then the inevitable change of mind of the manager who doesn’t touch code.

People who don’t touch code usually don’t know exactly what it takes to get a specific job done. People who don’t code seldom are aware of what is possible, and how easy or hard it should be.

Its like a basketball player and his coach. The coach might make suggestions about how the players should play, but ultimately its the players who know what’s possible and what’s not given the team they’re against, because they are the ones “in the field” and they work it everyday.

Its easy for a non-technical manager to simply not know how hard something really is to do, or how easy something should be to do — because perhaps an open source library exists that does the very thing desired.

There are a number of posts that went up ~2006ish about how to do domready for prototype.

at that time, prototype didn’t have built in support.

now it does

document.observe("dom:loaded", function() { // initially hide all containers for tab content $$('div.tabcontent').invoke('hide'); });

its easy!

in your WndProc, add a trapping for

#define WM_QUERYENDSESSION  0x11
LRESULT CALLBACK WndProc(HWND hwnd, UINT message, WPARAM wParam, LPARAM lParam)
{
  switch( message )
  {
    case WM_QUERYENDSESSION:
      return 0; // cancel the shutdown
  }
}

That’s really it!