AJAX

I did not dwell deep into this topic but went to Google maps.com.au and embedded the requisite link in my page or the HTML document where I needed it. This action was using Asynchronous JavaScript and XML and I did not need to import any additional *.js file in the head section of the HTML doc. The effect I derived was simple and congenial, progressive enhancement and not graceful degradation (week 12 class tutorial) to my page.

<78:360>

Reference:-

Week 11 class tutorial

Google maps (Australia), viewed 23 October 2009,

http://maps.google.com.au/maps?utm_campaign=en_AU&utm_medium=ha&utm_source=en_AU-ha-apac-au-bk-gm&utm_term=google%20maps

lightbox 2 for creating image gallery

In class Alastair showed us how to use jQuery libraries to create image overlays and a tutorial mentioning the same was there in the lecture notes of week 8 in UTS online section. However, the script overlaid the images on the current pages. It worked well for creating clickable enlarged visions of single images. But I wanted to create an image gallery. And it was an extension of the Lightbox JS tool. I did a Google search for creating lightbox image gallery and found http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm and http://www.huddletogether.com/projects/lightbox2/#overview by Lokesh Dhakar. The instructions were very easy and it was mentioned in easy steps which I followed. I downloaded and extracted the required files in my root directory and it was good to go!! I found the exercise easy after doing the single image overlay task and the video overlay task. The section did not want us to incorporate any additional code or files in the head or body section of the HTML document.

<162:848>

Reference:

Dhakar, L. 2008, Lightbox2, viewed 23 October 2009, http://www.huddletogether.com/projects/lightbox2/#overview

Dhakar, L. 2009, Lightbox image viewer 2.03a, Dynamic Drive (dhtml scripts for the real world), viewed 23 October 2009, http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm

prettyPhoto a jQuery lightbox clone

My basic idea for creation of this page was that user can view the sort of movies or films that interest me. I did not want the user to leave my page and jump onto the media sharing site, youtube.com, from where I was importing my trailer. So, I used JavaScript and a jQuery lightbox clone, prettyPhoto. The API is easy to use and can be launched from anywhere and is a multipurpose media lightbox. I used the facet because I imported my knowledge of Lightbox (as per week 8 JavaScript understanding) in it. prettyphoto is an extension of lightbox , however, after doing all that was mentioned (as per http://www.no-margin-for-errors.com/projects/prettyPhoto-jquery-lightbox-clone/#), I was baffled and balked, as my video didn’t run. And it was nasty. I imported the respective *.js and *.css files and images into my root directory and incorporated the respective executable code in the body section of my HTML document as per the instructions in the tutorial but the videos were not running. I felt like hitting my head on the wall. But it was of no use, as the thing still won’t run. I downloaded the jQuery library again reloaded the tutorial site on my browser and ripped it open using firebug, especially the head section of the HTML document to see what JavaScript and jQuery based files the tutor incorporated in his code. That option worked and I did what the tutor did in his head section of the HTML doc. I incorporated jquery-1.3.2.min.js and jsapi from Google.com and viola!! I had to customize the code as per my file structure and the darn thing worked in the end but it took 3 days for me to get things moving.

<285:1343>

Reference:

Caron, S. 2008, prettyPhoto a jQuery lightbox clone, viewed 22 October 2009, http://www.no-margin-for-errors.com/projects/prettyPhoto-jquery-lightbox-clone/#

System Plan

Note:- I uploaded my System Plan at

http://www-student.it.uts.edu.au/~sroy/dmt/DMT_systemplan.html