mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-11-29 00:30:44 +00:00
Adjustments and fixes for styles
* Made buttons use shared CSS code * Stopped using <button> elements and got all browsers looking the same * Fixed focus on text area issue - had to let the stack clear first Change-Id: I6781916822b4173ba906b9bc4c341219fbf10d82
This commit is contained in:
Trevor Parscal
parent
b6d0cebe59
commit
71b97ec45b
|
|
@ -14,23 +14,20 @@
|
|||
.ve-init-mw-viewPageTarget-pageTitle {
|
||||
-webkit-transition: opacity 200ms ease-out;
|
||||
-moz-transition: opacity 200ms ease-out;
|
||||
-ms-transition: opacity 200ms ease-out;
|
||||
-o-transition: opacity 200ms ease-out;
|
||||
transition: opacity 200ms ease-out;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-loadingSpinner,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saving {
|
||||
/* @embed */
|
||||
background-image: url(images/loading.gif);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-loadingSpinner {
|
||||
.ve-init-mw-viewPageTarget-loading {
|
||||
width: 128px;
|
||||
height: 15px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* Edit notices */
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-editNoticesButton {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
|
@ -71,93 +68,111 @@
|
|||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton {
|
||||
/* Buttons */
|
||||
|
||||
.ve-init-mw-viewPageTarget-button {
|
||||
display: inline-block;
|
||||
height: 1.8em;
|
||||
margin: 0.1em 0.25em;
|
||||
padding: 0 0.75em;
|
||||
border-radius: 0.25em;
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
font-size: 1em;
|
||||
padding: 0.25em 0.75em;
|
||||
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton {
|
||||
border: solid 1px #c3e59a;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0, #c3e59a),
|
||||
color-stop(1, #f0fbe1)
|
||||
);
|
||||
background-image: -webkit-linear-gradient(bottom, #c3e59a 0%, #f0fbe1 100%);
|
||||
background-image: -moz-linear-gradient(bottom, #c3e59a 0%, #f0fbe1 100%);
|
||||
background-image: -ms-linear-gradient(bottom, #c3e59a 0%, #f0fbe1 100%);
|
||||
background-image: -o-linear-gradient(bottom, #c3e59a 0%, #f0fbe1 100%);
|
||||
background-image: linear-gradient(bottom, #c3e59a 0%, #f0fbe1 100%);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton {
|
||||
border: solid 1px #b0d9ee;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0, #b0d9ee),
|
||||
color-stop(1, #eaf4fa)
|
||||
);
|
||||
background-image: -webkit-linear-gradient(bottom, #b0d9ee 0%, #eaf4fa 100%);
|
||||
background-image: -moz-linear-gradient(bottom, #b0d9ee 0%, #eaf4fa 100%);
|
||||
background-image: -ms-linear-gradient(bottom, #b0d9ee 0%, #eaf4fa 100%);
|
||||
background-image: -o-linear-gradient(bottom, #b0d9ee 0%, #eaf4fa 100%);
|
||||
background-image: linear-gradient(bottom, #b0d9ee 0%, #eaf4fa 100%);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton,
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton {
|
||||
height: 1.5em;
|
||||
margin-right: 0.25em;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton {
|
||||
display: inline-block;
|
||||
border: 1px #c9c9c9 solid;
|
||||
border-radius: 0.25em;
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
font-size: 1em;
|
||||
padding: 0.25em 0.75em;
|
||||
color: #252525;
|
||||
text-align: center;
|
||||
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
|
||||
/* Fancy CSS background */
|
||||
background-color: #f0f0f0;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, #ffffff),
|
||||
color-stop(100%, #f0f0f0)
|
||||
text-align: center;
|
||||
font-size: 1em;
|
||||
cursor: pointer;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
/* Gray */
|
||||
border: 1px #c9c9c9 solid;
|
||||
background-color: #ffffff;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(
|
||||
GradientType=0,startColorstr=#ffffff, endColorstr=#f0f0f0
|
||||
);
|
||||
background-image: -webkit-linear-gradient(top, #ffffff, #f0f0f0);
|
||||
background-image: -moz-linear-gradient(top, #ffffff, #f0f0f0);
|
||||
background-image: -ms-linear-gradient(top, #ffffff, #f0f0f0);
|
||||
background-image: linear-gradient(#ffffff, #f0f0f0);
|
||||
background-image: -webkit-gradient(
|
||||
linear, right top, right bottom, color-stop(0%,#ffffff), color-stop(100%,#f0f0f0)
|
||||
);
|
||||
background-image: -webkit-linear-gradient(top, #ffffff 0%, #f0f0f0 100%);
|
||||
background-image: -moz-linear-gradient(top, #ffffff 0%, #f0f0f0 100%);
|
||||
background-image: -ms-linear-gradient(top, #ffffff 0%, #f0f0f0 100%);
|
||||
background-image: -o-linear-gradient(top, #ffffff 0%, #f0f0f0 100%);
|
||||
background-image: linear-gradient(top, #ffffff 0%, #f0f0f0 100%);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton {
|
||||
.ve-init-mw-viewPageTarget-button-constructive {
|
||||
/* Green */
|
||||
border: solid 1px #c3e59a;
|
||||
background-color: #f0fbe1;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(
|
||||
GradientType=0,startColorstr=#f0fbe1, endColorstr=#c3e59a
|
||||
);
|
||||
background-image: -webkit-gradient(
|
||||
linear, right top, right bottom, color-stop(0%,#f0fbe1), color-stop(100%,#c3e59a)
|
||||
);
|
||||
background-image: -webkit-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
|
||||
background-image: -moz-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
|
||||
background-image: -ms-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
|
||||
background-image: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
|
||||
background-image: linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-button-primary {
|
||||
/* Blue */
|
||||
border: solid 1px #b0d9ee;
|
||||
background-color: #eaf4fa;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(
|
||||
GradientType=0,startColorstr=#eaf4fa, endColorstr=#b0d9ee
|
||||
);
|
||||
background-image: -webkit-gradient(
|
||||
linear, right top, right bottom, color-stop(0%,#eaf4fa), color-stop(100%,#b0d9ee)
|
||||
);
|
||||
background-image: -webkit-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
|
||||
background-image: -moz-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
|
||||
background-image: -ms-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
|
||||
background-image: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
|
||||
background-image: linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-actions .ve-init-mw-viewPageTarget-button {
|
||||
float: right;
|
||||
height: 2em;
|
||||
line-height: 1.25em;
|
||||
margin-right: 0;
|
||||
margin-left: 1em;
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saving {
|
||||
.ve-init-mw-viewPageTarget-button:hover {
|
||||
border-color: #aaa;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-button-down {
|
||||
border-color: #ddd;
|
||||
box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-button-disabled {
|
||||
filter: alpha(opacity=50);
|
||||
opacity: 0.5;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-button-disabled:hover {
|
||||
border-color: #ccc;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-button-label {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
line-height: 2.3em;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
/* Save dialog styles */
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-working {
|
||||
display: none;
|
||||
float: right;
|
||||
height: 2em;
|
||||
|
|
@ -167,59 +182,6 @@
|
|||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton:before,
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton:before {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
display: block;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton:hover,
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton:hover,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton:hover,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton:hover {
|
||||
border-color: #aaa;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton:active,
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton-down,
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton:active,
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton-down,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton:active,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton-down,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton:active {
|
||||
border-color: #ddd;
|
||||
box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton-disabled,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton-disabled,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton-disabled {
|
||||
filter: alpha(opacity=50);
|
||||
opacity: 0.5;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton-disabled:hover,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton-disabled:hover,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton-disabled:hover {
|
||||
border-color: #ccc;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-toolbar-saveButton-label,
|
||||
.ve-init-mw-viewPageTarget-toolbar-cancelButton-label,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-saveButton-label,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-diffButton-label {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
line-height: 1.8em;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
/* Save dialog styles */
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog {
|
||||
display: none;
|
||||
top: 0.25em;
|
||||
|
|
@ -269,7 +231,6 @@
|
|||
/* @see ve.init.mw.Icons */
|
||||
background-position: left top;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
padding-right: 0.5em;
|
||||
border-right: 1px solid #eee;
|
||||
margin-right: 0.5em;
|
||||
|
|
@ -316,16 +277,20 @@
|
|||
.ve-init-mw-viewPageTarget-saveDialog-summary {
|
||||
background-color: #fff;
|
||||
border: solid 1px #cccccc;
|
||||
border-bottom: none;
|
||||
padding: 0.5em;
|
||||
border-radius: 0.25em 0.25em 0 0;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-summary-focused {
|
||||
border-color: #aaa;
|
||||
}
|
||||
|
||||
.ve-init-mw-viewPageTarget-saveDialog-options {
|
||||
position: relative;
|
||||
background-color: #f7f7f7;
|
||||
margin-bottom: 1em;
|
||||
border: solid 1px #cccccc;
|
||||
border-top: none;
|
||||
border-radius: 0 0 0.25em 0.25em;
|
||||
min-height: 2.25em;
|
||||
}
|
||||
|
|
@ -368,3 +333,11 @@
|
|||
.ve-init-mw-viewPageTarget-saveDialog-editSummary:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* Images */
|
||||
|
||||
.ve-init-mw-viewPageTarget-loading,
|
||||
.ve-init-mw-viewPageTarget-saveDialog-working {
|
||||
/* @embed */
|
||||
background-image: url(images/loading.gif);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,17 +22,21 @@ ve.init.mw.ViewPageTarget = function VeInitMwViewPageTarget() {
|
|||
|
||||
// Properties
|
||||
this.$document = null;
|
||||
this.$spinner = $( '<div class="ve-init-mw-viewPageTarget-loadingSpinner"></div>' );
|
||||
this.$toolbarCancelButton =
|
||||
$( '<div class="ve-init-mw-viewPageTarget-toolbar-cancelButton"></div>' );
|
||||
this.$toolbarSaveButton =
|
||||
$( '<div class="ve-init-mw-viewPageTarget-toolbar-saveButton"></div>' );
|
||||
this.$toolbarEditNotices =
|
||||
$( '<div class="ve-init-mw-viewPageTarget-toolbar-editNotices"></div>' );
|
||||
this.$toolbarEditNoticesButton =
|
||||
$( '<div class="ve-init-mw-viewPageTarget-toolbar-editNoticesButton"></div>' );
|
||||
this.$saveDialog =
|
||||
$( '<div class="ve-init-mw-viewPageTarget-saveDialog"></div>' );
|
||||
this.$spinner = $( '<div class="ve-init-mw-viewPageTarget-loading"></div>' );
|
||||
this.$toolbarCancelButton = $( '<div>' ).addClass(
|
||||
've-init-mw-viewPageTarget-button ve-init-mw-viewPageTarget-toolbar-cancelButton'
|
||||
);
|
||||
this.$toolbarSaveButton = $( '<div>' ).addClass(
|
||||
've-init-mw-viewPageTarget-button ve-init-mw-viewPageTarget-button-constructive ' +
|
||||
've-init-mw-viewPageTarget-toolbar-saveButton'
|
||||
);
|
||||
this.$toolbarEditNotices = $( '<div>' ).addClass(
|
||||
've-init-mw-viewPageTarget-toolbar-editNotices'
|
||||
);
|
||||
this.$toolbarEditNoticesButton = $( '<div>' ).addClass(
|
||||
've-init-mw-viewPageTarget-toolbar-editNoticesButton'
|
||||
);
|
||||
this.$saveDialog = $( '<div>' ).addClass( 've-init-mw-viewPageTarget-saveDialog' );
|
||||
this.$saveDialogSaveButton = null;
|
||||
this.$saveDialogDiffButton = null;
|
||||
this.onBeforeUnloadFallback = null;
|
||||
|
|
@ -165,21 +169,23 @@ ve.init.mw.ViewPageTarget.saveDialogTemplate = '\
|
|||
<div class="ve-init-mw-viewPageTarget-saveDialog-options">\
|
||||
<input type="checkbox" name="minorEdit" \
|
||||
id="ve-init-mw-viewPageTarget-saveDialog-minorEdit">\
|
||||
<label class="ve-init-mw-viewPageTarget-saveDialog-minorEdit-label" \
|
||||
<label class="ve-init-mw-viewPageTarget-saveDialog-minorEdit-label"\
|
||||
for="ve-init-mw-viewPageTarget-saveDialog-minorEdit"></label>\
|
||||
<input type="checkbox" name="watchList" \
|
||||
<input type="checkbox" name="watchList"\
|
||||
id="ve-init-mw-viewPageTarget-saveDialog-watchList">\
|
||||
<label class="ve-init-mw-viewPageTarget-saveDialog-watchList-label" \
|
||||
<label class="ve-init-mw-viewPageTarget-saveDialog-watchList-label"\
|
||||
for="ve-init-mw-viewPageTarget-saveDialog-watchList"></label>\
|
||||
<label class="ve-init-mw-viewPageTarget-saveDialog-editSummaryCount"></label>\
|
||||
</div>\
|
||||
<button class="ve-init-mw-viewPageTarget-saveDialog-saveButton">\
|
||||
<span class="ve-init-mw-viewPageTarget-saveDialog-saveButton-label"></span>\
|
||||
</button>\
|
||||
<button class="ve-init-mw-viewPageTarget-saveDialog-diffButton">\
|
||||
<span class="ve-init-mw-viewPageTarget-saveDialog-diffButton-label"></span>\
|
||||
</button>\
|
||||
<div class="ve-init-mw-viewPageTarget-saveDialog-saving"></div>\
|
||||
<div class="ve-init-mw-viewPageTarget-saveDialog-actions">\
|
||||
<div class="ve-init-mw-viewPageTarget-button ve-init-mw-viewPageTarget-button-constructive ve-init-mw-viewPageTarget-saveDialog-saveButton">\
|
||||
<span class="ve-init-mw-viewPageTarget-button-label"></span>\
|
||||
</div>\
|
||||
<div class="ve-init-mw-viewPageTarget-button ve-init-mw-viewPageTarget-button-primary ve-init-mw-viewPageTarget-saveDialog-diffButton">\
|
||||
<span class="ve-init-mw-viewPageTarget-button-label"></span>\
|
||||
</div>\
|
||||
<div class="ve-init-mw-viewPageTarget-saveDialog-working"></div>\
|
||||
</div>\
|
||||
<div style="clear: both;"></div>\
|
||||
<div class="ve-init-mw-viewPageTarget-saveDialog-foot">\
|
||||
<p class="ve-init-mw-viewPageTarget-saveDialog-license"></p>\
|
||||
|
|
@ -760,23 +766,23 @@ ve.init.mw.ViewPageTarget.prototype.setupToolbarButtons = function () {
|
|||
.find( '.ve-init-mw-viewPageTarget-toolbar-editNotices-notice' ).length;
|
||||
this.$toolbarCancelButton
|
||||
.append(
|
||||
$( '<span class="ve-init-mw-viewPageTarget-toolbar-cancelButton-label"></span>' )
|
||||
$( '<span class="ve-init-mw-viewPageTarget-button-label"></span>' )
|
||||
.text( ve.msg( 'cancel' ) )
|
||||
)
|
||||
.on( {
|
||||
'mousedown': function ( e ) {
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-toolbar-cancelButton-down' );
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'mouseleave mouseup': function ( e ) {
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-toolbar-cancelButton-down' );
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'click': ve.bind( this.onToolbarCancelButtonClick, this )
|
||||
} );
|
||||
this.$toolbarSaveButton
|
||||
.append(
|
||||
$( '<span class="ve-init-mw-viewPageTarget-toolbar-saveButton-label"></span>' )
|
||||
$( '<span class="ve-init-mw-viewPageTarget-button-label"></span>' )
|
||||
.text( ve.msg(
|
||||
this.restoring ? 'visualeditor-restore-page': (
|
||||
this.pageExists ? 'savearticle' : 'visualeditor-create-page'
|
||||
|
|
@ -785,11 +791,11 @@ ve.init.mw.ViewPageTarget.prototype.setupToolbarButtons = function () {
|
|||
)
|
||||
.on( {
|
||||
'mousedown': function ( e ) {
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-toolbar-saveButton-down' );
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'mouseleave mouseup': function ( e ) {
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-toolbar-saveButton-down' );
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'click': ve.bind( this.onToolbarSaveButtonClick, this )
|
||||
|
|
@ -906,19 +912,31 @@ ve.init.mw.ViewPageTarget.prototype.setupSaveDialog = function () {
|
|||
} )
|
||||
.placeholder()
|
||||
.byteLimit( viewPage.editSummaryByteLimit )
|
||||
.on( 'keydown mouseup cut paste change focus blur', function () {
|
||||
var $textarea = $(this),
|
||||
$editSummaryCount = $textarea
|
||||
.closest( '#ve-init-mw-viewPageTarget-saveDialog-slide-main' )
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-editSummaryCount' );
|
||||
// TODO: This looks a bit weird, there is no unit in the UI, just numbers
|
||||
// Users likely assume characters but then it seems to count down quicker
|
||||
// than expected. Facing users with the word "byte" is bad? (bug 40035)
|
||||
setTimeout( function () {
|
||||
$editSummaryCount.text(
|
||||
viewPage.editSummaryByteLimit - $.byteLength( $textarea.val() )
|
||||
.on( {
|
||||
'focus': function () {
|
||||
$(this).parent().addClass(
|
||||
've-init-mw-viewPageTarget-saveDialog-summary-focused'
|
||||
);
|
||||
}, 0 );
|
||||
},
|
||||
'blur': function () {
|
||||
$(this).parent().removeClass(
|
||||
've-init-mw-viewPageTarget-saveDialog-summary-focused'
|
||||
);
|
||||
},
|
||||
'keydown mouseup cut paste change focus blur': function () {
|
||||
var $textarea = $(this),
|
||||
$editSummaryCount = $textarea
|
||||
.closest( '#ve-init-mw-viewPageTarget-saveDialog-slide-main' )
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-editSummaryCount' );
|
||||
// TODO: This looks a bit weird, there is no unit in the UI, just numbers
|
||||
// Users likely assume characters but then it seems to count down quicker
|
||||
// than expected. Facing users with the word "byte" is bad? (bug 40035)
|
||||
setTimeout( function () {
|
||||
$editSummaryCount.text(
|
||||
viewPage.editSummaryByteLimit - $.byteLength( $textarea.val() )
|
||||
);
|
||||
}, 0 );
|
||||
}
|
||||
} )
|
||||
.end()
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-editSummaryCount' )
|
||||
|
|
@ -935,23 +953,35 @@ ve.init.mw.ViewPageTarget.prototype.setupSaveDialog = function () {
|
|||
.end()
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-saveButton' )
|
||||
.on( {
|
||||
'mousedown': function () {
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-saveDialog-saveButton-down' );
|
||||
'mousedown': function ( e ) {
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'mouseleave mouseup': function () {
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-saveDialog-saveButton-down' );
|
||||
'mouseleave mouseup': function ( e ) {
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'click': ve.bind( viewPage.onSaveDialogSaveButtonClick, viewPage )
|
||||
} )
|
||||
.end()
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-saveButton-label' )
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-saveButton > span' )
|
||||
.text( ve.msg( viewPage.restoring ? 'visualeditor-restore-page' : 'savearticle' ) )
|
||||
.end()
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-diffButton-label' )
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-diffButton > span' )
|
||||
.text( ve.msg( 'showdiff' ) )
|
||||
.end()
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-diffButton' )
|
||||
.click( ve.bind( viewPage.onSaveDialogDiffButtonClick, viewPage ) )
|
||||
.on( {
|
||||
'mousedown': function ( e ) {
|
||||
$(this).addClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'mouseleave mouseup': function ( e ) {
|
||||
$(this).removeClass( 've-init-mw-viewPageTarget-button-down' );
|
||||
e.preventDefault();
|
||||
},
|
||||
'click': ve.bind( viewPage.onSaveDialogDiffButtonClick, viewPage )
|
||||
} )
|
||||
.end()
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-license' )
|
||||
.html( ve.init.platform.getParsedMessage( 'copyrightwarning' ) );
|
||||
|
|
@ -960,7 +990,7 @@ ve.init.mw.ViewPageTarget.prototype.setupSaveDialog = function () {
|
|||
viewPage.$saveDialogDiffButton = viewPage.$saveDialog
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-diffButton' );
|
||||
viewPage.$saveDialogLoadingIcon = viewPage.$saveDialog
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-saving' );
|
||||
.find( '.ve-init-mw-viewPageTarget-saveDialog-working' );
|
||||
} );
|
||||
// Hook onto the 'watch' event on by mediawiki.page.watch.ajax.js
|
||||
// Triggered when mw.page.watch.updateWatchLink(link, action) is called
|
||||
|
|
@ -1122,11 +1152,6 @@ ve.init.mw.ViewPageTarget.prototype.showSaveDialog = function () {
|
|||
.find ( '.ve-init-mw-viewPageTarget-saveDialog-prevButton' )
|
||||
.hide()
|
||||
.end()
|
||||
.find( 'textarea' )
|
||||
.eq( 0 )
|
||||
.focus()
|
||||
.end()
|
||||
.end()
|
||||
.fadeIn( 'fast', function () {
|
||||
// Initial size
|
||||
viewPage.onResizeSaveDialog();
|
||||
|
|
@ -1139,6 +1164,10 @@ ve.init.mw.ViewPageTarget.prototype.showSaveDialog = function () {
|
|||
}
|
||||
});
|
||||
$( window ).on( 'resize.ve-savedialog', ve.bind( viewPage.onResizeSaveDialog, viewPage ) );
|
||||
// Change focus
|
||||
setTimeout( function() {
|
||||
viewPage.$saveDialog.find( 'textarea:first' ).focus();
|
||||
}, 0 );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -1193,7 +1222,7 @@ ve.init.mw.ViewPageTarget.prototype.resetSaveDialog = function () {
|
|||
*/
|
||||
ve.init.mw.ViewPageTarget.prototype.enableToolbarSaveButton = function () {
|
||||
this.$toolbarSaveButton
|
||||
.removeClass( 've-init-mw-viewPageTarget-toolbar-saveButton-disabled' );
|
||||
.removeClass( 've-init-mw-viewPageTarget-button-disabled' );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -1203,7 +1232,7 @@ ve.init.mw.ViewPageTarget.prototype.enableToolbarSaveButton = function () {
|
|||
*/
|
||||
ve.init.mw.ViewPageTarget.prototype.disableToolbarSaveButton = function () {
|
||||
this.$toolbarSaveButton
|
||||
.addClass( 've-init-mw-viewPageTarget-toolbar-saveButton-disabled' );
|
||||
.addClass( 've-init-mw-viewPageTarget-button-disabled' );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -1213,8 +1242,7 @@ ve.init.mw.ViewPageTarget.prototype.disableToolbarSaveButton = function () {
|
|||
*/
|
||||
ve.init.mw.ViewPageTarget.prototype.unlockSaveDialogSaveButton = function () {
|
||||
this.$saveDialogSaveButton
|
||||
.prop( 'disabled', false )
|
||||
.removeClass( 've-init-mw-viewPageTarget-saveDialog-saveButton-disabled' );
|
||||
.removeClass( 've-init-mw-viewPageTarget-button-disabled' );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -1224,8 +1252,7 @@ ve.init.mw.ViewPageTarget.prototype.unlockSaveDialogSaveButton = function () {
|
|||
*/
|
||||
ve.init.mw.ViewPageTarget.prototype.lockSaveDialogSaveButton = function () {
|
||||
this.$saveDialogSaveButton
|
||||
.prop( 'disabled', true )
|
||||
.addClass( 've-init-mw-viewPageTarget-saveDialog-saveButton-disabled' );
|
||||
.addClass( 've-init-mw-viewPageTarget-button-disabled' );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -1235,8 +1262,7 @@ ve.init.mw.ViewPageTarget.prototype.lockSaveDialogSaveButton = function () {
|
|||
*/
|
||||
ve.init.mw.ViewPageTarget.prototype.unlockSaveDialogDiffButton = function () {
|
||||
this.$saveDialogDiffButton
|
||||
.prop( 'disabled', false )
|
||||
.removeClass( 've-init-mw-viewPageTarget-saveDialog-diffButton-disabled' );
|
||||
.removeClass( 've-init-mw-viewPageTarget-button-disabled' );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -1246,8 +1272,7 @@ ve.init.mw.ViewPageTarget.prototype.unlockSaveDialogDiffButton = function () {
|
|||
*/
|
||||
ve.init.mw.ViewPageTarget.prototype.lockSaveDialogDiffButton = function () {
|
||||
this.$saveDialogDiffButton
|
||||
.prop( 'disabled', true )
|
||||
.addClass( 've-init-mw-viewPageTarget-saveDialog-diffButton-disabled' );
|
||||
.addClass( 've-init-mw-viewPageTarget-button-disabled' );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
|||
Loading…
Reference in a new issue