﻿/**
 * @author spiegel2.Hwang@gmail.com
 */
function inputClick(i){
    if (i) {
        getImages(i);
    } else {
        var tagWord = $('tagWordId').value;
        getImages(tagWord);
    }
}

function getRelatedTags(srcDivId, destDivId){
    var a = new Array();
    
    a = getTagIds(srcDivId);
    if (a.length) {
        a.each(function(item){
            if (item == null || typeof item == "undefined" || item == "undefined") {
                log("undefined item[" + item + "], (getRelatedTags())" + a.length)
            } else {
                getFlickrApi(srcDivId, destDivId, "relatedTags", item);
            }
        });
    }
    $(srcDivId).innerHTML = '';
}

function getTags(srcDivId, destDivId){
    var a = new Array();
    
    a = getPhotoIds(srcDivId);
    if (a.length) {
        a.each(function(item){
            if (item == null || typeof item == "undefined" || item == "undefined") {
                log("undefined item[" + item + "], (getTags())" + a.length)
            } else {
                getFlickrApi(srcDivId, destDivId, "tags", item);
            }
        });
    }
    $('tagCloud').innerHTML = '';
}

function messageReady(){
    $('message').value = "아래 입력창에 단어를 넣어 주세요.";
}

function messageRetry(){
    $('message').value = "다시 시도 중입니다.";
}

function messageLoadding(){
    $('message').value = "로딩 중입니다.";
}

function deleteImages(divId){
    if (divId == "tagCloud") 
        $(divId).innerHTML = '';
    else $(divId).innerHTML = ' <a id="blankId"><img id="blankId" style="visibility: hidden; width: 75px; height: 75px" src="./images/blank.gif"></a>';
}

function getImages(tagWord){
    insertImages("draggables", "dropZone", "Flickr", tagWord);
    insertImages("draggables", "dropZone", "Daum", tagWord);
    //insertImages("draggables", "dropZone","Delicious", tagWord);
}

function insertImages(divId, dragTarget, service, tagString, retryCount){
    var params = $H({
        cmd: service,
        param: tagString
    }).toQueryString();
    
    messageLoadding();
    
    var ajaxTimer;
    if (retryCount == null || retryCount < 5) {
        retryCount = (retryCount) | 0;
        if (retryCount > 0) 
            messageRetry();
        ajaxTimer = window.setTimeout(function(){
            insertImages(divId, dragTarget, service, tagString, retryCount + 1);
        }, 10000 * (retryCount + 1));
        log("retry," + retryCount + ". ajaxTimer," + ajaxTimer);
    }
    
    new Ajax.Request('echoFeed.php', {
        method: "get",
        parameters: params,
        onSuccess: function(rsp){
            log("Ajax:" + service + "," + tagString);
            j = rsp.responseText.evalJSON();
            $(divId).innerHTML += eval("show" + service + "Images(j.items)");
            enableDraggable(divId, 'a', 'dropZone', 'a');
            enableDraggable(divId, 'a', 'linkZone', 'a');
            enableDraggable(divId, 'a', 'deliciousZone', 'a');
            enableDraggable(divId, 'a', 'deleteZone', 'a');
            if (retryCount == null || retryCount < 5) {
                log("retry," + retryCount + ". ajaxTimer," + ajaxTimer);
                window.clearTimeout(ajaxTimer);
            }
            messageReady();
        },
        onFailure: function(rsp){
            log('<H3>Error: ' + rsp.status + ' ' + rsp.statusText + '</H3>');
        }
    });
}

function getFlickrApi(divId, dragTarget, service, p, retryCount){
    var params = $H({
        cmd: service,
        param: p
    }).toQueryString();
    
    messageLoadding();
    
    var ajaxTimer;
    if (retryCount == null || retryCount < 5) {
        retryCount = (retryCount) | 0;
        if (retryCount > 0) 
            messageRetry();
        ajaxTimer = window.setTimeout(function(){
            getFlickrApi(divId, dragTarget, service, p, retryCount + 1);
        }, 10000 * (retryCount + 1));
        log("retry," + retryCount + ". ajaxTimer," + ajaxTimer);
    }
    
    new Ajax.Request('FlickrApi.php', {
        method: "get",
        parameters: params,
        onSuccess: function(rsp){
            log("Ajax:" + service + "," + p);
            j = rsp.responseText.evalJSON();
            $(dragTarget).innerHTML += eval(service + "Handler(j)");
            
            //xx
            enableDraggable_test(divId, 'a', dragTarget, 'input');
            if (retryCount == null || retryCount < 5) {
                log("retry," + retryCount + ". ajaxTimer," + ajaxTimer);
                window.clearTimeout(ajaxTimer);
            }
            messageReady();
        },
        onFailure: function(rsp){
            log('<H3>Error: ' + rsp.status + ' ' + rsp.statusText + '</H3>');
        }
    });
}

function getPhotoIds(divId){
    var a = new Array();
    var p;
    
    $A($(divId).getElementsByTagName('a')).each(function(item){
        p = item.getAttribute("photoId");
        if (p != "undefined" || p == null) {
            a.push(p);
        }
    });
    
    return a;
}

//tagCloud or relatedTagCloud
function getTagIds(divId){
    var a = new Array();
    var p;
    
    $A($(divId).getElementsByTagName('input')).each(function(item){
        p = item.getAttribute("tag");
        if (p != "undefined" || p == null) {
            a.push(p);
        }
    });
    
    return a;
}

function tagsHandler(items){
    var s = "";
    
    log("tagsHandler [" + items.length + "]");
    for (var i = 0; i < items.length; i++) {
        var anyDo = getTagIds('tagCloud').any(function(item){
            return item == items[i];
        });
        
        if (anyDo) {
            log("matched!");
        } else {
        
            var tip = 'onmouseover="Tip(\'' + escapeQ(items[i]) + '\')" ';
            var click = 'onclick="inputClick(\'' + escapeQ(items[i]) + '\')" ';
            //s += '<a class="tagString" tag="' + items[i] + '" href="#">' + items[i] + '</a>';
            //s += '<input class="tagWord" type="button" ' + tip + '  value="' + items[i] + '" tag="' + items[i] + '" href="#"/>';
            s += '<input class="tagWord" type="button" ' + tip + click + '  value="' + items[i] + '" tag="' + items[i] + '" href="#"/>';
            log(items[i]);
        }
        if (i > 3) 
            break;
    }
    return s;
}

function escapeQ(s){
    var re = /\'/g;
    s = s.replace(re, " ")
    var re = /\"/g;
    s = s.replace(re, " ")
    return s;
}

function relatedTagsHandler(items){
    var s = "";
    
    log("relatedTagsHandler [" + items.length + "]");
    for (var i = 0; i < items.length; i++) {
        var anyDo = getTagIds('relatedTagCloud').any(function(item){
            return item == items[i];
        });
        
        if (anyDo) {
            log("matched!");
        } else {
            var tip = 'onmouseover="Tip(\'' + escapeQ(items[i]) + '\')"';
            var click = 'onclick="inputClick(\'' + escapeQ(items[i]) + '\')"';
            //s += '<a class="tagString" tag="' + items[i] + '" href="#">' + items[i] + '</a>';
            //s += '<input class="tagWord" type="button" value="' + items[i] + '" tag="' + items[i] + '" href="#"/>';
            //s += '<input class="tagWord" type="button" ' + tip + '  value="' + items[i] + '" tag="' + items[i] + '" href="#"/>';
            s += '<input class="tagWord" type="button" ' + tip + click + '  value="' + items[i] + '" tag="' + items[i] + '" href="#"/>';
            log(items[i]);
        }
        if (i > 3) 
            break;
    }
    return s;
}

function photoInfoHandler(items){
    var s = "";
    
    log("relatedTagsHandler [" + items.length + "]");
    for (var i = 0; i < items.length; i++) {
        log(items[i]);
    }
    return s;
}

function showDaumImages(items){
    var s = "";
    
    log("showDaumImages [" + items.length + "]");
    for (var i = 0; i < items.length; i++) {
        if (items[i]['cover_s_url'] != null) {
            //log(items[i]['title'] + "," + items[i]['cover_s_url']);
            s += makeImage(items[i]['link'], items[i]['cover_s_url'], items[i]['title']);
        }
    }
    
    return s;
}

function showDeliciousImages(items){
    var s = "";
    
    log("showDeliciousImages [" + items.length + "]");
    for (var i = 0; i < items.length; i++) {
        log(items[i]['title']);
        log(items[i]['title']);
        s += makeImage(items[i]['link'], items[i]['link'], items[i]['title']);
    }
    
    return s;
}

function showFlickrImages(items){
    var imgPattern = /(http:\/\/farm3.static.*)_m\.jpg/;
    var photoIdPattern = /http:\/.*photos\/.*\/(\d+)\//;
    var s = "";
    
    log("showFlickrImages [" + items.length + "]");
    for (var i = 0; i < items.length; i++) {
        var result = imgPattern.exec(items[i]['description'])[1];
        var photoId = photoIdPattern.exec(items[i]['link'])[1];
        
        //var photoId = "2206067195";
        if (result) {
            var image = result + '_s.jpg';
            s += makeImage(items[i]['link'], image, items[i]['title'], photoId);
        } else {
            log("<H3>imgPattern Error!</H3>");
        }
    }
    
    return s;
}

function makeImage(itemLink, itemImageLink, itemTitle, photoId){
    if (itemLink == "") 
        itemLink = "http://walnutpie.blogdns.net/mashup/"
    if (itemImageLink == "") 
        itemImageLink = "http://walnutpie.blogdns.net/mashup/images/sun.jpg"
    if (itemTitle == "") 
        itemTitle = "Test Title";
    if (photoId == "") 
        var photoId = "0";
    
    //var link = 'ondblclick="function(){alert(\'' + itemLink + '\');}"';
    var tip = 'onmouseover="Tip(\'' + escapeQ(itemTitle) + '<br/>' + escapeQ(itemLink) + '\')"';
    var s = "";
    //s += '<a ref="' + itemLink + '" alt="' + itemTitle + '" ' + tip + '>';
    s += '<a ref="' + itemLink + '" lt="' + itemTitle + '" photoId="' + photoId + '" ' + tip + '>';
    //s += '<a ref="' + itemLink + '" alt="' + itemTitle + '" ' + link + ' >';
    s += '<img src="' + itemImageLink + '" lt="' + itemTitle + '" />';
    s += '</a>';
    
    return s;
}

function enableDraggable(divIdA, tagA, divIdB, tagB){
    $A($(divIdA).getElementsByTagName('a')).each(function(item){
        new Draggable(item, {
            revert: false,
            ghosting: false
        });
    });
    Droppables.add(divIdB, {
        hoverclass: 'hoverActive',
        onDrop: movePhoto
    });
    $(divIdB).cleared = false;
    
    $A($(divIdB).getElementsByTagName('a')).each(function(item){
        new Draggable(item, {
            revert: false,
            ghosting: false
        });
    });
    Droppables.add(divIdA, {
        hoverclass: 'hoverActive',
        onDrop: movePhoto
    });
    $(divIdA).cleared = false;
};

function movePhoto(draggable, dropZone){
    /*
     if (!dropZone.cleared) {
     dropZone.innerHTML = '';
     dropZone.cleared = true;
     }
     */
    log(">From" + draggable.parentNode.id);
    log(">to" + dropZone.id);
    var ref = draggable.getAttribute("ref");
    var lt = draggable.getAttribute("lt");
    log(">href" + ref);
    
    var p = draggable.parentNode;
    draggable.parentNode.removeChild(draggable);
    if (!p.getElementsByTagName('a').length) {
        p.innerHTML = '<a id="blankId"><img id="blankId" style="visibility: hidden; width: 75px; height: 75px" src="./images/blank.gif"></a>';
    }
    
    draggable.style.top = '';
    draggable.style.left = '';
    
    p = dropZone.getElementsByTagName('a');
    if (p.length == 1) {
        if (p[0].id == "blankId") {
            dropZone.removeChild(p[0]);
        }
    }
    
    dropZone.appendChild(draggable);
    
    if (dropZone.id == "draggables") {
        new Effect.Grow(draggable);
    }
    
    if (dropZone.id == "dropZone") {
    }
    
    if (dropZone.id == "linkZone") {
        new Effect.Pulsate(draggable);
        setTimeout(function(){
            window.open(ref, 'WalnutPie', 'menubar=yew,scrollbars=yes,status=yes,resizable=yes,width=800,height=800');
        }, 1000);
    }
    
    if (dropZone.id == "deliciousZone") {
        new Effect.Pulsate(draggable);
        setTimeout(function(){
            window.open('http://del.icio.us/post?v=4&noui&jump=close&url=' + encodeURIComponent(ref) + '&title=' + encodeURIComponent(lt), 'delicious', 'toolbar=no,width=700,height=400');
        }, 1000);
    }
    
    if (dropZone.id == "deleteZone") {
        new Effect.DropOut(draggable);
        setTimeout(function(){
            dropZone.removeChild(draggable);
            dropZone.innerHTML = '<a id="blankId"><img id="blankId" style="visibility: hidden; width: 75px; height: 75px" src="./images/blank.gif"></a>';
        }, 1000)
    }
}

function isNotEmpty(elem){
    var str = elem.value;
    var re = /.+/;
    if (!str.match(re)) {
        alert("Please fill in the required field.");
        return false;
    } else {
        return true;
    }
}

//function callInProgress(xmlhttp){
//    switch (xmlhttp.readyState) {
//        case 1:
//        case 2:
//        case 3:
//            return true;
//            break;
//        // Case 4 and 0
//        default:
//            return false;
//            break;
//    }
//}
//function showFailureMessage(){
//    alert('uh oh, it looks like the network is down. Try again shortly');
//}
//
//// Register global responders that will occur on all AJAX requests
//Ajax.Responders.register({
//    onCreate: function(request){
//        request['timeoutId'] = window.setTimeout(function(){
//            // If we have hit the timeout and the AJAX request is active, abort it and let the user know
//            if (callInProgress(request.transport)) {
//                request.transport.abort();
//                showFailureMessage();
//                // Run the onFailure method if we set one up when creating the AJAX object
//                if (request.options['onFailure']) {
//                    request.options['onFailure'](request.transport, request.json);
//                }
//            }
//        }, 5000 // Five seconds
//);
//    },
//    onComplete: function(request){
//        // Clear the timeout, the request completed ok
//        window.clearTimeout(request['timeoutId']);
//    }
//});
//
