YouTube embed showing device support option -

i embed youtube videos in angular app using 2 directives make use of youtube iframe api. first loads library async

   angular.module('myapp')     .service('youtubeservice', function($rootscope, $window) {       var self = this;       self.ready = false;       $window.onyoutubeiframeapiready = function () {           self.ready = true;           console.log("youtube service ready");           $rootscope.$broadcast('youtubeserviceready', true);       };       var tag = document.createelement('script');       tag.src = '//www.youtube.com/iframe_api';       var firstscripttag = document.getelementsbytagname('script')[0];       firstscripttag.parentnode.insertbefore(tag, firstscripttag);     }); 

i embed video using javascript library

angular.module('myapp')   .directive('youtube', function (youtubeservice) {     return {           link: function (scope, element, attrs) {               var player;               var playerready = false;               var playerstate;               var callback;                var carouselscope = element.parent().parent().scope();                function createplayer() {                   player = new yt.player(element[0], {                       height: attrs.height,                       width: attrs.width,                       videoid: attrs.youtube,                       playervars: { 'start' : attrs.starttime, 'end' : attrs.endtime, 'origin': 'https://', showinfo: 0, modestbranding: 1 },                       events: {                           onready: function () {                               playerready = true;                               // if (callback !== null) {                               //     callback();                               // }                           },                           onstatechange: function (event) {                               //console.log("time:" + getcurrenttime() + ", duration:" + getduration() );                               playerstate = event.data;                               if (playerstate === yt.playerstate.paused) {                                  carouselscope.play();                               }                           }                       }                   });               }                if (youtubeservice.ready) {                   createplayer();               } else {                   scope.$on('youtubeserviceready', function () {                       createplayer();                   });               }     ... 

this working months until yesterday following video embed in desktop browsers documented here

https://support.google.com/youtube/answer/6098135?hl=en-gb

my problem can't figure out should changing because far understand iframe api correct one. know should changing?

so having exact same issue our site.

it turns out our client, uses code similar yours above functioning correctly. our problem ended being way in adding videos , video meta data our database.

this might not issue, using

http://gdata.youtube.com/feeds/api/videos/<video id>?v=2&alt=json 

to add videos our system. turns out deprecated endpoint, had upgrade v3 system explained here: https://developers.google.com/youtube/v3/docs/videos/list