How to share notes across multiple machines

Throughout the day, I am working on multiple machines. And sometimes I need to a way to note down some ideas, links, articles in whome I’ll be looking later on, and at that time I could be on different machine. Its also important that its an OS independent solution.

Earlier I used backpackit to write down notes, links etc. But It was cumbersome, I had to go to my backpackit page and than add the required thing still It allowed you to add notes, check lists, links etc.
Now a days I’m using Google Notebook. It allows you to add text clippings, images and links to your notebook. And you can access it on any machines. It becomes more useful and productive with the help of firefox extension for google notebook where you just select the text (or link, image) and right click and Note this! (Or Clip it) And you are done. Now you can access the notes on any other machines.

It also allows you to comment, tag your ideas along with providing the functionality of sharing the notebook and many new improvements.

Tell me how do you share notes when working across multiple machines.

The Perfect Home Page

Through ajaxian.com, I found about this project “TPHP “.

“command based way to start your web journey”

An simple designed HTML page with javascripts to provide various functionality like search from google, yahoo etc and others like whois, dns lookup. It provides all these functionality with a simple command like interface. For example you can do :

-g India // to do a google search for India
-g India>> // to take you to first result of google search
-whois google.com // to do whois query

It also provides recommendation based on previous searches.
Try it..and give your feedback , would you prefer such homepage ?
For more details :TPHP: The Perfect Home Page

Creating Error 404 page

Helping lost visitors? Sometimes a link provided by you may end up as 404 page or viewer might have typed wrong URL that doesn’t lead correct page on your site. To help your visitors you can actually use .htaccess file (for Apache servers) to redirect all such links to a special page which will be more useful than plain “404 File Not found” error.

You can add this one line to .htaccess file (create this file if it doesn’t exist)

 

ErrorDocument 404 /web404.html

This will redirect all queries for files not found in that directory and sub directories to web404.html
On that page you can provide user with:

So yesterday I added a 404 page for my website: Check it out

I have also added similar functionality for my wordpress blog. For setting up 404 Error page on wordpress follow this well compiled article: Creating an Error 404 Page

Interesting read: Creating User Friendly 404 Pages

View page source trick in firefox, flock

You may have read about firefox’s special about: pages like about:config, about:cache etc. Or you can go through Firefox about: pages to have an idea about them. There is one similar functionality in firefox which allows you to view page source of a page. You can type

view-source:http://www.google.com/

this in location bar to view page source of google.com.
So i have made this Bookmarklet to view page source: View Source (So you can drag this to your bookmark toolbar to have quick access).

Similarly you can type javascript: in your location bar to open java script error console.

Update1:
Key Board Shortcut: Use Ctrl+U to view page source

Related Post:
Firefox About Pages
Little tweaks with javascript : Bookmarklets.
Open webpages in sidebar

Cross-site Scripting (XSS)

Two days back, my shoutbox was hacked :). I was not aware that people are actually visiting this, which I made long back to have similar thing for Ethos in june, 2005. After that i haven’t updated the code and many things were left in between.

What actually happened: Cross Site Scripting, when we want user to input some data (which may be html/javascript) and displays it back. So if html/script tags are not properly checked it can cause trouble. Earlier I hadn’t checked for javascript, iframe inputs. So somebody just inserted an iframe as message input in my shout box. And the source of iframe contained redirection to another website. So when shouts were displayed on the page the iframe code was displayed as it is and page got redirected to other page.

Luckily I checked the page just after the day this happened, So that way i actually got chance to update this orphaned code and made some fixes.

Solution : Idea is to filter meta characters such as (< , >, ‘ , ” etc) Which will prevent browser from processing them as part of some script, they will be processed as plain text only.
So while doing in php you can do:

$shout=str_replace("<","<",$_GET["shout"]);

And to be on safer side we should also replace following characters:

replace ( with (
replace ) with )
replace & with &
replace ' with '
replace " with "

Or If you are not expecting user to input these characters then you can simply replace these with null string;

Update: (25-apr-2008)
You can also use php functions htmlspecialchars, htmlentities, strip_tags.

The replacements which I have mentioned above can be easily done using htmlspecialchars but if you want to extend it to all html tags then you can use htmlentities. And to strip both html and php tags from string you can use strip_tags. The disadvantage with strip_tags is that it doesn’t validate html so can cause trouble in case of broken html tags. It also provide you option to exclude list of tags from being stripped.

So now you can enjoy Shout Box until some new bug is found or its hacked again [;)]

Related post:
SQL Attacks: Hacking (SQL injection)

Update(14th May 2008): XSS cheatsheet by ha.ckers.org lists possible cross site scripting methods on various browsers.

Firefox shortcuts

Today I learnt 2 new firefox shortcuts/tricks through this article 20 Amazing Firefox Shortcuts to Save You Time and Money.

Read article for more such tips.
Related Links:

Trying hands on Google gadgets

Tonight i tried creating some google gadgets (actually its quite easy using Google Gadget Creator). You can check out them here: Google gadgets . You can use html / javascript (as in any other webapage) to create gadgets.Rubik timer gadget So i converted my Rubiks Cube Timer to a gadget. Other one is a gadget to search stock, scripts on bombay stock exchange.

You can also create gadgets using : Make your Own Gadget (Which is as simple as filling out forms)

P.S. : My first post on wordpress blog. (I imported my previous posts from blogger)

Power of RSS reader

I saw this on Kshitij’s blog and later on Amit’s blog: How Do You Subscribe to Blog Feeds ?

RSS in plain English: Watch video

You may need a flv player to view it.

Improving interactivity with Javascript

HTML controls other than conventional Push buttons, radio buttons, check boxes, select boxes, and text inputs, can power up forms, webdev using javascript to increase interactivity and easy (for users). List of such controls includes : slider, Date picker, Smart text boxes, Advanced tooltips, Auto validation etc.

Read more friendly bit >> Improving interactivity with Javascript
In addition, I find image maps also very handy when it comes to intereactivity when used properly with tooltips…as i used them in Paint Chat.

Bonus link[ :) ] DailyBlogTips > Web 2.0 Webdesign Tutorials
Related post :

GPRS on Mobile

Yesterday I activated GPRS on my mobile (nokia 6030) …its quite cheap( 10paise/10kb)
So I tried different pages which works for mobile

Some more websites which works on mobile can be found here : Mobile Compatibe Wesites

So I thougth i should have a mobile webpage too.. so i searched for it and found this great tutorial on w3schools: WAP/WML tutorial. It has also got a demo page which works with explorer only but it contains simple and good examples explaining basic features of wml along with preview on how it looks on mobile.

The WAP (Wireless Application Protocol) protocol is the leading standard for information services on wireless terminals like digital mobile phones. WML stands for Wireless Markup Language. It is a mark-up language inherited from HTML, but WML is based on XML, so it is much stricter than HTML.

Tutorial was pretty easy..so i create my own pae which works on mobile. You can access it at:
http://www.aburad.com/m.wml, though it contain my pic, blog address and some content only(I will add some more content). WML supports wbmp(which is black & white) image format,( you can convert image to wbmp using http://www.online-utility.org/. It als o supports jpg format. One more thing while designing your pages for mobile, you can opera to see how it looks as it supports wml files. Or check it at online wap emulator: WapTiger
Some more links : Wap Tutorials(haven’t tried yet).

Related Post :Things You Never Knew Your Cell Phone Could Do

Next Page →