Split the toolbar into two modes depending on if the surface is focused:
* When unfocused, show a hamburger containing back and source switch
* When focused, show editing tools, and a check button to unfocus
For the editing toolbar, space the tools out using table-cell layout
and hide labels below 480px.
Depends on I06813e3ff in core (surface blur method).
Bug: T93325
Change-Id: Ibf09cb29019d7a71e1e144b326710b1f6506cd0c
* Use local edit source tool, and emit event to MF
* Bring in toolbar styles, bonus: remove old desktop style hacks
Bug: T96186
Change-Id: I89351e409aa4e9d626edd7151ae05bdcd58f1cee
* Bring in back button & save button from MobileFrontend
so they are properly styled OOUI widgets
* Accordingly, move toolbar save button code up into base
MW target.
Bug: T96186
Change-Id: Ic89dd4efb831fc3b09980da16524276f6568619d
All this is no longer needed since 121216184718e7ebe22d6ecc8f5af5fe4e202465 in
OOjs UI and started causing issues after bb9c9c4f6a2fca6aed0e671e904e469d57da5f34.
Bug: T98795
Change-Id: I6493d6b52b313aac521aee2b0cff1571ea63bbe5
Prevents read-mode elements placed inside the target from
getting scaled down (e.g. firstHeading).
Change-Id: I55ed38e2855c4eb317ec71cebb1842b9b70790b6
New changes:
de79de2 [BREAKING CHANGE] Fix font sizes and padding in Surface and SurfaceWidget
aa4a481 Localisation updates from https://translatewiki.net.
c2ff1cb Initialize toolbar tools disabled until surface is initialized
f457c83 Split visualEditor.css into apex & mediawiki versions
aff993c Don't drop <html> attributes when parsing HTML on Opera 12
Local changes:
Fix SurfaceWidget and DebugBar hacks
Change-Id: I93cb8ec787e53c07b5051c0296eb6f59b6048e91
Reduces event overhead and prevents accidental interaction with
content while loading, and with content sub while editing.
Change-Id: Ief997cd4d5cf444fb2ee0d28c709301d26e814f9
This is not pretty and probably isn't optimal, but it works well
enough. The bug about getting rid of this all is T91152.
Bug: T94071
Change-Id: If926286f1d0c7835489914ed653a0d65ed24f53a
Split up beta and meta dialog show methods so that beta dialog
is displayed as soon as possible, regardless of the surface being
ready. Also make sure that we destroy the temporary window
manager on destroy.
Bug: T90454
Change-Id: Ib8f94518af431487ce940a74a8c268dbdbe403d2
Set 've-activated' as soon as edit is clicked, with a 've-loading' state.
This necessitates moving the relevant styles to mw.ViewPageTarget.init.css.
Change-Id: Ic9757cdbf63a2f72eda0dd03ff5588d79028ba0e
ve-ce-surface is a child of ve-ui-surface. The ve-ui-surface has
margins that would remain in the document flow causing a temporary
growth outwards to the bottom during deactivation (causing the
white area and blue border on Vector's grey background to move down)
after which it would restore again.
Follows-up 77f016a.
Bug: T91442
Change-Id: I5b999b580c968fcd24f07d9a895cfa17afc80c0d
While showing the content earlier as soon as possible is nice, the ve-ce-surface
remained visible until toolbar and surface were torn down.
This avoids the split second where the new pageview content *and*
CE surface were visible in the page (this it also messed with the scroll position,
and would temporarily cause a scrollbar to appear).
Bug: T91442
Change-Id: I0a7232cd0264bff28ad66aa328de29d339891aa1
The toolbar now uses a CSS transition for its height instead of
JavaScript animation through slideDown().
* The animation is on toolbar instead of toolbar-bar so that it
contains the padding and borders. Otherwise it slides up until
there is the top and left (quite thick) borders stacked on
each other which then disappear at once.
* Add transform/translateY so that toolbar also transitions
when it is in floating state.
* Move class addition to attachToolbar() to avoid additional
reflow.
Bug: T89543
Change-Id: I30a7b69b77b874d220f60ebe7f7e616cd77bcc36
These were there to match Vector, however as of 4cec8a70589
Vector no longer has these. Having these in VisualEditor causes
the toolbar to be a few pixels behind (like a slingshot) when the
rest of the skin has already moved.
Change-Id: Ia5886a58316ccb3b0420553c3f466b5256089c73
Follows-up 62c1d64ad0.
* Remove '.mw-indicators' animation for opacity. Was a left-over from other
elements previously stripped in 62c1d64ad0.
* '#siteNotice' no longer slides. It's hidden at the same time as '#contentSub',
'#toc', and other elements. This is an annoying jump, and we should find a
way to do it consistently and in a performant manner.
* Fix state classes added in 62c1d64ad0. During deactivation, the ve-active
class was kept for too long. This created a temporary state in which ve-active
*and* ve-deactivating were applied. This was harmless as nothing ises the
've-deactivating' class yet.
* Leaving toolbar as-is for another commit.
Bug: T89543
Change-Id: Ide49f93c45a12f2c13eb4412a9a16a82fefeb43e
While #contentSub element tends to be empty, it does take up
line-height in most skins (incl. Vector). Previously, hiding this
would cause the content to be shiften upwards one line, only to
be shiften down one line again once activated.
While there are other edge cases to be straightened out, this
makes the content a lot more stationary during activation.
Change-Id: I784436c0f60a63e1a77aba5b8afeacbbdd6932be
This hides the links at the same time as other parts, right when the
module is loaded, instead of after the surface is ready.
Change-Id: Ifda6985636f354060f43b7e9ecc9425b30c513c9
It's slow, especially on large pages, and it's triggered
very infrequently these days, and only for known bugs.
In the future we should replace this with a debugging
interface that displays the DOM diff between the original
DOM and the round-tripped DOM, as opposed to the boolean
interface we have now.
By extension, this also means the visualeditor-needcheck
tag won't be applied to new edits any more, although
its registration and messages are kept around because
edits with this tag still exist in page histories.
Bug: T87161
Change-Id: I909153492a5786b4b69fccd42ce3c1d4bdb3a059
* Use .ve-activated for elements changed in activate()
- hideReadOnlyContent()
- mutePageContent()
- mutePageTitle
* Use .ve-active for elements changed in onSurfaceReady()
- hidePageContent()
* Set 've-activated' class from activate() instead of transformPage()
to consolidate reflows and minimise DOM interaction. It's still
in the same (synchronous) execution path, but a few statements
earlier now.
* Remove obsolete #toc wrapper. This <div> (with data property
to distinguish it from potentially foreign parents in the future)
was there to aid slideDown/slideUp animations, because those
don't work well on table elements. See eba7d58dd1.
* Remove obsolete setTimeout in restorePageTitle().
The removal of .ve-init-mw-viewPageTarget-pageTitle was delayed
by one second (introduced in Ibc3fa2fb7 / 4cc88b9850). This
was to account for a jQuery animation we no longer use.
* Remove unused '.ve-init-mw-viewPageTarget-transform-muted'
* Remove unused '.ve-init-mw-viewPageTarget-transform'
* Remove unused '.ve-init-mw-viewPageTarget-pageTitle'
The resulting stylesheet exposes that we're not consistent in
whether elements hide immediately (ve-activated) or once the
surface is ready (ve-active). This is intentionally kept as-is
within this commit.
Of the different elements that had their opacity changed, only
firstHeading was being animated. This animation was removed.
Bug: T88590
Bug: T87160
Change-Id: I87033456f715d99a88425e38e8ac5171144f4ec8
Move reference style hack to MWReferenceNode.css, and move
heading style hack to ve.init.mw.Target.css
Change-Id: Icbd53f8df998c9f7bcc701b7c29dc226dfc5c05f
* Move styles that apply to all targets to ve.init.mw.Target.css
* Move styles for MWPopupTool subclasses to ve.ui.MWPopupTool.css
Change-Id: I34c8a6200ee337debf00c4e432948f1b86f1b60a
* Ensure surface widget font size matches main surface,
move vector-specific hack to vector css file and fix.
* Fix base font size in non-isolated monobook windows.
* Move monobook z-index hack to global overlay only.
Change-Id: I1607dc77f81ac9c522e09a3b502aeb38fee02178
In I19da270a we bumped the z-index for the overlay from 4 down to 2, to avoid
clashing with the toolbar. However, the site logo, search box and personal
tools all have a z-index of 3, so 4 is required. Instead, bump the toolbar's
z-index up by 1 to 5.
Change-Id: I7e1edcf05cde054c7bcb8c13b5633930fb5ed3b5
New changes:
7d8ed7f Copy in some IE CSS hacks from ve-mw
a2e962e Update OOjs UI to v0.1.0-pre (20c61ec865)
d99c62f Update OOjs UI to v0.1.0-pre (d4cfcce969)
7fe02b3 Fix lots of spelling mistakes and typos
Local changes:
Remove redundant IE CSS rules since core's I013688c5
Bug: 73565
Change-Id: Ic60cd5290932ec38fab26492fffa17c3a8e91398
Copy in the font-size:127%; rule from MonoBook's main.css which is applied to
div#globalWrapper
Caused by Id425c56d
Bug: 73660
Change-Id: I05502295b81c62fd1180dff860dea68d76c2dfa9
When this dialog is not isolated, MediaWiki's overflow: hidden;
rules for headings cut off part of the text in the <h3>s.
Compensates for Id425c56d9d24 in VE core.
Change-Id: Id9f6bd2bdbed0c6fe57e897c2415c3eceff900a6
Moved the spinner code from ViewPageTarget to ViewPageTarget.init to make it appear immediately on clicking edit.
Bonus: also fixes the URL to add the parameter vesection when clicking a section edit link.
Bug: 65453
Change-Id: Ica33de675203cc0f0594b8362731c4e98a644313
New changes:
5d063a2 Don't use three different coordinate systems in getSelectionRect()
feeb1ae Only focus the paste target if focusedNode has changed
2c1bb97 Update OOjs UI to v0.1.0-pre (4cef83f702)
Local changes:
* Update references to renamed classes
* Update calling patterns element mixins
Change-Id: I330c0e308807597dec31dad8dbf713eb29fdc290
* Toolbar was too tall
** The actions toolbar is nested in the main toolbar, so the rule
increasing the font size by 25% for toolbars applied to it twice
* Font size in link suggestions was too big
** Remove 25% font size increase from overlays
** Add it back on the context (otherwise it's too small)
** But only on the main surface's context (otherwise contexts in dialogs are too big)
* Make highlights and context appear below, not above, toolbar menus
** z-index: 4 was too high for the overlay, because MenuToolGroup also has 4
** But the default of z-index: 1 is too low because it puts dialogs behind the surface
** z-index: 2 seems to work
Bug: 69949
Change-Id: I19da270abcdbe526ff213f0eb7d0859b48276930
New changes:
c9f1027 Remove broken ve.isMsie() function
6571da1 Fix case on language annotation CSS class
c231b71 Fix case in all annotation classes
Local changes:
Fix case in all annotation classes
Change-Id: Iba2596cde52d8f8be27e0257893ef8ec77798ae8
Because doing that makes the text disappear if dir="rtl" is also set.
Bonus: explain why we're changing which nodes to set highlight
opacities on for IE.
Change-Id: I061e372b26a7b523fc1f307ad9897b884803fdf4
New changes:
20c220a Remove unused CSS classes
9bdcc65 Comment icon positioning
e50e790 [BREAKING CHANGE] Fix ve.ui.Overlay classes
1ac4927 ve.ce.TextNode: Use getChar() helper
29fd0f8 ve.ce.TextNode: Simplify #getAnnotatedHtml logic
18336eb ve.ce.ResizableNode: Run find() once instead of 4x in showHandles()
febf125 Use getDescription for title attribute
ab3cb6c Localisation updates from https://translatewiki.net.
Local changes:
* Rename overlay class rules
Change-Id: Ia90b6afbd4abdf3267f4ccaac0b2a7d4101ccc7b
By searching for CSS classes that don't exist in the code.
In some cases the classes were used but had been renamed.
Change-Id: I76442a632c18d2133cdf78c4555da149c0a7888c
New changes:
8bb3848 Bring back global/local specific CSS classes
Local changes:
Use global overlay class to target the z-index hack for the Vector skin.
Bug: 68066
Change-Id: If1b6ba0c9035ff32b61d34ee779a95554883a2ec
New changes:
56de6f5 Localisation updates from https://translatewiki.net.
f8bda64 Widgetise demo menu
6ac48d8 Localisation updates from https://translatewiki.net.
365e131 builderloader: Omit value for boolean "disabled" attribute per HTML5
706e4b3 Prevent double counting of DM nodes in getNodeAndOffset
b141a7d Update OOjs UI to v0.1.0-pre (d2451ac748)
c5b3921 Localisation updates from https://translatewiki.net.
1606983 Update reference to ConfirmationDialog to use MessageDialog
Deletions:
* Styles for ve.ui.MWBetaWelcomeDialog - not needed anymore because
OO.ui.MessageDialog provides them
* Styles for ve.ui.MWGalleryInspector - not needed anymore because
ve.ui.MWExtensionInspector provides part of them and the rest are being
replaced by programatic sizing
Modifications:
* ve.ui.MWLinkTargetInputWidget - Added support for validation and href
getter
* Split message between tool and dialog title for ve.ui.MWEditModeTool
and ve.ui.MWWikitextSwitchConfirmDialog
General changes:
* Updated inheritance.
* Added manager param to constructors of dialogs and inspectors.
* Updated use of show/hide with toggle.
* Added meaningful descriptions of dialog and inspector classes.
* Configured dialog and inspector sizes statically.
* Configured dialog action buttons statically.
* Interfaced with OO.ui.ActionSet to control action buttons.
* Moved applyChanges code into getActionProcess methods.
* Always using .next in setup/ready process getters and .first in
hold/teardown process getters.
Change-Id: Ia74732e6e32c0808eee021f0a26225b9e6c3f971
The stylesheet contains workarounds for highlights on references
being drawn in the wrong place, resize handles appearing on headings,
and highlights being opaque.
Change-Id: I78da4d6a751429cd160b693b4a524fc7ea1ef76f
This will mean it will be more obvious if making a change to the SD or HD version
that an equivalent adjustment may be needed.
Change-Id: I6129220839ef55017fe69d723524ecdf6cf0234f
Use new setupToolbar and setupDebugbar methods in base target.
New changes:
7ff523d Localisation updates from https://translatewiki.net.
3815224 [BREAKING CHANGE] Debug bar refactor
155f4ab Edit HTML mode in demo
Change-Id: I554ce51eae872ab0f741a913bf10394c2a8c3e52
We don't have a FOUC on the appearing of the 'edit' link. That
one is handled quite intelligently:
* Via the stylesheet that is also loaded in noscript mode, its
(hidden) appearance is already predetermined. So as soon as
those elements are seen by the browser they style correctly
for users without JavaScript (display: none).
* This same stylesheet also hides it for users with JavaScript
but where VE is not available (e.g. due to browser support).
While ve-not-available is added very early on (before
document ready), it could in theory cause a short FOUC, but
that's okay. We simply don't know that VE isn't supported
until then. We optimise for the common case (JavaScript
enabled, VE available), while still ensuring that it is
always hidden in noscript, and is hidden as soon as possible
when VE turns out not to be available.
For some reason, one small detail (the little bit of whitespace
added inside the brackets), was left out of this and was
implemented by adding the class 'mw-editsection-expanded' to them
from a document ready handler.
* First step, get rid of the script that adds this class and
use ve-available instead. That means they're styled
correctly much earlier (we add the class to <html> before
document ready). This can still cause a brief FOUC, though
in most cases they're correct from the start.
* Step two, make brackets expand by default for script users,
and let ve-not-available reset it. This way, like with edit tabs,
a FOUC will never happen for ve-available. And even for
ve-not-available, a FOUC is rare since we add it before
document ready via <html> look-ahead styling.
There was still a brief reflow jump because of negative margins
between two paint events. One was undoing the other at a later
time. These negative margins are a remnant of when we were doing
animations (follows-up I4b9c47fd65a70). They were added to reduce
reflows and content shift, but were now actually causing them.
Removed "padding-right" from mw-editsection, and negative margin
from the brackets.
Also:
* Don't add inline 'style="direction: ltr;"' on every single
editsection throughout the DOM. This was the only operation we
were doing unconditionally. While I doubt the need of it in
general, we can at least allow MediaWiki to do it right, and
only add the override if needed. This saves quite a few DOM
operations.
Change-Id: I7a729edc2cd4a66ebc0ad6935ffd02cb9b948bff
Update VE core submodule to master (109a3cf):
* 109a3cf ve.ce.Surface: Remove font-size: 1em;
Follows-up I5818dce6265.
* When applied to ve-ui-surface, it applies to both of its children,
namely ve-ce-surface and ve-ui-surface-overlay. The latter
(containing things like context menu and inspectors) should not
inherit styles intended for rendering of wikipage content by
the skin.
* Move mw-content-{ltr,rtl} from an outer parent to a slightly
deeper parent of the actual content. It's now on documentNode.
Still high enough to apply to all content. This was to ensure
it remains a child of mw-body-content, like in MediaWiki core.
* Updated padding/margin hack again. Since now the font-size
applies on the surface, this once again means that now 1em
on the surface != 1em on the documentNode, so we need the
calculation again. Brought it back and this time documented
what it is based on.
Bug: 64599
Change-Id: I9ee4582a6a0ec9e128f5c36a6dbf2adbd0b216a1
* font-size and line-height differed between read mode and
edit mode. This makes them match by using the same css class
as MediaWiki core uses for the body content.
Depends on I66c56c57 in MediaWiki core.
* Document padding / margin hack on surface, and sync the values.
In edit mode, the text was being nudged to the right by a few
pixels.
* Bump the wfUseMw call as this is a symptom of how VisualEditor
now depends on MediaWiki 1.23.
Bug: 64599
Change-Id: I5818dce626545c4cbc8bd84fd551dc08baedbe32
New changes:
dd15f23 Split ve.ui.Surface into DesktopSurface and MobileSurface
16283f4 Add OOjs UI's sco.json i18n file
ef94038 Split ve.ui.Context into DesktopContext and MobileContext
Minor adjustments to point to desktop and mobile Surface or Context.
Change-Id: I7cf6f99a5a1216a28a7146afcd4deb68c7eac38e
There are several conditions to defaultSize behavior of thumbnails and
frameless images and other images when it comes to default size. In the
same principle is 'border' which is not quite a type despite the fact
it 'behaves' as such in wikitext (and has a unique identifier that comes
instead of the other types.
This commit aims to organize this behavior for the user in an
understandable manner.
* Add 'basic' image type for images that have no specified type ('none')
* Handle the difference in 'default' size behavior between basic images
and thumbnails/frameless. The thumb/frameless images have the default
wiki size. Other images' default size is their original dimensions.
* Force wiki-configured default size for thumbnails and frameless images
in the DM. This is done because at the moment Parsoid's output is of
Wikipedia's default size rather than the local wiki's. The size is
adapted if needed, directly in the DM.
* Added 'border' as a pseudo-type checkbox flag that sets css class
'mw-image-border' is for parsoid rendering on save.
* Add 'make full size' to the size widget select and treat it as a faux
default button for basic and frame images.
Bug: 62013
Bug: 62024
Bug: 61155
Bug: 61059
Bug: 61282
Change-Id: I6778705306f0dd6bb96afeb91383089a4ddab7ed
We don't yet have any way to test or verify anything with less. Not the less
syntax, not the less compilation, not the resulting css code quality.
Using it at this point doesn't seem worth the cost of not having any of that.
This reverts commit 17ddf031fe.
Change-Id: I7e8ab90f7a9f77f5cf6d7baeab586d4e0332042e
Just doing simple nesting for now. No mix-ins or variables.
There are no actual style changes in this commit.
Change-Id: Ied29358d39703ca6d2c896c2d44d9cf397d51d4e
Rules like "right-aligned images get float: right;" should
be in the generic image CSS, they're not skin-specific.
I haven't exactly teased apart what is and it's skin-specific,
this is just a first stab.
Change-Id: Ie374685d2c66e2275f7a98a590e563bf36da7f87
The styling of the image thumbnails should be controlled at the
skin level, not by the generic VE styles. Moving the thumb/figure
styles from ve.ce.Node.css to ViewPageTarget-shared.css. Otherwise
no changes to the styles themselves.
Also adding minerva (the mobile skin) to the list of supported skins.
Bug: 60542
Change-Id: I67ab6d5b91cee7e587f61df26e7dae74c1068788
Changes in MediaWiki core to the padding of div#content in Vector
(see 9d988924a0350228745375e074420a0e1214f7e3 ) made the toolbar in
VisualEditor's ViewPageTarget integration for Vector render incorrectly.
This adjusts the toolbar margins to match the changes in content padding.
Bug: 61224
Change-Id: Ie6b47f5d1929533669118ba51202c1fccda4a0d6
In HD mode, the left margin was 0.25em off.
In narrow mode, the margins were completely wrong.
Bug: 51000
Change-Id: I7fd9cbc925b828fd780adb9ab2c71bcf15dc7284
New changes:
* e7e2833 - Update uses of Push/IconButtonWidget to ButtonWidget
* d9d9eb5 - Update OOjs UI to v0.1.0-pre (d9bab13)
* d9bab13 - The Great Button Refactor of 2014
* 22b93ef - Update OOjs UI build (88b2871)
* 88b2871 - Fix png transparency on required.png
* 670c468 - Add i18n
Also:
* Update uses of Push/IconButtonWidget to ButtonWidget as there
is a breaking change in new OOjs UI version.
This was separated from commit I325a4dcc316d0.
Change-Id: I82220d15221c52be03feafcfc85c2bd6c12ba462
Also:
* Added modules/syntaxhighlight to csslintignore because
it is broken right now, so it's hard to fix those warnings
without being able to verify it.
* Fixed a typo in the grunt-watch config that accessed an
inexistent property.
Change-Id: Ib81572506786b6a1203c454d1b2b91bb6ae2a3de
Some 've-ui-toolbar-bar' classes hadn't been converted to OO.ui so the
toolbar had no border. Also removed a useless rule in mw.ViewPageTarget.css.
SA platform didn't override OO.ui.msg to use the ve.msg so no messages
were getting through.
Change-Id: Ieb5bc3c98d1c435ec194b201b517a688cd9b02b9
* Move and rename generic parts of ve.ui to OO.ui
* We now have a UI test suite because ve.Element (outside ve.ui)
is now part of oojs-ui, so it needs a test suite.
* Added to the MW test run (just like we do for unicodejs).
* Updated csslint config (also added ve-mw and syntaxhighlight
which were missing).
oojs-ui still depends on the TriggerRegistry in VE, this is addressed
in a follow-up commit.
Change-Id: Iec147155c1ddf20b73a4d15d87b8742207032312
Major changes:
* Create a MW specific save dialog class
* Widgetize save dialog elements
* Simplification of viewPageTarget
Minor changes:
* Added getWindow method to windowSet and setTitle methods to window class
* Add transition css properties to dialog styles
Bug: 48566
Bug: 50722
Bug: 51918
Bug: 52175
Bug: 53313
Change-Id: I8c0db01fb8477a9b3d3dfe2a6073ac67869ce40e
Class ve-init-mw-viewPageTarget-pageTitle added various
transition settings that were never used. Meanwhile, we're doing
fadeTo which sets inline opacity css every X ms until the
animation is finished.
* Changed the inline jQuery animation to use css transitions
instead.
* Removed the inexistent and obsolete ms-transition declaration.
* Removed ":visible" from selector query. This makes the selector
more performant (since :visible is a proprietary Sizzle keyword)
and it was obsolete anyway. The classes don't affect display none/hide,
this is handled naturally by the browser now.
Change-Id: Ibdfb442ff6c743ef16b514a7696796ee27821887
Objectives:
* Use widgets to render toolbar actions
* Remove labels next to help notices and edit notices buttons
* Add a close button to the help notices and edit notices
Overview:
* ve.ui.ButtonWidget is now abstract, use ve.ui.PushButtonWidget instead
* ve.ui.IconButtonWidget now inherits from ve.ui.ButtonWidget
* ve.ui.PopupWidget's display method no longer takes x and y arguments
* Fixup naming issues in MWCategoryPopupWidget
* Fixup naming issues with some ve-init-mw CSS classes
* Rename ve-mw/ui/styles/ve.ui.Widget.css to ve.ui.MWWidget.css
* Change uses of "callout" to "tail"
* Add hyperlink functionality to buttons
* Make buttons accessible through focusing, but make unfocusable by
clicking
* Add head option to popup for rendering a title and close button
Bug: 52386
Change-Id: Iea2c8df1be64d40f9c039873d89ee540cc56e687
