• Capabilities of a desktop application with manageibility of web applications
• mash related data from different sources
• Focus on client side processing
• Simple but powerful interfaces
• Collaborative

Why it is difficult to develop web 2.0 application?

• Complex technologies involved like SOAP, JSON, Javascript, Ajax etc.
• Most tools and solutions are either front end or backend.

IBM has come up with EGL to solve these problems and provide a easy platform for the development of RIA.

EGL is a higher-level programming language designed for developing powerful, modern applications

The goal is to shield developers from complexities typically associated with Web 2.0 application development.

EGL Features:

• A true cross-platform, cross-tier language targeted at all types of developers
• Traditional, procedural, object-oriented
• Provides flexible deployment options
• Compiles to Java, COBOL, or JavaScript
• Web 2.0 and SOA built-in

EGL is also an excellent target language for migration of existing, traditional applications

EGL is easy to learn, simple, open and extensible, comes with widget library, eclipse based plugin, can consume all types of webservices.

More on EGL

Segnala presso:

Web vs Desktop: Desktop allows a lot of options to store data on the client side as it allows us to access information from local files. But the web has a limitation in that respect. Wen do allow some mechanisms to store and load data locally one of them is cookies.

What is a cookie? Cookies are small text based files which holds information in key:value pairs. Cookies are domain specific and don’t allow other domains to access data other than created by themselves.

Example of a cookie file.

firstname=devang;expires=29/04/2008; path=’/'; domain=’/';

This example stores firstname as a cookie and also tells us when it expires and about the domain and the path which are allowed to access the cookie.

Cookies can be used for Session Management, Personalization, Tracking. Lot of information about cookies can be found at More on cookies

Cookies can be used to serialize javascript objects and store them in cookie files. Then when needed they can be deserialized and brought back into application. After deserialization a json is made can be used as a  normal Js object.

A js wrapper for loading and saving jsObject is cookieMonster.js.  It has got all the functions required to load ,save objetcs to cookies and  removing them.

But there are some drawbacks with cookies like

• Inaccuratee Indentification
• cookie hijacking
• cookie theft
• cookie poisoning
• cross site cooking

Information about all these can be found on more on cookies

There are various alternatives available for cookies like

• IP address
• URL (query string)
• Hidden form fields
• window.name
• HTTP authentication
• Adobe Flash Local Shared Objects

So before using cookies analyse our case and if you use cookies make sure you are ready for the drawbacks which cookie offers.

If you want to know how cookies work you can read a super article at howstuffworks.

nJoy !!

Segnala presso:

var bodyContent=window.frames['frameName'].document.body.innerHTML;

To my surprise it was not cross browser compatible.

It didn’t work on both IE and Firefox.

After googling i figured it out how to make it work for both IE and Firefox. Here is the code

var iFrameId =  document.getElementById('frameId');
   //For Firefox
   if ( iFrameId .contentDocument )
   { 
     alert( iFrameId .contentDocument.getElementsByTagName('body')[0]);
   }
   else if ( iFrameId .contentWindow )
   { // internet explorer
     alert(iFrameId .contentWindow.document.getElementsByTagName('body')[0]);
   }

Have fun !!

Segnala presso:

This problem exists even in Gmail , Google Maps etc.

I came  across a solution which can solve bookmarking and back button problem. The article listed on ONJava.com demonstrates the way in which this problem can be solved.

They have used RSH (Really Simple History framework) to solve this problem.

The crux of the solution is

• Hidden HTML form is used to allow for a large transient session cache of client-side information; this cache is robust against navigation to and away from the page.
• A combination of hyperlink anchors and hidden iframes is used to intercept and record browser history events, tying into the back and forward buttons. Both techniques are wrapped with a simple JavaScript library to ease development.

What is RSH ?

The Really Simple History (RSH) framework makes it easy for AJAX applications to incorporate bookmarking and back and button support. By default, AJAX systems are not bookmarkable, nor can they recover from the user pressing the browser’s back and forward buttons. The RSH library makes it possible to handle both cases.

In addition, RSH provides a framework to cache transient session information that persists after a user leaves the web page. This cache is used by the RSH framework to help with history issues, but can also be used by your own applications to improve application performance. The cache is linked to a single instance of the web page, and will disappear when the user closes their browser or clear their browser’s cache.

RSH works on Internet Explorer 6+ and Gecko-based browsers, like Firefox. Safari is not supported.

Source

DEMO

Segnala presso:

This library contains six of the most useful JavaScript tools available for today’s website. The beauty of this library is that all of these tools can be used together, extended, configured and styled. In the end, you can have hundreds of different widgets and new personal ways of using the library.

This library is open source and dual licensed under MIT and GPL 2+ licenses.

jQuery Tools

Performance :
This library weighs 5.8 Kb. This is possible with good programming habits, compressed files and a Content Delivery Network (CDN).

Accourding to jQuery Tools –
“The file size is definitely not the primary reason why this library speeds up your site. The fact that this tool is a single file makes it performance friendly. According to Yahoo experts, this is the first rule for making highly responsive websites.”

I tried it for a demo and its experienced the speed factor stated above.

jQuery Tools provide six components

• tabs
• tooltips
• scrollale
• overlay
• expose
• flashembed

See Demos of jQuery Tools at  Demos

Download it from  Download

Segnala presso:

The problem has different solution depending on platform/browser

Solution

1) Windows/IE : Use the available FileSystemObject. It allows one to read and write files from local machine.

2) Firefox: It does not have a object corresponding to FileSystemObject in IE. So we rely on XMLHTTPREQUEST Object provided. Our strategy here is to send the file to the server. On server read the file and flush the content to the client. On client side we can get the file contents in xmlhttprequest.responseText property.

3) Applet: This solution makes use of Java Applet which allows you to read the local files.

Example of 2nd method using PHP as scripting language

1) From the client side write a form having a file upload utility.

2) Send the file to the server.

3) On sever side read that file and flush the contents

PHP Code

if ($_FILES["file"]["error"] > 0)
{
echo "Error: " . $_FILES["file"]["error"] . "
";
}
else
{
echo "";
$file = fopen($_FILES["file"]["tmp_name"], "r") or exit("Unable to open file!");
//Output a line of the file until the end is reached
while(!feof($file))
{
echo fgets($file). "
";
}
fclose($file);
}

4) On client side read it as

var fileContent=xmlhttprequest.responseText

Thats it guys. You are Done.

Segnala presso:

“Robot.txt is placed at the root folder of the site”

Webmaster can specify three instructions for crawlers namely

• disallow : which tells the robot about sections which it cannot visit.
• crawl delay: speed at which crawler crawls the site.
• sitemap: Tells the crawler about all the pages associated with the Site and their URL.

Sitemap instruction is very useful for the Search Engine Optimization.

Example of Robots.txt:

User-agent: *
Disallow: /javascript/
Disallow: /css/
Disallow: /images/
 
sitemap:www.robotdevpaliwal.com/sitemap.xml

In this example robots wont be able to access three folders namely javascript, css, images using any user-agent.

Sitemap command tells the robot the location of the sitemap file.

Another example

User-agent: *
Disallow: /

This will not allow the robot to index even a single page from the server.

Another example

User-agent: xyzBot
Disallow: /

This will disallow xyzBot to crawl the website.

Another example

User-agent: *
Disallow: /password.php

This will disallow acces to password.php in the root folder.

Segnala presso:

Just need to put a @ before calling file handling functions.

$handle = @ fwrite(”abc.txt”, “w”);

After this warning messages were not rendered on the screen.

Segnala presso:

Solution: IE provides Dynamic Properties to solve this problem. IE provides “expression“  propert/function which is evaluated at runtime and the value is assigned to the CSS property.

For example: Lets look at the below css

position:absolute;
 
left:expression(document.body.clientWidth/2-oDiv.offsetWidth/2);

In this example left property will be assigned the value of ” document.body.clientWidth/2-oDiv.offsetWidth/2 “.

So now to set min-height of a div with id ‘xyz’ in CSS we write:

For Internet Explorer

HTML
<div id=”xyz” class=”xyz”/>

CSS

.xyz{
 
height:expression(document.getElementById('xyz').scrollHeight > 50 ? "50px" : document.getElementById('xyz').scrollHeight+"px");
 
}

For other Browsers

.xyz{
min-height:50px;
}

The same holds true for all other properties namely max-height,max-width,min-width.

For more information about expression you can read this article.

Segnala presso:

Download TWEET

Download jQuery

How to use it?

1) Include jquery.min.js file in the head section of your html page.
2) Include jquery.tweet.js file in the head section of your html page.
3) In this jquery.tweet.js file change username to username whose tweets you want. ex devangpaliwal
4) In head section of the html document add following code in script tag.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

$(document).ready(function(){
        $(".tweet").tweet({
            username: "devangpaliwal",
            join_text: "auto",
            avatar_size: 16,
            count: 100,
            auto_join_text_default: "I said",
            auto_join_text_ed: "I",
            auto_join_text_ing: "I am",
            auto_join_text_reply: "I replied to",
            auto_join_text_url: "I was checking out",
            loading_text: "loading tweeter feeds..."
        });
    });

5) In body tag add the following HTML. This is where twitter feeds will appear.

<div class="tweet"></div>

List of features which TWEET offers-

• small size and fast download time
• will not slow down or pause your page while tweets are loading
• display up to 100 tweets, as permitted by the twitter search api
• display tweets from a twitter search, or from your own feed
• optional verb tense matching, for human readable tweets
• optionally display your avatar
• optionally display tweets from multiple accounts!
• automatic linking of @replies to users’ twitter page
• automatic linking of URLs
• automatic linking of #hashtags, to a twitter search of all your tags
• converts <3 to a css styleable ? (we ? hearts)
• makes awesome text, AWESOME text with AWESOMEIZER
• customize the style with your own stylesheet or with other jquery plugins
• compatible with most jquery versions, including jquery 1.2.6 and the latest, 1.3.x

Bold features are the ones which distinguishes it from other twitter plugins.

A must use for sites providing social media!!

Segnala presso: