var cph = {};

(function() {
supplant = function (str,o) {
    return str.replace(/{([^{}]*)}/g,
        function (a, b) {
            var r = o[b];
            return typeof r === 'string' ? r : a;
        }
    ); 
}; 

cph.tab = function(el) {
	this.init(el);
};

cph.tab.prototype = {
	elBase:null,
	init:function(el) {
		var that = this;
		this.elBase = el;
		$j(this.elBase).find(".tab-content").css("display","none");
		var tmp = $j(this.elBase).find(".tab-nav li.selected a").attr("href");
		$j(tmp).css("display","block");
		$j(this.elBase).find(".tab-nav a").click(
			function(evt) {
				evt.preventDefault();
				this.blur();
				$j(that.elBase).find(".tab-nav li.selected").removeClass("selected");
				$j(this.parentNode).addClass("selected");
				$j(that.elBase).find(".tab-content").css("display","none");
				var id = $j(this).attr("href");
				$j(id).css("display","block");
			}
		);
        $j(this.elBase).find(".sel-tab").click(
			function(evt) {
				evt.preventDefault();
                var className,id;
				$j(that.elBase).find(".tab-nav li.selected").removeClass("selected");
                className = $j(this).attr("href");
				$j(that.elBase).find(className).addClass("selected");
				$j(that.elBase).find(".tab-content").css("display","none");
				var id = $j(that.elBase).find(className + " a").attr("href")
				$j(id).css("display","block");
			}
        );
	}
};

cph.photoViewer = function(el) {
	this.init(el);
};

cph.photoViewer.prototype = {
	elBase:null,
    elAlbumList:null,
    albumWidth:282,
    albumCount:0,
    currentPage:0,
    animating:false,
	init:function(el) {
		var that = this;
		this.elBase = el;
        this.albumCount = $j(this.elBase).find(".album").length;
        this.elAlbumList = $j(this.elBase).find(".album-list")[0];
        this.buttonToggle();
		$j(this.elBase).find(".album-list").click(
			function(evt) {
				var target = evt.target || evt.srcElement;
				if ( target.tagName.toLowerCase() === "img" ) {
					evt.preventDefault();
					var idx = target.id.replace(/^t/,"");

					/* select the thumbnail */
					$j(this).find("a img").removeClass("selected");
					$j(target).addClass("selected");

					/* select the large image */
					$j(that.elBase).find(".img-cont li").removeClass("selected");
					$j(that.elBase).find(".img-cont #hotel-img-"+idx).addClass("selected");
				}
			}
		);
		$j(this.elBase).find(".btn-cont").click(
			function(evt) {
                evt.preventDefault();
                if ( that.animating === true ) {
                    return;
                }
                var margin, count,
                    target = evt.target || evt.srcElement;
				margin = $j(that.elAlbumList).css("margin-left");
                margin = parseInt(margin.replace(/px/,""),10);
                count = Math.abs(margin / that.albumWidth);
				if ( $j(target).hasClass("btn-next") && count < that.albumCount - 1) {
                    that.currentPage++;
                    that.buttonToggle();
                    margin = ( count + 1 ) * that.albumWidth * -1;
                    that.animating = true;
                    $j(that.elAlbumList).animate({marginLeft:margin},300,'swing',function(){that.animating = false});
				} else if ( $j(target).hasClass("btn-prev") && count > 0) {
                    that.currentPage--;
                    that.buttonToggle();
                    margin = ( count - 1 ) * that.albumWidth * -1;
                    that.animating = true;
                    $j(that.elAlbumList).animate({marginLeft:margin},300,'swing',function(){that.animating = false});
				}
			}
		);
	},
    buttonToggle:function() {
        if ( this.currentPage === 0 ) {
            $j(this.elBase).find(".btn-prev").css({visibility:"hidden",cursor:"normal"});
        } else {
            $j(this.elBase).find(".btn-prev").css({visibility:"visible",cursor:"pointer"});
        }
        
        if ( this.currentPage + 1 === this.albumCount ) {
            $j(this.elBase).find(".btn-next").css({visibility:"hidden",cursor:"normal"});
        } else {
            $j(this.elBase).find(".btn-next").css({visibility:"visible",cursor:"pointer"});
        }
    }
};

cph.hotelMap = function(el) {
	this.init(el);
}

cph.hotelMap.prototype = {
	elBase:null,
	elList:null,
	mapBlockHTML:"<li class='clearfix idx_{idx} {selected}'><div class='marker-cont'><img src='/chl/images/system/spacer.gif' class='marker-{label}' style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.google.com/mapfiles/marker{label}.png', sizingMethod='scale');\" /></div><div class='map-block'><div class='bd'><a class='text-cont' href=''><h6>{header}</h6><p class='price'>From HKD{price}</p></a></div><div class='ft'></div></div></li>",
	oGmap:null,
	baseIcon:null,
	marker:null,
	init:function(el) {
		this.elBase = el;
		this.marker = mapData.marker;
		this.elList = $j(this.elBase).find("#location-list")[0];
		this.initGmap();
		this.renderList();
		this.createHandler();
	},
	initGmap:function() {
		var m, selected_idx,that = this;
		this.baseIcon = new GIcon(G_DEFAULT_ICON);
		this.baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
		this.baseIcon.iconSize = new GSize(20, 34);
		this.baseIcon.shadowSize = new GSize(37, 34);
		this.baseIcon.iconAnchor = new GPoint(9, 34);
		this.baseIcon.infoWindowAnchor = new GPoint(9, 2);
		this.oGmap = new GMap2(document.getElementById("gmap"));
		for ( i = 0 ; i < this.marker.length; i++) {
			var m = this.marker[i];
			if (m.label != 99) {
				m.oMarker = this.createMarker(new GLatLng(m.lat, m.lng), m.label, m.bubble,this.oGmap)
				this.oGmap.addOverlay(m.oMarker);
				if ( m.selected ) {
					selected_idx = i;
				}
			}
		}
		this.setToMarker(selected_idx,13);
		this.oGmap.setUIToDefault();
		GEvent.addListener(this.oGmap, "click", function(o) {
			if (o) {
				that.selectListBlock(o);
			}
		});
	},
	setToMarker:function(idx,zoom) {
		var o = this.marker[idx].oMarker;
		
		if(typeof(o) == 'undefined' || o == null) {
			return;
		}
		
		if ( zoom ) {
			this.oGmap.setCenter(o.getLatLng(),zoom);
		} else {
			this.oGmap.panTo(o.getLatLng());
		}
		o.openInfoWindow(this.marker[idx].bubble);
	},
	createMarker:function(point, label, bubbleHTML,gmap) {
		// Create a lettered icon for this point using our icon class
		var letter = String.fromCharCode("A".charCodeAt(0) + label);
		var letteredIcon = new GIcon(this.baseIcon);
		letteredIcon.image = "http://www.google.com/mapfiles/marker" + letter + ".png";

		// Set up our GMarkerOptions object
		markerOptions = {draggable:false,icon:letteredIcon};
		var marker = new GMarker(point, markerOptions);

		GEvent.addListener(marker, "click", function() {
			gmap.panTo(marker.getLatLng());
			marker.openInfoWindowHtml(bubbleHTML);
		});
		return marker;
	},
	renderList:function() {
		var i, m, html = "", o = {};
		for ( i = 0 ; i < this.marker.length; i++) {
			m = this.marker[i];
			o.idx = i+"";
			o.label = String.fromCharCode("A".charCodeAt(0) + m.label);
			o.header = m.header;
			o.price = m.price;
			o.selected = (m.selected)?"selected":"";
			html += supplant(this.mapBlockHTML,o);
		}
		this.elList.innerHTML = html;
	},
	createHandler:function() {
		var that = this;
		$j(this.elList).find("li").click(
			function (evt) {
				evt.preventDefault();
				$j(that.elBase).find("#location-list li").removeClass("selected");
				$j(this).addClass("selected");
				var idx = this.className.match(/idx_(\d+)/)[1];
				that.setToMarker(idx);
			}
		);
		
	//disabled mouse up / down function
		/*
        $j(this.elBase).find(".btn-list-up").mousedown(
            function(evt) {
                if ( $j(that.elBase).find(".btn-list-up-end")[0] ) {
                    return;
                }
                $j(that.elBase).find(".btn-list-up").addClass("btn-list-up-over");
                that.slideIntervalRef = setInterval(
                    function(){
                        var margin = $j(that.elBase).find("#location-list").css("margin-top");
                        margin = parseInt(margin.replace(/px/,""),10);
                        margin += 10;
                        if ( margin > 0 ) {
                            clearInterval(that.slideIntervalRef);
                            $j(that.elBase).find(".btn-list-up").addClass("btn-list-up-end").removeClass("btn-list-up-over");
                            return;
                        }
                        $j(that.elBase).find("#location-list").css("margin-top",margin);
                        $j(that.elBase).find(".btn-list-down-end").removeClass("btn-list-down-end");
                    },50
                );
            }
        );
        $j(this.elBase).find(".btn-list-up").mouseup(
            function(evt) {
                $j(that.elBase).find(".btn-list-up").removeClass("btn-list-up-over");
                clearInterval(that.slideIntervalRef);
				
            }
        );
		
		
		$j(this.elBase).find(".btn-list-up").mouseover(
            function(evt) {
                $j(that.elBase).find(".btn-list-up").addClass("btn-list-up-over");
            }
        );
		 
		$j(this.elBase).find(".btn-list-up").mouseout(
            function(evt) {
                $j(that.elBase).find(".btn-list-up").removeClass("btn-list-up-over");
            }
        );
		
        $j(this.elBase).find(".btn-list-down").mousedown(
            function(evt) {
                if ( $j(that.elBase).find(".btn-list-down-end")[0] ) {
                    return;
                }
                $j(that.elBase).find(".btn-list-down").addClass("btn-list-down-over");
                that.slideIntervalRef = setInterval(
                    function(){
                        var height = $j(that.elBase).find("#location-list").height();
                        var margin = $j(that.elBase).find("#location-list").css("margin-top");
                        margin = parseInt(margin.replace(/px/,""),10);
                        if ( (height + margin) < 440 ) {
                            clearInterval(that.slideIntervalRef);
                            $j(that.elBase).find(".btn-list-down").addClass("btn-list-down-end").removeClass("btn-list-down-over");
                            return;
                        }
                        margin -= 10;
                        $j(that.elBase).find("#location-list").css("margin-top",margin);
                        $j(that.elBase).find(".btn-list-up-end").removeClass("btn-list-up-end");
                    },50
                );
            }
        );
		
		
        $j(this.elBase).find(".btn-list-down").mouseup(
            function(evt) {
                $j(that.elBase).find(".btn-list-down").removeClass("btn-list-down-over");
                clearInterval(that.slideIntervalRef);
            }
        );
		$j(this.elBase).find(".btn-list-down").mouseover(
            function(evt) {
                $j(that.elBase).find(".btn-list-down").addClass("btn-list-down-over");
            }
        );
		$j(this.elBase).find(".btn-list-down").mouseout(
            function(evt) {
                $j(that.elBase).find(".btn-list-down").removeClass("btn-list-down-over");
            }
        );
		*/
	},
	
	
	selectListBlock:function(oMarker) {
		var i;
		for ( i = 0; i < this.marker.length; i++) {
			if ( this.marker[i].oMarker === oMarker ) {
				$j(this.elBase).find("#location-list li.selected").removeClass("selected");
				$j(this.elBase).find("#location-list li.idx_"+i).addClass("selected");
				//this.chkListBlock(i);
				this.scrollBlock(i);
			}
		}
	},
	
	scrollBlock:function (idx) {
		var itm = $j(this.elBase).find("#location-list li.idx_"+idx);
		var y = $j(itm).position().top;
		var ry = $j("#location-cont").position().top;
		var pos = (y-ry);
		if (pos <0) pos = 0;
		$("#location-list-cont").scrollTo(pos , 300);
	}
		
	//function disabled
	/*
	chkListBlock:function(idx){
		var cont = $j(this.elBase).find("#location-list-cont");
		var itm = $j(this.elBase).find("#location-list li.idx_"+idx);
		var ul = $j(this.elBase).find("#location-list");
		var itm_t = itm.position().top;
		var itm_h = itm.height();
		var cont_t = cont.position().top;
		var cont_h = cont.height();
		var ul_t = ul.position().top;
		var ul_mt = parseInt(ul.css("margin-top").replace("px", ""));
		if(ul_t > itm_t){
			var diff = ul_t - itm_t;
			ul.css("margin-top",ul_mt+Math.round(diff)+"px");
		}else if(itm_t - ul_t + itm_h > cont_h){
			var diff = ul_t - itm_t + cont_h -  itm_h;
			ul.css("margin-top",ul_mt+Math.round(diff)+"px");
		}
		this.chkListBtn();
		var pos = $j(this.elBase).find("#location-list li.idx_"+idx).position().top;
		var locl = $j(this.elBase).find("#location-list-cont").height();
		var mt = $j(this.elBase).find("#location-list").css("margin-top").replace("px", "");
	},
	
	chkListBtn:function(){
		var height = $j(this.elBase).find("#location-list").height();
		var margin = $j(this.elBase).find("#location-list").css("margin-top");
		margin = parseInt(margin.replace(/px/,""),10);
		
		$j(this.elBase).find(".btn-list-down").removeClass("btn-list-down-end");
		$j(this.elBase).find(".btn-list-up").removeClass("btn-list-up-end");
		
		if(margin >=  0){
			$j(this.elBase).find(".btn-list-up").addClass("btn-list-up-end").removeClass("btn-list-up-over");
		}
		if((height + margin) < 440){
			$j(this.elBase).find(".btn-list-down").addClass("btn-list-down-end").removeClass("btn-list-down-over");	
		}
	}*/
	
}

cph.searchMod = function(el) {
	this.init(el);
};

cph.searchMod.prototype = {
	elBase:null,
	init:function(el) {
		var that = this;
		this.elBase = el;
		$j(this.elBase).find(".adv-search").click(
			function(evt) {
				evt.preventDefault();
				$j(that.elBase).addClass("extended");
			}
		)
	}
}

cph.collapseMod = function(el) {
	this.init(el);
}

cph.collapseMod.prototype = {
	elBase:null,
	init:function(el) {
		var that = this;
		this.elBase = el;
		$j(this.elBase).find(".collapse-toggle").click(
			function(evt) {
				evt.preventDefault();
				if (!document.all) {
					$j(that.elBase).find("tr.collapse-content").css("display","table-row");
				} else {
					$j(that.elBase).find("tr.collapse-content").css("display","block");
				}
			}
		)
	}
}

cph.main = function() {
	var i;
	var elAry = $j(".tab-mod");
	for ( i = 0 ; i < elAry.length ; i++) {
		new cph.tab(elAry[i]);
	}
	elAry = $j(".photo-viewer");
	for ( i = 0 ; i < elAry.length ; i++) {
		new cph.photoViewer(elAry[i]);
	}
	elAry = $j("#map-mod");
	for ( i = 0 ; i < elAry.length ; i++) {
		new cph.hotelMap(elAry[i]);
	}
	elAry = $j(".search-mod");
	for ( i = 0 ; i < elAry.length ; i++) {
		new cph.searchMod(elAry[i]);
	}
	elAry = $j(".collapse-mod");
	for ( i = 0 ; i < elAry.length ; i++) {
		new cph.collapseMod(elAry[i]);
	}
}
}());

try{
$j(document).ready(function(){
	cph.main();
});
} catch (err) {
}

function popUp(url) {
    var w = window.open(url, "hotel", 'width=790,height=800,scrollbars=yes');
    w.focus();
}