mirror of
https://github.com/vale981/Vulcan
synced 2025-03-08 19:11:38 -05:00
fixing bug where video kept playing when closing lightbox
This commit is contained in:
parent
570e99cdc0
commit
2b7f573217
5 changed files with 41 additions and 27 deletions
|
@ -8,7 +8,14 @@
|
|||
{{else}}
|
||||
<div class="post-thumbnail-empty"></div>
|
||||
{{/if}}
|
||||
{{#if media}}
|
||||
{{> post_video}}
|
||||
{{/if}}
|
||||
{{#with media}}
|
||||
{{#if showVideo}}
|
||||
<div class="post-video-lightbox hidden">
|
||||
<a class="post-video-lightbox-hide" href="#">×</a>
|
||||
<div class="post-video-lightbox-inner">
|
||||
{{{html}}}
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/with}}
|
||||
</template>
|
||||
|
|
|
@ -1,3 +1,8 @@
|
|||
Template.post_thumbnail.onCreated(function () {
|
||||
var instance = this;
|
||||
instance.showVideo = new ReactiveVar(false);
|
||||
});
|
||||
|
||||
Template.post_thumbnail.helpers({
|
||||
postLink: function () {
|
||||
return Posts.getLink(this);
|
||||
|
@ -7,13 +12,34 @@ Template.post_thumbnail.helpers({
|
|||
},
|
||||
playVideoClass: function () {
|
||||
return !!this.media ? 'post-thumbnail-has-video': '';
|
||||
},
|
||||
showVideo: function () {
|
||||
return Template.instance().showVideo.get();
|
||||
}
|
||||
});
|
||||
|
||||
Template.post_thumbnail.events({
|
||||
'click .post-thumbnail-has-video': function (e) {
|
||||
'click .post-thumbnail-has-video': function (e, instance) {
|
||||
|
||||
e.preventDefault();
|
||||
$('body').addClass('showing-lightbox');
|
||||
$(e.target).parents('.post').find('.post-video-lightbox').fadeIn('fast');
|
||||
}
|
||||
instance.showVideo.set(true);
|
||||
|
||||
// use Meteor.defer to make sure the elements are rendered by Blaze
|
||||
Meteor.defer(function () {
|
||||
$('body').addClass('showing-lightbox');
|
||||
$(e.target).parents('.post').find('.post-video-lightbox').fadeIn('fast');
|
||||
});
|
||||
|
||||
},
|
||||
'click .post-video-lightbox-hide, click .post-video-lightbox': function (e, instance) {
|
||||
|
||||
e.preventDefault();
|
||||
$(e.target).parents('.post').find('.post-video-lightbox').fadeOut('fast');
|
||||
$('body').removeClass('showing-lightbox');
|
||||
|
||||
Meteor.defer(function () {
|
||||
instance.showVideo.set(false);
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,10 +0,0 @@
|
|||
<template name="post_video">
|
||||
{{#with media}}
|
||||
<div class="post-video-lightbox hidden">
|
||||
<a class="post-video-lightbox-hide" href="#">×</a>
|
||||
<div class="post-video-lightbox-inner">
|
||||
{{{html}}}
|
||||
</div>
|
||||
</div>
|
||||
{{/with}}
|
||||
</template>
|
|
@ -1,7 +0,0 @@
|
|||
Template.post_video.events({
|
||||
'click .post-video-lightbox-hide, click .post-video-lightbox': function (e) {
|
||||
e.preventDefault();
|
||||
$(e.target).parents('.post').find('.post-video-lightbox').fadeOut('fast');
|
||||
$('body').removeClass('showing-lightbox');
|
||||
}
|
||||
});
|
|
@ -25,9 +25,7 @@ Package.onUse( function(api) {
|
|||
'lib/client/autoform-postthumbnail.js',
|
||||
'lib/client/post_thumbnail.html',
|
||||
'lib/client/post_thumbnail.js',
|
||||
'lib/client/post_thumbnail.scss',
|
||||
'lib/client/post_video.html',
|
||||
'lib/client/post_video.js'
|
||||
'lib/client/post_thumbnail.scss'
|
||||
], ['client']);
|
||||
|
||||
api.addFiles([
|
||||
|
|
Loading…
Add table
Reference in a new issue