Screenshots now use on-the-fly thumbnails

phpI finally got around to implementing thumbnails for the screenshots to the right and in the gallery! Basically, instead of loading full screen images (which take ages to load on a slow internet connection) you are now loading images that have been shrunk from the originals down to the size that you see so no bandwidth is wasted and you see them load much faster!

Here is how it works:
The script that I’m using takes a src param and a width param. [You’ll see this if you’re viewing the source of the images. πŸ˜‰ ] The src (or source) param is the path to the original full size image. Once the source or path to the image has been established, the script shrinks and caches (saves or stores) the image on the server and then sends it to you. This makes my job of maintaining screenshots much easier!

Just thought you ought to know. πŸ˜‰ You most likely would never have known that these images were served to you on-the-fly and are not actually stored on the server in the sizes that you see. Just a neat little php trick!

If you’re interested in the script that I used you can find it at phpthumb.sourceforge.net/. It’s open source and updated fairly often (just enough so it’s not out of date, lol).

Enjoy the faster page loads!

New Screenshot Gallery Design..

I came across a very cool open source gallery project online that makes heavey use of Javascript, so I decided it was about time to get knees deep in some code and update the screenshot gallery a little bit. Little did I know how much I would have to manipulate the code to work with my screenshots. πŸ˜€

Checkout the new screenshot gallery design here!
Be warned..I haven’t implemented thumbnails as of yet, so the gallery will take a bit longer to load than it will when the project is complete. Just be a bit patient until I get the thumbnails loading instead of the full size pictures. πŸ˜‰

Credit goes to the ImageFlow project for the great work.

Next on the list is to add a custom made photo gallery so I can upload all of my pictures I’ve been taking over the years and let friends peek through them in a cool fun way! You better believe I’m going to be doing some more heavey Javascript coding to get this picture gallery going! The first thing I need to tackle is creating my own upload page so I can do everything from the site and not have to use ftp at all. After that it should be smooth sailing.

lso, uploading screenshots has been temperarily disabled until I update the uploader to cooperate with the new design. πŸ˜€

Cheers!
Off to get a bit of sleep in before NC State beats UNC in football..

UPDATE:
Uploads are now working for screenshots! If you want to upload an image just click here and browser for whatever you want to upload! I have it setup to only accept jpeg, gif and png images for now. The rest is straight forward! Enjoy!

Gmail 2.0

Google recently announced they want to release an updated version of Gmail that’s supposed to be even faster than the current one. Speed increases are due mainly to a complete rewrite of the JavaScript back-end. The main goal of the new version is to improve contacts management. “Gmail 2.0” is apparently available already and slowly migrating for users who choose to go ahead and update before it is officially released. If you would like to do the same then you can do so by following the link below:

https://mail.google.com/mail/?ui=2

Until Gmail 2.0 is completely stable, you will have the option of switching between classic Gmail and Gmail 2.0 interfaces on the fly. I have attempted to update my Gmail account using the above link, however, I’ve read that they have began to slow down and the migration is not immediate any longer. So there is no telling how long you will have to wait, but rest assured it will eventually migrate to the new interface. Now for some previews:

gmail

New Contacts Manager
gmail

New Contacts Manager with lots of information options
gmail

Nice new avatar selection dialog (excellent example of the power of Web 2.0 design!)
gmail
The select box (drop down box) has been replaced by a more
dynamic approach to the select box (using divs that are updated)!
gmail

All in all the updates do appear to be small, however, word on the virtual street is that the overall speed of Gmail has been improved on tremendously! I’ve heard of small complaints about slow initial load times, but that it is very snappy and fast after initially loading. I’ve also heard reports that the chat window is no longer hide-able, however, this may be temporary as it has not been publicly released yet and is not a final product.

Google, or more specifically Gmail, is one of the best examples on the world wide web of just how awesome Web 2.0 is! Let’s define “Web 2.0” right quick:

Web 2.0 according to Wikipedia.org:
Web 2.0 refers to a perceived second generation of web-based communities and hosted services β€” such as social-networking sites, wikis and folksonomies β€” which aim to facilitate collaboration and sharing between users. The term became popular following the first O’Reilly Media Web 2.0 conference in 2004. Although the term suggests a new version of the World Wide Web, it does not refer to an update to any technical specifications, but to changes in the ways software developers and end-users use the internet. According to Tim O’Reilly, “Web 2.0 is the business revolution in the computer industry caused by the move to the internet as platform, and an attempt to understand the rules for success on that new platform.”

Web 2.0 is bringing the internet to a more personalized level. Web sites are beginning to ride the fence between being an application and being just a web site. The look and feel of web pages are starting to become oddly similar to many desktop applications that we use daily.

Just think about it. What are some applications that you use on your computer on a daily basis (or atleast once a week)? I’ll make a small list:

Internet Explorer

Internet Explorer..we’ve all seen it develop over the years. Or have we? We’ve seen Internet Explorer release a new version of their browser from time to time, but how much are they really packing under the hood?

You’ll read reviews and cool new features online around Microsoft enthusiast sites, but how many of the new features and updates aren’t already available in an alternative browser? Internet Explorer 7 seems to be the new cool browser of choice among a very large percentage of web surfers, but why are they using it? Is it because of the built-in search box in the upper right corner? Is it the super cool new tabbed browsing? Maybe it’s just the shiny vista-like skin..? Or could it be that it is the most secure browser available?

Basically, all of those questions can be answered with a simple “No”. Many people just aren’t aware that there are better browsers…or to be a little less bias…alternative browsers that can do everything they need! I personally have been using Opera for all of my browsing needs for around nine years now. Around the time that I starting using Opera, Netscape Navigator was a popular choice. However, most people just stuck to what they already had installed, which was Internet Explorer.

acid2Quick facts: A man by the name of HΓ₯kon Wium Lie (who is now the CTO of Opera Software ASA) proposed Cascading HTML Style Sheets (CHSS) in October 1994. These style sheets were later used to test browsers compliance to web standards for the first time in 1997. The first test, which was called the Box Acid Test (a.k.a. Acid1 Test), was a simple case test used to help browser developers as they developed and implemented cascading style sheets and accepted it into the web. The next test and probably most famous of the two is know as the Acid2 Test. The purpose of this test was to push developers into implementing new features available through CSS. If a browser passes the test then the page loads fine and looks like a simple little smiley face.

This simple little smiley face is in fact a challenge to reproduce. The test is designed to make the results obvious. Either it passes or it fails. You will see a nasty looking face if it fails (hint: look at it in Internet Explorer here). You should check the Acid2 Test in different browsers that you have installed on your computer and decide for yourself if you want to use a product that has been left behind or if you want to switch to an alternative browser with equal or more features and much better web rendering. Personally I would recommend looking into the following browsers and giving them each a test drive:

The Opera browser has been known for years for it’s record of being the most secure browser available. You are much more likely to get a nasty virus from the web using Internet Explorer than you are while using a browser such as Opera. Opera was also a pioneer in the beginning of tabbed browsing days. Many other browsers saw the potential and jumped to implement the same thing. Opera was also the first browser to include a quick search box at the top of the window. Opera provides a light weight browser with the fasted speeds of any browser from almost every angle and some of the best web standards support. You can’t go wrong with Opera!Anyway, I hope you enjoyed this! Download some of these browsers and give them a try! Any of them are more capable than Internet Explorer. πŸ˜‰

New Posting Tools!

I’ve spent some time today making from scratch a few tools to make things such as using bold, italic, underline, inserting images, hyperlinks, emails and smilies (a.k.a. emoticons)! It took some time to complete as the entire interface is written in javascript, but it should be working fine now! πŸ˜‰ Left me know if you have any problems at all. 😎 You can post those here in the comments section if you wish, however, please do provide some method of communication in case I have a question about how the problem occurred (you could just give me a forum name or something so I can get a hold of you). Thanks! πŸ˜€

ECMAScript and CSS: Quick Lesson

Hey all, I know most of you are not guru’s in ECMAScript (a.k.a. Javascript)..but then again I’m not either. I just wanted to share a little tip with you. I find that many times when people try to add javascript functions to their pages or web applications, they add the functions in an incorrect manor.

Here is the most common mistake made. Say you want to make an image button or a hyperlink on your page that is linked to a javascript function. You might attempt this..

<a href=”#” onclick=”Javascript:someFunction();”> Click Here to do some action </a>

One more correct way to do this would be the following..

<a onclick=”Javascript:someFunction();” style=”cursor: pointer;”> Click Here to do some action </a>

Or..if you are using an image as a button or link to a javascript function then instead of wrapping an anchor tag around it, you could do the following..

<img src=”./image.png” alt=”buton” onclick=”Javascript:someFunction();” style=”cursor: pointer;”>

So you can see that the main difference is the use of some simple css ( cursor: pointer; ) which gives you the effect of appearing to “link” to something. The whole linking design is a good way to just make your functions easier for users to find (verses the regular arrow cursor). However, the problem with the incorrect method that I mentioned is that search engines tend to find your site and scan links. When they scan links with addresses such as “#” they usually rank your pages lower. Using css can help you avoid causing poor search results for your site. Also, some browsers are not designed to follow links such as “#” and often just reload the current page. You don’t want your page reloading instead of performing the script that you thought you correctly called for..do you?

So it’s best to just follow safe methods and standards to ensure that your code lasts longer and is supported in most all browsers without having to do silly browser specific hacks. These hacks can often become out dated very fast and force you to do hacks to your hacks. If you’d like to check into other web standards take a look at W3C. If you have any comments or suggested articles please let me know!

Userbars!

How many of you are regular forum visitors? You’ve probably seem many users who have small images in their signatures that make them a little unique.

You can get these signature images from Userbars.org!

userbars.org

They have thousands of contributed signature images! Just do a search for anything that defines you!

Here are a few of my favorites..
opera
vista
photoshop cs3
trillian astra
azureus
bmw

Handy User Javascripts for Opera

Here is a treat for you Opera n00bs! If you don’t know already, Opera 8 started allowing users to add scripts (javascript) to a directory on their local machine. With these scripts, users can do just about anything! One example of how Opera ASA uses scripts in a positive way is that every single computer with Opera on it has a file in the settings folder called browser.js. This file contains javascript functions that Opera uses to correct pages with faulty javascript code.

You can take advantage of this wonderful feature and save some javascript files to your machine that add features such as Google Suggests (which is a drop down menu with suggestions based on what you are typing). This userjs (user javascript) file adds this functionality to all google pages for you! There are also spell checkers and one very important userjs file that patches all google services so they are more cooperative with Opera. Here is a list of what you can get..

  • Google Suggests
  • Google Services Patch
  • Google Thumbnail Image Direct Links
  • No Click to Activate for Flash Items
  • Inline OSpell Checker
    To use these userjs files follow the steps listed below inorder to enable your Opera to use userjs files.

    1. Find the directory that you installed Opera to. If you are on a windows machine then this is most likely in ‘C:\Program Files\Opera’.
    2. After finding the install folder, create a new folder inside of the install folder called ‘userjs’. You should now have the following folder: ‘C:\Program Files\Opera\userjs’
    3. Open Opera. Click on ‘Tools -> Preferences… -> Advanced -> Content -> JavaScript options…’. Now, at the bottom of this window you should see ‘User Javascript Options’ with an input box and a button below it. Click the ‘Choose…’ button and select the userjs folder that you created.
    4. Now click OK to save changes in the JavaScript options window. Click OK once more to save changes to the Preferences window.
    5. Now that you’ve finished setting up Opera to use your userjs files, just start saving the once you want Opera to use in the userjs folder that you created! To get the scripts that I mentioned above just click on them. If you want more you can check:

There is also a video available that you can use to guide you through setting up UserJS with Opera for the first time. Here is the link: video!

Enjoy!

Edit (10th Jun 07):
Here are some more useful userjs files you can use:

Online Alarm Clock

Hey all,
I’ve been spending some of my bored time working on a small ‘fun’ project that I had been wanting to get started. I made an Alarm Clock that you can create an account/password for and setup your very own list of alarms to wake you up in the morning. It is very easy to use and it works! If you by chance do have any questions or comments then please feel free to ask away! Comments can be left here for this blog entry..or you can send me an email if you wish (look at the contact me page). I’m always open for suggestions and constructive criticism.

As always..I’ve tried my best to make it follow webstandards and w3 standards, haha. I’m always coding by standards, but that’s what us Opera fanatics do, lol. We don’t force people to use Opera, we already know it’s the best. πŸ˜›

Back on topic, I hope you all find the Online Alarm Clock useful!

RSS Feed should be working soon!

‘m in the process of writing the code to compile the rss file on the fly so it is generated from the database and I don’t have to manually update it, hehe. This coding gets very interesting and is much easier than I thought it would be.

Leave any suggestions for the RSS feed in the comments section!