wikimedia/mediawiki-extensions-MultimediaViewer
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer synced 2024-11-24 08:13:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Show metadata panel immediately.

Browse source 
Change-Id: Ie71eb1d29e3863b99687a75da69fad9a1ead552c
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/458
This commit is contained in:
Gergő Tisza 2014-04-18 23:28:41 +00:00 committed by MarkTraceur
parent 3ea4703c8c
commit c304baf0ba
4 changed files with 56 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
resources/mmv/mmv.lightboxinterface.less
View file

@ -57,7 +57,6 @@
color: #333333;
background-color: @metadata-background;
min-height: (@bottom-height + 1);
opacity: 0;
z-index: 2;
}

2
resources/mmv/ui/mmv.ui.metadataPanel.js
View file

@ -742,8 +742,6 @@
if ( !this.hasAnimatedMetadata ) {
this.hasAnimatedMetadata = true;
this.$container.addClass( 'invite' );
} else {
this.$container.addClass( 'invited' );
}
};

88
resources/mmv/ui/mmv.ui.metadataPanel.less
View file

@ -20,13 +20,66 @@
}
.mw-mmv-post-image {
.animation( mw-mmv-appear-animation 0.5s ease 0s 1 normal forwards );
&.invite {
.animation( mw-mmv-invite-animation 0.5s ease 0s 1 normal forwards );
}
}
.mw-mmv-appear-animation() {
0% {
opacity: 0.6;
}
50% {
opacity: 0.9;
}
100% {
opacity: 1;
}
&.invited {
opacity: 1;
}
@-webkit-keyframes mw-mmv-appear-animation {
.mw-mmv-appear-animation;
}
@-moz-keyframes mw-mmv-appear-animation {
.mw-mmv-appear-animation;
}
@-o-keyframes mw-mmv-appear-animation {
.mw-mmv-appear-animation;
}
@keyframes mw-mmv-appear-animation {
.mw-mmv-appear-animation;
}
.mw-mmv-invite-animation() {
0% {
margin-top: 5px;
}
50% {
margin-top: -3px;
}
100% {
margin-top: 0;
}
}
@-webkit-keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
@-moz-keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
@-o-keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
@keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
.mw-mmv-title-contain {
@ -296,34 +349,3 @@
.mw-mmv-about-links {
clear: both;
}
.mw-mmv-invite-animation() {
0% {
opacity: 0.6;
margin-top: 5px;
}
50% {
opacity: 0.9;
margin-top: -3px;
}
100% {
opacity: 1;
margin-top: 0;
}
}
@-webkit-keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
@-moz-keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
@-o-keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}
@keyframes mw-mmv-invite-animation {
.mw-mmv-invite-animation;
}

8
tests/qunit/mmv/ui/mmv.ui.metadataPanel.test.js
View file

@ -210,7 +210,7 @@
} );
QUnit.test( 'Metadata div is only animated once', 6, function ( assert ) {
QUnit.test( 'Metadata div is only animated once', 4, function ( assert ) {
localStorage.removeItem( 'mmv.hasOpenedMetadata' );
var $qf = $( '#qunit-fixture' ),
@ -220,8 +220,6 @@
assert.ok( panel.hasAnimatedMetadata,
'The first call to animateMetadataOnce set hasAnimatedMetadata to true' );
assert.ok( !$qf.hasClass( 'invited' ),
'After the first call to animateMetadataOnce led to an animation' );
assert.ok( $qf.hasClass( 'invite' ),
'The first call to animateMetadataOnce led to an animation' );
@ -230,12 +228,8 @@
panel.animateMetadataOnce();
assert.strictEqual( panel.hasAnimatedMetadata, true, 'The second call to animateMetadataOnce did not change the value of hasAnimatedMetadata' );
assert.ok( $qf.hasClass( 'invited' ),
'After the second call to animateMetadataOnce the div is shown right away' );
assert.ok( !$qf.hasClass( 'invite' ),
'The second call to animateMetadataOnce did not lead to an animation' );
$qf.removeClass( 'invited' );
} );
QUnit.test( 'Repo icon', 4, function ( assert ) {