2017-02-14 19:19:06 +00:00
|
|
|
var $ = jQuery,
|
|
|
|
mw = window.mediaWiki,
|
|
|
|
actions = {},
|
|
|
|
types = require( './actionTypes' ),
|
2017-02-27 16:10:50 +00:00
|
|
|
wait = require( './wait' ),
|
2017-03-24 05:33:50 +00:00
|
|
|
|
|
|
|
// See the following for context around this value.
|
|
|
|
//
|
|
|
|
// * https://phabricator.wikimedia.org/T161284
|
|
|
|
// * https://phabricator.wikimedia.org/T70861#3129780
|
|
|
|
FETCH_START_DELAY = 150, // ms.
|
2017-02-14 19:19:06 +00:00
|
|
|
|
2017-03-26 18:19:24 +00:00
|
|
|
// The delay after which a FETCH_COMPLETE action should be dispatched.
|
2017-02-14 19:19:06 +00:00
|
|
|
//
|
|
|
|
// If the API endpoint responds faster than 500 ms (or, say, the API
|
|
|
|
// response is served from the UA's cache), then we introduce a delay of
|
2017-03-26 18:19:24 +00:00
|
|
|
// 500 - t to make the preview delay consistent to the user.
|
|
|
|
FETCH_COMPLETE_TARGET_DELAY = 500, // ms.
|
2017-02-14 19:19:06 +00:00
|
|
|
|
|
|
|
ABANDON_END_DELAY = 300; // ms.
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Mixes in timing information to an action.
|
|
|
|
*
|
|
|
|
* Warning: the `baseAction` parameter is modified and returned.
|
|
|
|
*
|
|
|
|
* @param {Object} baseAction
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
function timedAction( baseAction ) {
|
|
|
|
baseAction.timestamp = mw.now();
|
|
|
|
|
|
|
|
return baseAction;
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents Page Previews booting.
|
|
|
|
*
|
|
|
|
* When a Redux store is created, the `@@INIT` action is immediately
|
|
|
|
* dispatched to it. To avoid overriding the term, we refer to booting rather
|
|
|
|
* than initializing.
|
|
|
|
*
|
|
|
|
* Page Previews persists critical pieces of information to local storage.
|
|
|
|
* Since reading from and writing to local storage are synchronous, Page
|
|
|
|
* Previews is booted when the browser is idle (using
|
|
|
|
* [`mw.requestIdleCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Window/requestIdleCallback))
|
|
|
|
* so as not to impact latency-critical events.
|
|
|
|
*
|
2017-03-03 11:19:46 +00:00
|
|
|
* @param {Boolean} isEnabled See `isEnabled.js`
|
2017-02-14 19:19:06 +00:00
|
|
|
* @param {mw.user} user
|
|
|
|
* @param {ext.popups.UserSettings} userSettings
|
|
|
|
* @param {Function} generateToken
|
|
|
|
* @param {mw.Map} config The config of the MediaWiki client-side application,
|
|
|
|
* i.e. `mw.config`
|
|
|
|
* @returns {Object}
|
|
|
|
*/
|
|
|
|
actions.boot = function (
|
|
|
|
isEnabled,
|
|
|
|
user,
|
|
|
|
userSettings,
|
|
|
|
generateToken,
|
|
|
|
config
|
|
|
|
) {
|
|
|
|
var editCount = config.get( 'wgUserEditCount' ),
|
|
|
|
previewCount = userSettings.getPreviewCount();
|
|
|
|
|
|
|
|
return {
|
|
|
|
type: types.BOOT,
|
|
|
|
isEnabled: isEnabled,
|
|
|
|
isNavPopupsEnabled: config.get( 'wgPopupsConflictsWithNavPopupGadget' ),
|
|
|
|
sessionToken: user.sessionId(),
|
|
|
|
pageToken: generateToken(),
|
|
|
|
page: {
|
|
|
|
title: config.get( 'wgTitle' ),
|
|
|
|
namespaceID: config.get( 'wgNamespaceNumber' ),
|
|
|
|
id: config.get( 'wgArticleId' )
|
|
|
|
},
|
|
|
|
user: {
|
|
|
|
isAnon: user.isAnon(),
|
|
|
|
editCount: editCount,
|
|
|
|
previewCount: previewCount
|
|
|
|
}
|
2016-11-08 19:42:21 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents Page Previews fetching data via the gateway.
|
|
|
|
*
|
|
|
|
* @param {ext.popups.Gateway} gateway
|
|
|
|
* @param {Element} el
|
|
|
|
* @return {Redux.Thunk}
|
|
|
|
*/
|
2017-03-26 23:18:29 +00:00
|
|
|
actions.fetch = function ( gateway, el ) {
|
2017-02-14 19:19:06 +00:00
|
|
|
var title = $( el ).data( 'page-previews-title' );
|
|
|
|
|
|
|
|
return function ( dispatch ) {
|
2017-03-26 23:18:29 +00:00
|
|
|
var request;
|
|
|
|
|
2017-03-07 00:27:38 +00:00
|
|
|
dispatch( timedAction( {
|
2017-02-14 19:19:06 +00:00
|
|
|
type: types.FETCH_START,
|
|
|
|
el: el,
|
|
|
|
title: title
|
2017-03-07 00:27:38 +00:00
|
|
|
} ) );
|
Add reading depth
Use schema revision 16163887.
Add the 'checkin' action, which is accompanied by the 'checkin'
property. The action is logged at the following seconds
(Fibonacci numbers) after the page loads: 1, 2, 3, 5, 8, 13, 21,
34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765.
The `checkin` property contains the values listed above.
Bug: T147314
Change-Id: Ib9ec7bd0e60aa34a04e32222b025347f6ee31794
2016-12-13 22:52:20 +00:00
|
|
|
|
2017-03-26 23:18:29 +00:00
|
|
|
request = gateway.getPageSummary( title )
|
|
|
|
.then( function ( result ) {
|
|
|
|
dispatch( timedAction( {
|
|
|
|
type: types.FETCH_END,
|
|
|
|
el: el
|
|
|
|
} ) );
|
|
|
|
|
|
|
|
return result;
|
|
|
|
} )
|
2017-02-14 19:19:06 +00:00
|
|
|
.fail( function () {
|
|
|
|
dispatch( {
|
|
|
|
type: types.FETCH_FAILED,
|
|
|
|
el: el
|
2016-11-16 19:45:10 +00:00
|
|
|
} );
|
2017-03-26 23:18:29 +00:00
|
|
|
} );
|
2017-02-14 19:19:06 +00:00
|
|
|
|
2017-04-06 20:12:19 +00:00
|
|
|
$.when( request, wait( FETCH_COMPLETE_TARGET_DELAY - FETCH_START_DELAY ) )
|
2017-03-26 23:18:29 +00:00
|
|
|
.then( function ( result ) {
|
2017-03-26 19:13:56 +00:00
|
|
|
dispatch( timedAction( {
|
2017-03-26 23:18:29 +00:00
|
|
|
type: types.FETCH_COMPLETE,
|
|
|
|
el: el,
|
|
|
|
result: result
|
2017-03-26 19:13:56 +00:00
|
|
|
} ) );
|
2016-12-19 12:53:11 +00:00
|
|
|
} );
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user dwelling on a link, either by hovering over it with
|
|
|
|
* their mouse or by focussing it using their keyboard or an assistive device.
|
|
|
|
*
|
|
|
|
* @param {Element} el
|
|
|
|
* @param {Event} event
|
|
|
|
* @param {ext.popups.Gateway} gateway
|
|
|
|
* @param {Function} generateToken
|
|
|
|
* @return {Redux.Thunk}
|
|
|
|
*/
|
|
|
|
actions.linkDwell = function ( el, event, gateway, generateToken ) {
|
|
|
|
var token = generateToken();
|
|
|
|
|
|
|
|
return function ( dispatch, getState ) {
|
|
|
|
var action = timedAction( {
|
|
|
|
type: types.LINK_DWELL,
|
|
|
|
el: el,
|
|
|
|
event: event,
|
|
|
|
token: token
|
|
|
|
} );
|
2016-12-19 12:53:11 +00:00
|
|
|
|
2017-02-14 19:19:06 +00:00
|
|
|
// Has the new generated token been accepted?
|
|
|
|
function isNewInteraction() {
|
|
|
|
return getState().preview.activeToken === token;
|
|
|
|
}
|
2017-01-10 23:23:40 +00:00
|
|
|
|
2017-02-14 19:19:06 +00:00
|
|
|
dispatch( action );
|
2016-11-16 19:45:10 +00:00
|
|
|
|
2017-02-14 19:19:06 +00:00
|
|
|
if ( !isNewInteraction() ) {
|
|
|
|
return;
|
|
|
|
}
|
2017-01-10 23:23:40 +00:00
|
|
|
|
2017-02-27 16:10:50 +00:00
|
|
|
wait( FETCH_START_DELAY )
|
2017-02-14 19:19:06 +00:00
|
|
|
.then( function () {
|
|
|
|
var previewState = getState().preview;
|
2016-11-25 21:22:09 +00:00
|
|
|
|
2017-02-14 19:19:06 +00:00
|
|
|
if ( previewState.enabled && isNewInteraction() ) {
|
2017-03-26 23:18:29 +00:00
|
|
|
dispatch( actions.fetch( gateway, el ) );
|
2017-02-14 19:19:06 +00:00
|
|
|
}
|
|
|
|
} );
|
2016-11-09 11:57:24 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user abandoning a link, either by moving their mouse away
|
|
|
|
* from it or by shifting focus to another UI element using their keyboard or
|
|
|
|
* an assistive device, or abandoning a preview by moving their mouse away
|
|
|
|
* from it.
|
|
|
|
*
|
|
|
|
* @return {Redux.Thunk}
|
|
|
|
*/
|
|
|
|
actions.abandon = function () {
|
|
|
|
return function ( dispatch, getState ) {
|
|
|
|
var token = getState().preview.activeToken;
|
|
|
|
|
|
|
|
dispatch( timedAction( {
|
|
|
|
type: types.ABANDON_START,
|
|
|
|
token: token
|
|
|
|
} ) );
|
|
|
|
|
2017-02-27 16:10:50 +00:00
|
|
|
wait( ABANDON_END_DELAY )
|
2017-02-14 19:19:06 +00:00
|
|
|
.then( function () {
|
|
|
|
dispatch( {
|
|
|
|
type: types.ABANDON_END,
|
|
|
|
token: token
|
2016-11-28 12:00:07 +00:00
|
|
|
} );
|
2017-02-14 19:19:06 +00:00
|
|
|
} );
|
2016-11-28 12:00:07 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user clicking on a link with their mouse, keyboard, or an
|
|
|
|
* assistive device.
|
|
|
|
*
|
|
|
|
* @param {Element} el
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.linkClick = function ( el ) {
|
|
|
|
return timedAction( {
|
|
|
|
type: types.LINK_CLICK,
|
|
|
|
el: el
|
|
|
|
} );
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user dwelling on a preview with their mouse.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.previewDwell = function () {
|
|
|
|
return {
|
|
|
|
type: types.PREVIEW_DWELL
|
2016-12-05 11:56:51 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents a preview being shown to the user.
|
|
|
|
*
|
2017-03-03 11:19:46 +00:00
|
|
|
* This action is dispatched by the `./changeListeners/render.js` change
|
2017-02-14 19:19:06 +00:00
|
|
|
* listener.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.previewShow = function () {
|
|
|
|
return timedAction( {
|
|
|
|
type: types.PREVIEW_SHOW
|
|
|
|
} );
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user clicking either the "Enable previews" footer menu link,
|
|
|
|
* or the "cog" icon that's present on each preview.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.showSettings = function () {
|
|
|
|
return {
|
|
|
|
type: types.SETTINGS_SHOW
|
2016-12-12 17:17:41 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user closing the settings dialog and saving their settings.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.hideSettings = function () {
|
|
|
|
return {
|
|
|
|
type: types.SETTINGS_HIDE
|
2016-11-15 18:18:13 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user saving their settings.
|
|
|
|
*
|
|
|
|
* N.B. This action returns a Redux.Thunk not because it needs to perform
|
|
|
|
* asynchronous work, but because it needs to query the global state for the
|
|
|
|
* current enabled state. In order to keep the enabled state in a single
|
|
|
|
* place (the preview reducer), we query it and dispatch it as `wasEnabled`
|
|
|
|
* so that other reducers (like settings) can act on it without having to
|
|
|
|
* duplicate the `enabled` state locally.
|
|
|
|
* See doc/adr/0003-keep-enabled-state-only-in-preview-reducer.md for more
|
|
|
|
* details.
|
|
|
|
*
|
|
|
|
* @param {Boolean} enabled if previews are enabled or not
|
|
|
|
* @return {Redux.Thunk}
|
|
|
|
*/
|
|
|
|
actions.saveSettings = function ( enabled ) {
|
|
|
|
return function ( dispatch, getState ) {
|
|
|
|
dispatch( {
|
|
|
|
type: types.SETTINGS_CHANGE,
|
|
|
|
wasEnabled: getState().preview.enabled,
|
|
|
|
enabled: enabled
|
|
|
|
} );
|
2016-12-12 19:26:55 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
2017-03-03 11:19:46 +00:00
|
|
|
* Represents the queued event being logged `changeListeners/eventLogging.js`
|
|
|
|
* change listener.
|
2017-02-14 19:19:06 +00:00
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.eventLogged = function () {
|
|
|
|
return {
|
|
|
|
type: types.EVENT_LOGGED
|
2016-11-30 13:40:08 +00:00
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
};
|
2016-11-30 13:40:08 +00:00
|
|
|
|
2017-03-07 00:27:38 +00:00
|
|
|
/**
|
|
|
|
* Represents the queued statsv event being logged.
|
|
|
|
* See `mw.popups.changeListeners.statsv` change listener.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.statsvLogged = function () {
|
|
|
|
return {
|
|
|
|
type: types.STATSV_LOGGED
|
|
|
|
};
|
|
|
|
};
|
2017-02-14 19:19:06 +00:00
|
|
|
module.exports = actions;
|