metadataPanel overrides the grow() and shrink() methods in Permission
class instance, so the text is changed also when user clicks the
"view more" link inside the box.
Bug: T71233
Change-Id: I66fe57980c6f469d86e3d52b67d01e06a3a14270
- Adds attribution variable to Image model
- In mmv.ui.metadataPanel and mmv.EmbedFileFormatter, display
attribution line instead of author and credit when it is set
- Update junit tests for mmv.model.Image and mmv.EmbedFileFormatter
Bug: T67445
Change-Id: Idfe542a1542d28cf8d27c1720ab0bd54324b2f37
I've combed through the entire codebase for keydown, keyup, keypress
and .which and I've only found one case where modifier keys are not
ignored for keyboard shortcuts.
Bug: T68329
Change-Id: I10ca2b89b9eb5addd7c706cf796331b5206d6bef
Most special pages which list images generate a caption using
various information and MediaViewer displays this caption.It should
fall back to the file description instead.
Bug: T85234
Change-Id: I5448e5de7d6f8de9852a2a845400299b6b51b8ef
Logs metadata panel open/close by scroll. When the panel is opened
via keyboard or the "view terms" button, both a normal and a scroll
opening event is logged (same for closing). When the panel is opened
in fullscreen mode, neither event is logged.
Change-Id: I09092b8b6c20e6fea03b4fe59c811d7b441ca224
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/559
Also remove the unused mmv-image-click event and fix a bug
where links got right-aligned when the panel was opened in
fullscreen mode.
Change-Id: If538ac420da4aae3908ac96978491f89c5b53493
Bug: T76029
Also make sure part of it is not a link to avoid two links
ending up next to each other + fix a small documentation bug.
Bug: T76465
Change-Id: I128ec7034b0bb9784fb78d1a5ce90d195555848e
* use the same text for plain and HTML format
* use the same text whether or not a deed URL is set
Bug: T76030
Change-Id: Iea53766b2e2031206d707838551bd82dba29e8c4
* isOpening was calculated too early, so whenever the panel was
partially open and opened up fully via the forceDirection
parameter of toggle(), it was logged as the wrong direction.
(I think the only way for this to happen is via clicking on
"view terms" while the panel is partially open.)
* scrolling did not go all the way to the bottom when text was
truncated as the target position was calculated before untruncating.
* panel position was not preserved in some cases where it could have
been because the attempt to restore it happened before untruncating
the text, when the panel was not high enough.
Change-Id: I47a96d42c80e0a00d95023526ede3b5bbf18a52c
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/983
Several related changes to text truncation:
* remove untruncate-on-click so untruncated text is selectable
(untruncate will happen on click to the canvas are instead,
to be implemented in a followup patch)
* simplify the truncate/untruncate logic to be wholly based on
panel open/close state, and fix a bug which made panel state
and text truncation state inconsistent when prev/next
navigating while keeping the panel open.
* remove several variations on scrolling the panel in favor of
using toggle + remove some other unused truncation-related code
* fix a minor unrelated style bug which made truncate/untruncate more
jarring than it had to be when the title was short by making the title
higher on panel open even though the text did not use the extra height
* align title ellipsis better
* make sure clicking on the truncated title works even if the click is
between lines and so misses the inline box of the <span>
Change-Id: Ie0b3afb3833102b6a9812cb7fe2df78ec5eb8396
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/983
OptionWidget constructor now accepts a 'data' config option instead of
a separate 'data' parameter.
See I7ee78b6d.
Change-Id: Ie54e9db788cbe846cd2d173498c7fe17bafc126e
This is complete, but it would be better if the HEAD request
was actually aborted by Varnish when the viewDuration parameter is
present, or if the hit pointed to a script that does that.
Change-Id: I66cafd97427756411e967de1901324af2215e3ae
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/1001
Images inside the current WLA banner are getting picked up, spamming
all Media Viewer users with large-scale couscous imagery.
Couscous is nice, but too much couscous will make you bloated.
Change-Id: Ie5726be6de97da13e8dc650031285f899c2d6440
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/1011
This will be needed by Erik Zachte for compiling per-file image view data.
Since Media Viewer does preloading, it skews the HTTP request-based
statistics. By marking image requests coming from Media Viewer,
it allows us to remove that bias.
Change-Id: Iac8e7770c1a379691547de4b6d47b7d54467f54d
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/1002
These happen due to certain DOM changes. It's a hack in Chrome's
code and it seems to have gotten worse with a recent Chrome update,
causing this bug. Thankfully the fake event can be identified easily.
Change-Id: I1688054f5d57147a445db5116a6aafeb1f49ddc4
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/989
Also fixes popup texts which should have been updated in the parent commit
and the panel opening mechanism which did not work when the below-the-fold
description box was display:none-d.
Change-Id: I5fc37429a7dc7a8f1517fa42375cd140d7d11674
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/589
* when the caption is available, use it as the image title
* otherwise, fall back to description if available
* otherwise, fall back to filename
* if both caption and description are available, show caption as
title and show description below the fold; otherwise don't show anything
below the fold.
Change-Id: I9738ca46620d7cf3b30f6e46790a37966d4b9eaf
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/589
Due to differences in line-height, author and license text were missaligned.
Some adjusment has been done also about icon position.
The end result can be viewed at http://i.imgur.com/x7KEjDE.png
Change-Id: Ie369d7ab6f1230b1b795ce2b63cdba1401d052dd
The right data column has been adjusted to:
* Make the position of license info consistent when moving through images.
* Make the position of the right list of data consistent when the panel is open.
That is achieved by adjusting the license position in a different way depending on
the status of the panel (open or closed).
Change-Id: Ia1a54d400e9810119d5222a9da732e099d81d9cf
With touch devices, scrolling may get negative values (e.g., when
scrolling beyond the page limits). That kind fo scroll was triggering
the aplication of the "panel-oppen" class producing unintended UI changes.
With this patchset the class is only applied when the panel is really opened.
Change-Id: I183d8c725373ab29802650b53e26fd4820dbf499
* make top of "below-the-fold" be actually above the fold
* put all above-the-fold content except title and more details button
into that area
* kep below-the-fold area in fullscreen mode when title/credit gets untruncated
* increase title length to 180 (140 before reducing font size) - works nicely on
my 1600x900 laptop
* remove old styles which were intended to make the button smaller when the
panel is close but were mostly broken anyway and only caused the button to
twitch
To avoid redoing all the size calculation logic, we cheat and use a negative
margin to pull the below-the-fold content above the fold.
Change-Id: I18d7bdb7dbbdfb8201c0d66257731febfac31263
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/833
* move license and terms link from title area to attribution area
* remove some ineffective styling for elements which have already been removed
in earlier changes
Change-Id: I5bd41e337a4c8133bfa27e4c4d03162b2d6e35bb
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/833
- Fixes the bug where the options menu wouldn't open if media
viewer was reopened
- Adds human-readable console messages for the options actions
- Makes the tooltip a tipsy one like all the other buttons
- Fixes the tooltip copy, it was referring to "previews", which we
said we wouldn't do anymore, in favour of "Media Viewer"
Change-Id: I1590f9501cc6c406cc1f466b414062d4d6435c1b
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/963
Includes some small refactoring of the bootstrap code to open
MediaViewer so it can be used in a more controller-like fashion, and
removing the .mw-mmv-filepage-menu class which was added in the parent
commit but had no effect since the module was not loaded by default.
Change-Id: I2e7405e694af96e8eca4fcc839b60306232ead01
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/719
On full-screen mode the panel appears on hover over the image.
This patchset applies the same shadow as when the panel is open to the full-screen panel.
This is done to communicate that the panel is ovelapping the image.
Change-Id: Ia76f2ace6a424bbd26d4d3d43ed213b98ec91006
* create a resize-end event which fires 100ms after resize ends
(or pauses)
* move slow resize callback (fetching new thumbnail from the server)
to resize-end
Change-Id: I1c1217ea43ffade4cfaf0c03f24574d0ebfee080
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/898
This patchset avoids the more button to become tranlucent due to som legacy styling.
The margin is also slightly adjusted to center the button in the panel.
Change-Id: Ic3936e90c891ded71d2954cd0e591012fb7bb33b
Missed this small issue - doesn't affect actual behaviour but will make a
confusing cursor display in some instances.
Change-Id: I40c3cf0c9596f40983f090974044bcd6f7d203d3
I decided to fix them all at once since we're merging all of these
patches together anyway. I can pull changes into other patches if
absolutely necessary.
Also fixes the dialog open/close handlers for the canvas click event,
and leaves the reuse dialog open on next/prev.
Change-Id: Id1564425442aec72e5e41f2f80986d8a104dd92c
For files with long credit information, part of the text can get hidden
with the down-pointing chevron.
This patchset adjust sizes and margins of different elements to reduce that overlap.
Change-Id: I03f3b84d4ad0f754a0a20f2e78016711164ef433
In order to communicate that there is more content below.
This is related to acceptance criteria #8 of story #830.
For more details check: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/830
Some further improvement to consider:
- We'll need to adjust the "more details" button margin to make it fit better in the current above the fold area (0.55 em instead of the current 0.7em).
- If the panel is open, and the user clicks outside of it (e.g., over the image), the panel should close.
- We may want to eliminate the pointing-down chevron if we don't want it to conflict with the big "more details" button.
Change-Id: If14886647aa0660a524a720e8d223eca655d5f3f
Above and below the fold areas of the panle are given slightly different
shades. A separate patchset can make the below the fold 15px visible
to increade discoverability.
Change-Id: Ib38f63131c2060002da60296f7a0d2eba9f3168d
Due to a jQuery bug, errors in local code (gadgets, user scripts)
can cause onready handlers to not be executed. For MMV this causes
catastrophic failure, with a black screen of death on exit.
This change makes sure that the setup code necessary for Media
Viewer to work is executed at latest when MV is invoked, even if some
onready handlers were skipped.
Opening MediaViewer via a hash-URL will still not work if the onready
handler fails, but that's hard to avoid and it is not a catastrophic
failure anymore. This change can be reverted when bug 70772 gets fixed.
Bug: 70756
Change-Id: Ida3b780791bc9dfec29303567d33e3aa4f44dd81
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/891
Experimental revert of commit
d6c142fd2b to see if it caused
the weirdness in the versus charts:
http://multimedia-metrics.wmflabs.org/dashboards/mmv#media_viewer_vs_file_page-graphs-tab
That commit affecting file page load times is extremely unlikely.
A change in the test environment which exactly coincided with it is
equally unlikely. This is an easy way to tell which is the case.
Change-Id: I3581abd36d25494ca294db892480e25f6f4c5a73
OOJS polyfills Object.create now so there is no need to check for its
existence before loading OOJS-dependent code. On the other hand,
MediaViewer uses SVG icons extensively and the interface cannot be used
if they don't show up.
Bug: 70553
Change-Id: I716e12d4061cfc5c64ccca4563bc30a4394494af
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/863
This works because the title doesn't exist if there's no caption and we
won't get to this logic branch if the thumbnail is an explicit |thumb|
with a caption already.
Refactored caption-fetching a bit.
Change-Id: If84c890e7b71880db640a0993f8e3d6cd59951b8
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/513
Using the "complete" property worked for the file page, but not
for media viewer because change the src of an img doesn't reset
the prop.
This introduces a custom event that cucumber can listen to in order
to know when the full resolution image had been loaded in media
viewer.
Change-Id: I40875166e70badbb35106c4a3536c706a7c815b4
Ensure that changing the preference via the quick link and
Special:Preferences is stored identically in the DB.
Change-Id: Ia37da1c6bfbb3edf0eba56f01105e4a5f3a5e4ba
OOJS uses es5-shim but does not use es5-sham so the following ES5
functions are not polyfilled:
Object.getPrototypeOf
Object.defineProperty
Object.getOwnPropertyDescriptor
Object.getOwnPropertyNames
Object.create
Object.defineProperties
Object.seal
Object.freeze
Object.preventExtensions
Object.isSealed
Object.isFrozen
Object.isExtensible
Grepping on them shows that Object.create is the only one in use in
OOJS, so checking for its existence should be enough to ensure that
OOJS works in the given browser.
Change-Id: Icf54a9c35b3599dd1831c10ffcd9f15573dc8b00
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/813
Categories are implemented via galleries, so they have the same
markup, but while galleries have human-written captions, category
captions just contain the file page.
Change-Id: I6a8548fe696418befc789e20b114778fc724c314
Add position:fixed to the metadata panel to stick it to the bottom
of the page.
This reverts the change in Ic37b4150288055c3fae8d22919ed7b1249db1f09
I can't recall if there was some intent behind that or it was an
accidental deletion; but this seems to work fine in Chrome and
FF.
Change-Id: Ic5fdce5fb3d6884df782f8bc9ec5c9a5c67edbd6
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/805
Changes document title (which is shown in history navigation)
to include the image name.
Bug: 67008
Change-Id: Id1b030f2b984571fb0877e35db2ca2ccc86f0130
Automatically reveal/hide full text as metadata panel is opened/closed.
Also makes metadata open/close a proper event.
Changes scrollTop calculation for the fully open metadatapanel so it is not
confused by the size of the panel changing.
Also rename MetadataPanel.$controlBar to $aboveFold (that field was missed
when the corresponding CSS class got renamed).
Change-Id: I7e66ca0f45c2188dab4b78508ad7f91154187de4
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/396
Reveal the full title + author + source when the user clicks one
of these, and make some related changes:
* expand the above-the-fold part of the metadata panel so they fit
* make the stripe buttons smaller and hide their text
* scroll the panel up if necessary
* modify tooltip texts when there is more text to show
Change-Id: I304297bc5e7be7b16e2fc4bde66ac19641b00029
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/396
* make Commons icon slightly larger than "use this file" icon so
it seems to be the same size (since the Commons icon has more
whitespace)
* re-add size adjustments for dynamic icon; IIRC this was needed
to make Wikipedia icons look good
Change-Id: I6cc2c66beb1d270c9367446661ef14139afa814e
Check for tipsy-ness, and for the existence of the opt out button. The
latter doesn't affect prod, but the former might.
Change-Id: Ia5ae8b160626d27750cb3e4938c27a461b9f0c64
I've tested a wide variety of old browsers on sauce labs and only
the older IEs reported "false" for support_onhashchange.
I think the $.browser.msie check was defensive in the first place,
there's no reason why a browser that doesn't support the
onhashchange event wouldn't benefit from the iframe trick.
Change-Id: I5b3a83118ef870237a54a6d67dd930617987abf2
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/590
The following visual adjustments have been made:
- Make color similar to other icons in the metadata panel.
- Highlight on hover to convey interactivity.
- Adjust to the "visual center". The icon was matematically centered, but since the angular separator adds empty space to the right, a 2px correction has been added so that it looks centered taking into account that extra space.
Change-Id: Ib4db723b38a8d6fc9528fe86756220b6525da95b
Avoid ugly selection colors when people double-click the dropdown
button.
(Why would people double-click the dropdown button? Not sure, but
I did, so...)
Change-Id: If505c7b62ca501a492aa7f85d2f6c92790ecd6dd
- Split button has been adjusted to have the same height on both parts (button and drop-down)
- The attribution panel has been adjusted to add hover states and adjust sizes and colors
Change-Id: I3ba80776add6dbca9f0b096dfe7ad4a8779f1a0d
The invite animation has been adjusted to:
- Make the panel movement more subtle (reduced distance and length)
- Add an animation for the chevron and coordinate it whith th panel movement.
Change-Id: I8fbd01d23fd9bf74fc272c40acd2663f5907326a
* partially undo the RTL fix from mingle #512 which looks bad,
and use four-value syyntax for background-position instead.
* use noflip on :before rule as :before itself is not flipped
* handle better the uncertainty resulting from image name
usually not being RTL
Change-Id: If4aa7240e9bee5c0a06f1785edb9c72964dfc60f
Rearrange the above-the-fold part of the metadata panel so that
the link to the file descriprion page and the button for the
download/share/embed widgets are easier to find.
One gotcha is that favicons are blown up to 32x32px (a small icon
in the middle of a big empty space would really look ridiculous)
so if a site uses 16x16px favicons it will look pixelated.
None of the WMF sites do that though, and if anyone else does, they
should just fix it, 16px favicons suck anyway (e.g. not retina friendly).
Change-Id: Icce12174b6ed89731fe75f8069c0b4a2b7161a34
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/732
- rearrange DOM structure of above-fold part of the metadata panel:
- rename .mw-mmv-controls to .mw-mmv-above-fold
- the above-fold part is a single positioned div now, with height
explitcitly set
- less LESS gymnastics, above-fold height is a single variable
- add paddings to the p elements instead of the containers
- make all title elements align to baseline (except the logo which
would look horrible)
- discard some CSS which was superfluous
- overspecified sizes/positions
- some top/bottoms for staticly positioned elements
- get rid of the .mw-mmv-drag-affordance div, since a full-width bar
wouldn't really make sense on the bottom of the above-fold section
- flip the chevron and place it to the bottom of the above-fold part;
add colors etc. per spec
- fix stripe button horizontal spacing
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/706
Change-Id: Ic37b4150288055c3fae8d22919ed7b1249db1f09
- fix sizing error so that the image actually fits the screen
- hide some stuff that didn't work properly in fullscreen anyway
(commons/survey buttons just exited fullscreen, reuse menu
did not fade with the metadata panel, view terms link didn't do
anything)
- move metadata scroller CSS rules into metadata scroller LESS file
- disable invite animation which broke the opacity transition
- move opacity transition to the main metadata panel element;
remove background-color transition which is pointless since there
is an opacity transition
Change-Id: Ib26160cc6431ea007dab8441c634d0faf9ee1d0a
This uses best-effort logging (like most other links do), not the
blocking call that's used by the other file page link, since
analytics folks had severe misgivings about that.
Change-Id: I35204420c834fa4fce3dcf81403cb78b92811caf
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/726
Instead of setting the parent's height as max height of the
<img> element, find the first parent which has a non-automatic
height (that would be .mw-mmv-image-wrapper).
With the old structure, the height of the parent element could
be determined by the height of the image, which would then be
written back into the max-height of the image, messing up the
aspect ratio. I did not see this in the wild, but it was easy
to reproduce by changing the timing of the resize handler (in
particular, I tried to call the resize handler before loading
the new resolution, to make the UI more responsive, and ran
into this problem). This cannot happen anymore now.
This also fix a bug on some browsers (IE 10, maybe iOS Safari)
where the size of the image could be slightly larger than the
available space, and the bottom of the image was obscured by
the metadata panel. I am still not sure how exactly that
happened, but it was related to the <img> parents with automatic
heights having incorrect height. After making sure the <img>
has a max-height derived from an element with non-automatic
height, I cannot reproduce the bug on IE 10 anymore.
Change-Id: I193aefc42e6d6072717643659a9e4c0c8b7c7e93
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/698
Bug: 66244
This includes images where the <img> element has that class
(achievable with [[File:Foo.png|class=noviewer]]) and also those
where some parent element has it.
Change-Id: I666be026828ea9ecb6e8c93d3f5ad1e3c190f81e
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/511
Chevron icons for the new design of the chevron.
Beware that the active version of the chevron is white since it is assuming
it will have a blue background.
Change-Id: I3d8fa040bfecc219a735565d5ebee8e283691bee
Mark pointed out that using localized namespace names would cause
problems when users try to reuse images across wikis with different
content language. Reverting for now.
This reverts commit 59b8e5c82a.
Bug: 64710
Change-Id: I4b8b46871a1c80bce20e4017aa8adcfe3041bb4a
Previously 'up' brought the panel up, and 'down' brought it down,
which might conflict with expectations on scrolling. Up/down keys
now move the metadata panel to the opposite state, no matter what
the current state was.
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/697
Change-Id: I53079d81042afb86354bf44e9dfd662adf1576cb
- open.svg icon added for the "view in browser" feature form the share panel.
- expand.svg icon updated for better icon consistency (spacing also adjusted in the CSS)
Change-Id: Id6176d8f9b4884c9aabde05f1639500d3349f9a7
:not() only works with simple selectors, not composite selectors.
This caused problems for people with customized skins.
Also, this way we only require support for > (wider) instead of
support for :not.
Also fixed footer id and added monobook for good measure.
Bug: 66326
Change-Id: Ibaa0861aff711723dd336eeaa8c12e73110b1c3b
The jQuery update broke onDomEvent('focus') in OOjs UI. This is a
workaround which fixes the issue by binding on the input/textarea
elements directly, instead of their parents.
This introduces the annoying side effect that the metadata panel jumps
a bit when the embed HTML text is selected. (Just for that one, yes.
Weird.) Still better for now than no selection at all.
Change-Id: Ifa4c0600d7b4c0c64487596cbcabd5b4f4a12a19
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/638
Has issues:
- needs dependency injection
- needs to be DRY
- should not load mw.eventLogging when we are not in sample
Due to urgency this will be fixed in another commit.
Change-Id: I0df067a619109a7c945f82c8d33fa2e621217f0b
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/619
The invite animation has been made more prominent and the chevron
is highlighted. this only applies until the user opens the
panel for the first time.
Change-Id: I91d1b9bffaf302890f63b741313aa47cc4beef24
Per the design meeting, we are abandoning this feature for now - there is not enough time to ensure it is of acceptable quality.
This reverts commit 4329d453ec.
Change-Id: I27c113ffecb617d442557163722ea5181ed0b2f4
Just a link to the full-size file for now.
Since the link must be to a PNG/JPEG/GIF (so possibly a thumbnail),
and we want to cap the size, we might need to get the URL from the
API, but we need to open the new window right away to avoid popup
blockers, making this patch quite complicated.
Change-Id: I9ce9d2a2d27b75470eae2806d9f9ce2f95f4dac2
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/588
- Fix JS error on pushState
- Fix blur issue where blur(0px) filter would blur anyway
- Fix wrapper sizing issue where its size would be 0 when measured
Bug: 65225
Change-Id: If9279cd56f55f71f261ec54dda8228194988b9ae
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/597
Do not log metadata-open when panel is already fully open and the
user presses the open key. (Same with close).
Also a completely unrelated code simplification.
Change-Id: I1f26b8669aa496d68b61d9a432430bf0864e8533
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/559
This tries to fix a number of related issues:
* the blurred thumbnail was visible for a split-second sometimes
when switching back to an already-loaded image. (Presumably when
JS was sluggish enough to take more than 10 ms to execute.) We
now check whether the promise is pending before showing a placeholder.
(More generally, a lot of unnecessary logic was executed when paging
through already loaded images, like displaying the placeholder, so
this might make the UI a bit more responsive.)
* the blur could get stuck sometimes - I have seen this a few times,
but have never been able to reproduce it, so I'm only guessing, but
maybe the timing was really unfortunate, and we switched back less
than 10 ms before loading finished. We now remove the blur on every
branch, just to be sure.
* adding a progress handler to a promise might not have any immediate
effect, so when switching to an image which was loading, the progress
bar reacted too late. We now store the progress state per thumbnail
so it is always available immediately.
* the progress would animate from 0 to its actual state whenever we
navigated to the image. The change on paging is now instant; the
progress bar only animates when we are looking at it.
* switching quickly back and forthe between a loaded and a loading
image resulted in the loading image becoming unblurred. This seems
fixed now, I'm not sure why. Maybe the "skip on non-pending promise"
logic affects it somehow.
Also removes some unused things / renames some things which were
confusing, and makes an unrelated fix in the image provider, which kept
amassing fail handlers.
Change-Id: I580becff246f197ec1bc65e82acd422620e35578
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/489
- this avoids an issue where the arrow wouldn't point to what we
want when near the edge of the screen
- this avoids an RTL issue where the bubble would go outside of
the screen
Bug: 64258
Change-Id: I1cc9683af2743b093a45b19d7142fe7e5e66423f
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/485
The code to replay clicks and clean up the handler was called after
processing each thumbnail, instead of just once at the end.
This might have caused many subtle issues such as clicks on any
but the first image not replaying correctly; more problematically,
of there were no MediaViewer-compatible thumbs, the handler was
never cleaned up and the clicks were never replayed.
Besides fixing that, this commit also adds a try..finally wrapper
so that the click replaying is not broken even if there is an error
in the thumb processing code. This might or might not be a good
idea. The internets say that try..finally without a catch causes
errors in IE8, but only if it is not wrapped in another try..catch,
so we are probably fine. (Adding a catch which just rethrows the
error would be an alternative, but it messes up stack traces.)
Change-Id: I2f645762103274c92c15a0d4b595d18d93b08415
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/497
Bug: 64345
With latest refactorings, the animatin looked like a glitch.
The position of the panel has been adjusted to (a) make the initial
position the same as shown while the progress bar for better continuity,
and (b) make the move more noticeable by increasing the distance the
panel moves.
To test, clear the local storage variable mmv.hasOpenedMetadata
Change-Id: Ie3ed29826fa15bf4c6b38f0fc8bde4bd84563fb9
Solves the bug, and makes the code slightly cleaner, but it
still does not inspire confidence (e.g. use of viewer flags
by a bunch of callbacks that can run for a background image).
Also, the tests seem underspecified.
I'll follow up with some more refactoring.
Change-Id: I2557abcec173691ffce21185bf1a939f1644ba8c
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/489
processThumb() is a mess. This change is kept small since we might
want to backport it per the bugzilla comments; I might follow up
with some refactoring in a separate commit.
Bug: 62518
Change-Id: I1f916b88fe1b667c6c7e51c9bdca186d4aa2ef2c
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/338
Cache API responses, both on Varnish and in the user's browser.
The imageinfo request is not cached, since that would make it very
hard to test metadata template edits. Everything else is cached for
one day.
Change-Id: I9149cf40d4448a424073eefd1eb442c70c977687
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/435
Not convinced this is a good thing (file description page still
opens in same window so it is somewhat inconsistent) but suddenly
leaving the lightbox to show the deed feels like a very unintuitive
behavior to me.
Change-Id: I2cca3e4241fd1bb2848c11cf425aa75aad8c4a30
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/472
Works, but awkward - the extension name changes a little later than the button
text itself. This is hard to avoid since we don't know beforehand
what the thumbnail type is - we have to wait for the API request.
(We can't do thumbnail URL guessing here since we cannot catch the 404 error.)
In general the whole API handling here is not so good, with a separate API
request going out when we should just get all size options in a single request,
when the user opens the reuse panel.
Change-Id: I502b7cb4e99d8af348d7d1967eb8343ec0f926fe
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/471
Fullscreen clicks are only about 5-10% of image views, and there
are a lot of complaints about the app being slow, so until the
speed can be improved in other ways, there is no point in
preloading for the fullscreen mode. Unlike the normal preloading,
it is not queued, and it slows down the normal image loading.
Bug: 64135
Change-Id: Ic145c8a1d5c3729f684e2f6c96f7d84869ef4087
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/474
...since there probably still is one, and our failure to parse it
just makes it more important that we direct the user to the file
page.
Change-Id: Id31f95021f059ccf4bf9893b1146f3807dcabdcb
Given a sample thumbnail URL and the original width/height
this provider tries to guess the thumbnail url for a given
size.
Change-Id: I2966b60978ab763864475851d8a79370bd422dc4
Which would cause the image to never appear, even when reopening
Media Viewer. The source of the issue was an uncaught exception in
ThumbnailWidth.
Unfortunately this cannot be covered by E2E because the image
loads too fast in that context, and cucumber/selenium doesn't
have time to catch the placeholder.
Change-Id: I9386f6e857a7974166ddb5eeb7ea731d943eddcf
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/450
* deduplicates URL generating/parsing code
* gets rid of spaces in URLs
* fixes error for file names with / in them (in case they exist;
current MediaWiki seems to disallow such names anyway)
Change-Id: I5aad43f6af1b99523c597c39befcc9db1ecab83a
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/371
Adds a Route class hierarchy for various URL schemes and a Router
class to convert Route classes to and from URLs.
Right now we only have two(-ish) schemes, but in the future we want
to be able to show related images which are not present on the current
page and need shareable URLs for those as well; also we might want
to specify other things in the URL than the current image (the reuse
box being open was one thing discussed); this will be a good framework
to add features like that.
The MainFileRoute class will be used by #416.
Change-Id: I489126a0ada37f91a22a2f48a4e686140a28d162
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/371
There used to be a CSS trick with the order we added things to the
page and removed them from it, but it doesn't seem possible anymore
with the new order of execution, with the overlay appearing
immediately and being taken care of inside bootstrap.
The main cause of the bug, however, was the hash reset happening
after the interface was closed.
Doing the scroll restore with jQuery.scrollTo is more future-proof
and testable in QUnit.
Additions were also made to the cucumber E2E test because QUnit
alone wouldn't have caught the hash issue.
This also cleans up custom events a little and reintroduces
pushState on browsers that support the history API.
Change-Id: I63187383b632a2e8793f05380c18db2713856865
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/439
Bug: 63892
The download button used a dashed black line to separate options.
It has been changed to a dark green line to better fit the style.
Change-Id: I3224027b69c4c1e5cf2568aed8f4f50ee351c369
The CSS to make the favico twice as big was looking horrible in
Firefox and possibly other browsers. Since we're already
special-casing commons, let's apply a proper SVG instead of the
favico.
Change-Id: Ie32302342eba7aa37bd310c013a9f4d7f9ae187e
Two images contained a white background that was limiting their
use over other background colours.
Change-Id: Ic61e0d223ed927968344b132dbe67952c80bbe28
Make original file width/height part of LightboxImage, and pass it
to the image loading function.
This adds a bit to the big steaming pile of technical debt that is
mmv.js. To be cleaned up later.
Change-Id: I84b8ae75cd1cc3e94c6cf03d174473764cfbf86f
maybeDisplayThumbnail is invoked even when the survey is disabled,
which results in calling functions of a null object.
Change-Id: If7a48349e22069f91af20d8c4bb6a82b7339bd66
Also fixes other issues:
- Some code in mmv.lightboxinterface.js wasn't doing anything
- Canvas buttons were being added to the wrong element
- Several CSS rules were being declared twice, a remnant of the multilightbox days
Change-Id: I6ffa1f6a989964d3863aa9dbeb332c0e59dff2e6
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/409
Errors which were early enough in the life cycle to completely
block the lightbox from displaying were so far invisible to the user.
We display them in a small popup using the core messaging functionality.
Change-Id: Id04fe5d3b54703e24cd216910b15cc8bae786434
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/414
To achieve consistency with the icons in the Media Viewer panel,
the following has been adjusted:
- Colors onf the "share" icon to match the rest of the icons (updated to the new gray values of Agora).
- Size of the Commons icon has been adjusted both in the SVG file and when it is added in the LESS/CSS. Due to the different aspect ratio of this icon, extra spacing has been added to make it visually fit.
Change-Id: Ic14a869ea96ea1a8202c9988f0c5d330ba3e9a70
For download button and size drop-downs, the size labels
have been set to small and normal weight (in the download button,
other rules made it to be bold if no weight was specified).
Change-Id: I7511b307a8459d6e4a01f0b9540528046ad2be8e
This fixes three issues:
* the overlay way multiplied during history navigation, but only
the last one was cleaned up on exit
* the overlay was not cleaned up when loading a #mediaviewer URL
with an invalid file name
* the overlay was not cleaned up when there was an error creating
the viewer object
This is a quick fix, and does not change the fact that
bootstrapping is an unmaintainable mess which should be cleaned up.
Change-Id: I2838e5e709e7c7308b0a5b27eca24a2584d0a01e
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/414
The way categories were handled made it impossible to add anything
after them (they always ended up as the last child of the parent
container). This commit fixes that, and also moves the repo link
behind them (as required by #270).
Change-Id: I7c561c43897054e60028bd524d8ad5ea85f39e36
Only show the survey button if the user's language matches and the site is
enabled, and log which site we are on.
The corresponding site configuration commit is
Ic07432649906890785769ce5127761e2c84316e2
Change-Id: I575bb286f4289489b80505c901f5a9e7aeecec8b
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/261
* intializeSelection was removed
* selectItem is replaced by chooseItem, sort of
(selectItem does not always update the UI, I think?)
* remove old workaround, bug was fixed upstream
This fixes the download button and unbreaks lots of unittests.
It does not fix the "Loading" text in the embed tab.
Change-Id: Iec7bf9ad5b516001231c7ba46fda962671aaddd8
- error caused by select() called during focus event
- HTMLElement not existing in older IEs
- filter rotation for older IEs causing black background bug in IE9
- IE9 lacking progress would have its progress bar never reach 100% and disappear
- Handle e.which value for clicks on IE < 9
Change-Id: I5727ef3f2a9f9aa77eac930f93320e6ce5964c78
Also make sure that the reuse dialog is positioned right, no
matter where its button is.
Also fixes some minor documentation problem with mw.mmv.ui.canvas
which I noticed in the process.
Change-Id: I86feed07738ebef012e63861ed909f3449b85a53
An empty download attribute means the file name from the URL is
used; any value would override the default file name.
Change-Id: Idf1d78c4b4570eb7ccd58b5da7d5ce10cfd91b70
Also do a bunch of refactoring to:
* keep LESS rules in more sane locations so it is not as hard to get an overview
(most of the metadata panel rules were in mmv.less)
* move mmv.mixins.less up one directory as it is not specific to the UI
* move the SVG icons as all of them were related to the UI
* remove the marging-right hack which was used to keep the title text from
overflowing the button; instead use a float and overflow properties to make
sure text that is too long gets hidden
Change-Id: Icc8ea2e766be67d86ae98c734721b2185bd6c36e
Fix of I37a6da620157b9254cdc44eca8b7bd482491e916, see bug 59234
and Ic9fdd081003b694dbd7e413ca25fffe782b912b5 for background.
Fix was done using the script from that commit.
Change-Id: Ic5084f09376ce8107b91cb5651f465958361368a
I think this takes care of all the different mutations of
weird states that happen when going from a small to large
images and transitions in the middle, see card/386.
Change-Id: I80527d746614c0bbda7a1084061d292e5d6394a8
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/386
* Following design, use split button to display a pulldown
menu with possible image sizes. The download happens by
sending the special "download" parameter to the server.
* Offer link to preview image in the browser.
Change-Id: Ic9d895fead04c9128186c7376a0bb09f3596335c
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/79
At the moment issues in core are preventing Media Viewer
from working on IE < 9. Let's disable it in those browsers for now.
Change-Id: Icdd29f3c00fb8eeb3d463e8b8718d54d6cd01a23
With apologies to anyone who gets a hundred merge conflicts
because of this :)
We had several different prefix styles (mlb-, mw-mlb-, mw-mmv-,
mw-mmv-mmv-, a few unprefixed), which was getting annoying,
and will be confusing to wiki editors who are trying to figure out
where a given style comes from. Such changes are better done before
going live because it breaks all local CSS tweaks on the wiki,
so I am renaming things now (also removing some stuff which wasnt
used anywhere).
Change-Id: I00447a25f0028e234169c6db941bedc99622eb8d
I went for this option because it was the fastest to implement.
I think we should wait until we make the change to core to expose
image dimensions before we consider switching to another strategy.
Change-Id: I61c9342a2d6d6fc24a24e0988b3cf7f9a06859a2
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/248
Less misleading as we have lots of buttons, and I plan to add a new
button class for the Commons/survey/reuse thing.
Change-Id: I74194e22e9066c58f9c1eba57629458b2b9148b5
Adds site link, license link and long name, replaces internal license name
(we don't have it for most licenses) with short name.
Also fixes some problems in previous changesets that I stumbled on,
renames things to be more consistent/less misleading, and makes
EmbedFileInfo a thin container for existing classes. (That results
in a lot of Demeter's law violations, but it means one less model
to remember, which is a good thing since our property names are
often not very informative (e.g. EmbedFileInfo.url and
Image.url which had completely different meanings))
We always have the site information for embed texts (comes from the repo
API); that part of the tests was pointless, but now that EmbedFileInfo
depends on Repo they became impossible to maintain, hence the
deletion of half the test cases in getThumbnailHtml().
Change-Id: I94e1d0aca14e2a7d5fad983412090add8ad6bfa3
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/369
This takes care of several minor annoyances:
* centralizes all the text processing functions which have been
floating all around the code, and adds proper tests
* filters out invisible elements (sometimes used for metadata)
* avoids merging separate words on HTML->text transformation
* adds caching since doing all this transformations could be
processing-intensive for big chunks of HTML. (This might or
might not be a good idea. I haven't done performance tests, so
this might be premature optimization, and increases memory use.
OTOH these functions are often called in situations where an
immediate UI response is expected (such as selecting a size
from the list) so even small delays would be perceivable.
Bug: 63126
Change-Id: I1ef1e3a33efdfea17612df00da6b629bf39e07aa
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/388
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/369
