Goyslop/4chan-x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

set up clones of videos properly

Browse Source
This commit is contained in:
ccd0 2014-04-07 17:38:00 -07:00
parent deeba623a0
commit 1ef501fc91
4 changed files with 88 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
builds/4chan-X.user.js
View File

@ -1236,7 +1236,7 @@
__extends(Clone, _super);
function Clone(origin, context, contractThumb) {
var file, info, inline, inlined, key, nodes, post, root, val, _i, _j, _k, _len, _len1, _len2, _ref, _ref1, _ref2, _ref3, _ref4;
var file, info, inline, inlined, key, nodes, post, root, val, _i, _j, _k, _len, _len1, _len2, _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
this.origin = origin;
this.context = context;
_ref = ['ID', 'fullID', 'board', 'thread', 'info', 'quotes', 'isReply'];
@ -1306,12 +1306,16 @@
this.file.thumb = $('img[data-md5]', file);
this.file.fullImage = $('.full-image', file);
if (contractThumb) {
$.rmClass(this.nodes.root, 'expanded-image');
$.rmClass(root, 'expanded-image');
$.rmClass(this.file.thumb, 'expanding');
}
this.file.isExpanded = $.hasClass(root, 'expanded-image');
if ((_ref4 = this.file.fullImage) != null) {
_ref4.removeAttribute('id');
}
if ((_ref5 = $('.video-controls', this.file.text)) != null) {
_ref5.remove();
}
}
if (origin.isDead) {
this.isDead = true;
@ -7600,10 +7604,10 @@
$.on(thumb.parentNode, 'click', ImageExpand.cb.toggle);
if (this.isClone && $.hasClass(thumb, 'expanding')) {
ImageExpand.contract(this);
ImageExpand.expand(this);
return;
}
if (ImageExpand.on && !this.isHidden && (Conf['Expand spoilers'] || !this.file.isSpoiler)) {
return ImageExpand.expand(this);
} else if (this.isClone && this.file.isExpanded && this.file.isVideo) {
return ImageExpand.setupVideo(this);
} else if (ImageExpand.on && !this.isHidden && (Conf['Expand spoilers'] || !this.file.isSpoiler)) {
return ImageExpand.expand(this);
}
},
@ -7692,7 +7696,7 @@
return ImageExpand.contract(post);
},
contract: function(post) {
var cb, eventName, video, _ref, _ref1;
var cb, eventName, video, _ref;
if (post.file.isVideo && (video = post.file.fullImage)) {
video.pause();
TrashQueue.add(video, post);
@ -7703,9 +7707,7 @@
cb = _ref[eventName];
$.off(video, eventName, cb);
}
if ((_ref1 = post.file.videoControls) != null) {
_ref1.map($.rm);
}
$.rm(post.file.videoControls);
delete post.file.videoControls;
}
$.rmClass(post.nodes.root, 'expanded-image');
@ -7750,25 +7752,29 @@
if (!$.hasClass(thumb, 'expanding')) {
return;
}
post.file.isExpanded = true;
if (post.file.isVideo) {
ImageExpand.setupVideo(post);
}
if (!post.nodes.root.parentNode) {
$.addClass(post.nodes.root, 'expanded-image');
$.rmClass(post.file.thumb, 'expanding');
ImageExpand.completeExpand2(post);
return;
}
bottom = post.nodes.root.getBoundingClientRect().bottom;
return $.queueTask(function() {
$.addClass(post.nodes.root, 'expanded-image');
$.rmClass(post.file.thumb, 'expanding');
ImageExpand.completeExpand2(post);
if (!(bottom <= 0)) {
return;
}
return window.scrollBy(0, post.nodes.root.getBoundingClientRect().bottom - bottom);
});
},
completeExpand2: function(post) {
var thumb;
thumb = post.file.thumb;
$.addClass(post.nodes.root, 'expanded-image');
$.rmClass(post.file.thumb, 'expanding');
post.file.isExpanded = true;
if (post.file.isVideo) {
return ImageExpand.setupVideo(post, Conf['Autoplay']);
}
},
videoCB: {
mousedown: function(e) {
if (e.button === 0) {
@ -7789,11 +7795,13 @@
}
}
},
setupVideo: function(post) {
var cb, contract, eventName, file, play, video, _ref;
setupVideo: function(post, play) {
var cb, contract, eventName, file, video, _ref;
file = post.file;
video = file.fullImage;
file.videoControls = [];
file.videoControls = $.el('span', {
className: 'video-controls'
});
file.thumb.parentNode.removeAttribute('href');
file.thumb.parentNode.removeAttribute('target');
video.muted = !Conf['Allow Sound'];
@ -7813,9 +7821,9 @@
$.on(contract, 'click', function(e) {
return ImageExpand.contract(post);
});
file.videoControls.push($.tn('\u00A0'), contract);
$.add(file.videoControls, [$.tn('\u00A0'), contract]);
}
if (Conf['Autoplay']) {
if (play) {
video.controls = false;
video.play();
if (Conf['Show Controls']) {
@ -7836,7 +7844,7 @@
video[this.textContent]();
return this.textContent = this.textContent === 'play' ? 'pause' : 'play';
});
file.videoControls.push($.tn('\u00A0'), play);
$.add(file.videoControls, [$.tn('\u00A0'), play]);
}
return $.add(file.text, file.videoControls);
},

56
builds/crx/script.js
View File

@ -1273,7 +1273,7 @@
__extends(Clone, _super);
function Clone(origin, context, contractThumb) {
var file, info, inline, inlined, key, nodes, post, root, val, _i, _j, _k, _len, _len1, _len2, _ref, _ref1, _ref2, _ref3, _ref4;
var file, info, inline, inlined, key, nodes, post, root, val, _i, _j, _k, _len, _len1, _len2, _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
this.origin = origin;
this.context = context;
_ref = ['ID', 'fullID', 'board', 'thread', 'info', 'quotes', 'isReply'];
@ -1343,12 +1343,16 @@
this.file.thumb = $('img[data-md5]', file);
this.file.fullImage = $('.full-image', file);
if (contractThumb) {
$.rmClass(this.nodes.root, 'expanded-image');
$.rmClass(root, 'expanded-image');
$.rmClass(this.file.thumb, 'expanding');
}
this.file.isExpanded = $.hasClass(root, 'expanded-image');
if ((_ref4 = this.file.fullImage) != null) {
_ref4.removeAttribute('id');
}
if ((_ref5 = $('.video-controls', this.file.text)) != null) {
_ref5.remove();
}
}
if (origin.isDead) {
this.isDead = true;
@ -7619,10 +7623,10 @@
$.on(thumb.parentNode, 'click', ImageExpand.cb.toggle);
if (this.isClone && $.hasClass(thumb, 'expanding')) {
ImageExpand.contract(this);
ImageExpand.expand(this);
return;
}
if (ImageExpand.on && !this.isHidden && (Conf['Expand spoilers'] || !this.file.isSpoiler)) {
return ImageExpand.expand(this);
} else if (this.isClone && this.file.isExpanded && this.file.isVideo) {
return ImageExpand.setupVideo(this);
} else if (ImageExpand.on && !this.isHidden && (Conf['Expand spoilers'] || !this.file.isSpoiler)) {
return ImageExpand.expand(this);
}
},
@ -7711,7 +7715,7 @@
return ImageExpand.contract(post);
},
contract: function(post) {
var cb, eventName, video, _ref, _ref1;
var cb, eventName, video, _ref;
if (post.file.isVideo && (video = post.file.fullImage)) {
video.pause();
TrashQueue.add(video, post);
@ -7722,9 +7726,7 @@
cb = _ref[eventName];
$.off(video, eventName, cb);
}
if ((_ref1 = post.file.videoControls) != null) {
_ref1.map($.rm);
}
$.rm(post.file.videoControls);
delete post.file.videoControls;
}
$.rmClass(post.nodes.root, 'expanded-image');
@ -7769,25 +7771,29 @@
if (!$.hasClass(thumb, 'expanding')) {
return;
}
post.file.isExpanded = true;
if (post.file.isVideo) {
ImageExpand.setupVideo(post);
}
if (!post.nodes.root.parentNode) {
$.addClass(post.nodes.root, 'expanded-image');
$.rmClass(post.file.thumb, 'expanding');
ImageExpand.completeExpand2(post);
return;
}
bottom = post.nodes.root.getBoundingClientRect().bottom;
return $.queueTask(function() {
$.addClass(post.nodes.root, 'expanded-image');
$.rmClass(post.file.thumb, 'expanding');
ImageExpand.completeExpand2(post);
if (!(bottom <= 0)) {
return;
}
return window.scrollBy(0, post.nodes.root.getBoundingClientRect().bottom - bottom);
});
},
completeExpand2: function(post) {
var thumb;
thumb = post.file.thumb;
$.addClass(post.nodes.root, 'expanded-image');
$.rmClass(post.file.thumb, 'expanding');
post.file.isExpanded = true;
if (post.file.isVideo) {
return ImageExpand.setupVideo(post, Conf['Autoplay']);
}
},
videoCB: {
mousedown: function(e) {
if (e.button === 0) {
@ -7808,11 +7814,13 @@
}
}
},
setupVideo: function(post) {
var cb, contract, eventName, file, play, video, _ref;
setupVideo: function(post, play) {
var cb, contract, eventName, file, video, _ref;
file = post.file;
video = file.fullImage;
file.videoControls = [];
file.videoControls = $.el('span', {
className: 'video-controls'
});
file.thumb.parentNode.removeAttribute('href');
file.thumb.parentNode.removeAttribute('target');
video.muted = !Conf['Allow Sound'];
@ -7832,9 +7840,9 @@
$.on(contract, 'click', function(e) {
return ImageExpand.contract(post);
});
file.videoControls.push($.tn('\u00A0'), contract);
$.add(file.videoControls, [$.tn('\u00A0'), contract]);
}
if (Conf['Autoplay']) {
if (play) {
video.controls = false;
video.play();
if (Conf['Show Controls']) {
@ -7855,7 +7863,7 @@
video[this.textContent]();
return this.textContent = this.textContent === 'play' ? 'pause' : 'play';
});
file.videoControls.push($.tn('\u00A0'), play);
$.add(file.videoControls, [$.tn('\u00A0'), play]);
}
return $.add(file.text, file.videoControls);
},

6
src/General/lib/clone.class
View File

@ -61,12 +61,16 @@ class Clone extends Post
# Contract thumbnails in quote preview
if contractThumb
$.rmClass @nodes.root, 'expanded-image'
$.rmClass root, 'expanded-image'
$.rmClass @file.thumb, 'expanding'
@file.isExpanded = $.hasClass root, 'expanded-image'
# Remove any #ihover ID
@file.fullImage?.removeAttribute 'id'
# Remove video controls.
($ '.video-controls', @file.text)?.remove()
@isDead = true if origin.isDead
@isClone = true
root.dataset.clone = origin.clones.push(@) - 1

33
src/Images/ImageExpand.coffee
View File

@ -22,8 +22,9 @@ ImageExpand =
# make it loading in the clone too.
ImageExpand.contract @
ImageExpand.expand @
return
if ImageExpand.on and !@isHidden and (Conf['Expand spoilers'] or !@file.isSpoiler)
else if @isClone and @file.isExpanded and @file.isVideo
ImageExpand.setupVideo @
else if ImageExpand.on and !@isHidden and (Conf['Expand spoilers'] or !@file.isSpoiler)
ImageExpand.expand @
cb:
toggle: (e) ->
@ -99,7 +100,7 @@ ImageExpand =
post.file.thumb.parentNode.target = '_blank'
for eventName, cb of ImageExpand.videoCB
$.off video, eventName, cb
post.file.videoControls?.map($.rm)
$.rm post.file.videoControls
delete post.file.videoControls
$.rmClass post.nodes.root, 'expanded-image'
$.rmClass post.file.thumb, 'expanding'
@ -126,21 +127,24 @@ ImageExpand =
completeExpand: (post) ->
{thumb} = post.file
return unless $.hasClass thumb, 'expanding' # contracted before the image loaded
post.file.isExpanded = true
ImageExpand.setupVideo post if post.file.isVideo
unless post.nodes.root.parentNode
# Image might start/finish loading before the post is inserted.
# Don't scroll when it's expanded in a QP for example.
$.addClass post.nodes.root, 'expanded-image'
$.rmClass post.file.thumb, 'expanding'
ImageExpand.completeExpand2 post
return
{bottom} = post.nodes.root.getBoundingClientRect()
$.queueTask ->
$.addClass post.nodes.root, 'expanded-image'
$.rmClass post.file.thumb, 'expanding'
ImageExpand.completeExpand2 post
return unless bottom <= 0
window.scrollBy 0, post.nodes.root.getBoundingClientRect().bottom - bottom
completeExpand2: (post) ->
{thumb} = post.file
$.addClass post.nodes.root, 'expanded-image'
$.rmClass post.file.thumb, 'expanding'
post.file.isExpanded = true
ImageExpand.setupVideo post, Conf['Autoplay'] if post.file.isVideo
videoCB:
mousedown: (e) -> @dataset.mousedown = 'true' if e.button is 0
mouseup: (e) -> @dataset.mousedown = 'false' if e.button is 0
@ -149,10 +153,11 @@ ImageExpand =
if @dataset.mousedown is 'true' and e.clientX <= @getBoundingClientRect().left
ImageExpand.contract (Get.postFromNode @)
setupVideo: (post) ->
setupVideo: (post, play) ->
{file} = post
video = file.fullImage
file.videoControls = []
file.videoControls = $.el 'span',
className: 'video-controls'
file.thumb.parentNode.removeAttribute 'href'
file.thumb.parentNode.removeAttribute 'target'
video.muted = !Conf['Allow Sound']
@ -167,8 +172,8 @@ ImageExpand =
href: 'javascript:;'
title: 'You can also contract the video by dragging it to the left.'
$.on contract, 'click', (e) -> ImageExpand.contract post
file.videoControls.push $.tn('\u00A0'), contract
if Conf['Autoplay']
$.add file.videoControls, [$.tn('\u00A0'), contract]
if play
video.controls = false
video.play()
# Hacky workaround for Firefox forever-loading bug
@ -183,7 +188,7 @@ ImageExpand =
$.on play, 'click', (e) ->
video[@textContent]()
@textContent = if @textContent is 'play' then 'pause' else 'play'
file.videoControls.push $.tn('\u00A0'), play
$.add file.videoControls, [$.tn('\u00A0'), play]
$.add file.text, file.videoControls
error: ->