Sn1per has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/329495 )
Change subject: Copy button for attribution text in download dialog
......................................................................
Copy button for attribution text in download dialog
In addition:
* .mw-mmv-reuse-copy => .mw-mmv-dialog-copy because it's not just a
reuse dialog thing anymore
* Adjust margin between attribution textbox and attribution option
widget to stay consistent with reuse dialog UI
Bug: T77295
Change-Id: I79abdc1a3c10f0a8c3ecb6f4d444a601595a903f
---
M extension.json
M i18n/en.json
M i18n/qqq.json
M resources/mmv/ui/mmv.ui.dialog.less
M resources/mmv/ui/mmv.ui.download.pane.js
M resources/mmv/ui/mmv.ui.download.pane.less
M resources/mmv/ui/mmv.ui.reuse.dialog.less
M resources/mmv/ui/mmv.ui.reuse.embed.js
M resources/mmv/ui/mmv.ui.reuse.embed.less
M resources/mmv/ui/mmv.ui.reuse.share.js
M resources/mmv/ui/mmv.ui.reuse.share.less
11 files changed, 61 insertions(+), 21 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MultimediaViewer
refs/changes/95/329495/1
diff --git a/extension.json b/extension.json
index 65ce6e9..2b249ca 100644
--- a/extension.json
+++ b/extension.json
@@ -264,6 +264,7 @@
"multimediaviewer-download-attribution-cta-header",
"multimediaviewer-download-optional-attribution-cta-header",
"multimediaviewer-download-attribution-cta",
+ "multimediaviewer-download-attribution-copy",
"multimediaviewer-attr-plain",
"multimediaviewer-attr-html"
]
diff --git a/i18n/en.json b/i18n/en.json
index f926a79..d5be709 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -128,6 +128,7 @@
"multimediaviewer-download-attribution-cta-header": "You need to
attribute the author",
"multimediaviewer-download-optional-attribution-cta-header": "You can
attribute the author",
"multimediaviewer-download-attribution-cta": "Show me how",
+ "multimediaviewer-download-attribution-copy": "Select and copy (if
supported) the attribution text for this file",
"multimediaviewer-attr-plain": "Plain",
"multimediaviewer-attr-html": "HTML",
"multimediaviewer-options-tooltip": "Enable or disable Media Viewer",
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 6c94fa0..f33e26d 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -137,6 +137,7 @@
"multimediaviewer-download-attribution-cta-header": "Header for telling
the user that the author of an image must be attributed, during a download
action. See also
{{msg-mw|multimediaviewer-download-optional-attribution-cta-header}}.",
"multimediaviewer-download-optional-attribution-cta-header": "Header
for inviting the user to attribute author of the image during a download
action. This is used for images where attribution is not a legal requirement.
See also {{msg-mw|multimediaviewer-download-attribution-cta-header}}.",
"multimediaviewer-download-attribution-cta": "Call to action for a user
to find out how to attribute the author of an image.",
+ "multimediaviewer-download-attribution-copy": "Text of the tooltip for
the button to select and copy the attribution of a file (if supported by the
browser) in the download panel, that is displayed when hovered over.",
"multimediaviewer-attr-plain": "Label for a button that lets the user
pick plain text as an output format.",
"multimediaviewer-attr-html": "{{optional}}\nLabel for a button that
lets the user pick HTML as an output format.\n{{Identical|HTML}}",
"multimediaviewer-options-tooltip": "Tooltip for a button that opens a
panel for enabling or disabling the media viewer.",
diff --git a/resources/mmv/ui/mmv.ui.dialog.less
b/resources/mmv/ui/mmv.ui.dialog.less
index 3206901..d51fd04 100644
--- a/resources/mmv/ui/mmv.ui.dialog.less
+++ b/resources/mmv/ui/mmv.ui.dialog.less
@@ -24,4 +24,18 @@
.rotate( -45deg );
position: fixed;
}
+
+ .mw-mmv-dialog-copy {
+ /* @embed */
+ background-image: url( img/pasting.svg );
+ background-size: contain;
+ background-position: right center;
+ background-repeat: no-repeat;
+
+ &:hover {
+ /* @embed */
+ background-image: url( img/pasting-hover.svg );
+ text-decoration: none;
+ }
+ }
}
diff --git a/resources/mmv/ui/mmv.ui.download.pane.js
b/resources/mmv/ui/mmv.ui.download.pane.js
index 7ee519f..814369f 100644
--- a/resources/mmv/ui/mmv.ui.download.pane.js
+++ b/resources/mmv/ui/mmv.ui.download.pane.js
@@ -187,6 +187,29 @@
.text( mw.message(
'multimediaviewer-download-attribution-cta' ).text() )
)
.appendTo( this.$attributionSection );
+ this.attributionInput = attributionInput;
+ this.$attributionCopy = this.$copyButton = $( '<a>' )
+ .addClass( 'mw-mmv-dialog-copy' )
+ .click( function () {
+ // Select the text, and then try to
copy the text.
+ // If the copy fails or is not
supported, continue as if nothing had happened.
+ dl.attributionInput.select();
+ try {
+ if (
document.queryCommandSupported &&
+
document.queryCommandSupported( 'copy' ) ) {
+ document.execCommand(
'copy' );
+ }
+ } catch ( e ) {
+ // queryCommandSupported in
Firefox pre-41 can throw errors when used with
+ // clipboard commands. We catch
and ignore these and other copy-command-related
+ // errors here.
+ }
+ } )
+ .prop( 'title', mw.msg(
'multimediaviewer-download-attribution-copy' ) )
+ .tipsy( {
+ delayIn: mw.config.get(
'wgMultimediaViewer' ).tooltipDelay,
+ gravity: this.correctEW( 'se' )
+ } );
this.$attributionHowHeader = $( '<p>' )
.addClass( 'mw-mmv-download-attribution-how-header' )
@@ -195,7 +218,8 @@
.addClass( 'mw-mmv-download-attribution-how' )
.append(
this.$attributionHowHeader,
- attributionInput.$element,
+ this.attributionInput.$element,
+ this.$attributionCopy,
attributionSwitch.$element,
$( '<p>' )
.addClass(
'mw-mmv-download-attribution-close-button' )
@@ -206,8 +230,6 @@
.text( ' ' )
)
.appendTo( this.$attributionSection );
-
- this.attributionInput = attributionInput;
};
/**
diff --git a/resources/mmv/ui/mmv.ui.download.pane.less
b/resources/mmv/ui/mmv.ui.download.pane.less
index 540063c..afb67a0 100644
--- a/resources/mmv/ui/mmv.ui.download.pane.less
+++ b/resources/mmv/ui/mmv.ui.download.pane.less
@@ -180,11 +180,26 @@
// override OOJS-UI fixed width
width: auto;
+ // margin between text widget and option switch widget
+ margin-bottom: 10px;
+
input[readonly] {
color: @input-text-color;
text-shadow: none;
}
}
+
+ .mw-mmv-dialog-copy {
+ // style rules based on .mw-mmv-share-page-link
+ float: right;
+ width: 1.5em;
+ height: 1.5em;
+
+ // position approximately to the middle - probably
fragile but couldn't find a better way as
+ // the height of OOJS-UI input widget has both em and
px parts and not possible to calculate
+ // exactly
+ margin: 8px 0.5em 8px 0;
+ }
}
}
diff --git a/resources/mmv/ui/mmv.ui.reuse.dialog.less
b/resources/mmv/ui/mmv.ui.reuse.dialog.less
index 1791aeb..1521406 100644
--- a/resources/mmv/ui/mmv.ui.reuse.dialog.less
+++ b/resources/mmv/ui/mmv.ui.reuse.dialog.less
@@ -54,20 +54,6 @@
&.active {
display: block;
}
-
- .mw-mmv-reuse-copy {
- /* @embed */
- background-image: url( img/pasting.svg );
- background-size: contain;
- background-position: right center;
- background-repeat: no-repeat;
-
- &:hover {
- /* @embed */
- background-image: url( img/pasting-hover.svg );
- text-decoration: none;
- }
- }
}
.mw-mmv-dialog-down-arrow {
diff --git a/resources/mmv/ui/mmv.ui.reuse.embed.js
b/resources/mmv/ui/mmv.ui.reuse.embed.js
index dc080ac..bb17bea 100644
--- a/resources/mmv/ui/mmv.ui.reuse.embed.js
+++ b/resources/mmv/ui/mmv.ui.reuse.embed.js
@@ -144,7 +144,7 @@
} );
this.$copyButton = $( '<a>' )
- .addClass( 'mw-mmv-reuse-copy' )
+ .addClass( 'mw-mmv-dialog-copy' )
.click( function () {
// Select the text, and then try to copy the
text.
// If the copy fails or is not supported,
continue as if nothing had happened.
diff --git a/resources/mmv/ui/mmv.ui.reuse.embed.less
b/resources/mmv/ui/mmv.ui.reuse.embed.less
index 5c89523..5824212 100644
--- a/resources/mmv/ui/mmv.ui.reuse.embed.less
+++ b/resources/mmv/ui/mmv.ui.reuse.embed.less
@@ -35,7 +35,7 @@
margin: 0;
}
- .mw-mmv-reuse-copy {
+ .mw-mmv-dialog-copy {
float: right;
width: 1em;
height: 1em;
diff --git a/resources/mmv/ui/mmv.ui.reuse.share.js
b/resources/mmv/ui/mmv.ui.reuse.share.js
index 2a3dac4..449d916 100644
--- a/resources/mmv/ui/mmv.ui.reuse.share.js
+++ b/resources/mmv/ui/mmv.ui.reuse.share.js
@@ -68,7 +68,7 @@
} );
this.$copyButton = $( '<a>' )
- .addClass( 'mw-mmv-reuse-copy' )
+ .addClass( 'mw-mmv-dialog-copy' )
.click( function () {
// Select the text, and then try to copy the
text.
// If the copy fails or is not supported,
continue as if nothing had happened.
diff --git a/resources/mmv/ui/mmv.ui.reuse.share.less
b/resources/mmv/ui/mmv.ui.reuse.share.less
index 1e2cbc8..dd05a58 100644
--- a/resources/mmv/ui/mmv.ui.reuse.share.less
+++ b/resources/mmv/ui/mmv.ui.reuse.share.less
@@ -15,7 +15,7 @@
}
}
- .mw-mmv-reuse-copy {
+ .mw-mmv-dialog-copy {
// style rules based on .mw-mmv-share-page-link
float: right;
width: 1.5em;
--
To view, visit https://gerrit.wikimedia.org/r/329495
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I79abdc1a3c10f0a8c3ecb6f4d444a601595a903f
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MultimediaViewer
Gerrit-Branch: master
Gerrit-Owner: Sn1per <geof...@gmail.com>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
