var urlist_update_token = '';
var list = Array();
var from_index = -1;
var to_index = -1;

function reloadDialog() {
    var posLeft = ($(window).width() - 540) / 2;
    var posTop = 100;
    $('#dlg-reload').dialog('option', 'position', [posLeft, posTop]);
    $('#dlg-reload').dialog('open');
}

function htmlescape(t) {
    return $('<div/>').text(t).html()
}

function refresh_numbers() {
    $('#main-urlist li').each(function(i, e) {
        e.id = 'url-' + (i + 1);
        $(e).find('.number').text((i + 1) + '.');
        $(e).find('a').attr('href', '/nav/' + urlist_hash + '#' + (i + 1));
        $(e).find('a').attr('name', (i + 1));
    })
    counter = $('#main-urlist li').length + 1;
}
function iso8601_date() {
    function two(n) { return n < 10 ? '0' + n : n; };
    var now = new Date();
    var y = now.getFullYear(),
        m = two(now.getMonth() + 1),
        d = two(now.getDate()),
        h = two(now.getHours()),
        mi = two(now.getMinutes()),
        s = two(now.getSeconds());

    var d = y + '-' + m + '-' + d + 'T' + h + ':' + mi + ':' + s + 'Z';
    return d
}

function create_url_item(n, title, url, loading) {
    var s = '<li id="url-' + n + '">';
    s += '<span class="number">' + n + '.</span>';
    s += '<span class="urlink">';
    s += '<a href="/nav/' + urlist_hash + '#' + n + '" name="' + n + '">'
    if(loading) {
        s += '<span class="loading title">' + htmlescape(title) + '</span>';
    } else {
        s += '<span class="title">' + htmlescape(title) + '</span>';
    }
    s += '<span class="url">' + htmlescape(url) + '</span>';
    s += '</a>';
    s += '<span class="meta">Added by you <abbr title="' + iso8601_date() + '" class="timeago">now</abbr></span>';
    s += '</span>';
    s += '<span class="controls" onclick="delete_url(this)">x</span>';
    s += '</li>';
    return $(s);
}

function add_links() {
    if(!registered) {
        window.location = '/signin?back_to=' + urlist_hash;
    } else {
        $('#add-url').fadeIn('slow', function() {
            $('#txt-add-url').focus();
        });
        window.location.hash = '#add';
    }
}

function add_url() {
    var url = $('#txt-add-url').val();
    $('#txt-add-url').val('');
    $('#txt-add-url').focus();
    if(!url) {
        return;
    }
    if($('#main-message')) {
        swap_header()
    }

    $('.urlist-container').show();

    var title = 'loading...';
    var id = counter++;
    var li = create_url_item(id, title, url, true);
    $('#main-urlist').append(li);

    //document.location.hash = id;
    
    var request = '/add_url';
    var data = {urlist_edit_hash: urlist_edit_hash, url: url};
    $.post(request, data, function(data) {
        if (data.status == '-1') {
            li.find('.title').text('Oops! ' + data.error);
            li.addClass('error');
            return;
        }
        li.find('.title').text(data.title);
        li.find('.url').text(data.url);
        li.find('.title').addClass('ellipsis');
        li.find('.url').addClass('ellipsis');
    }, "json");
    reset_flash_message();
}

function delete_url(elem) {
    if(ui_status == 'edit-off') { return; }
    var li = $(elem).parent(); 
    var index = $('li').index(li);
    var request = '/delete_url';
    var data = {
        urlist_edit_hash: urlist_edit_hash,
        urlist_update_token: urlist_update_token,
        index: index};

    li.remove();

    $.post(request, data, function(data) {
        if (data.status == '-1') {
            li.find('.title').text('Oops! Error ' + data.error);
            li.addClass('error');
            return;
        } else if (data.status == '-2') {
            reloadDialog();
        } else {
            flash_message('Oops! Didn\'t mean to do that? <a onclick="undo()">Undo</a>.');
            urlist_update_token = data.update_token;
        }
    }, "json");
    refresh_numbers();
}

function undo() {
    var request = '/undo';
    var data = {
        urlist_edit_hash: urlist_edit_hash,
        urlist_update_token: urlist_update_token};

    $.post(request, data, function(data) {
        if (data.status == '-1') {
            li.find('.title').text('Oops! Error ' + data.error);
            li.addClass('error');
            return;
        } else if (data.status == '-2') {
            reloadDialog();
        } else {
            var next = $('ol#main-urlist li:eq('+data.old_position+')');
            //var next = $('#url-' + (data.old_position + 1));
            var elem = create_url_item(counter++, data.title, data.url);
            if (next.length) {
                next.before(elem);
            } else {
                $('#main-urlist').append(elem);
            }
            reset_flash_message();
            refresh_numbers();
            urlist_update_token = data.update_token;
        }
    }, "json");
}


function move_url(event, ui) {
    to_index = $('li').index(ui.item);
    var request = '/move_url';
    var data = {
        urlist_edit_hash: urlist_edit_hash,
        urlist_update_token: urlist_update_token,
        from_index: from_index,
        to_index: to_index};
    $.post(request, data, function(data) {
        if (data.status == '-1') {
            ui.item.find('.title').text('Oops! Moving error');
            ui.item.addClass('error');
        } else if(data.status == '-2') {
            reloadDialog();
        } else {
            urlist_update_token = data.update_token;
        }
    }, "json");
    refresh_numbers();
}

function start_move_url(event, ui) {
    ui.item.addClass('moving');
    from_index = $('li').index(ui.item);
    reset_flash_message();
}

function stop_move_url(event, ui) {
    ui.item.removeClass('moving');
}

function toggle_append_mode() {
    if(!registered) {
        window.location = '/signin?back_to=' + urlist_hash;
        return;
    }
    var request = '/urlist_settings';
    append_status = !append_status;
    var data = {
        urlist_edit_hash: urlist_edit_hash,
        urlist_update_token: urlist_update_token,
        append_mode: append_status };

    $.post(request, data, function(data) {
        if (data.status == '-1') {
            alert('guru meditation x_x');
        } else {}
    }, "json");

    $('#btn-append').toggleClass('btn-append-off');

    if(append_status) {
        $('#btn-append').text('Append is On');
        $('#lbl-append').text('Others can add links to this list.');
    } else {
        $('#btn-append').text('Append is Off');
        $('#lbl-append').text('Others cannot add links to this list.');
    }

    return false;
}

function edit_on() {
    $('#main-urlist').sortable('enable');
    $('#lbl-title').editable('enable');
}

var edit_clip = null;
function setup_edit_link_zeroclipboard() {
    if(FlashDetect.installed && (navigator.appVersion.indexOf("MSIE 7.") == -1)) {
        if(edit_clip) {
            edit_clip.destroy();
        }
        edit_clip = new ZeroClipboard.Client();
        edit_clip.glue('txt-edit-link');
        $(window).resize(function() {edit_clip.reposition();});

        edit_clip.addEventListener('mouseDown', function(client) {
            edit_clip.setText($('#txt-edit-link').val());
            temp_flash_message('Edit link copied into your clipboard (share it with care!)');
        });
    }
}

function setup_zeroclipboard() {
    if(FlashDetect.installed && (navigator.appVersion.indexOf("MSIE 7.") == -1)) {
        var share_clip = new ZeroClipboard.Client();
        share_clip.glue('txt-urlink');
        $(window).resize(function() {share_clip.reposition();});

        share_clip.addEventListener('mouseDown', function(client) {
            share_clip.setText($('#txt-urlink').val());
            temp_flash_message('Share link copied into your clipboard.');
        });

    }
}

function swap_header() {
    $('#main-message').fadeOut('slow', function(){
        $('#urlist-link').fadeIn('slow', setup_zeroclipboard);
        $('#urlist-title').fadeIn('slow');
    });
}

function highlightByFragment() {
    if(ui_status == 'edit-on') {
        return;
    }
    var fragment = document.location.hash.substring(1);
    $('a[name=' + fragment + ']').parent().parent().addClass('selected');
} 

$(document).ready(function(){
    $("#dlg-reload").dialog({
        autoOpen: false,
        modal: true,
        draggable: false,
        resizable: false,
        width: '540px',
        buttons: {
            "Reload": function() {
                window.location.reload();
            }
        }
    });

    if(urlist_status == 'old' && ui_status == 'edit-on' && $('#main-message').length != 0) {
        $('#main-message').mousemove(function(){
            swap_header();
            $('#main-message').unbind();
            $('#urlist-edit').unbind();
        });
        $('#urlist-edit').mousemove(function(){
            swap_header();
            $('#main-message').unbind();
            $('#urlist-edit').unbind();
        });
    } else {
        setup_zeroclipboard();
    }

    if(rights == 'append') {
        $('#btn-add-url').click(add_url);
        $('#btn-add-links').click(add_links);
        $('#txt-add-url').keypress(function(e) {
            if (e.keyCode == 13) {
                add_url();
            }
        });
    } else if (rights == 'edit' || rights == 'owner') {
        $("#main-urlist").sortable( {
            handle: '.number',
            opacity : 0.6,
            axis: 'y',
            start: start_move_url,
            stop: stop_move_url,
            update: move_url
        });

        edit_on();

        var btn_more_on = true;
        $('#btn-more').click(function() {
            $('#urlist-more-links').slideToggle('fast', function() {
                if(btn_more_on) {
                    $('#btn-more').text('Less');
                } else {
                    $('#btn-more').text('More');
                }
                btn_more_on = !btn_more_on;

                setup_edit_link_zeroclipboard();
            });
        });

        $('#btn-append').click(toggle_append_mode);
        $('#btn-add-url').click(add_url);
        $('#txt-add-url').keypress(function(e) {
            if (e.keyCode == 13) {
                add_url();
            }
        });

        $('#lbl-title').editable(function(value, data) {
                var request = '/urlist_settings';
                var settings = {
                    urlist_edit_hash: urlist_edit_hash,
                    'title': value
                };
                $('#lbl-title').removeClass('untitled');
                $.post(request, settings, function(data) {
                    if (data.status == '-1') {
                        flash_message('Error: ' + data.error);
                        return;
                    }
                    temp_flash_message('Settings saved!');
                }, "json");
                return htmlescape(value);
            },{
                submit: 'OK',
                cancel: 'Cancel',
                onblur: 'ignore',
                style: 'display: inline',
                tooltip:'Click to edit',
                data: function(value, settings) {
                    if($('#lbl-title').hasClass('untitled')) {
                        return '';
                    }
                    return value;
                },
                width: 'none',
                height: 'none'
            }
        );
    }

    $("#dlg-renew-editlink").dialog({
        autoOpen: false,
        modal: true,
        draggable: false,
        resizable: false,
        width: '540px',
        buttons: {
            "No": function() {
                $(this).dialog("close");
            },
            "Yes": function() {
                document.location.href = $('#btn-renew-editlink').attr('href');
            }
        }
    });

    $("#btn-renew-editlink").click(function() {
        var posLeft = ($(window).width() - 540) / 2;
        var posTop = 100;
        $('#dlg-renew-editlink').dialog('option', 'position', [posLeft, posTop]);
        $('#dlg-renew-editlink').dialog('open');
        return false;
    })

    highlightByFragment();
})