Browse Source

fix(filmstrip): set SmallVideo styles instead of using animate

jquery animate during animations sets an element's overflow to
hidden and then back to the overflow declared before the start
of the animation. If multiple animations are fired, then the
overflow could be set to hidden permanently. No calls
to Filmstrip#resizeThumbnails have animate set to true, so the
animate call is not even needed.
efficient_tiling
Leonard Kim 7 years ago
parent
commit
f8537dde6b
1 changed files with 15 additions and 17 deletions
  1. 15
    17
      modules/UI/videolayout/Filmstrip.js

+ 15
- 17
modules/UI/videolayout/Filmstrip.js View File

450
 
450
 
451
             if (thumbs.localThumb) {
451
             if (thumbs.localThumb) {
452
                 // eslint-disable-next-line no-shadow
452
                 // eslint-disable-next-line no-shadow
453
-                promises.push(new Promise(resolve => {
454
-                    thumbs.localThumb.animate({
455
-                        height: local.thumbHeight,
456
-                        'min-height': local.thumbHeight,
457
-                        'min-width': local.thumbWidth,
458
-                        width: local.thumbWidth
459
-                    }, this._getAnimateOptions(animate, resolve));
460
-                }));
453
+                thumbs.localThumb.css({
454
+                    display: 'inline-block',
455
+                    height: `${local.thumbHeight}px`,
456
+                    'min-height': `${local.thumbHeight}px`,
457
+                    'min-width': `${local.thumbWidth}px`,
458
+                    width: `${local.thumbWidth}px`
459
+                });
461
             }
460
             }
461
+
462
             if (thumbs.remoteThumbs) {
462
             if (thumbs.remoteThumbs) {
463
-                // eslint-disable-next-line no-shadow
464
-                promises.push(new Promise(resolve => {
465
-                    thumbs.remoteThumbs.animate({
466
-                        height: remote.thumbHeight,
467
-                        'min-height': remote.thumbHeight,
468
-                        'min-width': remote.thumbWidth,
469
-                        width: remote.thumbWidth
470
-                    }, this._getAnimateOptions(animate, resolve));
471
-                }));
463
+                thumbs.remoteThumbs.css({
464
+                    display: 'inline-block',
465
+                    height: `${remote.thumbHeight}px`,
466
+                    'min-height': `${remote.thumbHeight}px`,
467
+                    'min-width': `${remote.thumbWidth}px`,
468
+                    width: `${remote.thumbWidth}px`
469
+                });
472
             }
470
             }
473
             // eslint-disable-next-line no-shadow
471
             // eslint-disable-next-line no-shadow
474
             promises.push(new Promise(resolve => {
472
             promises.push(new Promise(resolve => {

Loading…
Cancel
Save