mediawiki-extensions-WikiEd.../modules/realtimepreview/ManualWidget.js
Sam Wilson 4c760f8634 Realtime Preview: display manual-reload bar when previews are slow
After three slow preview requests, switch to showing a bar at the
top of the preview area that contains a manual 'reload' button.

The manual bar will be hidden when an error message is show, but
re-shown again after the error is dismissed. Closing and
re-opening the preview pane doesn't reset the manual mode.

Bug: T304568
Change-Id: Ia72bd1ceab68fdaed5de53137bd8ac5961db4714
2022-04-20 13:01:14 +08:00

44 lines
1.4 KiB
JavaScript

/* global RealtimePreview */
/**
* @class
* @constructor
* @param {RealtimePreview} realtimePreview
* @param {OO.ui.ButtonWidget} reloadHoverButton
*/
function ManualWidget( realtimePreview, reloadHoverButton ) {
var config = {
classes: [ 'ext-WikiEditor-ManualWidget' ],
framed: true
};
ManualWidget.super.call( this, config );
this.reloadHoverButton = reloadHoverButton;
// UI elements.
var reloadIcon = new OO.ui.IconWidget( { icon: 'reload' } );
var $reloadLabel = $( '<span>' )
.text( mw.msg( 'wikieditor-realtimepreview-manual' ) );
this.reloadButton = new OO.ui.ButtonWidget( {
label: mw.msg( 'wikieditor-realtimepreview-reload' ),
framed: false,
flags: [ 'progressive' ]
} );
this.reloadButton.connect( realtimePreview, {
click: realtimePreview.doRealtimePreview.bind( realtimePreview )
} );
this.$element.append( reloadIcon.$element, $reloadLabel, this.reloadButton.$element );
}
OO.inheritClass( ManualWidget, OO.ui.Widget );
ManualWidget.prototype.toggle = function ( show ) {
ManualWidget.parent.prototype.toggle.call( this, show );
if ( show ) {
this.reloadHoverButton.$element.remove();
// Use the same access key as the hover reload button, because this won't ever be displayed at the same time as that.
this.reloadButton.setAccessKey( mw.msg( 'accesskey-wikieditor-realtimepreview' ) );
}
};
module.exports = ManualWidget;