Migrate Extension:PostEdit interface to core

As requested by the VisualEditor team, this change migrates the post-edit
confirmation notice from Extension:PostEdit to core.

This entails porting the 'postedit-confirmation' en/qqq message from the
extension's i18n file (the message key remains the same) to the appropriate
message files and augmenting mediawiki.action.view.postEdit.js to not only
signal post-edit state but also act on it by displaying the confirmation.

Bug: 48276
Change-Id: I01cfc0630c3a505af82922844b5e70c1d61f3c1d

diff --git a/RELEASE-NOTES-1.22 b/RELEASE-NOTES-1.22
index 1591fa9..c101bc9 100644 (file)
--- a/RELEASE-NOTES-1.22
+++ b/RELEASE-NOTES-1.22
@@ -196,6 +196,8 @@ changes to languages because of Bugzilla reports.
   is_chrome, webkit_version, is_safari_win, is_safari, webkit_match, is_ff2,
   ff2_bugs, is_ff2_win, is_ff2_x11, opera95_bugs, opera7_bugs, opera6_bugs,
   is_opera_95, is_opera_preseven, is_opera, and ie6_bugs.
+* (bug 48276) MediaWiki will now flash a confirmation message upon successfully
+  editing a page.
 
 == Compatibility ==
 

diff --git a/languages/messages/MessagesEn.php b/languages/messages/MessagesEn.php
index 7d632ff..838a9fc 100644 (file)
--- a/languages/messages/MessagesEn.php
+++ b/languages/messages/MessagesEn.php
@@ -1542,6 +1542,7 @@ It gave no explanation.',
 It appears to have been deleted.',
 'edit-conflict'                    => 'Edit conflict.',
 'edit-no-change'                   => 'Your edit was ignored because no change was made to the text.',
+'postedit-confirmation'            => 'Your edit was saved.',
 'edit-already-exists'              => 'Could not create a new page.
 It already exists.',
 'addsection-preload'               => '', # do not translate or duplicate this message to other languages

diff --git a/languages/messages/MessagesQqq.php b/languages/messages/MessagesQqq.php
index bfa8c18..498a489 100644 (file)
--- a/languages/messages/MessagesQqq.php
+++ b/languages/messages/MessagesQqq.php
@@ -1715,6 +1715,7 @@ See also:
 * {{msg-mw|edit-gone-missing}}
 * {{msg-mw|edit-conflict}}
 * {{msg-mw|edit-already-exists}}',
+'postedit-confirmation' => 'Confirmation message that is displayed upon successful edit. Parameter $1 is the current user, for GENDER support.',
 'edit-already-exists' => 'Used as error message.
 
 See also:

diff --git a/resources/Resources.php b/resources/Resources.php
index 7361b72..90f613e 100644 (file)
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -741,7 +741,14 @@ return array(
        ),
        'mediawiki.action.view.postEdit' => array(
                'scripts' => 'resources/mediawiki.action/mediawiki.action.view.postEdit.js',
-               'dependencies' => 'jquery.cookie'
+               'styles' => 'resources/mediawiki.action/mediawiki.action.view.postEdit.css',
+               'dependencies' => array(
+                       'jquery.cookie',
+                       'mediawiki.jqueryMsg'
+               ),
+               'messages' => array(
+                       'postedit-confirmation',
+               ),
        ),
        'mediawiki.action.view.rightClickEdit' => array(
                'scripts' => 'resources/mediawiki.action/mediawiki.action.view.rightClickEdit.js',

diff --git a/resources/mediawiki.action/images/green-checkmark.png b/resources/mediawiki.action/images/green-checkmark.png
new file mode 100644 (file)
index 0000000..8ec604e
Binary files /dev/null and b/resources/mediawiki.action/images/green-checkmark.png differ

diff --git a/resources/mediawiki.action/mediawiki.action.view.postEdit.css b/resources/mediawiki.action/mediawiki.action.view.postEdit.css
new file mode 100644 (file)
index 0000000..96cb395
--- /dev/null
+++ b/resources/mediawiki.action/mediawiki.action.view.postEdit.css
@@ -0,0 +1,81 @@
+.postedit-container {
+       margin: 0 auto;
+       position: fixed;
+       top: 0;
+       height: 0;
+       left: 50%;
+       z-index: 1000;
+}
+
+.postedit {
+       position: relative;
+       top: 0.6em;
+       left: -50%;
+       padding: .6em 3.6em .6em 1.1em;
+       font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+       font-size: 0.8em;
+       line-height: 1.5625em;
+       color: #626465;
+       /* @embed */
+       background-color: #f4f4f4;
+       border: 1px solid #dcd9d9;
+       -webkit-text-shadow: 0 0.0625em 0 rgba(255, 255, 255, 0.5);
+       -moz-text-shadow: 0 0.0625em 0 rgba(255, 255, 255, 0.5);
+       text-shadow: 0 0.0625em 0 rgba(255, 255, 255, 0.5);
+       -webkit-border-radius: 5px;
+       -moz-border-radius: 5px;
+       border-radius: 5px;
+       -webkit-box-shadow: 0 2px 5px 0 #ccc;
+       -moz-box-shadow: 0 2px 5px 0 #ccc;
+       box-shadow: 0 2px 5px 0 #ccc;
+       -webkit-transition: all 0.25s ease-in-out;
+       -moz-transition: all 0.25s ease-in-out;
+       -ms-transition: all 0.25s ease-in-out;
+       -o-transition: all 0.25s ease-in-out;
+       transition: all 0.25s ease-in-out;
+}
+
+.skin-monobook .postedit {
+       top: 3em !important;
+}
+
+.postedit-faded {
+       opacity: 0;
+}
+
+.postedit-icon {
+       padding-left: 41px; /* 25 + 8 + 8 */
+       /* like min-height, but old IE compatible and keeps text vertically aligned, too */
+       line-height: 25px;
+       background-repeat: no-repeat;
+       background-position: 8px 50%;
+}
+
+.postedit-icon-checkmark {
+       /* @embed */
+       background-image: url(images/green-checkmark.png);
+       background-position: left;
+}
+
+.postedit-close {
+       position: absolute;
+       padding: 0 .8em;
+       right: 0;
+       top: 0;
+       font-size: 1.25em;
+       font-weight: bold;
+       line-height: 2.3em;
+       color: black;
+       text-shadow: 0 0.0625em 0 white;
+       text-decoration: none;
+       opacity: 0.2;
+       filter: alpha(opacity=20);
+}
+
+.postedit-close:hover {
+       color: black;
+       text-decoration: none;
+       cursor: pointer;
+       opacity: 0.4;
+       filter: alpha(opacity=40);
+}

diff --git a/resources/mediawiki.action/mediawiki.action.view.postEdit.js b/resources/mediawiki.action/mediawiki.action.view.postEdit.js
index a11233f..e7a3e3c 100644 (file)
--- a/resources/mediawiki.action/mediawiki.action.view.postEdit.js
+++ b/resources/mediawiki.action/mediawiki.action.view.postEdit.js
@@ -1,15 +1,45 @@
 ( function ( mw, $ ) {
-       // Only a view can be a post-edit.
-       if ( mw.config.get( 'wgAction' ) !== 'view' ) {
+       'use strict';
+
+       var config = mw.config.get( [ 'wgAction', 'wgCookiePrefix', 'wgCurRevisionId' ] ),
+               // This should match EditPage::POST_EDIT_COOKIE_KEY_PREFIX:
+               cookieKey = config.wgCookiePrefix + 'PostEditRevision' + config.wgCurRevisionId,
+               div, id;
+
+       if ( config.wgAction !== 'view' || $.cookie( cookieKey ) !== '1' ) {
                return;
        }
 
-       // Matches EditPage::POST_EDIT_COOKIE_KEY_PREFIX
-       var cookieKey = mw.config.get( 'wgCookiePrefix' ) + 'PostEditRevision' + mw.config.get( 'wgCurRevisionId' );
+       $.cookie( cookieKey, null, { path: '/' } );
+       mw.config.set( 'wgPostEdit', true );
+
+       function removeConfirmation() {
+               div.parentNode.removeChild( div );
+               mw.hook( 'postEdit.afterRemoval' ).fire();
+       }
+
+       function fadeOutConfirmation() {
+               clearTimeout( id );
+               div.firstChild.className = 'postedit postedit-faded';
+               setTimeout( removeConfirmation, 500 );
+               return false;
+       }
 
-       if ( $.cookie( cookieKey ) === '1' ) {
-               // We just saved this page
-               $.cookie( cookieKey, null, { path: '/' } );
-               mw.config.set( 'wgPostEdit', true );
+       function showConfirmation() {
+               div = document.createElement( 'div' );
+               div.className = 'postedit-container';
+               div.innerHTML =
+                       '<div class="postedit">' +
+                               '<div class="postedit-icon postedit-icon-checkmark">' +
+                                       mw.message( 'postedit-confirmation', mw.user ).escaped() +
+                               '</div>' +
+                               '<a href="#" class="postedit-close">&times;</a>' +
+                       '</div>';
+               id = setTimeout( fadeOutConfirmation, 3000 );
+               div.firstChild.lastChild.onclick = fadeOutConfirmation;
+               document.body.insertBefore( div, document.body.firstChild );
        }
+
+       mw.hook( 'postEdit' ).add( showConfirmation ).fire();
+
 } ( mediaWiki, jQuery ) );