"Klasse" in JavaScript

KasselJulian · 07.08.2013

AW: "Klasse" in JavaScript

Priiiiiiiiiima!

Also ich habe dein Tipp mal versucht praktisch umzusetzen. Sag mir mal ob das mit deinen Vorstellungen hinkommt:

Code:

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Unbenanntes Dokument</title>
    <script>
    
        /**
         * Hier werden alle Overlay
         * Schließ-Funktionen aufgerufen
        */
        var overlay = array();
        function closeOverlays(){
            // Für jedes Overlay das geöffnet ist
            var length = arr.length,element = null;
            for (var i = 0; i < length; i++) {
                element = arr[i];
                // Öffnen der Schließ-Funktion für das Overlay
                window[element]();
                // Unset das Array mit den Funktionen beinhaltend
                overlay = [];
            }
            return true;
        }
        
        /**
         * Overlay eins
        */
        $('a.overlayOne').click(function(e){
            e.preventDefault();
            // Schließe ersteinmal alle anderen overlays
            closeOverlays();
            // füge das overlay in das array hinzu
            // damit closeOverlays() weiß, dass dieses
            // overlay geschlossen werden muss bevor
            // ein anderes geöffnet werden kann
            overlay.push("overlayOneClose");
            
            // Hier wird der Overlay eins eingeblendet    
        });
        function overlayOneClose(){
            // Schließt overlay eins
        }
        
        /**
         * Overlay zwei
        */
        $('a.overlayTwo').click(function(e){
            // Schließe ersteinmal alle anderen overlays
            closeOverlays();
            // füge das overlay in das array hinzu
            // damit closeOverlays() weiß, dass dieses
            // overlay geschlossen werden muss bevor
            // ein anderes geöffnet werden kann
            overlay.push("overlayTwoClose");
            
            // Hier wird der Overlay zwei eingeblendet
        });
        function overlayTwoClose(){
            // Schließt overlay zwei
        }
        
        
        
    </script>
</head>
<body>
<a href="#" class="overlayOne">Öffnet overlay eins</a>
<a href="#" class="overlayTwo">Öffnet overlay zwei</a>
</body>
</html>

Duddle · 07.08.2013

AW: "Klasse" in JavaScript

Sowas wie overlayOneClose und overlayTwoClose sollte dir sofort ins Auge stechen.

Ich habe ja schon ein Entwurfsmuster verlinkt, also bin ich so frei und zeige gleich auf das nächste: Strategie. Dafür hatte ich auch mal geschrieben. Das ist mglw. nicht ganz ideal für dich, falls du komplett freie Schließ-Animationen vergeben willst statt einer vordefinierten Menge, aber das Prinzip ist anwendbar:

Du hast einzelne Objekte für jede Schließ-Animation, plus ein Subjekt aus dem Observer-Muster (hey, wo wir schon dabei sind, mach doch gleich ein Singleton draus).
Beim Erzeugen eines neuen Overlays gibst du ihm eines der Schließ-Animations-Objekte und meldest es am Subjekt an. Beim Öffnen meldet das Overlay dem Subjekt diesen Wunsch, welches dann allen angemeldeten Beobachter/Overlays den Schließen-Befehl gibt.

Diese Lösung ist aber reiner Overkill. Zumindest der Observer-Teil. Du brauchst - wie vorher schon gesagt - nur ein globales Arrays mit den Overlays, über welches eine Hilfsfunktion iteriert und die Schließen-Funktion aufruft.

Duddle