var tagNumber;
var tagsArray;
var channel;
var feedType = $H();
var minus = $H();
var spamer = $H();

function initialize(){
    //Position.includeScrollOffsets = true;
    window.channels = {
	'del.icio.us': ['popular', 'recent'],
	'b.hatena.ne.jp': ['hot', 'popular', 'recent'],
	'youtube.com': ['recent'],
	'flickr.com': ['recent']
    };
    window.channels = $H(window.channels);
    window.tagNumber = 0;
    window.tagsArray = ["web2.0", "design", "apple", "sushi", "youtube", "japan", "beer", "beach", "google", "lifehacks"];
    window.channel = 'del.icio.us';
    window.feedType[channel] = 'recent';
    //loadRssID = setTimeout(function() {loadCookie()}, 30*1000);
    loadCookie();
}

function saveCookie() {
    var h = $H();
    ["tagsArray", "channel", "feedType", "minus", "spamer"].each(function(e) {
	    h[e] = window[e];
	});
    var url = "cookie";
    var val = encodeURIComponent(Object.toJSONString(h));
    //var val = encodeURIComponent(h.toJSONString());
    var options = {
	parameters: 'value='+val
    };
    new Ajax.Request(url, options);
}

function loadCookie() {
    var url = "cookie";
    var options = {
	onComplete: onLoadCookie
    };
    new Ajax.Request(url, options);
}

function onLoadCookie(req, json) {
    if (json) {
	["tagsArray", "channel", "feedType", "minus", "spamer"].each(function(e) {
		if (json[e]) {
		    window[e] = json[e];
		}
	    });
    }
    window.feedType = $H(window.feedType);
    var i = '<ul id="taglist">';
    for(var n=0; n<tagsArray.length; n++) {
        var tagID = 'tag'+n;
        i += '<li id="tag_'+n+'"><span class="cursor">&uarr;&darr;</span><span id="'+tagID+'" class="tag">'+tagsArray[n]+'</span></li>';
    }
    i += '</ul>';
    new Insertion.After('beforeTags', i);
    Sortable.create('taglist',{
	    ghosting:false,
		constraint:false,
		hoverclass:'over',
		/* ghosting: true, */
		onUpdate:loadRss
		/*
		onHover:itemDrag,
		onChange:itemsSort
		*/
		});
    for(var n=0; n<tagsArray.length; n++) {
        var tagID = 'tag'+n;
        new Ajax.InPlaceEditor(tagID, 'mirror.php', {
		cancelLink:false,
		    okButton:false,
		    submitOnBlur:true,
		    highlightcolor: '#FFFFFF',
		    savingText: 'sending...',
		    callback: function(form, value) {
		    form.firstChild.onblur = Prototype.emptyFunction;
                    form.firstChild.blur();
		    if (!value) {
			form.firstChild.value = form.firstChild.dvalue;
		    }
		    return Form.serialize(form);
		},
		    onComplete:function(){loadRss();}
	});
	var func = tagScroll;
	Event.observe(tagID, "mouseover", func.bindAsEventListener($('tag_'+n)));
    }
    var i = '<h2>channel</h2><ul id="feeds" class="radio">';
    channels.keys().each(function(k){
	    if (k == channel) {
		i += '<li class="current">';
	    } else {
		i += '<li>';
	    }
	    i += '<a href="#" onclick="channelOnClick(this); return false;">'+k+'</a>';
	    i += '</li>';
	});
    i += '</ul>';
    new Insertion.After('taglist', i);
    var i = '<h2>popular / recent</h2><ul id="popularRecent" class="radio">';
    channels[channel].each(function(t) {
	    if (feedType[channel] == t) {
		i += '<li class="'+t+' current">';
	    } else {
		i += '<li class="'+t+'">';
	    }
	    i += '<a href="#" onclick="popularRecent(this); return false;">'+t+'</a>';
	    i += '</li>';
	});
    i += '</ul>';
    new Insertion.After('feeds', i);
    loadRss();
    //loadRssID = setTimeout(function() {loadRss()}, 500);
    document.recalc();
}

Effect.ScrollTo.prototype.finish = function(){scrolling=null;};
var scrolling = null;
function tagScroll() {
    var n = 0;
    $A(this.parentNode.getElementsByTagName('li')).each(function(l, i){
	    if (l.id == this.id) {
		n = i;
	    }
	}.bind(this));
    if ($('rank'+(n+1))) {
	if (scrolling == null || scrolling  != $('rank'+(n+1))) {
	    var e = new Effect.ScrollTo($('rank'+(n+1)), {offset: -60});
	    scrolling = $('rank'+(n+1));
	    //alert(e);
	}
    }
}

function form(){
	alert("a");
}

function popularRecent(a){
    window.feedType[channel] = a.firstChild.nodeValue;
    prDraw();
    loadRss();
}

var loadRssID;
function loadRss() {
    window.tagNumber = 0;
    if (loadRssID) {
	clearTimeout(loadRssID);
    }
    window.tagsArray = getTagsArray();
    if (!window.minus[channel]) {
	window.minus[channel] = $H();
    }
    if (!window.spamer[channel]) {
	window.spamer[channel] = $H();
    }
    saveCookie();
    //_loadRss(0);
    setTimeout(function() {_loadRss(0)}, 10);
    loadRssID = setTimeout(function() {loadRss()}, 60*60*1000);
}

function getTagsArray() {
    var taglist = document.getElementsByClassName("tag", $("taglist"));
    var tagsArray = [];
    taglist.each(function(t) {
	    tagsArray.push(t.firstChild.nodeValue);
	});
    return tagsArray;
}

function _loadRss(tn){
    if(tn==0){
	if (!$("itemsList")) {
	    new Insertion.Top('items', '<ul id="itemsList"></ul>');
	}
    }
    var tagName = tagsArray[tn];
    if (!window.minus[channel][tagName]) {
	window.minus[channel][tagName] = $H();
    } else if (!window.minus[channel][tagName].keys) {
	window.minus[channel][tagName] = $H(window.minus[channel][tagName]);
    }
    if (!window.spamer[channel][tagName]) {
	window.spamer[channel][tagName] = $H();
    } else if (!window.spamer[channel][tagName].keys) {
	window.spamer[channel][tagName] = $H(window.spamer[channel][tagName]);
    }
    if (!window.feedType[channel]) {
	window.feedType[channel] = 'recent';
    }
    var rankName = "rank"+(tn+1);
    var uflag = false;
    if ($(rankName)) {
	var t = $(rankName).tName;
	var u = $(rankName).updateTime;
	var c = $(rankName).channel;
	var f = $(rankName).feedType;
	var m = $(rankName).minusTags;
	var cc = $(rankName).creator;
	var n = new Date();
	n.setTime(n.getTime() - 60 * 60 * 1000);
	if (c != channel || f != feedType[channel] || t != tagName || u < n.getTime() || m != window.minus[channel][tagName].keys().join(" ") || cc != window.spamer[channel][tagName].keys().join(" ")) {
	    var li = $(rankName);
	    var span = $(rankName).firstChild.firstChild;
	    Element.classNames(li).each(function(c){
		    Element.removeClassName(li, c);
		});
	    Element.addClassName(li, rankName);
	    Element.addClassName(li, tagName);
	    Element.update(span, tagName);
	    var m = getPlusTags(tagName);
	    if (span.nextSibling) {
		Element.replace(span.nextSibling, m);
	    } else {
		new Insertion.After(span, m);
	    }
	    var loading = li.firstChild.nextSibling;
	    Element.show(loading);
	    loading.nextSibling.style.visibility = 'hidden';
	    uflag = true;
	}
    } else {
	var i = '<li id="'+rankName+'" class="'+rankName+' '+tagName+'">';
	i += '<div class="tags"><span class="tag">'+tagName+'</span>';
	i += getPlusTags(tagName)+'</div>';
	i += '<ul class="loading"><li><img src="img/progress_pink.gif" class="pink" /><img src="img/progress_blue.gif" class="blue" /><img src="img/progress_green.gif" class="green" /><img src="img/progress_mossgreen.gif" class="mossgreen" /><img src="img/progress_darkblue.gif" class="darkblue" /><img src="img/progress_red.gif" class="red" /><img src="img/progress_gray.gif" class="gray" />Loading...</li></ul>';
	i += '</li>';
	new Insertion.Bottom('itemsList', i);
	uflag = true;
	//alert("ins");
	//return;
    }
    if (uflag) {
	$(rankName).tName = tagName;
	$(rankName).updateTime = (new Date()).getTime();
	$(rankName).channel = channel;
	$(rankName).feedType = feedType[channel];
	var mt = window.minus[channel][tagName].keys().join(" ");
	$(rankName).minusTags = mt;
	var tag = tagName;
	var params = $A();
	if (window.minus[channel][tagName].keys().length) {
	    window.minus[channel][tagName].keys().each(function(k) {
		    params.push('tags[]='+encodeURIComponent(k));
		});
	    //tags += " "+mt;
	}
	var sp = window.spamer[channel][tagName].keys().join(" ");
	$(rankName).creator = sp;
	if (window.spamer[channel][tagName].keys().length) {
	    window.spamer[channel][tagName].keys().each(function(k) {
		    params.push('tags[]='+encodeURIComponent(k));
		});
	    //tags += " "+sp;
	}
	var rss = 'proxy/'+channel+'/'+feedType[channel]+'/'+encodeURIComponent(tag);
	new Ajax.RssReader( rss, {
		method: 'post',
		    parameters: params.join('&'),
		    onSuccess: function(rss) {
		    myCallback(rss, tn);
		}, 
		    onFailure: errorHandler
		    });
    } else {
	tn++;
	if(tn<tagsArray.length){
	    setTimeout(function() {_loadRss(tn)}, 1*1000);
	    //_loadRss(tn);
	} else {
	    document.recalc();
	}
    }
}

function getPlusTags(tagName) {
    var m = "";
    var l = window.minus[channel][tagName].keys().length + window.spamer[channel][tagName].keys().length;
    if (l) {
	m += '<ul class="plusTags">';
	window.spamer[channel][tagName].keys().each(function(t) {
		m += '<li><a href="#" class="subject" onclick="creatorPlus(this); return false;">'+t+'</a></li>';
	    });
	window.minus[channel][tagName].keys().each(function(t) {
		m += '<li><a href="#" class="subject" onclick="tagPlus(this); return false;">'+t+'</a></li>';
	    });
	m += '</ul>';
    }
    return m;
}

function myCallback(rss, tn) {
    var tagName = tagsArray[tn];
    var rankName = "rank"+(tn+1);
    var loading = $A($(rankName).childNodes).detect(function(c) {
	    return Element.hasClassName(c, "loading");
	});
    if (loading) {
	Element.hide(loading);
    }
    var items = rss.items.length;
    //var itemMax = items;
    var itemMax = (items < 10-tn)? items: 10-tn;
    if (items > 0) {
	var i = '<ul class="items">';
	var d = channel.split(".").shift();
	for(var n=0; n<itemMax; n++) {
	    var title = rss.items[n].title? rss.items[n].title: "Untitled";
	    if (rss.items[n].thumbnail) {
		i += '<li class="item r'+(n+1)+' img '+d+'"><a href="' + rss.items[n].link + '" target="_blank" class="thumb snap_noshots"><img src="'+rss.items[n].thumbnail+'" width="'+rss.items[n].thumbnail_w+'" height="'+rss.items[n].thumbnail_h+'"/></a><div class="text"><a href="' + rss.items[n].link + '" target="_blank" class="snap_noshots"><span class="title">'+title+'</span></a>';
	    } else {
		//var path = rss.items[n].link.replace("https://", "").replace("http://","").replace(";","");
		var path = rss.items[n].link.replace("https://", "").replace("http://","");
		i += '<li class="item r'+(n+1)+' bookmark"><a href="'+rss.items[n].link+'" class="snap snap_shots snap_no_icon" onclick="return false;"><img src="favicon/'+path+'" alt="favicon" witdh="16" height="16" class="favicon"/></a><div class="text"><a href="' + rss.items[n].link + '" target="_blank" class="snap_noshots">' + title + '</a>';
	    }
	    var j = "";
	    rss.items[n].subjects.each(function(s){
		    if (s.toLowerCase() != tagName.toLowerCase()) {
			j += '<li><a href="#" class="subject" onclick="tagMinus(this);return false;">'+s+'</a><span class="blank"> </span></li>';
		    }
		});
	    if (j.length) {
		i += '<ul class="minusTags">'+j+'</ul>';
	    }
	    if (rss.items[n].creator) {
		    if (rss.items[n].thumbnail) {
				i += '<span class="creator">Posted by <a href="#" onclick="creatorMinus(this);return false;" class="subject">' + rss.items[n].creator + '</a></span>';
		    } else {
				i += '<span class="creator">Bookmarked by <a href="#" onclick="creatorMinus(this);return false;" class="subject">' + rss.items[n].creator + '</a></span>';
		    }
	    }
	    if (rss.items[n].date) {
		i += '<span class="date">(' + rss.items[n].date + ')</span>';
	    }
	    i += '</div>';
	    i += '</li>';
	}
	i += '</ul>';
    } else {
	var i = '<ul class="notfound"><li>not found</li></ul>';
    }
	i += '<div class="clearleft">&nbsp;</div>';
    var items = $A($(rankName).childNodes).detect(function(c) {
	    return Element.hasClassName(c, "items") || Element.hasClassName(c, "notfound");
	});
    if (items) {
	Element.replace(items, i);
    } else {
	new Insertion.Bottom($(rankName), i);
    }
    Element.update($(rankName).firstChild.firstChild, '<a href="'+rss.channel.link+'" target="_blank">'+tagName+'</a>');
    tn++;

  SNAP_COM.shot.Rescan(document.getElementsByTagName('body')[0]);
    if(tn<tagsArray.length){
	setTimeout(function() {_loadRss(tn)}, 50);
	//_loadRss(tn);
	//document.recalc();
    } else {
	document.recalc();
    }
}

function tagPlusMinusDraw(li) {
    var m = getPlusTags(li.tName);
    var pt = li.firstChild.firstChild.nextSibling;
    if (pt) {
	Element.replace(pt, m);
    } else {
	new Insertion.After(li.firstChild.firstChild, m);
    }
}

function tagMinus(a) {
    if (loadRssID) {
	clearTimeout(loadRssID);
    }
    var li = a.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
    var ptag = li.tName;
    var tag = a.firstChild.nodeValue;
    window.minus[channel][ptag][tag] = true;
    tagPlusMinusDraw(li);
    loadRssID = setTimeout(function() {loadRss()}, 1000*2);
    return false;
}

function tagPlus(a) {
    if (loadRssID) {
	clearTimeout(loadRssID);
    }
    var li = a.parentNode.parentNode.parentNode.parentNode;
    var ptag = li.tName;
    var tag = a.firstChild.nodeValue;
    delete(window.minus[channel][ptag][tag]);
    tagPlusMinusDraw(li);
    loadRssID = setTimeout(function() {loadRss()}, 1000*2);
    return false;
}

function creatorMinus(a) {
    if (loadRssID) {
	clearTimeout(loadRssID);
    }
    var li = a.parentNode.parentNode.parentNode.parentNode.parentNode;
    var ptag = li.tName;
    var creator = a.firstChild.nodeValue+"@";
    window.spamer[channel][ptag][creator] = true;
    tagPlusMinusDraw(li);
    loadRssID = setTimeout(function() {loadRss()}, 1000*2);
    return false;
}

function creatorPlus(a) {
    if (loadRssID) {
	clearTimeout(loadRssID);
    }
    var li = a.parentNode.parentNode.parentNode.parentNode;
    var ptag = li.tName;
    var tag = a.firstChild.nodeValue;
    delete(window.spamer[channel][ptag][tag]);
    tagPlusMinusDraw(li);
    loadRssID = setTimeout(function() {loadRss()}, 1000*2);
    return false;
}

function errorHandler(rss) {
    alert('An error has occured');
}

function relTags() {
    if (document.getElementsByTagName) {
        var anchors = document.getElementsByTagName("a");
        for (var loop = 0; loop < anchors.length; loop++) {
            var anchor = anchors[loop];
            if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external") {
                anchor.target = "_blank";
            } else if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "popup") {
                anchor.onclick = function () {
                openPopUpWindow(this);
                return false;
                };
            }
        }
    }
}

function channelOnClick(a) {
    $A(a.parentNode.parentNode.getElementsByTagName("li")).each(function(li) {
	    Element.removeClassName(li, "current");
	});
    Element.addClassName(a.parentNode, "current");
    switchChannel(a.firstChild.nodeValue);
    return false;
};

function switchChannel(channel) {
    window.channel = channel;
    if (!window.feedType[channel]) {
	window.feedType[channel] = 'recent';
    }
    prDraw();
    loadRss();
}

function prDraw() {
    var i = "";
    channels[channel].each(function(t) {
	    if (feedType[channel] == t) {
		i += '<li class="'+t+' current">';
	    } else {
		i += '<li class="'+t+'">';
	    }
	    i += '<a href="#" onclick="popularRecent(this); return false;">'+t+'</a>';
	    i += '</li>';
	});
    Element.update('popularRecent', i);
}

window.onloadListeners = new Array();

function addOnLoadListener(listener) {
    window.onloadListeners[window.onloadListeners.length] = listener;
}

addOnLoadListener(initialize);
addOnLoadListener(relTags);

window.onload = function() {
    for (var i=0; i<window.onloadListeners.length; i++) {
        var func = window.onloadListeners[i];
        func.call();
    }
};