Commit graph

70 commits

Author SHA1 Message Date
Sam Wilson a8833fcd3b Disable the realtime preview reload button during loading
Make the reloadButton into a class member so that it's
accessible in doRealtimePreview().

Bug: T304568
Change-Id: I81c1870becd81884894353921f878653cd690d7a
2022-04-21 11:16:54 +08:00
jenkins-bot e0aa0ee307 Merge "Realtime Preview: display manual-reload bar when previews are slow" 2022-04-21 00:55:21 +00:00
MusikAnimal 472cf0c07c Realtime Preview: make button toggle state more visible in MonoBook
Bug: T305953
Change-Id: Ibb0ee08837b7e3f5e98fa11d9e7a97dcef2dee9e
2022-04-20 12:30:30 -04:00
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
Sam Wilson 94d4912103 Realtime Preview: add hover button for reloading
Add a 'reload' button to the right-side preview pane (that shows
on hover, and stays in the same place when the preview is
scrolled), and also an accesskey to trigger the preview. If the
preview is not open when the accesskey is pressed, it'll be
opened.

Bug: T303532
Change-Id: Ifa77ad7cf6d2ed6a8b955f9a324986d1c6f9a993
2022-04-14 08:08:58 +08:00
Sam Wilson f5f39d41d4 Realtime Preview: Move loading bar to be a proper element
Change from a pseudoelement ::before the left pane, to its own
element. This is so that when we introduce the top manual-reload
bar the blue bouncing loading bar can be shifted down below it.

Also moves the CSS out of TwoPaneLayout.less and into
RealtimePreview.less where it more properly belongs.

Bug: T304568
Change-Id: I540f68d528d92b7db8594d729985e5dad3d90ac1
2022-04-13 19:08:23 +00:00
jenkins-bot 595d9ac447 Merge "Realtime Preview: Refactor event handler for easier re-use" 2022-04-07 03:00:44 +00:00
Sam Wilson 981a9c762a Realtime Preview: Refactor event handler for easier re-use
Instead of exposing a way of adding event listeners, just expose
the event handler and let consumers (i.e. CodeMirror) add it
to whatever events it wants.

Bug: T303767
Follow-Up: I8c8c25fe56be55a61f4b8d1d2ef8cf74483aa241
Change-Id: Iee4c885f92dd9ec985a3f9fd92a2fafc00f2e9ff
2022-04-06 13:25:12 +08:00
Sam Wilson 119f25e424 Add event logging for Realtime Preview enabling and disabling
Add two new actions for the 'preview' feature:

* preview-realtime-on – The WikiEditor 'Preview' toolbar button
  was clicked to turn the preview panel on.
* preview-realtime-off – The WikiEditor 'Preview' toolbar button
  was clicked to turn the preview panel off.
* preview-realtime-inuse – Fired without user interaction when the
  WikiEditor preview feature is already on when the editing form is
  opened.

This also adds a new hook for the last of these to use and to match
the enable/disable hooks.

Bug: T298218
Change-Id: I1a2545c2b0491c1d07f9508fab70967d03d61594
2022-04-04 14:25:16 +08:00
Sam Wilson e6b77fb2ab Persist Realtime Preview state in a user preference
Store the current state (enabled/disabled) of Realtime Preview in
a new user preference `wikieditor-realtimepreview` and set it
when enabling or disabling the preview pane.

Bug: T294599
Change-Id: Id5f51c6d77ed0077906d5d5178cbfa785cc04dcf
2022-03-31 21:01:36 +08:00
jenkins-bot 6089bf9fa8 Merge "Realtime Preview: disable if average response time is very slow" 2022-03-30 17:20:04 +00:00
MusikAnimal f1a2ba96eb Realtime Preview: disable if average response time is very slow
$wgWikiEditorRealtimeDisableDuration is introduced which allows
sysadmins to control the average time after which Realtime Preview
should be disabled. For now, this shows a simple error message that is
intentionally not localized. In a future patch, we will force the
user into a 'manual preview' workflow. See T304568 for more.

Bug: T302282
Change-Id: I2f01eef19fe81c19efedcc0073a28884f0055359
2022-03-30 12:28:23 -04:00
Sam Wilson 21b36a737d Fix dragbar direction for RTL text direction
Change the sign (positive/negative) of the change amount (in pixels)
depending on whether the text direction is LTR or RTL.

Bug: T304487
Change-Id: I8f01a92e5e1094c9602d2ff334c730241193cedc
2022-03-29 11:21:21 +08:00
Sam Wilson cdd01171cc Log realtime preview errors to console
Bug: T303545
Change-Id: Iaa23b85eeb8d9951cbbbf350e55da006d49c84fa
2022-03-24 16:02:03 -04:00
jenkins-bot 07423d1a9f Merge "Add nicer realtime preview error messages" 2022-03-24 20:00:40 +00:00
Sam Wilson 6175e2c519 Add nicer realtime preview error messages
Add a new ErrorLayout to display error messages along with an
image.

Bug: T303383
Change-Id: I1ec27a212b5ab67d3e805c0d7756432850de89ea
2022-03-24 14:56:19 +08:00
jenkins-bot bb2072b5d2 Merge "RealtimePreview: add config setting for debounce time" 2022-03-24 06:35:44 +00:00
MusikAnimal 68e6561857 RealtimePreview: add config setting for debounce time
Change-Id: Iaf49f076c5a290ab9049267b0aede1e6b13a9136
2022-03-24 02:00:19 -04:00
MusikAnimal 2cbf638f54 Realtime Preview: wait for a response before making new requests
If a preview is requested before one finishes, one final request is
fired off to ensure the preview is up-to-date.

Bug: T302282
Change-Id: I2399fc7cc08cd0987d2d689ca9f297db1ec5edf0
2022-03-21 21:17:26 -04:00
Sam Wilson 411be83bc3 Add toggle button and two-pane layout for realtime preview
* Toolbar button to toggle a two-pane layout on and off.
* Resizable bar for the width of the two panes.
* Resizable bar for the edit box height, even when realtime preview is off.
* Only enabled when $wgWikiEditorRealtimePreview = true.
* Fires JS hooks when enabled, resized, and disabled.

Bug: T293347
Change-Id: Id09d44519249c0b7f5c33d48d524b7c92a5a9106
2022-03-13 07:28:01 +08:00