//var GALLERY_SERVER_URL = "http://localhost:8080/gallery/";
var GALLERY_SERVER_URL = "http://justlocate.com/gallery/";
var GALLERY_IMG_DIR =  GALLERY_SERVER_URL+"img/uploaded/";
var PAGE_LIMIT = 9;
var COL_COUNT = 3;
var G_IS_LIVE = false;
var PAGING_RANGE=3;
var IMAGE_MAX_WIDTH = 400;
var IMAGE_MAX_HEIGHT = 400;
var tempKey = "";
var galleryUserId;
var galleryUserThumbnail;
var galleryUserProfile;
var galleryAllContent="";
var afterSaveCallBackGlob = "";
var clickCallBack = "";
var currentPage = 0;
var currentTag="";
var currentSort="popular";
var sortOrders={"popular":"Most Popular","newest":"Newest"};
var SYS_TAG="";

var getTempKey = function(){
	tempKey = galleryUserId+"_"+new Date().getTime();
	return tempKey;
}

var getUserId = function(){
	return galleryUserId;
}

var imgSavedHandler_gallery = function(tagList, published){	//save image from flash
	if(typeof published =="undefined" || published == null){
		tagList = "";
	}
	var data = "tempKey="+tempKey+"&socialId="+galleryUserId+"&title="+tagList+" "+SYS_TAG;
	data+="&model.user.socialId="+galleryUserId+"&model.user.socialType=myspace"+"&model.user.socialProfileUrl="+galleryUserProfile+"&model.user.socialThumbUrl="+galleryUserThumbnail+"&model.status="+(typeof published=='undefined' ? 0 : published);
	GRequest.sendPOST(GALLERY_SERVER_URL+"gallery/images",data,resp_add_image);
}

var init = function(user,columns,limit,systemTag){
	if(typeof columns!='undefined'){
		COL_COUNT=columns;
	}
	if(typeof limit!='undefined'){
		PAGE_LIMIT=limit;
	}
	if(typeof systemTag!='undefined'){
		SYS_TAG=systemTag;
	}
	if(typeof opensocial != "undefined"){
		G_IS_LIVE = true;
	}
    if (G_IS_LIVE) {
        galleryUserId = user.getId();
		galleryUserId=parseInt(galleryUserId.substring(galleryUserId.lastIndexOf(":")+1));
        galleryUserThumbnail = user.getField(opensocial.Person.Field.THUMBNAIL_URL);
        galleryUserName = user.getField(opensocial.Person.Field.NAME);
        galleryUserProfile = user.getField(opensocial.Person.Field.PROFILE_URL);       
    }
	else{
		user = {};
        galleryUserId = 3681836532;
        userAge = 2;
        userGender = 1;
        galleryUserThumbnail = "http://c1.ac-images.myspacecdn.com/images02/18/s_d3c05914e1664ea4b08def3a557efb20.jpg";
        galleryUserName = "User";
        galleryUserProfile = "http://profile";
        galleryUserCountry = "Armenia";
        galleryUserCity = "yerevan";
        galleryUserRegion = "yerevan";
        galleryUserPostalCode = "374";
	}
}

var create_image = function(afterSaveCallBack, allContentDiv, image_width){
	if(image_width == null || typeof image_width == "undefined"){
		image_width = IMAGE_MAX_WIDTH;
	}
	galleryAllContent = allContentDiv != "" ? allContentDiv : "allContent";
    afterSaveCallBackGlob = afterSaveCallBack;
  	create_game(image_width);
}

var create_game = function(image_width){
    var str = "";
	tempKey = galleryUserId+"_"+new Date().getTime();
    str += '<table>';
    str += '<tr>';
    str += '<td colspan="2">';
    str += '<table>';
    str += '<tr>';
    str += '<td colspan="2">';
    str += '<span class="title_text"><h3>Create Image</h3></span>';
    str += '</td>';
    str += '</tr>';
    str += '<tr>';
    str += '<td  style="color: red" colspan=2 id="errorTd">';
    str += '</td>';
    str += '</tr>';
    str += '<tr>';
    str += '<td class="grey_text">Tags</td>';
    str += '<td align="left"><input type="text" name="title" value="" id="titleText"/></td>';
    str += '</tr>';
    str += '<td colspan="2">';
    str += '<iframe ';
	str += 'src="'+GALLERY_SERVER_URL+'gallery/upload/'+galleryUserId+'/input?tempKey='+tempKey+'&imgDisplayWidth='+image_width+'&t='+new Date().getTime()+'"';   
    str += 'style="padding: 0px; border:none; width:'+(image_width+100)+'px; height:'+(image_width+100)+'px;" frameborder="0" name="picFrame"></iframe>';
    str += '</td>';
    str += '</tr>';
    str += '<tr>';
    str += '<td></td>';
    str += '<td style="float:right"><input type="button" value="Save!!" class="inputbutton" onclick="add_image();"/><input type="button" value="Save And Publish" class="inputbutton" valign="top" alugn="right"  onclick="add_image(1);"/></td>';
    str += '</tr>';
    str += '</table>';
    str += '</td>';
    str += '</tr>';
    str += '</table>';
	_$(galleryAllContent).innerHTML=str;
    $('#titleText').tagSuggest({
    url: GALLERY_SERVER_URL+"gallery/tag/1/suggest"
});
}

var vote = function(imageId){
	_$("loading_" + imageId).innerHTML="<img src='"+GALLERY_SERVER_URL+"img/ajax_loader.gif'";
    var data = "model.id=" + imageId + "&socialId=" + galleryUserId + "&socialType=myspace";
    GRequest.sendPOST(GALLERY_SERVER_URL + "gallery/images/"+imageId+"/vote", data, resp_vote);
    
}

var resp_vote = function(response){
    var voted = response.data.voted;
    var imageId = response.data.imageId;
    if (voted) {
        _$("loading_" + imageId).innerHTML = "Your voice has been counted";
		var voteSpan=_$("vote_"+response.data.imageId).childNodes.item(1);
		var oldCount=parseInt(voteSpan.nodeValue);
		voteSpan.nodeValue=oldCount+1;
		
    }
    else {
        _$("loading_" + imageId).innerHTML = "You have already voted";
    }
	var expToCall="_$(\'loading_"+ imageId+"\').innerHTML=''";
	var t=setTimeout(expToCall,3000);
	//clearTimeout(t);
}
var test_f = function(url,id,published)
{
//	alert(url+":"+id+":"+published);
	//document.getElementById("'loading_ "+ imageId+"').innerHTML='';
}
var tagList=function(){
	GRequest.sendGET(GALLERY_SERVER_URL + "gallery/tag?" + "page=0&limit=30", resp_tagList);
}

var resp_tagList=function(response){
	var data=response.data;
	var str=get_tags_html(data.tags);
	_$("tagsDiv").innerHTML=str;
	$("#xList").tagcloud({type:"list"}).find("li").tsort("rand");
}

var get_tags_html=function(tags){
	
	var str="<div style='height:100%;text-align:center'><a style='text-align:center;font-weight:bold;text-decoration:none;float:left;margin-right:5px' href=javascript:currentTag=0;imageList(0,'"+galleryAllContent+"',0)>All</a></div><ul id='xList' class='xmpl' style='position: static; height: 100px;'>";
	for(var i=0;i<tags.length;i++){
		str+="<li title='"+tags[i].name+" '"+"value='"+tags[i].value+"'>";
		str+="<a href='javascript:currentTag="+tags[i].id+";imageList(0,\""+galleryAllContent+"\",0)'>"+tags[i].name+"</a> ";
	}
	str+="</ul>";
	return str;
}
var imageList = function(clickCallBackParam, allContentDiv, page){
	galleryAllContent = allContentDiv != 0 ? allContentDiv+"" : "allContent";
	_$(galleryAllContent).innerHTML="<div id='tagsDiv'></div>";
	_$(galleryAllContent).innerHTML+="<div id='sortingDiv'></div>";
	var str="";
	for(var i in sortOrders){
		if(i==currentSort){
			str+="<span>"+sortOrders[i]+"</span>";
		}
		else{
			str+="<a href='javascript:currentSort=\""+i+"\";imageList(0,\""+galleryAllContent+"\",0)'>"+sortOrders[i]+"</a>"
		}
		str+="|";
	}
	_$("sortingDiv").innerHTML=str;
    if (clickCallBackParam != 0) 
        clickCallBack = clickCallBackParam;
    currentPage = typeof page != 'undefined' ? page : 0;
	//currentTag= typeof tagId != 'undefined' ? tagId : 0;
    GRequest.sendGET(GALLERY_SERVER_URL + "gallery/images?published=1" + "&page=" + currentPage + "&limit=" + PAGE_LIMIT+(typeof currentTag!='undefined'&&currentTag!=0 ? "&tagList="+currentTag : "")+"&sortOrder="+currentSort, resp_imageList);
}

var resp_imageList = function(response){
    var data = response.data;   
    var str = "";
    var images = data.images;
    var count = data.count;
    str += "<table cellPadding=3 cellspacing=10>";
    var currentImage = "";
    for (var i = 0; i < images.length; i++) {
        currentImage = images[i];
        if (i % COL_COUNT == 0) {
            str += "<tr>";
        }
        str += "<td class='grey_border'>";
		str+="<table width='140px'>";
		str+="<tr><td style='text-align:center; height: 100px; width:100px'>";
		str+="<a href='javascript:" + clickCallBack + "(\"" + GALLERY_IMG_DIR + currentImage.url + "\","+currentImage.id+")'>";
        str += "<img border='0' style='border-bottom-style: inset;' src='" + GALLERY_IMG_DIR + currentImage.smallUrl + "'></a></td></tr>";
		str+="<tr><td><span class='grey_text'><span class='title_text'>Tags:&nbsp</span> "+currentImage.smallTags+"</span></td></tr>";
		str+="<tr><td><span class='grey_text' id='vote_"+currentImage.id+"'><span class='title_text'>Votes:&nbsp;</span>"+currentImage.voteCount+"</span></td></tr>";
		str+="<tr><td><a href='javascript:vote(\"" + currentImage.id + "\")'><img alt='vote' title='vote' border='0' src='"+GALLERY_SERVER_URL+"img/vote_button.png' style='text-align:right'/></a></td></tr>";
		str+="<tr><td><div class='small_message' id='loading_"+currentImage.id+"'></div>";//<a href='javascript:vote(\"" + currentImage.id + "\")'><img alt='vote' title='vote' height='15px' width='15px' border='0' src='"+GALLERY_SERVER_URL+"img/vote-icon.jpg' style='text-align:right'/></a>";
		
		str+="</td></tr></table></td>";
//		"<a href='javascript:" + clickCallBack + "(\"" + IMG_DIR + currentImage.url + "\")'>";
//        str += "<img src='" + IMG_DIR + currentImage.url + "'></a><br>";
//        str += "<br><div id='loading_" + currentImage.id + "'></div>";
//        str += "<input typa='button' value='Vote for this image' onclick='vote(\"" + currentImage.id + "\")'></td>";
        if (i % COL_COUNT == COL_COUNT - 1) {
            str += "</tr>";
        }
    }
    str += "</table><br>";
    str += drawPaging(currentPage, count);
			_$(galleryAllContent).innerHTML+=str;
			tagList();
}

var drawPaging = function(selectedPage, count,linkFunction){
	linkFunction=typeof linkFunction=='undefined'?"imageList":linkFunction;
    var str = '<div style="margin-bottom: 10px; font-weight: bold; font-size: 12px; width: 90%; text-align: right">';
    var pageCount = Math.ceil(count / PAGE_LIMIT);
	var inf=Math.floor(selectedPage/PAGING_RANGE)*PAGING_RANGE;
	var sup=(Math.floor(selectedPage/PAGING_RANGE)+1)*PAGING_RANGE;
	if(inf>0)
	{
		str += '<a class="paging_link" href="javascript:'+linkFunction+'(0,\''+galleryAllContent+'\',0)">1</a>';
	}
    if (selectedPage > 0) {
        str += '<a class="paging_link" href="javascript:'+linkFunction+'(0,\''+galleryAllContent+'\',' + (selectedPage - 1) + ')">&lt;</a>';
    }
    
    for (var i = inf; i < sup; i++) {
        if (pageCount >= i + 1) {
			if(selectedPage!=i)
            str += '<a class="paging_link" href="javascript:'+linkFunction+'(0,\''+galleryAllContent+'\',' + i + ')">' + (i + 1) + '</a>';
        	else 
			str+=i + 1;
		}
    }
    if (selectedPage < pageCount - 1) {
        str += '<a class="paging_link" href="javascript:'+linkFunction+'(0,\''+galleryAllContent+'\',' + (selectedPage + 1) + ')">&gt;</a>';
    }
	
	if(sup<pageCount){
        str += ' of <a class="paging_link" href="javascript:'+linkFunction+'(0,\''+galleryAllContent+'\',' + (pageCount-1) + ')">'+pageCount+'</a>';
	}
    str += '</div>';
    return str;
}
var add_image = function(published){

	var data="tempKey="+tempKey+"&socialId="+galleryUserId+"&title="+_$("titleText").value+" "+SYS_TAG;
	data+="&model.user.socialId="+galleryUserId+"&model.user.socialType=myspace"+"&model.user.socialProfileUrl="+galleryUserProfile+"&model.user.socialThumbUrl="+galleryUserThumbnail+"&model.status="+(typeof published=='undefined' ? 0 : published);
	GRequest.sendPOST(GALLERY_SERVER_URL+"gallery/images",data,resp_add_image);
}

var resp_add_image = function(response){
    var data = response.data;
	if (data.error) {
		_$("errorTd").innerHTML=data.error;
	}else{
		eval(afterSaveCallBackGlob + "('" + GALLERY_IMG_DIR + data.image.url + "', data.image.id,data.image.published)");
	}
}


var _$ = function(id){
    return document.getElementById(id);
}

var resp_createGame = function(response){

}
///////////////////////////////////////////////////////////////////////////
var GRequest = new Object();
GRequest.send = function(url, method, responseHandler, data, urlencoded){
    var req;
    if (window.XMLHttpRequest) {
        req = new XMLHttpRequest();
    }
    else 
        if (window.ActiveXObject) {
            req = new ActiveXObject("Microsoft.XMLHTTP");
        }
    req.onreadystatechange = function(){
        if (req.readyState == 4) {// only if req shows "loaded"
            if (req.status < 400) {// only if "OK"
                try {
                    req.data = eval("(" + req.responseText + ")");
                } 
                catch (ex) {
                    console.log(ex);
                }
                req.text = req.responseText;
                responseHandler(req);
            }
        }
    }
    if (method == "POST") {
        req.open("POST", url, true);
        if (urlencoded) 
            req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        req.send("" + data);
    }
    else {
        req.open("GET", url, true);
        req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        req.send(null);
    }
    
    return req;
}

GRequest.sendPOST = function(url, data, responseHandler){
	if(G_IS_LIVE){
		var os_params = {};
		os_params[gadgets.io.RequestParameters.METHOD] = gadgets.io.MethodType.POST;
		os_params[gadgets.io.RequestParameters.CONTENT_TYPE] = gadgets.io.ContentType.JSON;
		os_params[gadgets.io.RequestParameters.POST_DATA] = data;
		gadgets.io.makeRequest(url, responseHandler, os_params);
	}else{
		if(undefined == data) data = '';
		GRequest.send(url, "POST", responseHandler, data, true);
	}
}

GRequest.sendGET = function(url, responseHandler){
	if(G_IS_LIVE){
		var os_params = {};
		os_params[gadgets.io.RequestParameters.METHOD] = gadgets.io.MethodType.GET;
		os_params[gadgets.io.RequestParameters.CONTENT_TYPE] = gadgets.io.ContentType.JSON;
		gadgets.io.makeRequest(url, responseHandler, os_params);
	}else{
		GRequest.send(url, "GET", responseHandler);
	}
}