Videogular Cannot Read Property 'updatevolume' of Undefined

bower-videogular-youtube

NamPNQ / bower-videogular-youtube Goto Github PK

40.0 6.0 29.0 1.31 MB

Videogular `youtube` plugin repository for distribution on `bower`

License: MIT License

HTML 21.76% JavaScript 78.24%

bower-videogular-youtube's Introduction

Bower-videogular-youtube

Videogular youtube plugin repository for distribution on bower

Install

Install Videogular youtube plugin with Bower:

bower install videogular-youtube

Inside the folder bower_components\videogular-youtube y'all should detect likewise html partials that you lot should locate in .\views\videogular\plugins\youtube\.

How to use

Add directives, and video source to your HTML:

                    <                    videogular                    vg-role player-ready="onPlayerReady"                    vg-theme="config.theme.url"                    vg-autoplay="config.autoPlay">                    <                    vg-media                    vg-src="config.sources"                    vg-youtube="rel=1;showinfo=1">                    </                    vg-media                    >                    <                    vg-controls                    vg-autohide="config.autoHide"                    vg-autohide-time="config.autoHideTime">                    <                    vg-play-pause-button                    >                    </                    vg-play-pause-push                    >                    <                    vg-timedisplay                    >{{ currentTime | date:'mm:ss' }}</                    vg-timedisplay                    >                    <                    vg-scrubBar                    >                    <                    vg-scrubbarcurrenttime                    >                    </                    vg-scrubbarcurrenttime                    >                    </                    vg-scrubBar                    >                    <                    vg-timedisplay                    >{{ timeLeft | date:'mm:ss' }}</                    vg-timedisplay                    >                    <                    vg-volume                    >                    <                    vg-mutebutton                    >                    </                    vg-mutebutton                    >                    <                    vg-volumebar                    >                    </                    vg-volumebar                    >                    </                    vg-book                    >                    <                    vg-fullscreenButton                    >                    </                    vg-fullscreenButton                    >                    </                    vg-controls                    >                    <                    vg-poster-epitome                    vg-url='config.plugins.poster.url'>                    </                    vg-affiche-image                    >                    <                    vg-buffering                    >                    </                    vg-buffering                    >                    <                    vg-overlay-play                    vg-play-icon="config.theme.playIcon">                    </                    vg-overlay-play                    >                    <                    vg-poster-prototype                    vg-url='config.plugins.poster.url'>                    </                    vg-poster-image                    >                    <                    vg-buffering                    >                    </                    vg-buffering                    >                    <                    vg-overlay-play                    vg-play-icon="config.theme.playIcon">                    </                    vg-overlay-play                    >                    </                    videogular                    >                  

Additionally, you lot will demand to add youtube plugins and videogular to your awarding:

                    "use strict"                    ;                    angular                    .                    module                    (                    "videogularApp"                    ,                    [                    "controllers"                    ,                    "com.2fdevs.videogular"                    ,                    "com.2fdevs.videogular.plugins.controls"                    ,                    "com.2fdevs.videogular.plugins.overlayplay"                    ,                    "com.2fdevs.videogular.plugins.buffering"                    ,                    "info.vietnamcode.nampnq.videogular.plugins.youtube"                    ]                    )                    ;                  

And that's all :)

Demo

Here you lot can run into a demo on Codepen:

http://codepen.io/2fdevs/pen/qOBRpO

A note on mobile fullscreen support

The YouTube iframe API does not provide a programmatic way to make a video fullscreen. If the Videogular full screen button is enabled for YouTube videos, it will not work.

While good results may exist obtained by making the iframe or videogular element fullscreen on Android, this currently is not supported on iOS which can only make video elements fullscreen. The only way to support fullscreen YouTube videos on iPad is to show the YouTube controls and allow the user to tap the fullscreen push button. If YouTube controls are enabled, ensure that whatever videogular elements that would embrace the iframe, such as vg-controls, vg-overlay-play, and vg-poster are disabled then that the user tin collaborate with the controls inside the YouTube iframe.

Donate

If project aid you, you can donate me

  • Paypal: [email protected]
  • Bitcoin: 1LKyH1jTP8Agd8FakpvydCP87HQzL85cFx

Install Videogular

Install Videogular with Bower:

bower install videogular

Install themes

Install Videogular themes with Bower:

bower install videogular-themes-default

Install plugins

Install Videogular plugins with Bower:

bower install videogular-buffering

bower install videogular-controls

bower install videogular-poster

Documentation

Information technology'southward available on Videogular's project Wiki.

License

The MIT License (MIT)

Copyright (c) 2014 NamPNQ

Permission is hereby granted, free of charge, to whatever person obtaining a re-create of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, re-create, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to let persons to whom the Software is furnished to practice so, subject to the following conditions:

The above copyright detect and this permission notice shall exist included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "Equally IS", WITHOUT WARRANTY OF ANY KIND, Limited OR Unsaid, INCLUDING BUT Not LIMITED TO THE WARRANTIES OF MERCHANTABILITY, Fettle FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS Exist LIABLE FOR Any Merits, Damages OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE Apply OR OTHER DEALINGS IN THE SOFTWARE.

bower-videogular-youtube's People

bower-videogular-youtube'due south Issues

vgYoutube is unable to be used in combination with the vgNextVideo Plugin

As vgYoutube uses deprecated defineGetters and defineSetters to overwrite the existing control functions, information technology is unable to get admission the response '.src' of the NewVal in the directive link office.

Is there a fashion to remove these Getters and Setters during the 'destroyYoutubePlayer()' part?

Greets Jules

Is vg-complete chosen?

Hi,

when youtube video is finished playing, is the method in vg-consummate called?

                  <                  videogular                  vg-theme="videoConfig.theme.url"                  grade="videogular-container"                  vg-consummate="onCompleteVideoPlay()"                  vg-player-ready="onPlayerReady($API)">                  <                  vg-media                  vg-src="videoConfig.sources"                  vg-youtube="rel=one;showinfo=ane">                  </                  vg-media                  >                  </                  videogular                  >                
                  $scope                  .                  onCompleteVideoPlay                  =                  part                  (                  )                  {                  if                  (                  secondScreenCtrl                  .                  API                  )                  {                  secondScreenCtrl                  .                  API                  .                  toggleFullScreen                  (                  )                  ;                  $scope                  .                  playingVideo                  =                  false                  ;                  }                  else                  {                  throw                  new                  Error                  (                  'video player API not ready!'                  )                  ;                  }                  }                  ;                

Vimeo support?

Hey!

Thanks for a slap-up plugin!
Any ambition for including Vimeo as well?

Cheers!

videogular-youtube - Cannot read property '0' of undefined - onSourceChange(newVal[0].src);

I have installed videogular-youtube and am faced with the following:

                  TypeError: Cannot read property '0' of undefined     at Object.fn (vg-youtube.js:121)     at Telescopic.$get.Scope.$digest (angular.js:14308)     at angular.js:14505     at completeOutstandingRequest (angular.js:4924)     at angular.js:5312                                  

Annotation I have even used just the example files provided, (with modification include the correct css file for the theme) only still the same.

I take also tried with code from the latest commits and from the pull requests but faced with the same.

I am using the latest stable versions of angular and videogular.

Is videogular-youtube up to appointment?

Assimilate cycle constantly triggered

I was gonna implement a directive to scout the curl position and decided to examination if this directive would have negative effects on the performances.

At my surprise, I found out that videogular is constantly watching and triggering the digest cycle.

Here is a Codepen to show you the problem: http://codepen.io/PierrickGT/pen/qbJawX

Is at that place a workaround?

console.log

Could we remove console.log from youtube.js? Information technology crashes the plugin with IE

Plugin not working

TypeError: Cannot read holding '0' of undefined at Object.fn (youtube.js:121) at Telescopic.$become.Scope.$digest (angular.js:14129) at Scope.$become.Telescopic.$use (angular.js:14391) at done (athwart.js:9567) at completeRequest (angular.js:9752) at XMLHttpRequest.requestLoaded (angular.js:9695)

Angular v1.three.4
Videogular v0.vii.1

Conflict between athwart-video-bg and videogular-youtube

Hi everybody,

I've spent the terminal couple hours trying to figure out why videogular-youtube didn't piece of work in my app and I've found out that information technology was because in that location is a strange conflict happening with angular-video-bg.

I judge it's because the plugins both use the aforementioned method to remember the Youtube videos and I would similar to know if some people got the aforementioned trouble and how they resolved it.

Not enough arguments to EventTarget.removeEventListener.

There is an issue with FireFox, because this method in FireFox requires ii arguments - type of listener and the listener itself. Only in youtube.js there is only type:

                  scope.removeHtmlMediaElementListener = role(htmlMediaElement) {     htmlMediaElement.removeEventListener("waiting");     htmlMediaElement.removeEventListener("ended");     htmlMediaElement.removeEventListener("playing");     htmlMediaElement.removeEventListener("timeupdate"); }                                  

https://developer.mozilla.org/en-US/docs/Spider web/API/EventTarget.removeEventListener

Vimeo integration WIP

if i play non-youtube video after youtube video then it gives me fault TypeError: Cannot read property 'src' of null

image

Clicking VIdeo to Play/Pause doesn't trigger an consequence

Howdy,
playing or pausing the video by just clicking on it doesn't trigger a state alter effect.

my Videogular HTML looks similar this:

                  <                  videogular                  vg-role player-ready="controller.onPlayerReady($API)"                  vg-update-time="controller.onUpdateTime($currentTime, $duration)"                  vg-update-state="controller.onUpdateState($state)"                  vg-complete="controller.onCompleteVideo()"                  vg-theme="controller.config.theme">                  <                  vg-media                  vg-youtube="rel=ane;showinfo=1"                  vg-src="controller.config.sources">                  </                  vg-media                  >                  </                  videogular                  >                

and the controller'due south onComplete function is just:

                  controller.onCompleteVideo = function() {   panel.log("onCompleteVideo"); };                                  

Switching from YouTube video to non-YouTube video fails

When loading the player, onVideoReady() sets the getter/setter functions and the play(), pause(), etc. When changing to a non-YouTube source, these functions are never returned to their original (non-YouTube) state, then pressing play (for example) fails.

Cannot play videos in a playlist with not-youtube videos

Seems the plugin code overrides "mediaelement" functions without reverting back to original functions on video complete. This causes problem when trying to play the adjacent non-youtube video by changing videogular source.

                  API                  .                  mediaElement                  [                  0                  ]                  .                  __defineGetter__                  (                  "duration"                  ,                  office                  (                  )                  {                  return                  ytplayer                  .                  getDuration                  (                  )                  ;                  }                  )                  ;                  API                  .                  mediaElement                  [                  0                  ]                  .                  __defineGetter__                  (                  "currentTime"                  ,                  office                  (                  )                  {                  return                  ytplayer                  .                  getCurrentTime                  (                  )                  ;                  }                  )                  ;                  API                  .                  mediaElement                  [                  0                  ]                  .                  __defineSetter__                  (                  "currentTime"                  ,                  role                  (                  seconds                  )                  {                  return                  ytplayer                  .                  seekTo                  (                  seconds                  ,                  truthful                  )                  ;                  }                  )                  ;                  ...                  API                  .                  mediaElement                  [                  0                  ]                  .                  play                  =                  role                  (                  )                  {                  ytplayer                  .                  playVideo                  (                  )                  ;                  }                  ;                  API                  .                  mediaElement                  [                  0                  ]                  .                  intermission                  =                  function                  (                  )                  {                  ytplayer                  .                  pauseVideo                  (                  )                  ;                  }                  ;                  ...

unintentional dependency on jQuery?

I was trying to use videogular-youtube just it looks up an chemical element via 'vg-overlay-play>div'

https://github.com/NamPNQ/bower-videogular-youtube/blob/main/youtube.js#L54

                                      var videogularElementScope = API.elementScope.scope().$$childHead,                             vgOverPlayElementScope = angular.element('vg-overlay-play>div', API.videogularElement).telescopic();                                  

That fails for me at runtime because angular'due south jqLite appears to not back up selector syntax and throws "Fault: [jqLite:nosel] Looking upwardly elements via selectors is not supported by jqLite!"

image

Since it doesn't announced to list jQuery as a dependency in bower.json, I was wondering if this was unintentional and this could be updated to work with 'just' angular and its jqLite?

Thanks!

Missing State Change Event when switching video

Hi,
when yous change the video source, the new video is loaded with loadVideoById, and it is played automatically.
If the Player was in paused or stopped land, 1 doesn't get an event then.

Working example

Hi,

is it possible that you include a working case in this repository for reference?

Thank you.

Auto play not working

I started with the example youtube.js and html files and the video does non auto play. Hither is my lawmaking:

$scope.onPlayerReady = part (API) {
$scope.API = API;
ytplayer.playVideo();
};

                  $scope.onCompleteVideo = function () {   $scope.isCompleted = true; };  $scope.onUpdateState = role (land) {   $scope.country = state; };  $scope.onUpdateTime = function (currentTime, totalTime) {   $scope.currentTime = currentTime;   $scope.totalTime = totalTime; };  $scope.onUpdateVolume = function (newVol) {   $scope.book = newVol; };  $scope.videos = [   {     sources: [         {src: video.url_source}     ]     // Tracks are inside .mpd file and added past Nuance.js   } ];  $scope.config = {   autoHide: truthful,   autoHideTime: 3000,   autoPlay: true,   sources: $telescopic.videos[0].sources,   tracks: $scope.videos[0].tracks,   loop: true,   preload: "auto",   transclude: true                                  

};

Example non working locally

example does not work on local machine at all. no errors, just blank page

wow

Not working with videogular 0.v.x

Howdy at that place,

I tried to apply this plugin with the latest version of videogular (~ 0.5.1) and it is not working.

The start problem is that it nevertheless uses the VG_EVENTS constant, that does not exists anymore.

Is there whatsoever way to fix it for using the new $watch and $detect approach used by videogular newer versions?

Thanks for your attempt!

When irresolute source, the next video starts playing automatically

Every fourth dimension I change the sources holding, the video automatically starts playing - is there any mode to stop this from happening?

New release needed

I think that is neccesary brand a new tagged release (2.0.1?) to add the last changes to bower package.

Thanks

Non load youtube videos...

I don't sympathise...

My code:

                  var                  jukebox                  =                  athwart                  .                  module                  (                  'jukebox'                  ,                  [                  'jukeboxFilters'                  ,                  "com.2fdevs.videogular"                  ,                  "com.2fdevs.videogular.plugins.overlayplay"                  ,                  "com.2fdevs.videogular.plugins.controls"                  ,                  "com.2fdevs.videogular.plugins.buffering"                  ,                  "info.vietnamcode.nampnq.videogular.plugins.youtube"                  ]                  )                
                  .                  controller                  (                  'playerController'                  ,                  part                  (                  $scope                  ,                  $sce                  )                  {                  $scope                  .                  currentTime                  =                  0                  ;                  $scope                  .                  totalTime                  =                  0                  ;                  $scope                  .                  state                  =                  null                  ;                  $scope                  .                  volume                  =                  1                  ;                  $scope                  .                  isCompleted                  =                  faux                  ;                  $scope                  .                  API                  =                  zip                  ;                  $scope                  .                  onPlayerReady                  =                  office                  (                  API                  )                  {                  $scope                  .                  API                  =                  API                  ;                  }                  ;                  $scope                  .                  onCompleteVideo                  =                  function                  (                  )                  {                  $telescopic                  .                  isCompleted                  =                  true                  ;                  }                  ;                  $scope                  .                  onUpdateState                  =                  part                  (                  country                  )                  {                  $telescopic                  .                  state                  =                  state                  ;                  }                  ;                  $telescopic                  .                  onUpdateTime                  =                  office                  (                  currentTime                  ,                  totalTime                  )                  {                  $scope                  .                  currentTime                  =                  currentTime                  ;                  $scope                  .                  totalTime                  =                  totalTime                  ;                  }                  ;                  $scope                  .                  onUpdateVolume                  =                  office                  (                  newVol                  )                  {                  $telescopic                  .                  book                  =                  newVol                  ;                  }                  ;                  $scope                  .                  onUpdateSize                  =                  function                  (                  width                  ,                  height                  )                  {                  $telescopic                  .                  config                  .                  width                  =                  width                  ;                  $scope                  .                  config                  .                  superlative                  =                  height                  ;                  }                  ;                  $telescopic                  .                  stretchModes                  =                  [                  {                  label:                  "None"                  ,                  value:                  "none"                  }                  ,                  {                  label:                  "Fit"                  ,                  value:                  "fit"                  }                  ,                  {                  label:                  "Fill"                  ,                  value:                  "fill"                  }                  ]                  ;                  $scope                  .                  config                  =                  {                  width:                  300                  ,                  pinnacle:                  300                  ,                  autoHide:                  false                  ,                  autoHideTime:                  3000                  ,                  autoPlay:                  imitation                  ,                  responsive:                  false                  ,                  stretch:                  $scope                  .                  stretchModes                  [                  1                  ]                  ,                  sources:                  [                  {                  src:                  $sce                  .                  trustAsResourceUrl                  (                  "http://world wide web.youtube.com/lookout man?v=dC4Ac4hiLFM"                  )                  ,                  blazon:                  "video/youtube"                  }                  ,                  /*{src: $sce.trustAsResourceUrl("http://world wide web.videogular.com/assets/videos/videogular.mp4"), type: "video/mp4"},                                      {src: $sce.trustAsResourceUrl("http://www.videogular.com/assets/videos/videogular.webm"), type: "video/webm"},                                      {src: $sce.trustAsResourceUrl("http://world wide web.videogular.com/avails/videos/videogular.ogg"), type: "video/ogg"}*/                  ]                  ,                  transclude:                  truthful                  ,                  theme:                  {                  url:                  "styles/themes/default/videogular.css"                  }                  ,                  plugins:                  {                  poster:                  {                  url:                  "assets/images/videogular.png"                  }                  ,                  ads:                  {                  companion:                  "companionAd"                  ,                  companionSize:                  [                  728                  ,                  90                  ]                  ,                  network:                  "6062"                  ,                  unitPath:                  "iab_vast_samples"                  ,                  adTagUrl:                  "http://pubads.g.doubleclick.cyberspace/gampad/ads?sz=400x300&iu=%2F6062%2Fiab_vast_samples&ciu_szs=300x250%2C728x90&gdfp_req=1&env=vp&output=xml_vast2&unviewed_position_start=1&url=[referrer_url]&correlator=[timestamp]&cust_params=iab_vast_samples%3Dlinear"                  }                  }                  }                  ;                  $telescopic                  .                  changeSource                  =                  function                  (                  )                  {                  $scope                  .                  config                  .                  sources                  =                  [                  {                  src:                  $sce                  .                  trustAsResourceUrl                  (                  "http://vjs.zencdn.net/v/oceans.mp4"                  )                  ,                  blazon:                  "video/mp4"                  }                  ,                  {                  src:                  $sce                  .                  trustAsResourceUrl                  (                  "http://vjs.zencdn.net/v/oceans.webm"                  )                  ,                  type:                  "video/webm"                  }                  ]                  ;                  }                  ;                  }                  )                

and view:

                                      <videogular             vg-player-ready="onPlayerReady"              vg-complete="onCompleteVideo"              vg-update-time="onUpdateTime"              vg-update-size="onUpdateSize"              vg-update-volume="onUpdateVolume"              vg-update-land="onUpdateState"             vg-width="config.width" vg-height="config.height"              vg-theme="config.theme.url"              vg-autoplay="config.autoPlay"              vg-stretch="config.stretch.value"              vg-responsive="true">              <video id='player' class='videoPlayer' vg-src="config.sources" preload='metadata'></video>  ....                                  

But not error show, and not load video youtube...

I endeavor with http and https.

Assistance ?

I'cant load dynamic video on src

this.config = {
preload: "none",
sources: [
{src: "https://world wide web.youtube.com/spotter?5="+ $scope.data.trailer_video},
{src: $sce.trustAsResourceUrl("http://static.videogular.com/avails/videos/videogular.webm"), blazon: "video/webm"},
{src: $sce.trustAsResourceUrl("http://static.videogular.com/assets/videos/videogular.ogg"), blazon: "video/ogg"}
],
theme: {
url: "http://www.videogular.com/styles/themes/default/latest/videogular.css"
},
plugins: {
controls: {
autoHide: true,
autoHideTime: 5000
}
}
};

Not able to run with instance in bower component

I accept followed your example, simply I am unable to run the youtube video.
Getting this error : TypeError: Cannot read property '0' of undefined

Uncaught TypeError: undefined is not a part

Hello, and thank y'all for your work!

Videogular is working good with a mp4 video, only i can't use your plugin considering i accept this error on initialization:

                  Uncaught TypeError: undefined is not a function     play     $scope.doPlayerReady     videogularElementScope.onPlayerReady     $telescopic.onVideoReady     telescopic.onVideoReady                                  

This error comes from videogular.js in the play function (controller part), this.videoElement[0].play(); is undefined.

HTML

                  <videogular ng-switch-when="youtube" vg-autohide="config.autoHide" vg-autohide-time="config.autoHideTime" vg-complete="onCompleteVideo" vg-update-time="onUpdateTime" vg-autoplay="config.autoPlay" vg-stretch="config.stretch" vg-width="config.width" vg-height="config.height" vg-theme="config.theme" vg-responsive="config.responsive">     <video form='videoPlayer' preload='metadata'>             <!--<source ng-src='http://video-js.zencoder.com/oceans-clip.mp4' type='video/mp4'>-->         <source src='http://www.youtube.com/picket?v=nOEw9iiopwI' type='video/youtube' />     </video>     <vg-youtube></vg-youtube>     <vg-overlay-play vg-play-icon="config.theme.playIcon"></vg-overlay-play>     <vg-controls vg-autohide="config.autoHide" vg-autohide-time="config.autoHideTime" style="acme: 50px;">         <vg-play-pause-button vg-play-icon="config.theme.playIcon" vg-pause-icon="config.theme.pauseIcon"></vg-play-pause-button>         <vg-timeDisplay>{{ currentTime }}</vg-timeDisplay>         <vg-scrubBar>             <vg-scrubbarcurrenttime></vg-scrubbarcurrenttime>         </vg-scrubBar>         <vg-timeDisplay>{{ totalTime }}</vg-timeDisplay>         <vg-book>             <vg-mutebutton                 vg-volume-level-3-icon="config.theme.volumeLevel3Icon"                 vg-volume-level-2-icon="config.theme.volumeLevel2Icon"                 vg-volume-level-ane-icon="config.theme.volumeLevel1Icon"                 vg-volume-level-0-icon="config.theme.volumeLevel0Icon"                 vg-mute-icon="config.theme.muteIcon">             </vg-mutebutton>             <vg-volumebar></vg-volumebar>         </vg-volume>         <vg-fullscreenButton vg-enter-full-screen-icon="config.theme.enterFullScreenIcon" vg-exit-total-screen-icon="config.theme.exitFullScreenIcon"></vg-fullscreenButton>     </vg-controls> </videogular>                                  

Module:

                  ['ngSanitize', 'com.2fdevs.videogular', 'com.2fdevs.videogular.plugins.controls', 'com.2fdevs.videogular.plugins.overlayplay', 'com.2fdevs.videogular.plugins.buffering', 'com.2fdevs.videogular.plugins.affiche', 'info.vietnamcode.nampnq.videogular.plugins.youtube']                                  
                  videogular 0.three.0 videogular-youtube 1.0.0                                  

What do y'all call up?

Parse youtube parameters from html

My idea is that the vg-youtube attribute will be passed a set of parameters that will be set up on the YT object.

ex

                  <vg-video vg-src="source.sources" vg-youtube="rel=0;showinfo=1"></vg-video>                                  
                  var optionsArray = attr.vgYoutube.separate(';'); var playerVars = {   controls: 0,   showinfo: 0,   rel: 0 }  optionsArray.forEach(role(item) {   var keyValuePair = item.split up('=');   playerVars[keyValuePair0]] = keyValuePair[one]; });  ytplayer = new YT.Player(API.mediaElement[0], {   videoId: getYoutubeId(url), playerVars); });                                  

Will as well accept checks to make sure keys and values are valid.

the plguin not works! wey

Mistake with there plugin...
the error is ?

error

Tin't get video to play on iOS

Here's my code pen if that helps. Videogular without the Youtube plugin works fine.

onEnter() don't piece of work with youtube plugin on smartphone

Hi,

I'grand trying to add outcome on video using cuePoints, onEnter and onComplete function. But it doesn't piece of work with Youtube plugin when the video is see on a smartphone. When I examination without Youtube plugin it work on smartphone.

Here my code :

controller :

                                      var timePoint = [];     var kickoff = three;     var end = 10;      var result = {};     result.timeLapse = {             commencement: start,             terminate: end     };      consequence.onComplete = role onComplete(currentTime, timeLapse, params) {         alert('onComplete')     };      upshot.onEnter = role onEnter(currentTime, timeLapse, params) {         alarm('onEnter');     };      timePoint.push(result);      this.config = {         preload: "none",         sources: [{                 src: "https://www.youtube.com/picket?v=bZZB40MRjiI"             }],         theme: {             url: "http://world wide web.videogular.com/styles/themes/default/latest/videogular.css"         },         cuePoints: {             timePoint: timePoint         },         plugins: {             controls: {                 autoHide: true,                 autoHideTime: 5000             }         }     };                                  

view :

                  <videogular vg-theme="videoController.config.theme.url"                    vg-histrion-set up="videoController.onPlayerReady($API)"                    vg-automobile-play="truthful"                    vg-native-fullscreen="false"                    vg-plays-inline="true"                    vg-cue-points="videoController.config.cuePoints"                    vg-consummate="videoController.onCompleteVideo()" >            <vg-media vg-src="videoController.config.sources"                      vg-native-controls="false"                      vg-youtube="rel=i;showinfo=0">            </vg-media> </videogular>                                  

Whatsoever Idea ?

Support for Angular ii

Thanks for the plugin ,

Whatever support for the angular2

TypeError: undefined is not a function

is fullscreen working?

Hi

I've tried calling toggleFullScreen() on videogular but the youtube video didn't switch to fullscreen.

Information technology switches to fullscreen simply on doubleclick.

Thanks for help!

How to display subtitle?

How-do-you-do, could you tell me how to display my own subtitle on youtube video. I tried this:

In html file I added: "...vg-tracks="config.tracks"...", and in js file I added:
tracks: [
{
src: $scope.story.subtitleUrl,
kind: "subtitles",
srclang: "en",
label: "English",
default: "default"
}
]
But the subtitle is not shown. Thanks.

TypeError url.friction match is not a role

It gives this fault when I change from regular mp4 to youtube video.

TypeError: url.match is not a function
at isYoutube (youtube.js:142)

Videogular 1.0

Youtube video: change autoplay using radioButton

Hi,
I meet that I can enable Youtube's video autoplay in youtube.js from videogular-youtube pluggin:

                  playerVars = {          'controls': 0,          'showinfo': 0,          'rel': 0,          'autoplay': 0, //Switch autoplay to one to autoplay videos          'beginning': 0   };                                  

My problem is that I have ii radioButtons for enable or disable autoplay. How can I make that, when I select enable autoplay, modify the property to autoplay the video?

P.D. Deplorable for my English.

Add together videos dynamically

Hi !

Thank you for youtube support!

I tried to load video dynamically

For case:

                  var                  url                  =                  $sce                  .                  trustAsResourceUrl                  (                  "https://www.youtube.com/watch?5="                  +                  id                  )                  $rootScope                  .                  config                  .                  sources                  .                  button                  (                  {                  src:                  url                  ,                  blazon:                  "video/youtube"                  }                  )                  //other controller                  $rootScope                  .                  config                  =                  {                  width:                  400                  ,                  height:                  300                  ,                  autoHide:                  false                  ,                  autoHideTime:                  3000                  ,                  autoPlay:                  false                  ,                  responsive:                  fake                  ,                  stretch:                  $scope                  .                  stretchModes                  [                  1                  ]                  ,                  sources:                  [                  ]                  ,                  transclude:                  truthful                  ,                  theme:                  {                  url:                  "styles/themes/default/videogular.css"                  }                  ,                  plugins:                  {                  poster:                  {                  url:                  "assets/images/videogular.png"                  }                  ,                  memeAds:                  {                  vid:'P9EzRfvqOF'                  }                  }                  }                  ;                

And added to the sources array correctly, only when play, i become this fault:

                  TypeError: Cannot read property 'playVideo' of undefined     at onEvent (http://dev.jukebox/js/com/2fdevs/videogular/plugins/youtube.js:156:45)     at Scope.$emit (https://code.angularjs.org/ane.two.17/angular.js:12732:33)     at play (http://dev.jukebox/js/com/2fdevs/videogular/videogular.js:300:xiv)     at playPause (http://dev.jukebox/js/com/2fdevs/videogular/videogular.js:276:13)     at HTMLElement.onClickPlayPause (http://dev.jukebox/js/com/2fdevs/videogular/plugins/controls.js:120:11)     at HTMLElement.ten.event.acceleration (http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js:5:14113)     at HTMLElement.five.handle (http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js:5:10857)                                  

I updated videogular and youtube.js along with other units from this repository (stagging)

ytplayer.a is undefined

How-do-you-do,

I am trying the plugin and getting error here;

                                      API.mediaElement[0].__defineGetter__("videoWidth", function () {                             render ytplayer.a.width; --<<<<  ytplayer.a is undefined                         });                                  

inspecting ytplayer from developer tools i cannot run into the property "a"

No issues

None

Update bower youtube.js to main version

Hullo,

Right now the youtube.js of bower-videogular-youtube V2.0.0 is not the newest lawmaking of master one. Tin can y'all update bower at your earliest convinience?

One problem with V2 is I can't change youtube params with attribute vg-youtube.

Thanks!

Stagging

Close ads

How-do-you-do,
When i use this plugin and youtube shows an ads popup( in the lesser of the video), i can't close this ads popup(the 10 push is disabled). In that location is a fashion i can enable this push button or a function to close the ads?

Thanks

blaggsled1965.blogspot.com

Source: https://coder.social/NamPNQ/bower-videogular-youtube

0 Response to "Videogular Cannot Read Property 'updatevolume' of Undefined"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel