resources/src/mediawiki.page.watch.ajax.js

   1 /**
   2  * Animate watch/unwatch links to use asynchronous API requests to
   3  * watch pages, rather than navigating to a different URI.
   4  *
   5  * Usage:
   6  *
   7  *     var watch = require( 'mediawiki.page.watch.ajax' );
   8  *     watch.updateWatchLink(
   9  *         $node,
  10  *         'watch',
  11  *         'loading'
  12  *     );
  13  *
  14  * @class mw.plugin.page.watch.ajax
  15  * @singleton
  16  */
  17 ( function () {
  18         var watch,
  19                 // The name of the page to watch or unwatch
  20                 title = mw.config.get( 'wgRelevantPageName' );
  21
  22         /**
  23          * Update the link text, link href attribute and (if applicable)
  24          * "loading" class.
  25          *
  26          * @param {jQuery} $link Anchor tag of (un)watch link
  27          * @param {string} action One of 'watch', 'unwatch'
  28          * @param {string} [state="idle"] 'idle' or 'loading'. Default is 'idle'
  29          */
  30         function updateWatchLink( $link, action, state ) {
  31                 var msgKey, $li, otherAction;
  32
  33                 // A valid but empty jQuery object shouldn't throw a TypeError
  34                 if ( !$link.length ) {
  35                         return;
  36                 }
  37
  38                 // Invalid actions shouldn't silently turn the page in an unrecoverable state
  39                 if ( action !== 'watch' && action !== 'unwatch' ) {
  40                         throw new Error( 'Invalid action' );
  41                 }
  42
  43                 // message keys 'watch', 'watching', 'unwatch' or 'unwatching'.
  44                 msgKey = state === 'loading' ? action + 'ing' : action;
  45                 otherAction = action === 'watch' ? 'unwatch' : 'watch';
  46                 $li = $link.closest( 'li' );
  47
  48                 // Trigger a 'watchpage' event for this List item.
  49                 // Announce the otherAction value as the first param.
  50                 // Used to monitor the state of watch link.
  51                 // TODO: Revise when system wide hooks are implemented
  52                 if ( state === undefined ) {
  53                         $li.trigger( 'watchpage.mw', otherAction );
  54                 }
  55
  56                 $link
  57                         .text( mw.msg( msgKey ) )
  58                         .attr( 'title', mw.msg( 'tooltip-ca-' + action ) )
  59                         .updateTooltipAccessKeys()
  60                         .attr( 'href', mw.util.getUrl( title, { action: action } ) );
  61
  62                 // Most common ID style
  63                 if ( $li.prop( 'id' ) === 'ca-' + otherAction ) {
  64                         $li.prop( 'id', 'ca-' + action );
  65                 }
  66
  67                 if ( state === 'loading' ) {
  68                         $link.addClass( 'loading' );
  69                 } else {
  70                         $link.removeClass( 'loading' );
  71                 }
  72         }
  73
  74         /**
  75          * TODO: This should be moved somewhere more accessible.
  76          *
  77          * @private
  78          * @param {string} url
  79          * @return {string} The extracted action, defaults to 'view'
  80          */
  81         function mwUriGetAction( url ) {
  82                 var action, actionPaths, key, m, parts;
  83
  84                 // TODO: Does MediaWiki give action path or query param
  85                 // precedence? If the former, move this to the bottom
  86                 action = mw.util.getParamValue( 'action', url );
  87                 if ( action !== null ) {
  88                         return action;
  89                 }
  90
  91                 actionPaths = mw.config.get( 'wgActionPaths' );
  92                 for ( key in actionPaths ) {
  93                         parts = actionPaths[ key ].split( '$1' );
  94                         parts = parts.map( mw.RegExp.escape );
  95                         m = new RegExp( parts.join( '(.+)' ) ).exec( url );
  96                         if ( m && m[ 1 ] ) {
  97                                 return key;
  98                         }
  99                 }
 100
 101                 return 'view';
 102         }
 103
 104         // Expose public methods
 105         watch = {
 106                 updateWatchLink: updateWatchLink
 107         };
 108         module.exports = watch;
 109
 110         $( function () {
 111                 var $links = $( '.mw-watchlink a[data-mw="interface"], a.mw-watchlink[data-mw="interface"]' );
 112                 if ( !$links.length ) {
 113                         // Fallback to the class-based exclusion method for backwards-compatibility
 114                         $links = $( '.mw-watchlink a, a.mw-watchlink' );
 115                         // Restrict to core interfaces, ignore user-generated content
 116                         $links = $links.filter( ':not( #bodyContent *, #content * )' );
 117                 }
 118
 119                 $links.click( function ( e ) {
 120                         var mwTitle, action, api, $link;
 121
 122                         mwTitle = mw.Title.newFromText( title );
 123                         action = mwUriGetAction( this.href );
 124
 125                         if ( !mwTitle || ( action !== 'watch' && action !== 'unwatch' ) ) {
 126                                 // Let native browsing handle the link
 127                                 return true;
 128                         }
 129                         e.preventDefault();
 130                         e.stopPropagation();
 131
 132                         $link = $( this );
 133
 134                         if ( $link.hasClass( 'loading' ) ) {
 135                                 return;
 136                         }
 137
 138                         updateWatchLink( $link, action, 'loading' );
 139
 140                         // Preload the notification module for mw.notify
 141                         mw.loader.load( 'mediawiki.notification' );
 142
 143                         api = new mw.Api();
 144
 145                         api[ action ]( title )
 146                                 .done( function ( watchResponse ) {
 147                                         var message, otherAction = action === 'watch' ? 'unwatch' : 'watch';
 148
 149                                         if ( mwTitle.isTalkPage() ) {
 150                                                 message = action === 'watch' ? 'addedwatchtext-talk' : 'removedwatchtext-talk';
 151                                         } else {
 152                                                 message = action === 'watch' ? 'addedwatchtext' : 'removedwatchtext';
 153                                         }
 154
 155                                         mw.notify( mw.message( message, mwTitle.getPrefixedText() ).parseDom(), {
 156                                                 tag: 'watch-self'
 157                                         } );
 158
 159                                         // Set link to opposite
 160                                         updateWatchLink( $link, otherAction );
 161
 162                                         // Update the "Watch this page" checkbox on action=edit when the
 163                                         // page is watched or unwatched via the tab (T14395).
 164                                         $( '#wpWatchthis' ).prop( 'checked', watchResponse.watched === true );
 165                                 } )
 166                                 .fail( function () {
 167                                         var msg, link;
 168
 169                                         // Reset link to non-loading mode
 170                                         updateWatchLink( $link, action );
 171
 172                                         // Format error message
 173                                         link = mw.html.element(
 174                                                 'a', {
 175                                                         href: mw.util.getUrl( title ),
 176                                                         title: mwTitle.getPrefixedText()
 177                                                 }, mwTitle.getPrefixedText()
 178                                         );
 179                                         msg = mw.message( 'watcherrortext', link );
 180
 181                                         // Report to user about the error
 182                                         mw.notify( msg, {
 183                                                 tag: 'watch-self',
 184                                                 type: 'error'
 185                                         } );
 186                                 } );
 187                 } );
 188         } );
 189
 190 }() );