Translate TTS demo

HTML

<div>
  <ul>
   <li><a tts="{{ttsEnabled}}" href="#">Página principal</a></li>
   <li><a tts="{{ttsEnabled}}" href="#">Búsqueda en google</a></li>
   <li><a tts="{{ttsEnabled}}" href="#">Registro de usuarios</a></li>
 </ul>
 <label><input type="checkbox" ng-model="ttsEnabled" /> Habilitar voz</label>
</div>

JavaScript

var ttsApp = angular.module('ttsApp', []);

   ttsApp.directive('tts', function(){
    return {
     restrict: 'A',
     link: function(scope, element, attrs){
      var audio = null;
      var isPlaying = false;

      var playAudio = function(text, onFinish){
       audio = new Audio('http://translate.google.com/translate_tts?tl=es&q=' + encodeURIComponent(text));
       audio.play();
       audio.addEventListener('ended', onFinish);
       audio.addEventListener('error', function(error){ onFinish(); });
     };

     var stopAudio = function(){
       if(audio)
        audio.pause();
    }

    scope.$on('audioPlaying', function(){
     stopAudio();
     isPlaying = false;
   });

  element.bind('mouseenter', function(){
     if(eval(attrs.tts) && !isPlaying){
      isPlaying = true;
      scope.$broadcast('audioPlaying', []);
      playAudio(element.text(), function(){
       isPlaying = false;
     });
    }
  });

  }
}
});