EeePC, Google Reader, & GreaseMonkey

As I learn more about JavaScript I'm finding that there is more and more cool stuff that I can do with it. For example, my EeePC has a 7 inch screen and so I have to find ways to make the most of what little screen real-estate I have. I've tried using a few of the skins available in the Better GReader add-on, but found that each just doesn't quite hit the nail on the head ... so I built my own!

If that last paragraph makes no sense to you, that's ok, this is a highly specialized solution for a small segment of techies. The easiest way to explain this is to say that my laptop has a tiny screen and I need to re-arrange parts of webpages that I frequently visit to fit a lot of information into a small space.

You may notice that many webpages have a lot of "white space" built into them and when every pixel on your screen counts, you want to get rid of white space and replace it with content thus making the most effecient use of your screen.

So now it's time to stop telling and start showing. Below is a screenshot of what Google Reader looks like on my 7 inch EeePC screen in full-screen Firefox 3:
Here I've highlighted the "white space" that I was talking about, this is the stuff I want to get rid of:And here is the final result:
To do this, all you need is Firefox 3, the GreaseMonkey add-on, and this script:

// ==UserScript==
// @name           My GReader
// @namespace      none
// @include        https://www.google.com/reader/view
// ==/UserScript==
// updated on 20090512

function onLoadHandler()
{

 if(window.parent!=null &&
  window.parent.parent!=null &&
  window.parent.parent.document.getElementById("nav")!=null &&
  window.parent.parent.document.getElementById("chrome")!=null)

 {
  //
  // hide the GReader logo
  window.parent.parent.document.getElementById("logo-container").style.display = "none";
  //
  // reposition the search box in the blue title bar
  searchBar = window.parent.parent.document.getElementById("search");
  searchBar.style.position = "absolute";
  searchBar.style.left = "260px";
  searchBar.style.top = "30px";
  //
  // reposition the left nav

  leftNav = window.parent.parent.document.getElementById("nav");
  leftNav.style.position = "relative";
  leftNav.style.top = "-34px";
  leftNav.style.width = "150px";
  feedTitle = window.parent.parent.document.getElementById("chrome-title");
  //
  // hide the "Your stuff", "Trends", "Browse for stuff", and "Friends' shared items" links
  window.parent.parent.document.getElementById("your-items-tree-container").style.display = "none";
  window.parent.parent.document.getElementById("trends-selector").style.display = "none";

  window.parent.parent.document.getElementById("directory-selector").style.display = "none";

  window.parent.parent.document.getElementById("lhn-friends").style.display = "none";
  //
  // reposition the "Subscriptions" list to re-use the space freed by hiding links
  subList = window.parent.parent.document.getElementById("sub-tree")
  subList.style.height = (subList.offsetHeight + 100) + "px";
  //
  // expand the main body
  mainBody = window.parent.parent.document.getElementById("chrome");
  mainBody.style.position = "relative";
  mainBody.style.left = "-110px";
  mainBody.style.top = "-40px";
  mainBody.style.width = (mainBody.offsetWidth + 109) + "px";
  mainBody.style.height = (mainBody.offsetHeight + 68) + "px";
  listItems = window.parent.parent.document.getElementById("entries");
  listItems.style.height = (listItems.offsetHeight + 68) + "px";
  window.parent.parent.document.getElementById("viewer-footer").style.display = "none";

 }
}

window.addEventListener('load',onLoadHandler,true);