var isProductEdit = false;

var pageLoaded   = false;
var editorLoaded = false;

var maxIconsPerTable = 9;

var imageChooserLoaded    = false;
var downloadChooserLoaded = false;

var spinnerPath    = '/spinner.gif';
var spinnerMaxSize = 66;

var checkedState = $H();

var lastZoomed = null;

var imageBase = 'products';

var imageChooser = null;

/*******************************************
 * Funktionen für Produkt(seiten)übersicht *
 *******************************************/

/************************************
 * Funktionen für Produktseite-Edit *
 ************************************/

/**
 * Initialisiert die Produktseiten-Edit-Seite
 */
function init() {

    // Warten, bis Seite & Editor geladen sind 
    new PeriodicalExecuter(function(pe) {
        if(!pageLoaded || !editorLoaded) {
            return;
        }
        
        // Schleife stoppen
        pe.stop();
        
        // Buttons klickbarmachen
        enableEdit();
        
        blockPage(false);
    }, 1);
    
    blockPage(true);
    
    var div = $('ProduktText');
    
    // Editor instanziieren
    var editor = new FCKeditor('produkt_text', 500, 400);
    
    editor.BasePath = jsRoot + '/fckeditor/';
    editor.ToolbarSet = 'Basic';
    editor.ReplaceTextarea();
    
    isProductEdit = true;
    
    pageLoaded = true;
}

/**
 * Speicherfunktionen anschalten (nachdem Seite komplett geladen ist)
 */
function enableEdit() {
    // Speicher-Buttons
    $$('.savebutton').each(function(button) {
        button.enable();
    });
}

//------------------------------------------------------------------------------

/**
 * Zeigt die Bildauswahl
 * 
 * sektion: Für welche Sektion (aka Tabelle), -1 für Bilder im oberen Teil
 * pos: Bild an welcher Position (0-3), irrelevant für Bilder in Sektionen 
 */
function selectImage(sektion, pos) {
    
    image = null;
    if(sektion == null || sektion == 0 || sektion == -1) {
        image     = $('produkt_bild_'+pos);
    } else {
        image = $('sektion_'+sektion+'_bild');
    }
    image.block();
    
    initChooser(baseUrl + 'images/', imageBase, {
        show:   false,
        onInit: function(chooser) {
            imageChooser = $(chooser);
            
            imageChooser.centerOnScreen();
            imageChooser.show();
        },
        
        onImageClicked: function(imgName) {
            
            var url = baseUrl + 'images/get_entry/' + imageBase + '::' + imgName;
            new Ajax.Request(url, {
                
                onSuccess: function(t, meta) {
                    var imageId  = meta.Bild.id;
                    
                    imageUpdated(pos, imageId, sektion);
                    imageChooser.hide();
                    
                    image.unblock()
                }
                
            });
        },
        
        onClose: function() {
            //blockPage(false, false);
            /*
            image.unblock();
            bigSpinner.hide();
            */
            image.unblock();
        }
    });
}

//------------------------------------------------------------------------------

/**
 * Bildupload starten
 * 
 * (NOTE: unglücklich gewählter Funktionsname, ggf. ändern)
 */
function imgUploadBegins(pos, sektion) {
    
    // Upload-Formular holen
    var targetForm      = $('upload_form');
    
    // Säubern
    targetForm.innerHTML = '';
    
    var image   = null;
    
    var spinnerId = null;
    
    var action  = null;
    var srcFile = null;
    
    // korrektes Bild/Spinner/action/dateifeld
    if(sektion == null || sektion == 0 || sektion == -1) {
        
        image     = $('produkt_bild_'+pos);
        spinnerId = 'produkt_bild_'+pos+'_spinner';
        
        action  = $F('produkt_bild_' + pos + '_action');
        srcFile = $('file_bild_' + pos).cloneNode(true);
        
    } else {
        
        image = $('sektion_'+sektion+'_bild');
        spinnerId = 'sektion_'+sektion+'_spinner';
        
        action  = $F('produkt_bild_0_' + sektion + '_action');
        srcFile = $('file_bild_0_'+sektion).cloneNode(true);
                
    }
    
    action += '/0/' + imageBase;
    
    if(!image || !action || !srcFile) {
        return false;
    }

    // Spinnergröße: nicht größer als Bild, nicht größer als spinneMaxSize 
    // (sonst Skalierungsfaktor > 1)     
    var spinnerSize = (image.width < image.height) ? image.width : image.height;
    if(spinnerSize > spinnerMaxSize) {
        spinnerSize = spinnerMaxSize;
    }

    // Spinner erzeugen
    var spinner = createSpinner(spinnerId, spinnerSize);
    
    // Mit Bild zentrieren    
    spinner.alignTo(image, {
        hAlign: 'center',
        vAlign: 'middle'
    });
    
    // Bild ausgrauen, Spinenr zeigen
    image.setStyle({opacity: .25});
    spinner.show();
    
    // Formular auf richtige URL setzen
    targetForm.action = action;
    
    // Allgemeinen Namen für Dateifeld setzen
    srcFile.name = 'file'; 
    
    // Dateifeld in Formular einfügen
    targetForm.appendChild(srcFile);
    
    // Abschicken
    targetForm.submit();
    
}

/**
 * Callback für Bildupload
 */
function imageUpdated(pos, newId, sektion) {
    
    var imageDomId   = null;
    var imageIdDomId = null;
    
    var spinnerId = null;
    
    // korrekte IDs für Bild/BildId(ist hiddenfield)/Spinner
    if(sektion == null || sektion == 0 || sektion == -1) {
        imageDomId   = 'produkt_bild_' + pos;
        imageIdDomId = 'ProduktBild' + pos + 'Id';
        
        spinnerId = 'produkt_bild_'  + pos + '_spinner';
    } else {
        imageDomId   = 'sektion_' + sektion + '_bild';
        imageIdDomId = 'Sektion' + sektion + 'BildId';
        
        spinnerId = 'sektion_' + sektion + '_spinner';
    }

    // Wenn keine Sektion & pos = 0: 
    // erstes Bild, andere richten sich nach dessen Orientierung
    if(pos == 0 && (sektion == 0 || sektion == null || sektion == -1)) {
        
        // Url zum Ermitteln der Orientierung
        var oUrl = baseUrl + 'images/orientation/' + newId;
        new Ajax.Request(oUrl, {
            onSuccess: function(t) {
                
                var new0W, new0H, newW, newH;

                if(t.responseText == 'l') { // Hochformat                 
                
                    
                    new0W = imageSizes['produktBild0']['l'][0];
                    new0H = imageSizes['produktBild0']['l'][1];
                    
                    newW = imageSizes['produktBild']['l'][0];
                    newH = imageSizes['produktBild']['l'][1];
                    
                } else { // Querformat
                    
                    new0W = imageSizes['produktBild0']['p'][0];
                    new0H = imageSizes['produktBild0']['p'][1];

                    newW = imageSizes['produktBild']['p'][0];
                    newH = imageSizes['produktBild']['p'][1];
                }
                
                // Maße für großes Bild neu setzen
                $(imageDomId).width  = new0W;
                $(imageDomId).height = new0H;
                
                // Maße für kleine Bilder neu setzen
                $R(1,3).each(function(num) {
                    $('produkt_bild_'+num).width  = newW;
                    $('produkt_bild_'+num).height = newH;
                });
            }
        });
    }
    
    
    var image = $(imageDomId);
    
    var w = image.width;
    var h = image.height;

    // Spinner erst abschalten, wenn Bild geladen ist
    $(imageDomId).onload = function() {
        $(imageDomId).setStyle({opacity: 1});
        destroySpinner(spinnerId);
        
    };    
    
    // Bild-Url
    url = baseUrl + 'images/byId/' + newId + '/' + w + '/' + h;
    
    // Aktuelle Zeit als Dummy-Parameter anhängen, 
    // damit kein Cache ins Spiel kommt
    url += '/' + new Date().getTime();

    $(imageDomId).src = url;
    $(imageIdDomId).value = newId;
} 

/**
 * Callback für Bildupload, wenn Bildname schon existiert
 */
function imageExists(imgName, formName, pos, sektion) {
    
    var spinnerId;
    var imageId;
    
    // Spinner/Bild-IDs
    if(sektion == null || sektion == 0 || sektion == -1) {
        spinnerId = 'produkt_bild_' + pos + '_spinner';
        imageId   = 'produkt_bild_' + pos;
    } else {
        spinnerId = 'sektion_' + sektion + '_spinner';
        imageId   = 'sektion_' + sektion + '_bild';
    }
    
    // Fragen, ob Bild überschrieben werden soll
    if(confirm(getString(
        'Ein Bild mit diesem Namen existiert bereits. Soll es überschrieben werden?', 
        interfaceLanguage
        
    ))) {
        
        // Ja -> Bild neu hochladen
        var imgForm = $('upload_form');
        //var formAction = imgForm.action;
        
        //var actionOverwrite = formAction + '/1/' + imageBase;
        //imgForm.action = actionOverwrite;
        
        var formAction = null;
        if(sektion == null || sektion == 0 || sektion == -1) {
            formAction  = $F('produkt_bild_' + pos + '_action');
        } else {
            formAction  = $F('produkt_bild_0_' + sektion + '_action');
        }
        
        formAction += '/1/' + imageBase;
        imgForm.action = formAction;
        
        imgForm.submit();
        imgForm.action = formAction;
        
    } else {
        // Nein -> Spinner verstecken
        $(imageId).setStyle({opacity: 1});
        destroySpinner(spinnerId);
    }
}

/**
 * Callback, wenn Bildupload fehlgeschlagen
 */
function imageUploadFailed(pos, sektion) {
    
    // Hinweis zeigen
    alert(getString(
        'Upload fehlgeschlagen!', 
        interfaceLanguage
    ));

    // Spinner verstecken, Bild wieder auf volle Sichtbarkeit    
    var spinnerId;
    var imageId;
    
    if(sektion == null || sektion == 0 || sektion == -1) {
        spinnerId = 'produkt_bild_' + pos + '_spinner';
        imageId   = 'produkt_bild_' + pos;
    } else {
        spinnerId = 'sektion_' + sektion + '_spinner';
        imageId   = 'sektion_' + sektion + '_bild';
    }
    
    $(imageId).setStyle({opacity: 1});
    destroySpinner(spinnerId);
}

/**
 * Speichert die Produktseite
 */
function updateAll(doSave, afterSubmitCallback) {
    
    if($F('ProduktName') == '') {
        alert(getString('Bitte einen Produktnamen angeben!', interfaceLanguage));
        return false;
    }
    
    blockPage(true, true);
    var editor = FCKeditorAPI.GetInstance('produkt_text');
    $('ProduktseiteText').value = editor.GetHTML();
    
    
    // Alle Bilderuploadformulare aus Dokument entfernen
    $$('.upload_form').each(function(form) { form.remove() });
    
    var form = $('produktseite_form'); 
    
    var submitUrl = baseUrl + '/admin/produkt/update';
    if(doSave) {
        submitUrl += '/1'
    } 
    
    // Wenn kein Callback angegeben, Formular normal abschicken
    if(!afterSubmitCallback) {
        form.submit();
        return;
        
    } 
    // sonst per XHR
    else {
        var submitted = false;
        
        new Ajax.Request( encodeURI(submitUrl), {
            parameters: form.serialize(),
            onComplete: function() { afterSubmitCallback(); }
        });
    }
}

/**
 * Überprüft die Anzahl der gewählten Icons pro Tabelle
 */
function checkChecked(numSektion, clicked) {
    
    var checkedCount = 0;
    
    // Wenn Icons per Checkbox wählbar
    if(clicked.tagName.toLowerCase() == 'input') {
        
        $$('#sektion_'+numSektion+' .sektion_icon').each(function(checkbox) {
            if(checkbox.checked) { checkedCount++; }
        });
        
        // Wenn zuviel, letzten angehakten eintrag wieder aus
        if(checkedCount > maxIconsPerTable) {
            clicked.checked = false;
        }
        
    } 
    
    // Wenn Icons per Multiselect wählbar
    else if(clicked.tagName.toLowerCase() == 'select') {
        
        $A($(clicked.options)).each(function(option) {
            if(option.selected) { checkedCount++; }
        });
        
        // Wenn alles ok, für jeden Eintrag merken, ob gewählt
        if(checkedCount <= maxIconsPerTable) {
            
            $A($(clicked.options)).each(function(option) {
                checkedState[option.id] = option.selected;
            });
            
        } 
        // sonst alten Zustand wieder herstellen
        else { 
           $A($(clicked.options)).each(function(option) {
               option.selected = checkedState[option.id];
           });
        }
    }
    
    // Hinweis zeigen
    if(checkedCount > maxIconsPerTable) {
        alert(getString('Bitte maximal ' + maxIconsPerTable + ' Icons auswählen!', interfaceLanguage));
        clicked.checked = false;
    }
}

/**
 * Interface-Sprache wechseln
 */
function changeILang() {
    var newLang = $F('ilang');
    
    if(isProductEdit) {
        // Wird nach Update auf Server aufgerufen, lädt die Seite neu
        var afterSubmitCallback = function() {
            window.location.href = baseUrl + 'admin/produkt/edit/0';
        }
        
        new Ajax.Request(baseUrl + 'admin/produkt/changeILang?il='+newLang, {
            onSuccess: function() { 
                updateAll(false, afterSubmitCallback);
                
            } 
        });
    } else {
        new Ajax.Request(baseUrl + 'admin/produkt/changeILang?il='+newLang, {
            onSuccess: function() { 
                window.location.reload();
                
            } 
        });
    }
}

/**
 * Hilfsfunktion, setzt lediglich eine Variable, wenn Editor geladen
 */
function FCKeditor_OnComplete( editorInstance ) {
    editorLoaded = true;
}

/**
 * Eine Tabelle zur Seite hinzufügen
 */
function addSektion(clicked) {
    
    
    // Wenn geklicktes Element (hier: Link) übergeben, dieses Blocken, 
    // bis neue Tabelle da ist
    if(clicked && $(clicked)) { $(clicked).block(); }
    
    // Letzte Sektionsnummer finden
    var lastSection = $$('#sektionen table.sektion').last();
    if(lastSection) {
        var numSektion = parseInt(lastSection.id.split('_')[1]) + 1;
    } else {
        var numSektion = 1;
    }

    // Url für Tabelle
    var url = baseUrl + 'admin/produkt/sektion/' + numSektion;
    new Ajax.Request(url, {
        onSuccess: function(t) {
            new Insertion.Bottom($('sektionen'), t.responseText);
            
            // Zur neuen Tabelle scrollen
            $('sektion_'+numSektion).scrollTo();
            
            // Geklicktes Element wider freigeben
            if(clicked && $(clicked)) { $(clicked).unblock(); }
        }
    });
}

/**
 * Eine Tabelle löschen
 */
function deleteSektion(numSektion) {
    $('sektion_' + numSektion + '_set').value = 0;
    $('sektion_' + numSektion).remove();
}

/**
 * Eine Zeile zur Tabelle hinzufügen
 */
function addRow(numSektion) {
    
    // 'Add'-Button blocken
    $('sektion_'+numSektion+'_addrowbutton').block();
    
    // momentane letzte Zeile finden
    var lastZeile = $$('#sektion_'+numSektion+'_tabelle .sektion_zeile').last();
    var numZeile;
    if(lastZeile) {
        numZeile = parseInt(lastZeile.id.split('_')[3]) + 1;
    } else {
        numZeile = 1;
    }
    
    // Url für Tabellenzeile
    var url = baseUrl + 'admin/produkt/zeile/' + numSektion + '/' + numZeile;
    new Ajax.Request(url, {
        onSuccess: function(t) {
            new Insertion.Bottom($('sektion_'+numSektion+'_tabelle'), t.responseText);
            
            // Zur neuen Zeile scrollen
            $('sektion_'+numSektion+'_tabelle').scrollTo();
            
            // Button wieder freigeben
            $('sektion_'+numSektion+'_addrowbutton').unblock();
        }
    });
}

/**
 * Eine Tabellenzeile löschen
 */
function removeRow(numSektion, numZeile) {
    var zeileId = 'sektion_' + numSektion + '_zeile_' + numZeile;

    if($(zeileId)) { $(zeileId).remove(); }
}

/**
 * Zeigt den Download-Auswahldialog
 */
function selectDownload(sektion, zeile, spalte) {
    
    /**
     * Funktion um die gezeigen Downloads mit richtiger 'onclick'-Funktion
     * zu versehen
     */
    var updateClick = function() {
        $$('#download_chooser a.download_selector').each(function(link) {
                    
            var downloadId = link.id.split('_')[1];
    
            link.onclick = function() {
                
                var url;
                if(spalte == null) {
                    url = baseUrl + 'admin/produkt/sektion_download/'+sektion+'/'+downloadId;
                } else {
                    url = baseUrl + 'admin/produkt/spalte_download/'+sektion+'/'+zeile+'/'+spalte+'/'+downloadId;
                }
                new Ajax.Request(url, {
                    onSuccess: function(t) {
                        if(spalte == null) {
                          new Insertion.Bottom('sektion_' + sektion + '_downloads', t.responseText);
                        } else {
                            new Insertion.Bottom('sektion_' + sektion + '_zeile_' + zeile + '_spalte_' + spalte + '_downloads', t.responseText);
                        }
                    }
                });
                 
                $('download_chooser').hide();
            }
        });
    }

    // Wenn Chooser noch nicht geladen
    if(!downloadChooserLoaded) {
        
        // Seite blocken
        blockPage(true, true);
        
        // Chooser vom Server holen
        var chooserUrl = baseUrl + 'admin/download/chooser';
        new Ajax.Request(chooserUrl, {
            onSuccess: function(t, json) {
                $('download_chooser').innerHTML = t.responseText;
                
                // onclicks verknüpfen
                updateClick();

                // Seite freigeben
                blockPage(false);
    
                // Chooser zentrieren 
                // (funkioniert aus irgendwelchen Gründen nicht mit Element.centerOnScreen() )
                centerElement('download_chooser');

                // Anzeigen
                $('download_chooser').show();
                
                downloadChooserLoaded = true;
            }
        });    
    } 
    // Chooser schon geladen, nur anzeigen
    else {
        updateClick();
        
        centerElement('download_chooser');
        $('download_chooser').show();
    }
}

/**
 * Zentriert ein Element im sichtbaren Bereich des Browsers
 * 
 * eigentlich überflüssig: Element.centerOnScreen() [prototype_extensions.js] 
 * sollte das Gleiche tun, funktioniert aber nicht mit den klappbaren Listen
 * des Download-Choosers. 
 */
function centerElement(element) {
    
    var scrollOffset = window.pageYOffset
        || document.documentElement.scrollTop
        || document.body.scrollTop
        || 0;
        
    var newX = (window.innerWidth - $(element).getWidth()) / 2;
    var newY = ((window.innerHeight - $(element).getHeight()) / 2) + scrollOffset;
    
    new Effect.Move(element, {
        duration: 0,
        mode	: 'absolute',
        x		: newX,
        y		: newY
    });
}

/**
 * Inhalte der Produktseite in andere Sprachversion kopieren
 * 
 */
function copyLanguage() {
    if(!confirm(getString(
        'eintraege_geloescht', 
        interfaceLanguage))) {
        
        return;
   }
    
    var destLangId = $F('copylang_selector');

    // Nach Update auf Server Copy-Url aufrufen    
    var afterSubmitCallback = function() {
        var url = baseUrl + 'admin/produkt/copy/' + destLangId + '/1';
        window.location.href = url;
    };

    updateAll(true, afterSubmitCallback);
}

/**
 * Zoomt ein Bild im Bilddialog ein/aus
 * 
 * image: Bild oder ID desselben
 * toWidth: gewünschte Größe
 */
function toggleChooserImageZoom(image, toWidth) {
    
    var image = $(image);
    
    // Wenn anderes Bild vorher gezoomt, dieses wieder auf Normalgröße
    if(lastZoomed) { lastZoomed.morph('width: 100px', {duration: 0.5}); }
    
    if(lastZoomed != image) {
      image.morph('width: ' + toWidth + 'px', {duration: 0.5});
      lastZoomed = image;
      
    } else {
        
        lastZoomed = null;
    }
}

/**
 * Listenelement ein-/ausklappen
 */
function toggleList(listId, clicked) {
    if(!$(listId)) {
        return false;
    }
    
    var image = null;
    if(clicked.tagName.toLowerCase != 'img') {
        var found = false;
        $(clicked).descendants().each(function(element) {
            if(!found && element.tagName.toLowerCase() == 'img') {
                image = element;
                found = true;
            }
        });

    } else {
        image = clicked;
    }
    
    var list = $(listId);
    if(list.visible()) {
        new Effect.BlindUp(list, { duration: 0.25 });
        image.src = imageRoot + '/plus.gif';
    } else {
        new Effect.BlindDown(list, { duration: 0.25 });
        image.src = imageRoot + '/minus.gif';
    }
}


/**********************************
 * Funktionen für Downloads-Seite *
 *********************************/
 
/**
 * Initialisiert die Zeilen in der Downloadübersiche (Mouseover-HL)
 */
function initDownloads() {
    $$('.dllist_table tr').each(function(row) {
        
        var isHead = false;
        row.classNames().each(function(className) { if(className == 'head')  isHead = true; });
        
        if(!isHead) {
            Event.observe(row, 'mouseover', function() { row.setStyle({backgroundColor: '#CCCCCC'}); });
            Event.observe(row, 'mouseout',  function() { row.setStyle({backgroundColor: '#FFFFFF'}); })
        }
    });
}
 
/**
 * Startet automatisch Download-Verwaltung
 * (Hinzufügen von neuen / bei Bedarf löschen von alten)
 */
function autoaddDownloads() {
    
    var url = baseUrl + 'admin/download/autoadd';
    if($('delete_removed_downloads').checked) {
        url += '/1';
    }
    
    window.location.href = url;
}

/**
 * Wird vor Abschicken des Download-Edit-Formulares aufgerufen
 * Schaltet Dropdown für Ordner wieder an (dieser ist beim Editieren von 
 * Downloads abgeschalte, da Verschieben nicht möglich)
 */
function submitUpload() {
    $('DownloadOrdner').enable();
    return true;
}

/****************************
 * sonstige Hilfsfunktionen *
 ****************************/

/**
 * Blockiert die ganze Seite oder gibt sie wieder frei, 
 * zeigt bei Bedarf eine "Bitte warten"-Meldung an
 */
function blockPage(doBlock, showWaitMessage) {
    
    // Element für "Bitte warten"
    var waitMessage = $('wait_message');
    
    // Soll Seite geblockt werden?
    if(doBlock) {
        // Blocken
        $(document.body).block();
    
        // Soll "Bitte warten" angezeigt werden=
        if(showWaitMessage) {
            // Gibt es "Bitte warten" schon?
            if(!waitMessage) {
                // Nein -> neues 'div' anlegen
                new Insertion.Top(
                    document.body, 
                    '<div id="wait_message" ' + 
                          'style="position: absolute; display: none; z-index: 5001; opacity: 1;text-align: center;"></div>');
                
                waitMessage = $('wait_message');
                
                // "Bitte warten" einfügen
                new Insertion.Top(waitMessage, '<h1>' + getString('Bitte warten...', interfaceLanguage) + '</h1><br>');
                
                // Bild (Dummy-Progressbar à la XP-Boot) anlegen
                var waitImage    = new Image();
                
                // Wenn Bild geladen, Meldung zentrieren und anzeigen
                waitImage.onload = function() {
                    waitMessage.centerOnScreen();
                    waitMessage.show()
                }
                
                waitImage.src    = imageRoot + '/progressbar_green.gif';
                waitImage.border = 0;
                
                waitMessage.appendChild(waitImage);
                
            } else {
                // Div gibt's schon, nur zentrieren und anzeigen
                waitMessage.centerOnScreen();
                waitMessage.show()
            }
        }
        
    }
    // Seite freigeben 
    else {
        // Wenn 'Bitte warten' existiert, verstecken und aus Dokument schmeißen
        if(waitMessage) {
            waitMessage.hide();
            waitMessage.remove();
        }
        
        // Seite freigeben
        $(document.body).unblock();
    }
}

/**
 * Erzeugt einen Spinner
 * (Layer mit Bild darin, das anzeigt, das sich momentan etwas tut, aka 'Throbber')
 * 
 * @param spinnerId: ID, die der Spinner bekommen soll
 * @param spinnerSize: Groöße, die er bekommen soll
 * 
 * @return den neu erzeugten Spinner
 */
function createSpinner(spinnerId, spinnerSize) {
    
    // Bildobjekt erzeugen
    var spinnerImage    = new Image();
    spinnerImage.src    = imageRoot + '/' + spinnerPath;
    spinnerImage.width  = spinnerSize;
    spinnerImage.height = spinnerSize;
    
    // Neues div anlegen
    new Insertion.Top(
        $(document.body), 
        '<div id="' + spinnerId + '" ' +
              'class="spinner" ' + 
              'style="position: absolute; display: none; width: ' + spinnerSize + 'px; height: ' + spinnerSize + 'px;" >' + 
        '</div>'
    );
    
    // Bild in div einbauen
    var spinner = $(spinnerId);
    spinner.appendChild(spinnerImage);
    
    // Zurückgeben
    return spinner;
}

/**
 * Entfernt einen Spinner aus dem Dokument, macht ihn vorhger ggf. unsichtbar
 * 
 * @param spinner: der zu entfernende Spinner
 */
function destroySpinner(spinner) {
    
    var spinner = $(spinner);
    if(!spinner) { return null; }
    
    if(spinner.visible()) { spinner.hide(); }
    
    return spinner.remove();
}


/**
 * Gibt String 'str' in Sprache 'lang' zurück
 */
function getString(str, lang) {
    if(strings[str] && strings[str][lang]) {
        return strings[str][lang];
    } else {
        return str;
    }
    
}