2016-11-16 19:45:10 +00:00
|
|
|
( function ( mw, $ ) {
|
2016-11-08 19:42:21 +00:00
|
|
|
|
2016-11-10 18:02:29 +00:00
|
|
|
var actions = {},
|
|
|
|
types = {
|
|
|
|
BOOT: 'BOOT',
|
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
|
|
|
CHECKIN: 'CHECKIN',
|
2016-11-10 18:02:29 +00:00
|
|
|
LINK_DWELL: 'LINK_DWELL',
|
2016-11-28 12:00:07 +00:00
|
|
|
LINK_ABANDON_START: 'LINK_ABANDON_START',
|
|
|
|
LINK_ABANDON_END: 'LINK_ABANDON_END',
|
2016-11-10 18:02:29 +00:00
|
|
|
LINK_CLICK: 'LINK_CLICK',
|
|
|
|
FETCH_START: 'FETCH_START',
|
|
|
|
FETCH_END: 'FETCH_END',
|
|
|
|
FETCH_FAILED: 'FETCH_FAILED',
|
2016-11-28 12:00:07 +00:00
|
|
|
PREVIEW_DWELL: 'PREVIEW_DWELL',
|
|
|
|
PREVIEW_ABANDON_START: 'PREVIEW_ABANDON_START',
|
|
|
|
PREVIEW_ABANDON_END: 'PREVIEW_ABANDON_END',
|
2016-12-12 12:54:33 +00:00
|
|
|
PREVIEW_ANIMATING: 'PREVIEW_ANIMATING',
|
|
|
|
PREVIEW_INTERACTIVE: 'PREVIEW_INTERACTIVE',
|
2016-12-05 11:56:51 +00:00
|
|
|
PREVIEW_SHOW: 'PREVIEW_SHOW',
|
2016-12-12 12:54:33 +00:00
|
|
|
PREVIEW_CLICK: 'PREVIEW_CLICK',
|
2016-12-12 17:17:41 +00:00
|
|
|
SETTINGS_SHOW: 'SETTINGS_SHOW',
|
|
|
|
SETTINGS_HIDE: 'SETTINGS_HIDE',
|
2016-12-13 18:04:03 +00:00
|
|
|
SETTINGS_CHANGE: 'SETTINGS_CHANGE',
|
2016-11-30 13:40:08 +00:00
|
|
|
EVENT_LOGGED: 'EVENT_LOGGED'
|
2016-11-16 19:45:10 +00:00
|
|
|
},
|
2016-12-14 06:48:07 +00:00
|
|
|
FETCH_START_DELAY = 50, // ms.
|
2016-12-19 12:53:11 +00:00
|
|
|
|
|
|
|
// The delay after which a FETCH_END action should be dispatched.
|
|
|
|
//
|
|
|
|
// 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
|
|
|
|
// 300 - t to make the preview delay consistent to the user.
|
|
|
|
FETCH_END_TARGET_DELAY = 500, // ms.
|
|
|
|
|
2016-11-28 12:00:07 +00:00
|
|
|
ABANDON_END_DELAY = 300; // ms.
|
2016-11-08 19:42:21 +00:00
|
|
|
|
2016-12-06 14:02:13 +00:00
|
|
|
/**
|
|
|
|
* 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;
|
|
|
|
}
|
|
|
|
|
2016-11-08 19:42:21 +00:00
|
|
|
/**
|
2016-11-17 21:53:21 +00:00
|
|
|
* Represents Page Previews booting.
|
2016-11-14 19:37:11 +00:00
|
|
|
*
|
|
|
|
* 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.
|
|
|
|
*
|
2016-11-17 21:53:21 +00:00
|
|
|
* Page Previews persists critical pieces of information to local storage.
|
|
|
|
* Since reading from and writing to local storage are synchronous, Page
|
2016-11-14 19:37:11 +00:00
|
|
|
* 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.
|
|
|
|
*
|
2016-12-14 14:24:21 +00:00
|
|
|
* @param {Boolean} isEnabled See `mw.popups.isEnabled`
|
2016-11-30 13:40:08 +00:00
|
|
|
* @param {mw.user} user
|
2016-12-01 14:56:46 +00:00
|
|
|
* @param {ext.popups.UserSettings} userSettings
|
2016-11-14 19:37:11 +00:00
|
|
|
* @param {Function} generateToken
|
2016-11-30 13:40:08 +00:00
|
|
|
* @param {mw.Map} config The config of the MediaWiki client-side application,
|
|
|
|
* i.e. `mw.config`
|
2016-12-16 11:11:54 +00:00
|
|
|
* @returns {Object}
|
2016-11-08 19:42:21 +00:00
|
|
|
*/
|
2016-12-01 14:56:46 +00:00
|
|
|
actions.boot = function (
|
2016-12-14 14:24:21 +00:00
|
|
|
isEnabled,
|
2016-12-01 14:56:46 +00:00
|
|
|
user,
|
|
|
|
userSettings,
|
|
|
|
generateToken,
|
|
|
|
config
|
|
|
|
) {
|
|
|
|
var editCount = config.get( 'wgUserEditCount' ),
|
|
|
|
previewCount = userSettings.getPreviewCount();
|
2016-12-01 13:12:29 +00:00
|
|
|
|
2016-11-08 19:42:21 +00:00
|
|
|
return {
|
2016-11-10 18:02:29 +00:00
|
|
|
type: types.BOOT,
|
2016-12-14 14:24:21 +00:00
|
|
|
isEnabled: isEnabled,
|
2016-11-30 13:40:08 +00:00
|
|
|
sessionToken: user.sessionId(),
|
|
|
|
pageToken: generateToken(),
|
|
|
|
page: {
|
|
|
|
title: config.get( 'wgTitle' ),
|
|
|
|
namespaceID: config.get( 'wgNamespaceNumber' ),
|
|
|
|
id: config.get( 'wgArticleId' )
|
|
|
|
},
|
2016-12-01 13:12:29 +00:00
|
|
|
user: {
|
|
|
|
isAnon: user.isAnon(),
|
2016-12-01 14:56:46 +00:00
|
|
|
editCount: editCount,
|
|
|
|
previewCount: previewCount
|
2016-12-01 13:12:29 +00:00
|
|
|
}
|
2016-11-08 19:42:21 +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
|
|
|
/**
|
|
|
|
* How long has the user been actively reading the page?
|
|
|
|
* @param {number} time The number of seconds the user has seen the page
|
|
|
|
* @returns {{type: string, time: number}}
|
|
|
|
*/
|
|
|
|
actions.checkin = function ( time ) {
|
|
|
|
return {
|
|
|
|
type: types.CHECKIN,
|
|
|
|
time: time
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2016-11-16 19:45:10 +00:00
|
|
|
/**
|
2016-12-19 12:53:11 +00:00
|
|
|
* Represents Page Previews fetching data via the gateway.
|
2016-11-16 19:45:10 +00:00
|
|
|
*
|
|
|
|
* @param {ext.popups.Gateway} gateway
|
2016-11-25 12:42:02 +00:00
|
|
|
* @param {Element} el
|
2016-12-19 12:53:11 +00:00
|
|
|
* @param {Date} started The time at which the interaction started.
|
2016-11-16 19:45:10 +00:00
|
|
|
* @return {Redux.Thunk}
|
|
|
|
*/
|
2016-12-19 12:53:11 +00:00
|
|
|
actions.fetch = function ( gateway, el, started ) {
|
2016-11-25 12:42:02 +00:00
|
|
|
var title = $( el ).data( 'page-previews-title' );
|
|
|
|
|
2016-11-16 19:45:10 +00:00
|
|
|
return function ( dispatch ) {
|
|
|
|
dispatch( {
|
|
|
|
type: types.FETCH_START,
|
2016-11-25 12:42:02 +00:00
|
|
|
el: el,
|
2016-11-16 19:45:10 +00:00
|
|
|
title: title
|
|
|
|
} );
|
|
|
|
|
|
|
|
gateway( title )
|
|
|
|
.fail( function () {
|
|
|
|
dispatch( {
|
2016-11-25 12:42:02 +00:00
|
|
|
type: types.FETCH_FAILED,
|
|
|
|
el: el
|
2016-11-16 19:45:10 +00:00
|
|
|
} );
|
|
|
|
} )
|
|
|
|
.done( function ( result ) {
|
2016-12-19 12:53:11 +00:00
|
|
|
var now = mw.now(),
|
|
|
|
delay;
|
|
|
|
|
|
|
|
// If the API request has taken longer than the target delay, then
|
|
|
|
// don't delay any further.
|
|
|
|
delay = Math.max(
|
|
|
|
FETCH_END_TARGET_DELAY - Math.round( now - started ),
|
|
|
|
0
|
|
|
|
);
|
|
|
|
|
|
|
|
mw.popups.wait( delay )
|
|
|
|
.then( function () {
|
|
|
|
dispatch( {
|
|
|
|
type: types.FETCH_END,
|
|
|
|
el: el,
|
|
|
|
result: result
|
|
|
|
} );
|
|
|
|
} );
|
2016-11-16 19:45:10 +00:00
|
|
|
} );
|
|
|
|
};
|
2016-12-19 12:53:11 +00:00
|
|
|
};
|
2016-11-16 19:45:10 +00:00
|
|
|
|
2016-11-09 11:57:24 +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.
|
|
|
|
*
|
2016-11-16 19:45:10 +00:00
|
|
|
* @param {Element} el
|
2016-11-21 11:08:06 +00:00
|
|
|
* @param {Event} event
|
|
|
|
* @param {ext.popups.Gateway} gateway
|
2016-12-06 14:02:13 +00:00
|
|
|
* @param {Function} generateToken
|
2016-11-16 19:45:10 +00:00
|
|
|
* @return {Redux.Thunk}
|
2016-11-09 11:57:24 +00:00
|
|
|
*/
|
2016-12-06 14:02:13 +00:00
|
|
|
actions.linkDwell = function ( el, event, gateway, generateToken ) {
|
2017-01-08 13:25:17 +00:00
|
|
|
var token = generateToken();
|
2016-12-06 14:02:13 +00:00
|
|
|
|
2016-11-16 19:45:10 +00:00
|
|
|
return function ( dispatch, getState ) {
|
2016-12-19 12:53:11 +00:00
|
|
|
var action = timedAction( {
|
2016-11-16 19:45:10 +00:00
|
|
|
type: types.LINK_DWELL,
|
2016-11-21 11:08:06 +00:00
|
|
|
el: el,
|
|
|
|
event: event,
|
2017-01-08 13:25:17 +00:00
|
|
|
token: token
|
2016-12-19 12:53:11 +00:00
|
|
|
} );
|
|
|
|
|
2017-01-10 23:23:40 +00:00
|
|
|
// Has the new generated token been accepted?
|
|
|
|
function isNewInteraction() {
|
|
|
|
return getState().preview.activeToken === token;
|
|
|
|
}
|
|
|
|
|
2016-12-19 12:53:11 +00:00
|
|
|
dispatch( action );
|
2016-11-16 19:45:10 +00:00
|
|
|
|
2017-01-10 23:23:40 +00:00
|
|
|
if ( !isNewInteraction() ) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2016-11-25 10:40:33 +00:00
|
|
|
mw.popups.wait( FETCH_START_DELAY )
|
|
|
|
.then( function () {
|
2016-11-25 21:22:09 +00:00
|
|
|
var previewState = getState().preview;
|
|
|
|
|
2017-01-10 23:23:40 +00:00
|
|
|
if ( previewState.enabled && isNewInteraction() ) {
|
2016-12-19 12:53:11 +00:00
|
|
|
dispatch( actions.fetch( gateway, el, action.timestamp ) );
|
2016-11-25 10:40:33 +00:00
|
|
|
}
|
|
|
|
} );
|
2016-11-09 11:57:24 +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.
|
|
|
|
*
|
2017-01-11 00:34:34 +00:00
|
|
|
* TODO: linkAbandon and previewAbandon share test cases and structure,
|
|
|
|
* we should collapse them into one action creator in a followup commit,
|
|
|
|
* maybe keeping a origin: 'LINK'|'PREVIEW' field on the action payload for
|
|
|
|
* introspection on the devtools.
|
|
|
|
*
|
2016-11-16 19:45:10 +00:00
|
|
|
* @param {Element} el
|
2016-11-09 11:57:24 +00:00
|
|
|
* @return {Object}
|
|
|
|
*/
|
2016-11-16 19:45:10 +00:00
|
|
|
actions.linkAbandon = function ( el ) {
|
2017-01-08 13:32:03 +00:00
|
|
|
return function ( dispatch, getState ) {
|
|
|
|
var token = getState().preview.activeToken;
|
|
|
|
|
2016-12-06 14:02:13 +00:00
|
|
|
dispatch( timedAction( {
|
2016-11-28 12:00:07 +00:00
|
|
|
type: types.LINK_ABANDON_START,
|
2017-01-08 13:32:03 +00:00
|
|
|
el: el,
|
|
|
|
token: token
|
2016-12-06 14:02:13 +00:00
|
|
|
} ) );
|
2016-11-28 12:00:07 +00:00
|
|
|
|
|
|
|
mw.popups.wait( ABANDON_END_DELAY )
|
|
|
|
.then( function () {
|
|
|
|
dispatch( {
|
|
|
|
type: types.LINK_ABANDON_END,
|
2017-01-08 13:32:03 +00:00
|
|
|
el: el,
|
|
|
|
token: token
|
2016-11-28 12:00:07 +00:00
|
|
|
} );
|
|
|
|
} );
|
2016-11-09 11:57:24 +00:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2016-11-10 12:05:38 +00:00
|
|
|
/**
|
|
|
|
* Represents the user clicking on a link with their mouse, keyboard, or an
|
|
|
|
* assistive device.
|
|
|
|
*
|
2016-11-16 19:45:10 +00:00
|
|
|
* @param {Element} el
|
2016-11-10 12:05:38 +00:00
|
|
|
* @return {Object}
|
|
|
|
*/
|
2016-11-16 19:45:10 +00:00
|
|
|
actions.linkClick = function ( el ) {
|
2016-12-06 14:02:13 +00:00
|
|
|
return timedAction( {
|
2016-12-12 17:11:26 +00:00
|
|
|
type: types.LINK_CLICK,
|
2016-11-16 19:45:10 +00:00
|
|
|
el: el
|
2016-12-06 14:02:13 +00:00
|
|
|
} );
|
2016-11-10 12:05:38 +00:00
|
|
|
};
|
|
|
|
|
2016-11-28 12:00:07 +00:00
|
|
|
/**
|
2016-12-05 11:56:51 +00:00
|
|
|
* Represents the user dwelling on a preview with their mouse.
|
2016-11-28 12:00:07 +00:00
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.previewDwell = function () {
|
|
|
|
return {
|
|
|
|
type: types.PREVIEW_DWELL
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user abandoning a preview by moving their mouse away from
|
|
|
|
* it.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.previewAbandon = function () {
|
2017-01-10 20:14:40 +00:00
|
|
|
return function ( dispatch, getState ) {
|
|
|
|
var token = getState().preview.activeToken;
|
|
|
|
|
2016-11-28 12:00:07 +00:00
|
|
|
dispatch( {
|
2017-01-10 20:14:40 +00:00
|
|
|
type: types.PREVIEW_ABANDON_START,
|
|
|
|
token: token
|
2016-11-28 12:00:07 +00:00
|
|
|
} );
|
|
|
|
|
|
|
|
mw.popups.wait( ABANDON_END_DELAY )
|
|
|
|
.then( function () {
|
2016-12-06 14:02:13 +00:00
|
|
|
dispatch( timedAction( {
|
2017-01-10 20:14:40 +00:00
|
|
|
type: types.PREVIEW_ABANDON_END,
|
|
|
|
token: token
|
2016-12-06 14:02:13 +00:00
|
|
|
} ) );
|
2016-11-28 12:00:07 +00:00
|
|
|
} );
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2016-12-05 11:56:51 +00:00
|
|
|
/**
|
|
|
|
* Represents a preview being shown to the user.
|
|
|
|
*
|
|
|
|
* This action is dispatched by the `mw.popups.changeListeners.render` change
|
|
|
|
* listener.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.previewShow = function () {
|
2016-12-06 14:02:13 +00:00
|
|
|
return timedAction( {
|
2016-12-05 11:56:51 +00:00
|
|
|
type: types.PREVIEW_SHOW
|
2016-12-06 14:02:13 +00:00
|
|
|
} );
|
2016-12-05 11:56:51 +00:00
|
|
|
};
|
|
|
|
|
2016-11-15 18:18:13 +00:00
|
|
|
/**
|
|
|
|
* 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 {
|
2016-12-12 17:17:41 +00:00
|
|
|
type: types.SETTINGS_SHOW
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Represents the user closing the settings dialog and saving their settings.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
2016-12-12 19:26:55 +00:00
|
|
|
actions.hideSettings = function () {
|
2016-12-12 17:17:41 +00:00
|
|
|
return {
|
|
|
|
type: types.SETTINGS_HIDE
|
2016-11-15 18:18:13 +00:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2016-12-12 19:26:55 +00:00
|
|
|
/**
|
|
|
|
* Represents the user saving their settings.
|
|
|
|
*
|
2016-12-13 18:04:03 +00:00
|
|
|
* 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.
|
|
|
|
*
|
2016-12-16 11:11:54 +00:00
|
|
|
* @param {Boolean} enabled if previews are enabled or not
|
2016-12-13 18:04:03 +00:00
|
|
|
* @return {Redux.Thunk}
|
2016-12-12 19:26:55 +00:00
|
|
|
*/
|
2016-12-13 18:04:03 +00:00
|
|
|
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
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2016-11-30 13:40:08 +00:00
|
|
|
/**
|
|
|
|
* Represents the queued event being logged
|
|
|
|
* `mw.popups.changeListeners.eventLogging` change listener.
|
|
|
|
*
|
|
|
|
* @return {Object}
|
|
|
|
*/
|
|
|
|
actions.eventLogged = function () {
|
|
|
|
return {
|
|
|
|
type: types.EVENT_LOGGED
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2016-11-14 19:37:11 +00:00
|
|
|
mw.popups.actions = actions;
|
|
|
|
mw.popups.actionTypes = types;
|
2016-11-09 11:57:24 +00:00
|
|
|
|
2016-11-16 19:45:10 +00:00
|
|
|
}( mediaWiki, jQuery ) );
|