Commit graph

337 commits

Author SHA1 Message Date
Gergő Tisza 3a18515163 Replace filename with caption/description
* 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
2014-11-11 15:33:15 +00:00
Pau Giner 16098d98ce Align text and icons on the grey area
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
2014-11-06 17:48:42 +01:00
Bartosz Dziewoński 9a5b604537 Change OO.ui.InlineMenuWidget → OO.ui.DropdownWidget for OOUI upgrade
Result of I7714116 in OOUI, pulled into MediaWiki in Ifb7ffb1.

Bug: 70968
Change-Id: If039d3706ab653482ce4614c5643ee29ba0766ec
2014-11-01 01:06:38 +01:00
jenkins-bot 6e79ad51f1 Merge "Display a placeholder text when author and source are missing" 2014-10-31 09:41:30 +00:00
Pau Giner ea244e8c15 Layout adjustment for right data column
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
2014-10-29 20:17:08 +01:00
Gergő Tisza b0bac10627 Display a placeholder text when author and source are missing
Change-Id: I38478956c5a0b5f204e5caa43e54db651f297887
2014-10-29 15:38:56 +00:00
Gergő Tisza 392e714cc6 Add icon for PD licenses
Change-Id: I82c56a420d8d529a4a50cb66e64b191bbb36997f
2014-10-29 14:03:36 +01:00
jenkins-bot d096a73b36 Merge "Change above-the-fold layout - step 3" 2014-10-29 11:41:18 +00:00
Pau Giner cecf17319d Fix open panel detection when scrolling
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
2014-10-29 12:21:31 +01:00
Gergő Tisza 8423974c6a Change above-the-fold layout - step 3
* 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
2014-10-29 12:05:34 +01:00
Gergő Tisza f792a42f93 Change above-the-fold layout - step 2
* 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
2014-10-28 21:18:53 +00:00
jenkins-bot fb7a04f5a2 Merge "Change above-the-fold layout - step 1" 2014-10-28 21:18:48 +00:00
Gergő Tisza a6adad35ed Change above-the-fold layout - step 1
* remove chevron
* adjust colors

Change-Id: I443fd757f5df18d099e42a81f1f323fadea77987
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/833
2014-10-28 20:02:22 +00:00
Pau Giner 4d415c330c Cog icon adjustment
Border was added for the cog icon so that it can be visible on white

Change-Id: I1bdd73e2e8be571d3d0e3ab49e5d005812e2d090
2014-10-27 17:34:09 +01:00
Mark Holmquist ff7a8b23c2 Add about link to disable/enable dialog
This was the last issue with the dialogs. Tests included.

Change-Id: Ic08af400893950a04489af4b166827d059561974
2014-10-24 13:51:32 -05:00
jenkins-bot 5b4af66668 Merge "Fix issue with options dialog when media viewer has been reopened" 2014-10-23 14:58:54 +00:00
Gilles Dubuc 0d743977dd Fix issue with options dialog when media viewer has been reopened
- 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
2014-10-23 15:29:44 +02:00
Pau Giner cea4a105a9 Adjust style of the Disable panel
Spacing, color, and typography adjustments to the disable/enable panels

Change-Id: I86cfa04353fb500ebe027576a61301e8ef2f0f3b
2014-10-23 12:21:02 +00:00
jenkins-bot d5bd8d8eb1 Merge "Show popup when the user visits a file page the first time after disabling MMV" 2014-10-21 20:42:09 +00:00
jenkins-bot 4a5872fadd Merge "Show panel shadow on full-screen mode" 2014-10-21 19:31:26 +00:00
Gergő Tisza 2c578e6dc3 Show popup when the user visits a file page the first time after disabling MMV
Change-Id: Id2b121c930115373a8a81dc1091c4124807db053
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/719
2014-10-21 14:28:20 +00:00
Gilles Dubuc 90042a5a02 Cog icon & mw.ui styling for expand button
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
2014-10-21 15:16:33 +02:00
Pau Giner 8f9b5924bf Show panel shadow on full-screen mode
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
2014-10-21 13:00:49 +02:00
Mark Holmquist 1853540cd3 Add viewing options panel
Enable, disable, and get confirmations.

Lots of UI work on this one.

Change-Id: I1f731992bd240e7ea403592872f7c7e270158753
2014-10-19 00:27:15 +02:00
Gilles Dubuc c4fd6c3740 E2E tests for download menu
Change-Id: I3435366133a9b5fd6079c3a5bad270ee19da8daf
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/445
2014-10-15 23:07:21 +02:00
jenkins-bot 2203f89236 Merge "Log image dimensions" 2014-09-30 15:15:54 +00:00
jenkins-bot 8b13ddbd90 Merge "Debounce resizes" 2014-09-30 15:15:52 +00:00
Gergő Tisza ff76011032 Log image dimensions
Also add a sanity test to attribution logging which I forgot at the time.

Change-Id: I3010e57eb74a76fee4078c415182a033375ea890
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/898
2014-09-30 14:55:47 +00:00
Gergő Tisza 6a0ad63085 Debounce resizes
* 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
2014-09-30 14:45:00 +00:00
jenkins-bot 265e414c50 Merge "Remove duplicate details link in metadata panel" 2014-09-28 21:47:51 +00:00
Mark Holmquist 9187148b01 Remove duplicate details link in metadata panel
Change-Id: I2eaa221fa505e9f106fa8611adfe99677a24009b
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/909
2014-09-28 21:45:55 +00:00
Mark Holmquist b0aa337fd5 Initialise dialogOpen value to false
Because it was undefined, the toggleClass method just turned the class on
if it wasn't there in the first place.

Silly jQuery, Trix are for kids.

Change-Id: I4e21e033529834a4f808270306c72f5756b69ab2
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/921
2014-09-26 19:03:14 -07:00
jenkins-bot cab8fe42d5 Merge "Revert "Layout adjustments to reduce overlap with chevron"" 2014-09-26 18:46:51 +00:00
MarkTraceur 640984b2e9 Revert "Layout adjustments to reduce overlap with chevron"
This reverts commit b77ae2c62b.

Change-Id: Ibc9d864d5309eb23ec1b495a1311a614e907b5a8
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/912
2014-09-26 17:52:13 +00:00
jenkins-bot f1b9c0c391 Merge "Fix dialog class" 2014-09-25 13:44:44 +00:00
Pau Giner 958bedac36 More details button color fix
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
2014-09-25 07:19:22 +02:00
Mark Holmquist b691086f2b Fix dialog class
Missed this small issue - doesn't affect actual behaviour but will make a
confusing cursor display in some instances.

Change-Id: I40c3cf0c9596f40983f090974044bcd6f7d203d3
2014-09-24 16:19:03 -07:00
jenkins-bot 7b1d3814fe Merge "Move focus event handlers to mmv.ui.Element" 2014-09-24 21:14:59 +00:00
jenkins-bot 6c2fe0aaf5 Merge "Style fixes for the UI changes" 2014-09-24 21:14:51 +00:00
jenkins-bot 93d678dcd6 Merge "Move dialogs to the left, make arrows point right" 2014-09-24 21:14:50 +00:00
jenkins-bot 18beee316e Merge "Make the download pane into its own dialog" 2014-09-24 21:12:20 +00:00
jenkins-bot 24e2487d7e Merge "Make "more details" button bigger 'n' prettier" 2014-09-24 21:12:18 +00:00
jenkins-bot e05655d880 Merge "Make the reuse button part of the canvas" 2014-09-24 21:12:10 +00:00
Mark Holmquist 133a94cb89 Move focus event handlers to mmv.ui.Element
Needed to make sure the download dialog can use the handlers.

Change-Id: If62146f1181f0e722be691f61e5fdc133c9b3795
2014-09-24 17:08:50 +02:00
Mark Holmquist 325a8a3e27 Style fixes for the UI changes
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
2014-09-24 17:08:02 +02:00
Mark Holmquist c6f3be42aa Move dialogs to the left, make arrows point right
Change-Id: If8fc4ca5f902b3dc3271a33c44554d4e46faadb8
2014-09-24 17:07:05 +02:00
Mark Holmquist 0d4863dd91 Make the download pane into its own dialog
Change-Id: Ia92545ed1ef7f2e4ba7934c682eef684a22ca17f
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/841
2014-09-24 17:05:50 +02:00
Pau Giner b77ae2c62b Layout adjustments to reduce overlap with chevron
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
2014-09-24 13:11:47 +02:00
Mark Holmquist 7d7cd3a8e6 Make "more details" button bigger 'n' prettier
Change-Id: I81a370a910c0cec269a000c9dcaac8461d3421b0
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/830
2014-09-23 10:41:00 -07:00
Pau Giner 956cd4b47e Add shadow when scrolling panel
When the panel is scrolling a shadow is added to better communicate that
the panel moves over the image.
More details: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/193

Change-Id: I06866a3a034977002b98658a3d09b5421b583ee7
2014-09-23 17:37:41 +02:00