Prevent images from getting double borders due to slugs,
and prevent extraneous margins from piling up in captions.
Also add the ve-ce-mwBlockImageNode class which shockingly
wasn't being set (only ve-ce-mwBlockImageNode-TYPE was set).
Change-Id: I86b95aa0c0def92a9790b7cdb4b05837fb8f65e2
Also remove CSS hack from MWTransclusionNode now that
we have properly styled Parsoid references.
Bug: 63983
Change-Id: I5e8dc4c618809f6dd923fe4676d57acd1094f93d
Reorganize stylesheets in VE-MW to match JS directory structures,
and update VisualEditor.php for similar reorganization in VE core.
New changes:
c6ed962 Reorganize stylesheets
Change-Id: I4f1070643744fb2ee6726cb03e012e31a9a05c64
Make sure the magnify button in the caption is properly shown or
hidden when image type changes. The magnify icon will always be
built, but will be shown and hidden using CSS rules.
Bug: 62139
Change-Id: Ib9a4569239ed70d16a153fb0823e283203fba1d4
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
Even with the fix in VisualEditor core (I2c2c592) that prevents non-sheild
elements from being interacted with on generated content nodes, in the
case of a centered image, there is a shield placed on the wrapper which
causes the same problem. By hiding that particular shield, we can get the
desired effect, of only the actual figure being clickable.
Bug: 61001
Change-Id: I7fcf1a34c5ac67c3861cf0b8f3b2447d0d7dc1c1
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
For some reason, the class-wide /*@noflip*/ on mw-halign-left and
mw-halign-right didn't 'catch' and cssjanus ended up flipping the
float directions in RTL. This fix forces noflip condition on each
of the lines separately, which seems to work.
Bug: 50910
Change-Id: I4cddce80397d821dc3cbf40ee4b4c471890d8d35
MWBlockImage
* Remove properties which just cache model properties. We can get
fresh values from the model whenever needed and this just causes
problems keeping them in sync.
* Tidy up DOM documentation indentation
* Merge setupCaption and setCaptionVisible into updateCaption. The
caption's visibility can be calculated inside the method from
model attributes.
* No need to generate figcaption on init, updateCaption will do
this for us
* Storing full view and model in this.caption is unnecessary,
just store this.$caption (view.$element) and this.captionVisible
* Append the caption directly to the figure now there is no container
* Simplify setCaptionVisible
* Add in fix to account for border to figure width
* updateSize can get values from the model if they are not provided
* Remove unnecessary styles being set on this.$element.
MWImageCaption
* Generate as a figcaption instead of a div for direct attachment
MWImage
* Missing docs
CSS
* Cleanup reset styles, remove redundant add in required
* Fix margins for left/right floats to match .tleft/.tright
* Use more specific selector for inner border (thumbimage) to avoid
matching shields.
* Remove unnecessary frameless styles, it has no border by default.
Change-Id: I52e0e10b465bb9761c2e4be28c98bec37b0dd2ca
Adding @noflip to align-left and align-right in the <figure> css styling
rules and removing the need to resize the Branch Node div element on center.
Change-Id: Iec6e589ba9ecdf32c1a0934b9eb05ee3fd42af66
This change is meant to transform the current block image node rendering
in ContentEditable from the nested <div> structure to a <figure> tag more
closely matching Parsoid's output, with CSS to style it the same. This is
mostly so we can work with and display attribute changes, like 'type' and
'alignment', without constantly destroying and rebuilding nested <div>
structures.
This change also includes all the attribute changes that will be called
when the media edit dialog changes image type, alignment, size, etc.
Node: The mw-classes 'thumb', 'thumbinner' and 'thumbcaption' are
preserved in the structure of the <figure> but CSS designers should note
these styles are no longer necessarily attached to <div> elements.
Bug: 53436
Change-Id: I40065acd9fd59d30f94b5336736d4986e8de15aa
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
We had CSS that applied to our rendering of autonumbered links,
but not for raw <a rel="mw:ExtLink"></a> tags appearing in
generated content like templates.
Bug: 57420
Change-Id: Ic1585ecb1a133d16b7393ce0ce38a11b76cc2239
Since I0f0a826c in Parsoid, numbered external links are now empty
<a rel="mw:ExtLink"></a> tags. This means we have to put in a node type
for them to prevent them from being considered empty annotations and
getting converted to alienMeta.
MWNumberedExternalLinkNode is protected and focusable to avoid making
the link text (which isn't editable) clickable. It isn't inspectable
yet, we need to work on that.
Bug: 53505
Change-Id: I83f69695f3974089e51a84e799f31ab6ed879e05
VisualEditor.i18n.php, VisualEditor.php
* Button title
* New experimental files
ve.*.MWAlienExtensionNode.js
* Very basic extension of ve.*.MWExtensionNode
ve.ui.MWAlienExtensionInspector.js
* Default to inline-block for wrapper. Should probably
get rid of styled wrappers for GeneratedContent eventually.
ve.ui.MWAlienExtensionInspector.js
* Basic extension of MWExtensionInspector. Override title to
use tag name e.g. '<easytimeline>'. Could be changed in future
to 'Extension: easytimeline' or similar.
*.png, *.svg, *Icons*.css, ve.ui.MWAlienExtensionButtonTool.js
* Angle bracket icon for button (open to suggestions)
ve.ui.MWInspector.css
* Make extension inspector text input tall by default.
Change-Id: I07f0686839192cad3cd8dfd3233ae907fe5cdf6a
Mostly as a demonstration of how easy this is with MWExtensionNode.
The icon was chosen with the following criteria:
1. Recognisable (the ankh is quite common in popular culture, right?)
2. Doesn't look idiotic to academics (I've consulted an Egyptology
PhD and they can confirm it's not the glyph for penis)
3. Renders well at <16x16
That said it does look a little like a stick man...
Bug: 43118
Change-Id: I9f9e8af501401866bfeecf0eec3690a705fbd4db
VisualEditor.php
* Add CSS file
ve.ce.MWMathNode.js
* Wrap the image in a span, so GenerateContentNode doesn't
try to nest an image inside an image
* Remove unnecessary attribute setting
* Only pass unwrapped image to deferred.resolve
* Retrigger MathJax rendering
ve.ce.Node.css
* Use inline-block for image wrapper
ve.dm.MWMathNode.js
* Mixin GeneratedContentNode and implement getHash
* Copy over functionality of MWTransclusionNode:
+ Just store data-mw for attributes
+ Store orignal(DomElement|MW|Index) for selser
ve.init.mw.ViewPageTarget.js
* Add mwMath to the toolbar
ve.ui.MWMathInspector.js
* Remove static.InputWidget, not required in this architecture
* Use multiline TextInputWidget
* Only update mw attribute
* Allow creation of new math nodes
ve.ui.MWInspector.css
* Set height of TextInputWidget
Change-Id: I520f8ccc9f89a2ce70aa1d9e02ed0c6cacbecc2f
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
