Posts Tagged: windows


14
Mar 09

jQuery bsod plugin

So I was checking up on my twitter feed yesterday and saw a tweet that direceted me to this: http://devthought.com/wp-content/projects/mootools/BSOD/:

The script BSOD.js provides an easy-to-use class to boost the error reporting user experience of your websites.

To fully understand the characteristics of this technique please refer to this external article

I thought to myself… I can do that. I will use jQuery. So I spent most of yesterday after work learning up on how to make a jQuery extension (I wanted to be able to call it the same way as the moo-tools one)

$.bsod();

I got a bit carried away. I didn’t want just a bsod, I wanted each user to feel like the error was specifically made for them, so I added in os detection and os specific styles. I liked the way that he incorporated Spyjax (ajax for evil!), so I added that by default (you can turn it off of course if you want, it will blame a random site that is in the list). I also liked the colour changing, so that is in there too (it works only for the windows bsod though because linux and mac have images). Here are the options:

  • color: the background colour (win only, others are all black)
  • font_color: the font colour
  • error: the error message you want to display
  • os: the os (default is to guess the user’s os)
  • blame_url: boolean – true = blame a specific url
  • url_array: an array of urls you are looking to blame
  • error_array: a bunch of errors that you would like to use (one is randomly choosen)

Dependencies

Right now, the images and jQuery (tested with 1.3.1).

There is also a style that is compressed using cssTidy and inserted with the bsod.

Without further ado:

The demo (click on a word to see the bsod)

bsod.1.0.zip (with the dependencies included so you can use it right away!)

And some screen shots:

screen1 screen2 screen3 screen4

Tested in:

  • IE 8, IE 7
  • Firefox 3
  • Opera 9.63
  • Chrome 1.0.154.48

In case you missed it:

The demo (click on a word to see the bsod)

bsod.1.0.zip (with the dependencies included so you can use it right away!)


6
Aug 08

Xampp Virtual Hosts

One of the tools in my tool box is xampp, which seems to work better than trying to install everything bit by bit (at least it did at work). One thing I never considered was setting up virtual hosts for each project, I always worked from a folder so that to access the site I went to:


http://localhost/sitename

That is fine, but what happens when you are working with a site that needs to be the root site (ie: it has links like /page_name.php which bounce you out to the root)? In that case you need to set up a virtual server. In xampp they have separated the files out to ‘make it easier’ on a user to find what they want. Sometimes this is not the case… so here is how to setup a virtual server (at least it worked for me) on Windows Vista (and XP, and with some small modifications Linux and Mac as well).

Find the httpd-vhosts.conf file, it should be:

    C:\xampp\apache\conf\extra\http-vhosts.conf

if you installed it in the default location.

Then go to the bottom of that file and add:

<VirtualHost *:80>
  ServerName http://sitename.127.ca
  DocumentRoot C:\xampp\htdocs\sitename
</VirtualHost>

if that doesnt work, then there might be something in the http.conf files that is stopping access to that folder, in that case, add

 <Directory C:\xampp\htdocs\sitename>
    IndexOptions +FancyIndexing NameWidth=*
    Options Includes FollowSymLinks Indexes
    AllowOverride All
    Order allow,deny
    Allow from all
 </Directory>

So, you have:

<VirtualHost *:80>
  ServerName http://sitename.127.ca
  DocumentRoot C:\xampp\htdocs\sitename
  <Directory C:\xampp\htdocs\sitename>
    IndexOptions +FancyIndexing NameWidth=*
    Options Includes FollowSymLinks Indexes
    AllowOverride All
    Order allow,deny
    Allow from all
  </Directory>
</VirtualHost>

While you can probably put the site in any folder on your computer, it makes sense organizationally to keep them all in the htdocs folder (at least it does to me…), so that is why the example uses the path

    c:\xampp\htdocs

You should now be able to access your site by going to:


http://sitename.127.ca

For why 127.ca see this site.