var irisPoints = []; // Ein Array, um die Punkte der Iris zu speichern

var eyelidColor = 0; // Farbe der Augenlider (schwarz)

var spiralAngle = 2.0; // Der Startwinkel für die Spirale

var spiralOffset = 400; // Der Offset für die Spirale

var spiralScalar = 20; // Die Skalierung für die Spirale

var spiralSpeed = 0.13; // Die Geschwindigkeit, mit der sich die Spirale dreht

var maxSpiralPoints = 500; // Die maximale Anzahl von Punkten in der Spirale

var currentSpiralPoints = 0; // Der aktuelle Anzahl von Punkten in der Spirale

​

//Augenlider

var eyelidSpeed = 0.25; // Die Geschwindigkeit, mit der sich die Augenlider bewegen

var eyelidWidth = 300; // Die Breite der Augenlider

var eyelidHeight = 200; // Die Höhe der Augenlider (Radius)

var upperEyelidY, lowerEyelidY; // Die Y-Positionen der oberen und unteren Augenlider

​

// Augenlid Animation

var animationActive = false; // Eine Variable, um die Animation der Augenlider zu steuern

var maxEyelidSeparation = 0; // Der maximale Abstand zwischen den Augenlidern

var easingDuration = 3000; // Die Dauer der Animation in Millisekunden

var easingStart; // Der Zeitpunkt, an dem die Animation begonnen hat

var isAnimatingForward = true; // Eine Variable, um den Status der Animation (vorwärts oder rückwärts) zu verfolgen

​

function setup() {

  createCanvas(800, 800); // Erstelle eine Leinwand mit der Größe 800x800

  frameRate(60); // Setze die Bildrate auf 60 Bilder pro Sekunde

  // Setze die Anfangspositionen der Augenlider so, dass sie weit auseinander stehen

  upperEyelidY = height / 2.65;//oberees Augenlid max Abstand 2.65

  lowerEyelidY = height * 0.63;//unteres Augenlid max Abstand 0.63

  // Setze den Zeitpunkt, an dem die Animation beginnt

  easingStart = millis();

}

​

// Generiert einen Punkt für die Iris-Spirale

function generateIrisPoint() {

  // Zufällige Farbe für den Punkt generieren

  var col = {

    r: random(0, 200),

    g: random(0, 250),

    b: random(100, 250)

  };

  // Berechne die Position des Punktes in der Spirale

  var x = spiralOffset + cos(spiralAngle) * spiralScalar;

  var y = spiralOffset + sin(spiralAngle) * spiralScalar;

  // Füge den Punkt zum Array der Iris-Punkte hinzu

  irisPoints.push({x: x, y: y, color: col});

  // Aktualisiere die Parameter für die Spirale

  spiralAngle += spiralSpeed;

  spiralScalar += spiralSpeed;

  currentSpiralPoints++;

}

​

// Zeichnet die Iris-Punkte

function drawIris() {

  for (var i = 0; i < irisPoints.length; i++) {

    fill(irisPoints[i].color.r, irisPoints[i].color.g, irisPoints[i].color.b);

    noStroke();

    ellipse(irisPoints[i].x, irisPoints[i].y, 5, 5); // Größe der Punkte der Spirale

  }

}

​

// Zeichnet die Augenlider

function drawEyelids() {

  fill(eyelidColor); // Setze die Farbe der Augenlider auf Schwarz

  noStroke(); // Kein Rand für die Halbkreise

  // Zeichne das obere Augenlid als Halbkreis

  arc(width / 2, upperEyelidY, eyelidWidth, eyelidHeight, PI, TWO_PI);

  // Zeichne das untere Augenlid als Halbkreis

  arc(width / 2, lowerEyelidY, eyelidWidth, eyelidHeight, 0, PI);

}

​

// Bewegt die Augenlider

function moveEyelids() {

  // Wenn die Animation vorwärts abgespielt wird

  if (isAnimatingForward) {

    // Berechne die vergangene Zeit seit dem Start der Animation

    var elapsedTime = millis() - easingStart;

​

    // Berechne den Fortschritt der Animation (Wert zwischen 0 und 1)

    var progress = constrain(elapsedTime / easingDuration, 0, 1);

​

    // Wende die "Ease-In-Out"-Funktion auf den Fortschritt an

    var easedProgress = easeInOut(progress);

​

    // Berechne die neue Position der Augenlider basierend auf dem animierten Fortschritt

    upperEyelidY = height / 2.65 + (height / 2 - maxEyelidSeparation / 2 - height / 4 - 90) * easedProgress;

//Abstand in der Mitte der animation -> aufeinandertreffen ohne viel überschneidung -> height/4-90

    lowerEyelidY = height * 0.63 - (height / 2 - maxEyelidSeparation / 2 - height / 4 - 90) * easedProgress;

//Abstand in der Mitte der animation -> aufeinandertreffen ohne viel überschneidung -> height/4-90

​

    // Wenn die Animation abgeschlossen ist, ändere den Status der Animation

    if (progress >= 1) {

      isAnimatingForward = false;

      easingStart = millis();

    }

  } 

  else { // Wenn die Animation rückwärts abgespielt wird

    // Berechne die vergangene Zeit seit dem Start der Animation

    var elapsedTime = millis() - easingStart;

​

    // Berechne den Fortschritt der Animation (Wert zwischen 0 und 1)

    var progress = constrain(elapsedTime / easingDuration, 0, 1);

​

    // Wende die "Ease-In-Out"-Funktion auf den Fortschritt an

    var easedProgress = easeInOut(progress);

​

    // Berechne die neue Position der Augenlider basierend auf dem animierten Fortschritt

    upperEyelidY = height / 2.65 + (height / 2 - maxEyelidSeparation / 2 - height / 4 - 90) * (1 - easedProgress);

    //Abstand in der Mitte der animation -> aufeinandertreffen ohne viel überschneidung -> height/4-90

    lowerEyelidY = height * 0.63 - (height / 2 - maxEyelidSeparation / 2 - height / 4 - 90) * (1 - easedProgress);

    //Abstand in der Mitte der animation -> aufeinandertreffen ohne viel überschneidung -> height/4-90

​

    // Wenn die Animation abgeschlossen ist, ändere den Status der Animation

    if (progress >= 1) {

      isAnimatingForward = true;

      animationActive = false; // Stoppe die Animation, wenn die Augenlider wieder auseinander sind

    }

  }

}

​

// "Ease-In-Out"-Funktion für sanfte Animationen

function easeInOut(t) {

  return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;

}

​

// Zeichenfunktion, wird kontinuierlich aufgerufen

function draw() {

  background(0); // Hintergrundfarbe auf Grau setzen

  animateSpiral(); // Zeichne die Iris-Spirale automatisch

  drawIris(); // Zeichne die Iris-Punkte

  if (animationActive) {

    moveEyelids(); // Bewege die Augenlider nur, wenn die Animation aktiviert ist

  }

  drawEyelids(); // Zeichne die Augenlider

}

​

// Funktion zum Animieren der Spirale

function animateSpiral() {

  if (currentSpiralPoints < maxSpiralPoints) {

    generateIrisPoint(); // Generiere einen Punkt für die Spirale

  }

}

​

// Mausklick-Event-Handler

function mousePressed() {

  // Aktiviere die Animation der Augenlider, wenn mit der Maus geklickt wird

  if (!animationActive) {

    animationActive = true;

    easingStart = millis(); // Setze den Startzeitpunkt der Animation

  }

}