Commit graph

310 commits

Author SHA1 Message Date
Roan Kattouw 3321261e98 Split up ve.init.mw.ViewPageTarget.css
* 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
2014-12-08 15:42:19 -08:00
Ed Sanders 2653ce3bb3 Fix MW skin hacks
* 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
2014-11-22 17:52:46 +00:00
James D. Forrester 6f446e0d1a Follow-up I19da270a: Make overlay appear above non-VE skin items in Monobook
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
2014-11-21 13:29:16 -08:00
James D. Forrester a1d75042c0 Update VE core submodule to master (fb57e24)
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
2014-11-21 10:28:34 -08:00
Ed Sanders 2997cee444 Fix lots of spelling mistakes and typos
Change-Id: Icf78d3d599326d3f12d09edcd2b8491ed35ade04
2014-11-21 13:00:50 +00:00
jenkins-bot c8028dfe06 Merge "Fix ridiculously small font size in overlays under MonoBook" 2014-11-20 20:01:22 +00:00
jenkins-bot 921f606209 Merge "Remove unused CSS: toolbar contains no PopupButtonWidgets" 2014-11-20 18:27:55 +00:00
Alex Monk 8a1adef97c Fix ridiculously small font size in overlays under MonoBook
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
2014-11-20 17:56:38 +00:00
Ed Sanders 6ffbc72f82 Remove unused CSS: toolbar contains no PopupButtonWidgets
Change-Id: I719a4dec30d5ca52337bd3a7d2506065562d831d
2014-11-20 13:56:48 +00:00
James D. Forrester 7317114187 Update VE core submodule to master (029fc7e)
New changes:
029fc7e Update OOjs UI to v0.1.0-pre (1fa4eb7a73)

Update changes:
Changes were generated by running this script:
https://gist.github.com/trevorparscal/265f1b8c854190637a1e

File changes:

Scripts (modules/ve-mw/ui/widgets)
- ve.ui.MWInternalLinkMenuItemWidget.js → ve.ui.MWInternalLinkMenuOptionWidget.js
- ve.ui.MWLinkMenuItemWidget.js → ve.ui.MWLinkMenuOptionWidget.js

File content changes:

Scripts (*.js)
- MWInternalLinkMenuItemWidget → MWInternalLinkMenuOptionWidget
- MWLinkMenuItemWidget → MWLinkMenuOptionWidget
- ContextMenuWidget → ContextSelectWidget
- ContextItemWidget → ContextOptionWidget
- TextInputMenuWidget → TextInputMenuSelectWidget
- MenuWidget → MenuSelectWidget
- MenuItemWidget → MenuOptionWidget
- MenuSectionItemWidget → MenuSectionOptionWidget
- OutlineWidget → OutlineSelectWidget
- OutlineItemWidget → OutlineOptionWidget

Styles (*.less)
- contextMenuWidget → contextSelectWidget
- contextItemWidget → contextOptionWidget
- textInputMenuWidget → textInputMenuSelectWidget
- menuWidget → menuSelectWidget
- menuItemWidget → menuOptionWidget
- menuSectionItemWidget → menuSectionOptionWidget
- outlineWidget → outlineSelectWidget
- outlineItemWidget → outlineOptionWidget

Change-Id: Ifded7f9e17923dbb56a722b7424ccd2854194c21
2014-11-19 17:04:26 -08:00
Roan Kattouw 5876014c8f Override overflow: hidden; for <h3>s in the command help dialog
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
2014-10-27 17:51:46 -07:00
suchetag 5c0c117537 Make spinner appear immediately when clicking edit
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
2014-10-22 03:20:40 +05:30
James D. Forrester f2e22babaa Update VE core submodule to master (1f82a47)
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
2014-09-03 17:20:09 -07:00
Roan Kattouw 03c8ad7744 Fix various bugs in our Monobook stylesheet
* 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
2014-08-27 23:28:20 +00:00
Ed Sanders 9a1e3852fc Update VE core submodule to master (c231b71)
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
2014-08-22 14:27:14 -07:00
Roan Kattouw c5281a4e4d Don't apply a background to language annotations in IE
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
2014-08-22 13:34:45 -07:00
Amir E. Aharoni f4d6892fe4 Bidi-isolate the version in the help panel
Bug: 68688
Change-Id: Iaad230d64d923713c273bbbe2fefd94681e13a2d
2014-07-30 10:36:22 -07:00
Ed Sanders c9c10cf5b8 Update VE core submodule to master (0709218)
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
2014-07-29 16:31:42 -07:00
Ed Sanders 840c871a97 Remove unused CSS classes
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
2014-07-28 19:43:35 +01:00
James D. Forrester 040ef014bd Update VE core submodule to master (8bb3848)
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
2014-07-16 23:48:07 +00:00
James D. Forrester fbdff76263 Update VE core submodule to master (f2277ea)
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
2014-07-14 23:24:45 +00:00
Roan Kattouw a0989d15d4 Add stylesheet with IE hacks and only load it with IE
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
2014-07-03 18:20:30 -07:00
James D. Forrester e1b9f9c745 Get rid of ve.init.mw.ViewPageTarget-vector-hd.css and use a media query instead
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
2014-06-28 15:03:59 -07:00
Ed Sanders 79a34aa844 Fix document margin trick for vector-sd
Existing styles were based on 1.5em padding which is
only true in vector-hd. vector-sd uses 1em.

Change-Id: I2d73aa55a01f4524ba1d9352b1882632e92ebaa3
2014-06-28 17:47:46 +01:00
Ed Sanders f2fe87f1b3 Add missing TableCell CSS file and Vector-specific rule
Bug: 65416
Change-Id: I202893322866cf42b8fbe950224b6be08c35c4d6
2014-06-25 15:08:30 +01:00
Ed Sanders 00af43495b Update VE core submodule to master (155f4ab)
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
2014-06-16 14:52:48 -07:00
James D. Forrester e2fab2f1eb Dump raster support (unuseful) and assert SVG works before loading
Depends on Idb26804576 in core.

Change-Id: I17481b2d52ab2c33c26ff935b0fd58deb4aa207b
2014-05-27 15:22:26 -07:00
Moriel Schottlender 963e133851 Remove media item styling moved to MW-core in I400336c12d.
Change-Id: I348e55ddea94f3b67f647c66ba53f7384d683584
2014-05-22 12:34:00 -07:00
Timo Tijhof 7dae6496b3 mw.ViewPageTarget: Get rid of FOUC on edit section brackets
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
2014-05-09 12:20:24 +02:00
Timo Tijhof b272845791 mw.ViewPageTarget: Move .mw-body-content down to .ve-ce-surface
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
2014-04-30 21:09:54 +00:00
Trevor Parscal e0e08388ce mw.ViewPageTarget: Use .mw-body-content for content styling
* 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
2014-04-29 21:04:05 +00:00
Krenair b6f1793bf8 Use new OOUI pending feature rather than loading bar thing on save dialog
See I5c45cc6 for the oojs-ui change and I2fa71a1d for a similar commit

Change-Id: I77e3274a196bc13ae19a9520197f4a8b624fd528
2014-04-18 21:57:14 +01:00
Ed Sanders 391e247c90 Show the debug bar in MW if ve.debug is set
Depends on Ide1487250e in core.

Change-Id: Ia31e498b565c4db79026e0e40f515a2b65bbbde2
2014-04-02 17:33:29 -07:00
Trevor Parscal 42ba981e27 Update VE core submodule to master (520299e)
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
2014-03-14 13:13:02 -07:00
Moriel Schottlender 89aecd54ba Deal with 'none'/'border' and default size in media edit
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
2014-03-05 03:53:46 +00:00
Krinkle 2dd888814a Revert "Converting ViewPageTarget CSS files to LESS"
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
2014-02-20 22:55:49 +00:00
kaldari 17ddf031fe Converting ViewPageTarget CSS files to LESS
Just doing simple nesting for now. No mix-ins or variables.

There are no actual style changes in this commit.

Change-Id: Ied29358d39703ca6d2c896c2d44d9cf397d51d4e
2014-02-20 13:55:29 -08:00
Roan Kattouw a7d5751c80 Move some non-skin-specific styles back into ve.ce.Node.css
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
2014-02-20 00:12:48 +00:00
kaldari 9f1179938c Move some skin styling from ve.ce.Node.css to a shared skin css file
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
2014-02-19 13:30:30 -08:00
Trevor Parscal 79082ebf82 Fix margins after they were broken in 9d988924
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
2014-02-11 23:08:58 +00:00
Ed Sanders 3612914509 Fix toolbar margins in vector
In HD mode, the left margin was 0.25em off.

In narrow mode, the margins were completely wrong.

Bug: 51000
Change-Id: I7fd9cbc925b828fd780adb9ab2c71bcf15dc7284
2014-01-27 20:11:22 +00:00
Trevor Parscal f4156bd09f Update VE core submodule to master (e7e2833)
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
2014-01-17 16:29:36 +01:00
Timo Tijhof 6f90f9364e Remove unused ve-init-mw-viewPageTarget-transform-hidden
Follows-up I2d6157708bd7b.

Change-Id: I62c7d7bb179719165df92499cb66b62aa2c6785d
2014-01-13 20:18:42 +01:00
James D. Forrester 0ffd654bed Bump copyright like it's 2014
Change-Id: Ic469ebda2c061dc7da0b4c1625f43a7be55da4fa
2014-01-05 20:06:50 +08:00
Timo Tijhof 31e6950af0 Fix csslint warnings
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
2013-12-03 23:09:56 +01:00
Ed Sanders 3a98e84932 Fix appearance and messages on demo page
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
2013-11-04 15:11:04 +00:00
Trevor Parscal e83dc3f8fc Use a toolbar for the actions buttons in ve.init.mw.ViewPageTarget
Change-Id: I260059802379d8cab8ca175b7d7d32813e3ff10a
2013-10-29 05:57:52 +00:00
Trevor Parscal d2dfb9ac4f Split oojs-ui from ve.ui
* 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
2013-10-28 22:40:08 -07:00
Ed Sanders 972c9a46b7 Make the save dialog an actual dialog
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
2013-10-07 15:59:00 -07:00
Timo Tijhof 66ff702561 mw.ViewPageTarget: Fix broken firstHeading transition
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
2013-10-06 22:59:13 +02:00
Trevor Parscal 6ec34a3dee Toolbar action widgetization and UI refactoring
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
2013-10-04 16:26:13 -07:00
Amir E. Aharoni b10b5143ff Reverse the progress image for RTL
The reversed image was created by Ebraminio using
convert loading.gif -flop loading2.gif

Bug: 51401
Change-Id: I264d9368cf8fd030ff34540e50e0038aa42ece16
2013-08-22 23:46:59 +03:00
Roan Kattouw ced2a8aa59 Move edit tab generation into PHP and make it more configurable
* Generate the edit tabs and the section edit links in PHP, with a
  fallback in JS for cases where we don't have them yet due to
  caching. But only change things if VE is enabled, and have the JS
  correct the state if the wrong cached HTML comes through.
* Make the order of the tabs/links and the messages to use as captions
  configurable
* Make the edit tabs and section edit links always be present in the
  page (regardless of namespace, user prefs, etc.) but be hidden and
  have JS unhide them (using html.ve-available) if appropriate
* Add appendix messages so we can do a superscript "beta" even in places
  where we can't use HTML in the message

VisualEditor.php:
* Add new hook registrations
* Remove edit link caption messages from the init init module because
  they're now added dynamically in VisualEditor.hooks.php
* Add a noscript CSS module so we can hide some things in JS-less
  environments
* Remove $wgVisualEditorTabLayout and replace it with
  $wgVisualEditorPosition
* Add config vars for link captions, with null causing us to use
  the default caption
* Add config vars for link caption appendices. Too many config vars
  but we'll clean that up later

VisualEditor.hooks.php:
* Dynamically add tab messages to the init init module
* Remove unused globals in onBeforePageDisplay()
* Add noscript CSS module
* Add a SkinTemplateNavigation hook that changes and reorders the edit
  tabs as appropriate
* Add a DoEditSectionLink hook that overwrites the edit section links
* Export the new config variables to JS

VisualEditor.i18n.php:
* Add beta appendix message
* Add a message for the default VE edit section link

ve.init.mw.ViewPageTarget.init.css:
* Remove the animation on the edit section links
* Darken the color of the brackets and the pipe from #ccc to #555
* Style the beta message to be superscript-like (but not real <sup> to
  avoid moving the baseline)

ve.init.mw.ViewPageTarget.noscript.css:
* Hide the VE edit tab, the pipe and the VE edit section link initally
  unless and until JS unhides

ve.init.mw.ViewPageTarget.init.js:
* Toggle .ve-not-available / .ve-available
* Edit tabs
** Only generate the the edit tabs if they're not already there from PHP
** Rewrite the edit tab generation to mirror what's being done in PHP
* Section edit links
** Same as for edit tabs
** Also add mw-visualeditor-expanded to pad the brackets

ve.init.mw.ViewPageTarget.js:
* #ca-ve-edit is now always the VE tab (and #ca-edit always the
  edit source tab) so update the .selected behavior accordingly

Change-Id: Idcb15faea7fabe5fe7578b1508079969b27d2469
2013-08-01 21:08:13 -07:00
Timo Tijhof 14343c7bf7 ve.ui.Toolbar: Refactor floating logic for performance
== Renamed methods ==

* enableFloating  -> enableFloatable
* disableFloating -> disableFloatable
* setPosition     -> float
* resetPosition   -> unfloat

== Scroll and resize event ==

Timeline for scroll event reduced from about half a dozen
"Recalculate style" and various forced "Paint" down to 0.

New timeline for scroll is clean (for me: from ~35 to ~59 fps):
* 1 Event (scroll)
* 1 Composite Layer

The composite layer action is the browser changing the viewport
to a different portion of the document drawing. Exactly the one
thing a simple scroll should do.

Timeline for resize event is still pretty crowded and low fps,
but it has improved. Further improvement would likely be around
using requestAnimation and going outside ve.ui.Toolbar.

== Changes ==

* New: ve.ui.Toolbar#initialize.
  Similar to what surface has. Users of Toolbar should decide
  whether to call enableFloatable, append it to the DOM at some
  point and then call initialize() once.

* Don't compute offset() every time.
  Eliminated by doing it once in #initialize. These 'top' and
  'left' offsets do not change.

* Don't compute outerWidth() and $window.width() every time.
  Reduced by doing it once in #initialize to compute the 'right'
  offset. Updating it only on resize.

* Don't set 'top' every time.
  This is already in the stylesheet. It was never set to anything
  else so the abstraction for it in #float has been removed.
  This also made it obvious that code for "ve-ui-toolbar-bottom"
  was unused and left behind. Tha class was only ever being
  removed from something (never added).
  The one addClass call for it was in a condition that is always
  false ("if top > 0").

* Don't set 'left' every time.
  Eliminated by doing it once in #float.

* Don't set 'right' every time.
  Reduced by no longer doing it on scroll. Done once in #float,
  and on resize after computing the new value for it.

* Remove no-op style operations.
  Wrapped methods in if-floatable, if-floated etc. to reduce a
  fair amount of easily avoided re-paint overhead.

* Avoid double re-paint in mw.ViewPageTarget.
  Though we prevent a lot of redundant re-paints now, whenever
  we do repaint we want to do it in 1 repaint instead of 2.

  ve.ui.Toolbar emits #toolbarPosition, which tells
  mw.ViewPageTarget to update toolbarTracker which would read
  the new $bar style properties and copy them over to the
  $toolbarTracker. However, this read operation forces the browser
  to do an immediate re-paint half-way just for $bar.

  Browsers only repaint when style properties are changed and
  JS has yielded. The exception to this is JS reading style
  properties: in that case the browser is forced to do those
  deferred repaints directly and reflect the new values.

  We can avoid this double repaint by passing the updated values
  as data instead of requiring the receiver to read the DOM (and
  thus a keep the deferred repaint). Now toolbarTracker can use
  them directly whilst the browser hasn't even repainted $bar yet.

== Clean up ==

* Redundant "border-radius: 0". This would reset something, but
  it never does. None of the things it inherits from set a
  border-radius. There is one subclass where toolbar is used
  with a border-radius (".ve-ui-surfaceWidget .ve-ui-toolbar-bar"
  sets a border-radius) which overrides this on purpose, so the
  default of 0 is redundant.

* Pattern "if ( .. ) addClass() else removeClass()" changed to:
  "toggleClass( , .. )"

Bug: 52014
Change-Id: I9be855148962eee068a77fe83e98eb20bbdcfeec
2013-07-30 01:47:54 +02:00
Ed Sanders 326347b5a9 Fix font size for overlays in Monobook
Bug: 50058
Change-Id: I751682c4bc51299c15e7efef487ae32e70049b16
2013-07-25 00:12:01 +01:00
Ed Sanders 4e17496fa6 Prepend section title to edit summary
When section edit links are used.

Bug: 50872
Change-Id: I44cef7a892b4f2f22f60f8f7f531f4e9dcfe8363
2013-07-23 22:27:33 +00:00
Eloquence c5de7696a7 Make beta notice more informative and increase CSS width.
Point out that the software may have issues, and point users to the "Edit source"
link explicitly.

Change-Id: Id84d76887038a3a6a9e11a203f19dc3db7703e6a
2013-07-16 18:49:39 -07:00
Roan Kattouw e9ca44c86c Transplant CSS from the main document to each iframe
We previously manually loaded CSS into these frames, which is flawed
because it completely bypasses ResourceLoader (so CSSJanus didn't flip
them, necessitating a bunch of hacks for RTL), and doesn't pull in
MediaWiki styles (so templates inside references don't render correctly).
Instead, this commit copies all styles from the main document into each
frame's document, inlining what it can.

Loading all styles in dialogs and inspectors caused some problems,
initially. We didn't namespace our styles for dialogs vs. inspectors
at all; the only reason inspector styles weren't being applied to dialogs
and vice versa was because we controlled which files were being loaded
in which context. This commit namespaces the inspector and dialog styles
where needed so they don't conflict and try to override each other.

Tested in Vector and Monobook, but not in Apex and not in RTL.

ve.init.mw.ViewPageTarget*.css:
* Namespace styles that are only intended for the main document
* Undo Monobook's font-size: x-small; in frames

*Dialog.js:
* Remove addLocalStylesheet() calls, we don't need those any more
** ve.ui.MWDialog seems to be unneeded now, we may want to remove it

*.css:
* Remove @noflip-ped RTL rules where they were just flipped versions of
  their LTR counterparts

ve.ui.Dialog.css, ve.ui.Inspector.css:
* Namespace styles with .ve-ui-dialog-content / .ve-ui-inspector-content

ve.ui.Frame.css:
* Move the margin:0 and padding:0 here (were in the frame <body>'s style
  attribute) and add background:none to prevent frames from getting
  the skin's background (grey in Vector, a book in Monobook)

ve.ui.Dialog.js, ve.ui.Inspector.js:
* Add ve-ui-dialog-content / ve-ui-inspector-content class to the
  frame's content <div> so we can restrict styles to only apply in
  dialogs / inspectors

ve.ui.Frame.js:
* Replace infrastructure for @import-ing stylesheets with transplantation
* Remove code polling to see when the stylesheets were loaded
** We can't do this in the new approach AFAIK, since all styles in the
   frame are either inlined or inaccessible due to the same-origin policy
** We also shouldn't need it because the browser should have cached the
   styles when it loaded the main document
* Apply ve-ui-frame-body class to the frame's <body> so we can style it
** Move inline padding:0;margin:0; into ve.ui.Frame.css
** Move the ve-ltr/ve-rtl class up to the <body>

ve.ui.Window.js:
* Remove infrastructure registering stylesheet URLs to load

Change-Id: I4a37115301811ad860f4578344a04873ea8c2b69
2013-07-09 16:13:28 -07:00
Timo Tijhof eddd0b384a mw.ViewPageTarget.init: Move edit section to top init
Since we're now only loading the light-weight init on page load,
the section editing wasn't just deferred to after page load (like
it was before), but wasn't happening at all until you clicked
"Edit" (at which point the library loads). It only worked when
going back to "View" after "Edit".

Contrary to tab layout, edit section handling needs to be
accessible both in the top init and in the main target class
because we need to run it both at run time and after the user
has saved a page when we show them the updated page without
refresh. This is why we need to transfer the method at run time
and give the main class access to it as well.
Can't wait for bug 50707 to get rid of this mess...

Bug: 50731
Bug: 49993
Change-Id: Iab9c81222df7f1084179c3643d158374a89ca14b
2013-07-05 18:29:12 +00:00
Roan Kattouw 92c38eab85 The great directory split of 2013
Move all MW-specific files into the ve-mw directory, in preparation
for moving them out into a separate repo.

All MW-specific files were moved into a parallel directory structure
in modules/ve-mw . Files with both generic and MW-specific things were
split up. Files in ve/init/mw/ were moved to ve-mw/init/ rather than
ve-mw/init/mw ; they're still named ve.init.mw.* but we should change
that. Some of the test files for core classes had MW-specific test cases,
so those were split up and the test runner was duplicated; we should
refactor our tests to use data providers so we can add cases more easily.

Split files:
* ve.ce.Node.css
* ve.ce.ContentBranchNode.test.js (MWEntityNode)
* ve.ce.Document.test.js (some core test cases genericized)
* ve.dm.InternalList.test.js (uses mwReference test document)
* ve.dm.SurfaceFragment.test.js, ve.ui.FormatAction.test.js
** Made core tests use heading instead of mwHeading
** Updated core tests because normal headings don't break out of lists
** Moved test runners into ve.test.utils.js
* ve.ui.Icons-*.css
* ve.ui.Dialog.css (MW parts into ve.ui.MWDialog.css)
* ve.ui.Tool.css
* ve.ui.Widget.css (move ve-ui-rtl and ve-ui-ltr to ve.ui.css)

ve.dm.Converter.test.js: Moved runner functions into ve.test.utils.js

ve.dm.example.js:
* Refactored createExampleDocument so mwExample can use it
* Removed wgExtensionAssetsPath detection, moved into mw-preload.js
* Genericized withMeta example document (original version copied to mwExample)
* Moved references example document to mwExample

ve.dm.mwExample.js:
* Move withMeta and references example documents from ve.dm.example.js
* Add createExampleDocument function

ve-mw/test/index.php: Runner for MW-specific tests only

ve-mw/test/mw-preload.js: Sets VE_TESTDIR for Special:JavaScriptTest only

ve.ui.Window.js:
* Remove magic path interpolation in addLocalStyleSheets()
* Pass full(er) paths to addLocalStyleSheets(), here and in subclasses

ve.ui.MWDialog.js: Subclass of Dialog that adds MW versions of stylesheets

ve.ui.MW*Dialog.js:
* Subclass MWDialog rather than Dialog
* Load both core and MW versions of stylesheets that have both

ve.ui.PagedDialog.js: Converted to a mixin rather than an abstract base class
* Don't inherit ve.ui.Dialog
* Rather than overriding initialize(), provide initializePages() which the
  host class is supposed to call from its initialize()
* Rename onOutlineSelect to onPageOutlineSelect

ve.ui.MWMetaDialog.js, ve.ui.MWTransclusionDialog.js:
* Use PagedDialog as a mixin rather than a base class, inherit MWDialog

bullet-icon.png: Unused, deleted

Stuff we should do later:
* Refactor tests to use data providers
* Write utility function for SVG compat check
* Separate omnibus CSS files such as ve.ui.Widget.css
* Separate omnibus RL modules
* Use icon classes in ViewPageTarget

Change-Id: I1b28f8ba7f2d2513e5c634927a854686fb9dd5a5
2013-07-02 20:51:38 -07:00