jQuery Vibration Game (2) - Wir brauchen mehr Verlierer

In unserem vorherigen Let's Code haben wir den Grundstein für ein Spiel auf Basis der Vibration API gelegt. Die Freude über einen Sieg dürfte allerdings momentan noch durch den Umstand gemildert werden, dass man überhaupt nicht verlieren kann. Das Spiel ist also langweiliger als der Unterricht bei meinem ehemaligen Geschichtslehrer, dessen monotone Stimme mich in regelmäßigen Abständen wegnicken ließ. Und das obwohl mich das Fach interessierte. Aber genug der alten Zeiten und frisch ans Werk, der Spieler will verlieren können!

Wie ich schon bei der Beschreibungs des Spielkonzepts angekündigt habe, hat man nur eine begrenzte Zeit bis das Schloss den Alarm auslöst. Wir müssen also einen Timer einrichten, der beim ersten Scannen eines Buttons gestartet werden soll.

var vgTimerStarted = false;

Diese Variable nutzen wir als Flag, um zu checken ob der Timer bereits gestartet worden ist.

var vgTimerCurrent = 0;

vgTimerCurrent wird die verstrichene Anzahl von Sekunden speichern.

var vgTimerMax = 60;

Erreicht vgTimerCurrent den Wert von vgTimerMax, so hat das Schloss den Angriff abwehren können und das Spiel ist verloren.

Der Timer wird beim ersten Scannen eins Buttons aktiviert werden, so dass wir unsere Funktion vgScanButton etwas erweitern müssen. Wir überprüfen zunächst, ob der Timer bereits gestartet wurde. Wenn dies nicht der Fall ist, starten wir ein 1-Sekunden-Intervall, welches die Funktion vgCheckTimer aufruft. Unser Flag setzen wir anschließend auf true, um nicht Gefahr zu laufen weitere Intervalle zu spawnen.

function vgScanButton($vgButton) {
  if (vgTimerStarted == false) {
    vgTimerInterval = setInterval(function() {
      vgCheckTimer();
    }, 1000);

    vgTimerStarted = true;
   }

    if ($vgButton.hasClass(vgButtonActive)) {
      navigator.vibrate(vgDuration);
    }

    $('.vg-button').removeClass(vgButtonScanned);
    $vgButton.addClass(vgButtonScanned);
  }
}

Die Funktion vgCheckTimer erhöht unseren Zähler vgTimerCurrent bei jedem Aufruf um 1. Anschließend wird geprüft, ob wir noch im Toleranzbereich sind. Wenn nicht, wird vgHandleLose abgefeuert und das Intervall unterbrochen.

function vgCheckTimer() {
  vgTimerCurrent++;
  if (vgTimerCurrent >= vgTimerMax) {
    clearInterval(vgTimerInterval);
    vgHandleLose();
  }
}

Unsere Loser-Funktion gibt zunächst einmal nur ein Alert raus. Wahlweise kann der User noch beschimpft und verhöhnt werden. Dazu würde ich allerdings nicht unbedingt raten.

function vgHandleLose() {
  alert('Verloren!');
}

Geschafft, der User hat endlich einen Ansporn und das Spiel seinen Bösewicht. Allerdings dürfte das Spiel immernoch nicht besonders lange motivieren. Mit dem Wiederspielbarkeitswert werden wir uns im nächsten Artikel beschäftigen.

1. Idee und grundlegende Features

2. Wir brauchen mehr Verlierer

3. Spiel's noch einmal Sam