Home arrow AJAX & Prototype arrow Page 3 - Uncompressing Source Files with Google`s AJAX Libraries API

Serving JavaScript files without using compression - AJAX

Welcome to the third part of the series titled “Using Google's Ajax Libraries API.” Made up of four approachable tutorials, this series teaches you how to download and use your favorite JavaScript library by means of this client-side API. It complements the corresponding theory with a large variety of code samples.

TABLE OF CONTENTS:
  1. Uncompressing Source Files with Google`s AJAX Libraries API
  2. Serving JavaScript files using compression
  3. Serving JavaScript files without using compression
  4. Assembling the modules of the Ajax application
By: Alejandro Gervasio
Rating: starstarstarstarstar / 12
January 20, 2009

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

To demonstrate how to download, via the Google API, the source files of the Prototype library without using compression, I’m going to rebuild the Ajax-based application that you saw in the previous section. In this case, the pertinent “google.load()” method will take a third incoming parameter to specify that the library in question must be served in an uncompressed way.

That being said, here’s the modified version of the file that downloads the Prototype package in an uncompressed way:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Reading file contents with Prototype library (uses Google API)</title>

<style type="text/css">

body{

padding: 0;

margin: 0;

background: #fff;

}

h1{

font: bold 18pt Arial, Helvetica, sans-serif;

color: #000;

}

#filecontents{

width: 600px;

padding: 10px;

border: 1px solid #999;

font: normal 10pt Arial, Helvetica, sans-serif;

color: #000;

}

</style>

<script src="http://www.google.com/jsapi"></script>

<script>

// load Prototype library with Google API (loads uncompressed source file)

google.load("prototype", "1.4",{uncompressed:true});

// read file contents with Ajax

function readFileContents(){

// send http request

var ajaxobj=new Ajax.Request('read_file.php',{method: 'get',onComplete: displayFileContents,onFailure: displayError});

}

// display file contents

function displayFileContents(requestObj){

$('filecontents').innerHTML=requestObj.responseText;

}

// display error message

function displayError(requestObj){

$('filecontents').innerHTML='Error reading file contents!';

}

// initialize file reading application

function initializeApplication(){

// attach click handler to HTML button

Event.observe('btn','click',readFileContents);

}

google.setOnLoadCallback(initializeApplication);

</script>

</head>

<body>

<h1>Reading File Contents with Prototype library (uses Google API)</h1>

<p><input type="button" id="btn" value="Read File Now!" /></p>

<div id="filecontents"></div>

</body>

</html>


As you can see above, the “google.load()” method has been invoked with a third parameter, whose value “uncompressed: true” indicates to the API that the Prototype package should be served without using compression.

Of course, in most cases it’s preferable to download the source files of a specified library using compression, but there may be some exceptional situations where you may want to choose the “uncompressed” option.

Well, at this point you have hopefully learned how to instruct the Google API to download the Prototype library without utilizing HTTP compression. Nonetheless, you may have noticed that the previous Ajax application in its current state is actually incomplete, since it’s necessary to include the remaining source files.

Taking into account this requirement, in the last section of this tutorial I’ll be listing the complete source code of this sample Ajax program, so you’ll be able to test it much more easily.

Please, jump ahead and read the new few lines. We’re almost done!



 
 
>>> More AJAX & Prototype Articles          >>> More By Alejandro Gervasio
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

AJAX & PROTOTYPE ARTICLES

- Best AJAX Tutorials for Forms
- The Best AJAX Tutorials
- 8 Great Ajax Tutorials
- Using Ajax and jQuery
- Using Ajax and jQuery with HTML Forms
- Ajax.org Offers Cloud9 IDE for JavaScript
- Java Technologies Provider ICEsoft Releases ...
- Using Recaptcha in AJAX Prototype Framework ...
- Google's Closure Compiler Service API: Addit...
- Installing Google Web Toolkit: Introducing t...
- Google's Closure Compiler Service API: Displ...
- Google's Closure Compiler Service API: Deliv...
- Google's Closure Compiler Service API: the A...
- Google's Closure Compiler Service API: the S...
- Google's Closure Compiler Service API: Optim...

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: