mediawiki.notification: Add message type with predefined styles

New option.type to select a predefined style.

Default styles with colors:
* warn: yellow
* error: red
Other styles can be added.

Bug: T61099
Change-Id: I2d7305d9b62ebddc70e7f787e76e752b8b78d570

diff --git a/resources/src/mediawiki.page/mediawiki.page.patrol.ajax.js b/resources/src/mediawiki.page/mediawiki.page.patrol.ajax.js
index 3da1d14..f9b0d35 100644 (file)
--- a/resources/src/mediawiki.page/mediawiki.page.patrol.ajax.js
+++ b/resources/src/mediawiki.page/mediawiki.page.patrol.ajax.js
@@ -43,7 +43,7 @@
                                        mw.notify( mw.msg( 'markedaspatrollednotify', title.toText() ) );
                                } else {
                                        // This should never happen as errors should trigger fail
-                                       mw.notify( mw.msg( 'markedaspatrollederrornotify' ) );
+                                       mw.notify( mw.msg( 'markedaspatrollederrornotify' ), { type: 'error' } );
                                }
                        } )
                        .fail( function ( error ) {
@@ -53,9 +53,9 @@
                                $patrolLinks.show();
                                if ( error === 'noautopatrol' ) {
                                        // Can't patrol own
-                                       mw.notify( mw.msg( 'markedaspatrollederror-noautopatrol' ) );
+                                       mw.notify( mw.msg( 'markedaspatrollederror-noautopatrol' ), { type: 'warn' } );
                                } else {
-                                       mw.notify( mw.msg( 'markedaspatrollederrornotify' ) );
+                                       mw.notify( mw.msg( 'markedaspatrollederrornotify' ), { type: 'error' } );
                                }
                        } );
 

diff --git a/resources/src/mediawiki.page/mediawiki.page.watch.ajax.js b/resources/src/mediawiki.page/mediawiki.page.watch.ajax.js
index cc1ffb7..9724c56 100644 (file)
--- a/resources/src/mediawiki.page/mediawiki.page.watch.ajax.js
+++ b/resources/src/mediawiki.page/mediawiki.page.watch.ajax.js
@@ -170,7 +170,10 @@
                                        msg = mw.message( 'watcherrortext', link );
 
                                        // Report to user about the error
-                                       mw.notify( msg, { tag: 'watch-self' } );
+                                       mw.notify( msg, {
+                                               tag: 'watch-self',
+                                               type: 'error'
+                                       } );
                                } );
                } );
        } );

diff --git a/resources/src/mediawiki.special/mediawiki.special.unwatchedPages.js b/resources/src/mediawiki.special/mediawiki.special.unwatchedPages.js
index 8d3e86a..7628ff8 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.unwatchedPages.js
+++ b/resources/src/mediawiki.special/mediawiki.special.unwatchedPages.js
@@ -28,7 +28,7 @@
                                        mw.notify( mw.msg( 'addedwatchtext-short', title ) );
                                } ).fail( function () {
                                        $link.text( mw.msg( 'watch' ) );
-                                       mw.notify( mw.msg( 'watcherrortext', title ) );
+                                       mw.notify( mw.msg( 'watcherrortext', title ), { type: 'error' } );
                                } );
                        } else {
                                $link.text( mw.msg( 'unwatching' ) );
@@ -38,7 +38,7 @@
                                        mw.notify( mw.msg( 'removedwatchtext-short', title ) );
                                } ).fail( function () {
                                        $link.text( mw.msg( 'unwatch' ) );
-                                       mw.notify( mw.msg( 'watcherrortext', title ) );
+                                       mw.notify( mw.msg( 'watcherrortext', title ), { type: 'error' } );
                                } );
                        }
 

diff --git a/resources/src/mediawiki/mediawiki.notification.css b/resources/src/mediawiki/mediawiki.notification.css
index 954de22..632ae82 100644 (file)
--- a/resources/src/mediawiki/mediawiki.notification.css
+++ b/resources/src/mediawiki/mediawiki.notification.css
@@ -20,3 +20,13 @@
 .mw-notification-title {
        font-weight: bold;
 }
+
+.mw-notification-type-warn {
+       border-color: #F5BE00; /* yellow */
+       background-color: #FFFFE8;
+}
+
+.mw-notification-type-error {
+       border-color: #EB3941; /* red */
+       background-color: #FFF8F8;
+}

diff --git a/resources/src/mediawiki/mediawiki.notification.js b/resources/src/mediawiki/mediawiki.notification.js
index 132c334..004e710 100644 (file)
--- a/resources/src/mediawiki/mediawiki.notification.js
+++ b/resources/src/mediawiki/mediawiki.notification.js
@@ -39,6 +39,12 @@
                        }
                }
 
+               if ( options.type ) {
+                       // Sanitize options.type
+                       options.type = options.type.replace( /[ _\-]+/g, '-' ).replace( /[^\-a-z0-9]+/ig, '' );
+                       $notification.addClass( 'mw-notification-type-' + options.type );
+               }
+
                if ( options.title ) {
                        $notificationTitle = $( '<div class="mw-notification-title"></div>' )
                                .text( options.title )
@@ -479,11 +485,16 @@
                 * - title:
                 *   An optional title for the notification. Will be displayed above the
                 *   content. Usually in bold.
+                *
+                * - type:
+                *   An optional string for the type of the message used for styling:
+                *   Examples: 'info', 'warn', 'error'.
                 */
                defaults: {
                        autoHide: true,
                        tag: false,
-                       title: undefined
+                       title: undefined,
+                       type: false
                },
 
                /**