var socketio = require('socket.io-client');
var config = require('../../../config/config');

function Play() {
  this.queue = [];
  this.tid = false;
  this.supportSpeech = 'speechSynthesis' in window;
  this.hasLiveTweets = false;
  this.isTalking = false;
}

Play.prototype = {
  preload: function preload() {
    this.add.sprite(0, 0, 'landscape');
    this.panpoo = this.add.sprite(0, 0, 'panpoo');
    this.panpoo.position.set(this.world.centerX - this.panpoo.width / 2, 200);

    this.eyes = this.add.sprite(this.world.centerX - 75, 330, 'eyes', 6);
    this.eyes.animations.add('blink');

    this.mouth = this.add.sprite(this.world.centerX - 75, 430, 'mouth');
    this.mouth.animations.add('speak');

    this.socket = socketio(config.socketUrl);
    this.socket.on('connect', this.onConnect.bind(this));
    this.socket.on('tweet', this.onTweet.bind(this));

    // Chrome loads voices asynchronously.
    // try it here, maybe it works
    window.speechSynthesis.onvoiceschanged = function(e) {
      this.speechVoice = window.speechSynthesis.getVoices().filter(function(voice) {
        return voice.lang === 'de-DE';
      });
    }.bind(this);
  },

  create: function create() {

  },

  onConnect: function onConnect() {
    this.socket.emit('awaiting-tweets');

    // setup a timeout. if in the first 10 seconds
    // there is no live tweet, than get the last x
    // tweets so that the user can experience something
    setTimeout(function() {
      if(this.hasLiveTweets === false) {
        this.socket.emit('last-tweets');
      }
    }.bind(this), 1000);
  },

  onTweet: function onTweet(data) {
    console.log('received tweet', new Date());
    this.hasLiveTweets = true; // used for last-tweets
    this.queue.push(data);

    if(!this.tid || this.queue.length === 1) {
      this.tid = setTimeout(this.queueTweet.bind(this), 2000);
    }
  },

  queueTweet: function queueTweet() {
    this.showTweet(this.queue.shift());
  },

  showTweet: function showTweet(data) {
    // show tweet logic

    // need to load voice here, as in preload() the getVoices() always returned empty array
    this.speechVoice = window.speechSynthesis.getVoices().filter(function(voice) {
      return voice.lang === 'de-DE';
    });

    // double check
    if(!this.speechVoice || this.speechVoice.length === 0) {
      //TODO
      this.supportSpeech = false;
    }

    if(this.supportSpeech) {
      if(!this.isTalking) {
        // setup the utterance
        this.speaking = new SpeechSynthesisUtterance();

        // params for the text to speak
        this.speaking.text = (data && data.msg) || 'whoops';
        this.speaking.volume = 1.0;
        this.speaking.rate = 1.0;
        this.speaking.pitch = 1.7;
        this.speaking.voice = this.speechVoice[0];
        // bindings when speaking to the visual
        this.speaking.onstart = function() {
          this.isTalking = true;
          this.eyes.play('blink', 4, true);
          this.mouth.play('speak', 10, true);
        }.bind(this);
        this.speaking.onerror = function() {
          this.isTalking = false;
          this.eyes.animations.stop('blink');
          this.mouth.animations.stop('speak');
        }.bind(this);
        this.speaking.onend = function() {
          this.isTalking = false;
          this.eyes.animations.stop('blink');
          this.mouth.animations.stop('speak');
        }.bind(this);

        // ok lets talk
        window.speechSynthesis.speak(this.speaking);
      }
    }

    // queue next tweet if there is any
    if(this.queue.length > 0) {
      this.tid = setTimeout(this.queueTweet.bind(this), 5000);
    }

    this.tid = false;
  }
};

module.exports = Play;


@@ -865,298 +865,8 @@
 s));
-%0A%0A    // Chrome loads voices asynchronously.%0A    // try it here, maybe it works%0A    window.speechSynthesis.onvoiceschanged = function(e) %7B%0A      this.speechVoice = window.speechSynthesis.getVoices().filter(function(voice) %7B%0A        return voice.lang === 'de-DE';%0A      %7D);%0A    %7D.bind(this);
 %0A  %7D
@@ -1842,24 +1842,25 @@
 Voice = 
-window.s
+this.getS
 peechSyn
@@ -1864,124 +1864,30 @@
 Synt
-h
 esis
-.get
 Voice
-s
 ()
-.filter(function(voice) %7B%0A      return voice.lang === 'de-DE';%0A    %7D);%0A%0A    // double check
+;%0A%0A
 %0A    if(
 !thi
@@ -1878,25 +1878,24 @@
 );%0A%0A%0A    if(
-!
 this.speechV
@@ -1902,124 +1902,8 @@
 oice
- %7C%7C this.speechVoice.length === 0) %7B%0A      //TODO%0A      this.supportSpeech = false;%0A    %7D%0A%0A    if(this.supportSpeech
 ) %7B%0A
@@ -2274,11 +2274,8 @@
 oice
-%5B0%5D
 ;%0A  
@@ -2921,16 +2921,67 @@
 ts talk%0A
+        console.log('now talk...', this.speaking);%0A
         
@@ -3204,16 +3204,402 @@
  false;%0A
+  %7D,%0A%0A  getSpeechSyntesisVoice: function getSpeechSyntesisVoice() %7B%0A    if(!this.supportSpeech) %7B%0A      return false;%0A    %7D%0A%0A    var voices = window.speechSynthesis.getVoices().filter(function(voice) %7B%0A      return voice.lang === 'de-DE' %7C%7C voice.lang === 'de_DE';%0A    %7D);%0A%0A    if(voices && Array.isArray(voices) && voices.length %3E 0) %7B%0A      return voices%5B0%5D;%0A    %7D%0A%0A    return false;%0A
   %7D%0A%7D;%0A%0A

fix mobile android speaking