var ESCAPE_KEY = 27;

String.prototype.startsWith = function(s) { 
    return this.indexOf(s)==0; 
};

SimpleObserver = Class.create();
SimpleObserver.prototype = {
    initialize: function() {},
    onStart: function(eventname, draggable, event) {
                pUpdater.stop();
                if (draggable) {
                    window.status = 'Dragging';
                    draggable.element.style.position = 'absolute';
                }
    },
    onEnd: function(eventname, draggable, event) {
                window.status = 'Stopped';
    },
    onDrag: function(eventname, draggable, event) {}
}

Draggables.addObserver(new SimpleObserver());

var pUpdater;

function initPeriodicalUpdate(url) {    
    pUpdater = new Ajax.PeriodicalUpdater('tags', url, {frequency:5,evalScripts:true})    
}

function startPeriodicalUpdate(url) {
    if(!pUpdater) {
        initPeriodicalUpdate(url);
    } else {
        pUpdater.start();
    }
}

function wedge(event){ 
    return false 
};

function createDraggable(elementId, safeForIE) {
    if (!safeForIE) {
        new Draggable(elementId);
    } else {
        // see http://www.garyharan.com/index.php/2007/02/08/internet-explorer-bug-scriptaculous-drag-and-drop-goes-into-text-select-mode/
        new Draggable(elementId, { 
            onStart: function(){ 
                if (document.all){ 
                    Event.observe(document.body, "drag", wedge, false); 
                    Event.observe(document.body, "selectstart", wedge, false); 
                } 
            }, 
            revert: function(){ 
                if (document.all){ 
                    Event.stopObserving(document.body, "drag", wedge, false); 
                    Event.stopObserving(document.body, "selectstart", wedge, false); 
                } 
            } 
        });
    }
}

function initDraggables() {
    var divs = document.getElementsByTagName('div');
    for (div in divs) {
        var curdiv = divs[div];
        if (curdiv.id && curdiv.id.startsWith && curdiv.id.startsWith('tag_')) {
            createDraggable(curdiv.id);
        }
    }
}

function highlightTag(tagId, step) {
    var colors = ['#FF0000', '#E90016', '#CB0034', '#A70058', '#7F007F', '#5900A7', '#3400CB', '#0000FF'];
    if ($(tagId)) { 
        if (!step) step = 0;
        if (step < colors.length) {
            $(tagId).setStyle({color: colors[step]});
            setTimeout('highlightTag(\'' + tagId + '\', ' + (step + 1) + ');', 160); 
        }
    }
}

function cancelNamingForm(event) {
    if (event && (event.keyCode == ESCAPE_KEY)) {
        toggleNamingForm();
        $('name').value = $('naming').innerHTML;
    }
}

function toggleNamingForm() {
    var namingElement = $('namingContainer');
    var namingFormContainer = $('namingFormContainer');
    namingElement.toggle();
    namingFormContainer.toggle();
    updateTitle($('name').value);
    $('name').focus();
    $('name').select();
}

function submitCloudName() {
    var formElement = $('namingForm');
    var formValues = Form.serialize(formElement, true);
    
    new Ajax.Updater( 'naming', formElement.action, {      
        method: formElement.method, 
        parameters: formValues,
        onSuccess: toggleNamingForm        
    });
}

function submitPosition(tagValue, url, mapId) {
    var element = $('tag_'+tagValue);
    var positions = [element.style.left.replace('px',''), element.style.top.replace('px','')];
    new Ajax.Request(url, {
        method: 'post',
        onSuccess: function() {pUpdater.start();},
        parameters: '&positionLeft='+positions[0]+'&positionTop='+positions[1]+'&value='+tagValue+'&id='+mapId
    });
}

function updateTitle(cloudName) {
    if(cloudName) {
	    document.title = 'mindcloud.de - '+cloudName;    
    }   
}

function changeBackground(imgUrl) {
    var tc = $('tagcloud');
    tc.style.backgroundImage = 'url(' + imgUrl + ')';
}

function selectText(textFieldId) {
    $(textFieldId).focus(); 
    $(textFieldId).select(); 
}