Commit graph

557 commits

Author SHA1 Message Date
Trevor Parscal 130e446e52 Single-click insertion
Objectives:

* Reduce the number of clicks and mouse maneuvers required to insert
  media, references or template parameters
* Make use of highlighting with mouse movement or arrow key presses,
  similar to menus, to suggest action when clicked
* Improve the way media search results look and feel

Changes:

ve.ui.SelectWidget.js
* Add mouseleave handler to un-highlight when the mouse exits the widget
* Document highlight events (already being emitted)

ve.ui.SearchWidget.js
* Propagate both select and highlight events from results widget
* Make arrow keys change highlight instead of selection
* Get rid of enter event, make enter key select highlighted item instead
* Provide direct access to results widget through getResults method

ve.ui.MenuWidget.js
* Use the selected item as a starting point if nothing is currently
  highlighted when adjusting the highlight position

ve.ui.Dialog.js
* Add footless option to hide the foot element and make the body extend
  all the way down to the bottom
* Remove applyButton, which only some dialogs need, and should be creating
  themselves, along with other buttons as needed

ve.ui.Widget.css
* Change highlight and selected colors of option widgets to match other
  selection colors used elsewhere
* Leave selected and highlighted widget looking selected

ve.ui.Frame.css
* Add background color to combat any color that might have been applied to
  the frame body in the imported CSS from the parent frame

ve.ui.Dialog.css
* Add rules for footless mode

ve.ui.MWReferenceResultWidget.js,
ve.ui.MWParameterResultWidget.js,
ve.ui.MWMediaResultWidget.js
* Allow highlighting

ve.ui.MWParamterSearchWidget.js
* Switch from selecting the first item when filtering to highlighting

ve-mw/ve.ui.Widget.js
* Adjust media result widget styling to better match other elements

ve.ui.MWTransclusionDialog.js,
ve.ui.MWReferenceListDialog.js,
ve.ui.MWReferenceEditDialog.js,
ve.ui.MWMetaDialog.js
ve.ui.MWMediaEditDialog.js
* Add apply button, as per it being removed from parent class

ve.ui.MWTransclusionDialog.js,
ve.ui.MWReferenceInsertDialog.js,
ve.ui.MWMediaInsertDialog.js
* Insert parameter/reference/media on select, instead of clicking an
  insert button
* Use 'insert' instead of 'apply' as argument for close method

Bug: 50774
Bug: 51143
Change-Id: Ia18e79f1f8df2540f465468edb01f5ce989bf843
2013-07-15 23:42:56 +00:00
Trevor Parscal c7a5546bb2 Use template icon on template placeholder pages
As opposed to using a parameter icon - which just doesn't make sense.

Change-Id: Idbe42a1b91a0691d1cf83dde4221ce3aac09d0fa
2013-07-15 15:43:39 -07:00
Trevor Parscal d3df2a5a91 Fix uses of addPart to make them async friendly
Problem:

Adding or moving templates or content resulted in the incorrect item
being selected.

Diagnosis:

Although recently we solved a few issues by making addPart async, it
caused some other issues where callers of addPart were assuming
otherwise

Solution:

Return a promise from addPart which is resolved after the part is
actually added and setup callers to use the promise when needed

Changes:

ve.ui.MWTransclusionDialog.js
* Use promises to auto-select new or moved parts

ve.dm.MWTranclusionModel.js
* Make addPart return a promise
* Resolve promise when queue is processed
* Automatically remove existing items before adding them in different
  locations at the time of processing the queue we don't yield between
  removing and adding

Change-Id: Ie43c5b89ca4ed34d5f797714e19c9a7e1824cdec
2013-07-12 01:30:04 +00:00
Trevor Parscal b3b2d3fb91 Preserve unused Parsoid template properties
Problem:

Parsoid has a property called "i" which we don't use, but they need for
round-tripping purposes. Since we were generating a structure from
Parsoid data and then generating data from the structure without
preserving properties we didn't use, it was getting lost.

Solution:

Abstract creating a template from data vs. creating it from name. Make
only templates have an origin argument in their constructors, so and
set it within a set of static constructors that create a template for
either data or a template name. Store the original data in the former
case, and use it as a base when serializing.

Changes:

ve.ui.MWTranslcusionDialog.js
* Remove no-longer-needed mw global declaration
* Move most of the addTemplate function to a static constructor in the
  template model class

ve.dm.MWTransclusionPartModel.js,
ve.dm.MWTransclusionContentModel.js,
ve.dm.MWTemplatePlaceholder
* Remove unused origin argument/property/getter
* Add serialize method (if needed)

ve.dm.MWTranclusionModel.js
* Move template/parameter generation from data into static constructor
  of template model
* Move serialization to part classes

ve.dm.MWTemplateModel.js
* Add mw global declaration
* Stop passing origin to parent constructor, store it locally instead
* Add original data property/setter for preserving unused properties
  when round tripping
* Add static constructors for generating a template from data or by name
* Add serialize method

Bug: 51150
Change-Id: Ide596a0ca0ae8f93ffce6e79b7234a1db7e0586c
2013-07-12 00:47:01 +00:00
Trevor Parscal fc95029b34 Auto-add required params for user added templates
Objectives:

* Automatically add required parameters to templates that users create
  using the GUI, without touching existing templates loaded from data
* Cleanup some confusing terminology and APIs

Changes:

ve.ui.MWParameterSearchWidget.js
* Remove special logic for skipping aliases, which are no longer included
  in the list of names given by getParameterNames

ve.ui.MWTransclusionDialog.js
* Add origin arguments to constructors of transclusion parts
* Re-use onAddParameter method during initial construction of parameter
  pages
* Add required template parameters for user created template parts

ve.dm.MWTransclusionPartModel.js
* Add origin argument/property/getter for tracking where a part came from

ve.dm.MWTransclusionContentModel.js,
ve.dm.MWTransclusionPlaceholderModel.js,
ve.dm.MWTemplateModel.js
* Add origin argument pass through

ve.dm.MWTranclusionModel.js
* Add origin arguments to constructors of transclusion parts

ve.dm.MWTemplateSpecModel.js
* Rename origin to name - was a bad name to start with and will be even
  more confusing with the new part origin property
* Add isParameterAlias method
* Make getParameterNames only return primary names, excluding aliases

ve.dm.MWTemplateModel.js
* Update use of parameter origin, now called name

Bug: 50747
Change-Id: Ib444f0f5a8168cd59ea52a6000ba5e42ccdc2a24
2013-07-11 16:31:51 +00: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
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