/* $Id: animatedUpdate.js 29038 2009-06-26 10:42:02Z myusoof $ */

		//prerequisite for using this.
		// 1.jQuery should be included.
		// 2.The HTML and ajax response HTML should be <ul><li><li>...</ul> pattern.
		// 3.The UL should have the ID which is passing into streamUpdate() method. 
		// 4. <li>'s id should have the format of "actvity_[Timestamp]"
		var index = 0;
        var lastItem;
        var firstItem = null;
        var _div = null;
        var newActivityList = null;
        var newActivityListLength = 0;
        var ulParentID;
        var liHeight;
        var since = null;

        //Get Request Object
        function getHttpRequest(){
            var request;
            var browser = navigator.appName;
            if(browser == "Microsoft Internet Explorer"){
                request = new ActiveXObject("Microsoft.XMLHttp");
            }else{
                request = new XMLHttpRequest();
            }
            return request;
        }

        function streamUpdate(updateUrl,parentID,listHeight){
        	ulParentID = parentID;
        	liHeight = listHeight;
        	
            //Get the UL Object we are going to update the list.
            var recentActivity = document.getElementById(ulParentID);

            //Get the li list before update
            var recentActivityList = recentActivity.getElementsByTagName('li');

            //Get first and last Item before Update
            if(recentActivityList.length >0){
                firstItem = recentActivityList[0];
                lastItem = recentActivityList[recentActivityList.length-1];
            }
            
            if(firstItem!=null){

            //Make an Ajax call to Server.
            var ajaxReq = getHttpRequest();
            if (ajaxReq) {
                ajaxReq.onreadystatechange = function() {
                    if (ajaxReq.readyState == 4 && ajaxReq.status == 200) {

                    	since = null;
                    	
                        //create one sample Div and insert all the li elements got from server response.
                        _div = document.createElement('div');
                        _div.id ="activity-new-div-"+index++;
                        _div.style.display="none";
                        _div.innerHTML = ajaxReq.responseText;

                        var newRecentActivityList = _div.getElementsByTagName('li');
                        var newFirstItem = firstItem;

                        //create temp recent activity for having all the li objects got from server response.
                        var tempRecentActivityList = new Array(newRecentActivityList.length);

                        //create activity array to hold the li objects which are new ones.
                        newActivityList = new Array(newRecentActivityList.length);
                        var j = 0;

                        //Copy all the li objects got from server reponse to temp array.
                        for(var i=0;i<newRecentActivityList.length;i++){
                            tempRecentActivityList[i] = newRecentActivityList[i];
                        }

                        //Iterate temp array which holds all the li objects got from server.
                        //Find which are all the new activity and store it in newActivityList array.
                        //the logic finding new activities.
                        //1. Iterate the array.
                        //2. Check each item with original list's first Item.
                        //3. If unmatches its a new item. Add it to newActivityList.
                        //4. Continue this process up to match with first item, If it matches exit from the loop.

                        for(var i=0;i<tempRecentActivityList.length;i++){
                            var listItem = tempRecentActivityList[i];
                            var listItemPostedTime = listItem.id.replace("activity-",'');
                            var firstItemPostedTime = firstItem.id.replace("activity-",'');
                            since =  firstItemPostedTime;
                            if(listItemPostedTime > firstItemPostedTime){
                                listItem.style.display = "none";
                                recentActivity.insertBefore(listItem,newFirstItem);
                                newActivityList[j++] = listItem;
                                newFirstItem = listItem;
                               	since =  listItemPostedTime;
                            }else{
                                break;
                            }
                        }
                        newActivityListLength=newActivityList.length;
                        doAnimation();
                    }
                };
                if(since != null){
                	updateUrl = updateUrl+"?since="+since;
                }
                ajaxReq.open('POST', updateUrl);
                ajaxReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
                ajaxReq.send(null);
            }
            }
        }
        function doAnimation(){
            //Animation done here.
            var recentActivity = document.getElementById(ulParentID);

            //1.Get each item separately from newActivityList array do the animation for the li object.
            //2.For every li object last li object/item will be removed.
            var obj = getSpyItem();
            if(obj != false){
                if(obj != null){
                    var jQueryinsert = jQuery("#"+obj.id).css({
                        height : 0,
                        opacity : 0,
                        display : 'none'
                    }).prependTo("#"+ulParentID);

                    recentActivityList = recentActivity.getElementsByTagName('li');
                    lastItem = recentActivityList[recentActivityList.length-1];
                        jQuery("#"+lastItem.id).animate({ opacity : 0}, 1000, function () {
                        jQueryinsert.animate({ height:liHeight }, 1000).animate({ opacity : 1 }, 1000);
                        jQuery("#"+lastItem.id).remove();
                    });
                }
                setTimeout(doAnimation,4000);
            }
        }


        function getSpyItem(){
            if(newActivityList != null){
                do{
                    var obj = newActivityList[--newActivityListLength];
                    if(obj != null){
                        return obj;
                    }
                }while(newActivityListLength>=0);
            }
            return false;
        }

