> autoplay="1"> Could that be the problem ? (I've never used the youtube control) At a guess, you need to set that to 0 and then trigger the video to play once your element has been 'attached'
On Tuesday, 21 July 2015 19:33:43 UTC+1, Darin Hensley wrote: > > Stackoverflow cross post > <http://stackoverflow.com/questions/31543770/google-youtube-plays-before-paper-dialog-behavior-is-opened> > > > *Polymer 1.0* > > I have this custom element I made for playing youtube videos. It works > great. But there two issues: > > 1. the youtube video starts playing as soon as the index.html loads, > rather than waiting for the `paper-dialog-behavior` to open. > 2. closing the `paper-dialog-behavior` doesn't stop the video. I tried > using the `pause` api for the `google-youtube` node but that is not > a real fix(video should stop instead). > > I could use the `google-youtube` api `play()` for the event listener > `'iron-overlay-opened'`, but the `play()` method is not compatible with > most android browsers and will create issues. > > How can I make the `google-youtube` element play only when > `paper-dialog-behavior` opens and not on initial load? And same with > dismissing the `paper-dialog-behavior`. > > > <link rel="import" href= > "../bower_components/google-youtube/google-youtube.html"> > <link rel="import" href= > "../bower_components/paper-dialog/paper-dialog.html"> > <link rel="import" href= > "../bower_components/paper-dialog-behavior/paper-dialog-behavior.html"> > <link rel="import" href= > "../bower_components/paper-icon-button/paper-icon-button.html"> > <link rel="import" href= > "../bower_components/iron-icons/iron-icons.html"> > <link rel="import" href= > "../bower_components/neon-animation/animations/fade-out-animation.html"> > <link rel="import" href= > "../bower_components/neon-animation/animations/scale-up-animation.html"> > <link rel="import" type="css" href= > "../bower_components/paper-dialog-behavior/paper-dialog-common.css"> > <link rel="import" href= > "../bower_components/paper-styles/paper-styles.html"> > > <dom-module id="video-player"> > <style> > :host { > @apply(--layout-fit); > } > </style> > > > <template> > <div id="insertVideoPlayer" class="layout vertical fit"> > <google-youtube style="height: 100%" > video-id="YMWd7QnXY8E" > rel="1" > start="5" > playsinline="0" > controls="2" > showinfo="0" > width="100%" > height="100%" > autoplay="1"> > </google-youtube> > </div> > <paper-button dialog-dismiss style="color: white; margin-top: 0px > "> > <paper-icon-button icon="arrow-back"></paper-icon-button> > </paper-button> > </template> > > <script> > Polymer({ > is: "video-player", > behaviors: [ Polymer.PaperDialogBehavior ], > listeners: { 'iron-overlay-closed': 'bar' }, > bar: function(e) { > console.log('hi'); > this.$$('google-youtube').pause(); > } > }); > </script> > </dom-module> > > > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/676a2987-b7e5-44a5-b009-3740bcf44d36%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
