Commit graph

61 commits

Author SHA1 Message Date
Moriel Schottlender cf237b882e Insert special character tool
A tool to add special characters and diacritics to text.

Also added a new button type ve.ui.GroupButtonWidget that includes a
group of PushButtonWidget objects and returna the individual button's
value upon click

Wikis can edit <visualeditor-specialcharinspector-characterlist-insert>,
a JSON string, to include their own desird special characters to insert
through the tool.

Bug: 50296
Change-Id: I26d1f437feef1c8b61ed3be5f74ef524b33baf49
2013-12-05 22:51:14 -08: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
Trevor Parscal 580c5be915 Use CSS for handling empty labels
Objective:
* Use CSS to control the styling of empty labels

Changes:

ve.ui.LabeledElement.js
* Remove emptyHtml static property
* Add/remove ve-ui-labeledElement-empty class when setting label

ve.ui.ToolGroup.css
* Hide empty labels inside popup tool group handles

ve.ui.Widget.css
* Hide empty labels inside icon button widgets

ve.ui.Toolbar.js
* Only apply default catch-all tool group properties if they were previously undefined

ve.ui.IconButtonWidget.js
* Remove emptyHtml static property

Change-Id: Icd3f772942e74b547e926829c181e914182feb75
2013-10-16 17:41:53 -07:00
Ed Sanders 3077be6d9c Remove -ms-transition
Because it never existed.

Change-Id: Iaae7e8f11efb0a9853130bcdad8b643c06a1eed8
2013-10-16 15:32:04 +00: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
Trevor Parscal 9426dfd54b Cleanup tool styles
Objectives:

* Make drop down tools look more like buttons and less like inputs, since they aren't text input and are buttons
* Make context toolbars inside surface widgets render correctly
* Show outlines of groups on hover to hint tool relationships
* Make neighboring active tools look cleaner

Changes:

ve.ui.Tool.css
* Merge ButtonTool and DropdownTool styles as much as possible
* Add styles for DropdownTool active states
* Only round the corners of the first and last tool in a group
* Soften the borders between consecutive active tools

ve.ui.Toolbar.css
* Add border to groups on hover

ve.ui.Widget.css
* Isolate surface widget toolbar styles by using stricter selector

ve.ui.Tool.js
* Fix incorrect capitalization of class name

ve.ui.SurfaceWidget.js
* Add classes to toolbar and surface for better style targeting

Change-Id: Ib5ae8f705ef1e9c481e5bdf8c8dcef9c1eb22c4d
2013-08-07 05:08:08 +00:00
jenkins-bot ed8133e317 Merge "Link inspector bug fixes" 2013-07-31 20:54:46 +00:00
Trevor Parscal db3da5d16b Link inspector bug fixes
Formerly known as "The greatest commit in the history of the world*".

* Within a 3 block radius of Drayton Park and Auburt Park, starting
from July 30th at about 9pm or so.

Bugs:

* (bug 51404) Allow escaping out of the link inspector when in creation
  mode (no text is selected, text will be inserted based on link target)
  and the text input is empty
* (bug 51065 and bug 51415) Keep model and view in sync when changing the
  link inspector's text input value and showing options in a menu
* (bug 51523) Either restore selection at the time of close to what it was
  before opening the inspector (when using back) or to what it was before
  closing (might be changed by transactions processed during the close
  method) - this makes it simpler and more natural when clicking away from
  the link inspector, even when there are changes that must be saved by
  the link inspector on close

Bonus:

* Use only the light blue highlight color for menu widget items - the
  checkmark already displays the selected item, the dark blue is just
  masking the current highlight position and confusing the peoples
* Remove links when the user deletes everything from the link inspector's
  text input and then closes the link inspector
* Replace select menu's evil "silent" selectItem/highlightItem argument
  with a new method called initializeSelection which sets both selection
  and highlighting to an item without emitting events - this is needed
  when synchronizing the view with the model so the model isn't
  immediately told to change to a value it already has
* Make the MWTitle lookup menu not flash like crazy as you type (this was
  caused by a copy-paste oversight overriding
  initializeLookupMenuSelection unnecessarily)

Bug: 51404
Bug: 51065
Bug: 51415
Bug: 51523
Change-Id: I339d9253ad472c2f42c3179edc84a83d27561270
2013-07-31 17:42:14 +00:00
Moriel Schottlender 59079978ff Language Inspector UI
This is the language inspector UI engine with ULS core.
The Language Inspector works alongside ULS to choose and change language
blocks in text. The inspector was based on ve.ui.TextInputWidget and
now changed to inherit ve.ui.Widget and display details in a table
instead of an input textbox.

Added jQuery.ULS module:
* Repository: https://github.com/wikimedia/jquery.uls
* Latest Commit 728f112ffc90b03b50c0109487886a2647f12020
* Taken 'src' / 'images' and 'css' folders into modules/jquery.uls

Bug: 47759
Change-Id: I3c9fd6c135c05a54f6c7fc28c5962fc0a6677806
2013-07-29 00:38:59 -04:00
Trevor Parscal 61ba07d409 Reference dialog commingling
Objectives:

* Merge reference insert and edit dialogs
* Change workflow to put editing/creating a new reference first
* Add secondary page in dialog for selecting an existing reference

Changes:

*.php
* Cleanup unused files/messages

ve.ui.Dialog.css
* In the footer; make primary, constructive and destructive buttons
  appear on the right; all others on the left

ve.ui.MWReferenceSearchWidget.js
* Fix documentation
* Remove create option and reuse section header items

ve.ui.MWReferenceInsertButtonTool.js,
ve.ui.MWReferenceEditButtonTool.js,
ve.ui.MWReferenceButtonTool.js
* Merge reference button tools

ve.ui.MWDialog.css
* Remove body styles, use padded option of layout instead
* Update selectors as per merging of dialogs

ve.ui.MWReferenceInsertDialog.js
ve.ui.MWReferenceEditDialog.js
ve.ui.MWReferenceDialog.js
* Merge reference dialogs
* Add buttons to switch between edit and select mode

ve.init.mw.ViewPageTarget.js
* Update reference button name as per merging of tools

ve.ui.SurfaceWidget.js
* New widget!
* Encapsulates a "sub-surface"

Bug: 51152
Bug: 50458
Change-Id: I8265febf4fd8f64d2ac40470ff033bac68b24d99
2013-07-18 14:14:14 -07:00
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 1c637008e5 Tighten up outlines and fieldsets
Objective:

* Make outline widgets and fieldset layouts take up a little less space

Bonus:

* Fix option icons always showing up on the first item because the option
  wasn't position relative

Changes:

ve.ui.Widget.css
* Add position: relative to option widgets
* Cleanup unused background properties for outline items
* Reduce padding for outline items
* Move icons to match padding changes

ve.ui.Layout.css
* Reduce margins for fieldset layouts, including using a negative top
  margin to compensate for the overly tall legend

Change-Id: Ida6147b8171dcb4152ca9be0e099a5f9b81ac1c0
2013-07-11 16:22:38 +00:00
Trevor Parscal 703328d770 Make parameter search widget have a horizontal limit
Objective:

* Cut off really long parameter names with ellipsis

Changes:

ve.ui.Widget.css
* Use ellipsis when option labels get too long

ve-mw/ve.ui.Widget.css
* Limit the size of a parameter result widget label - this is a hack, but
  since there are strange bugs with using ellipsis together with % based
  width, it's the best we can do for now

Bug: 50800
Change-Id: Idbfa336d2bba376b0d078fdd0ece65926d610d81
2013-07-10 01:35:38 +00:00
Trevor Parscal 3a6e91dfb7 RTL Improvements
Objectives:

* Make option widget icons correctly placed in RTL
* Make embedded context toolbar correctly placed in RTL

Approach:

Use separate elements for icons within option widgets which have more
flexibility when rendering in either LTR or RTL when compared to CSS
background position. The simpler approach, using CSS background
position offsets, isn't cross-browser compatible at this time.

Changes:

ve.ui.OutlineItemWidget.js
* Remove custom icon implementation, using parent class implementation
  instead

ve.ui.OptionWidget.js
* Add icon option, which adds an icon element only if an icon was
  specified

ve.ui.MenuItemWidget.js, ve-mw/ve.ui.MWParameterResultWidget.js
* Add override for icon config option
* Document icon config as private

ve.ui.Context.js
* Add detection and special handling for positioning embedded context
  toolbar when rendering in RTL

ve.ui.Widget.css
* Add styles for option widget's new icon option
* Add styles to make indentation still work for outline item widgets
* Adjust styles for menu item widget as per changes in option widget

ve-mw/ve.ui.Widget.css
* Adjust styles for parameter result widget as per changes in option
  widget

Change-Id: Ibfa4b613e0fd7902f8a2c78b5717de402c5f82b8
2013-07-10 00:09:22 +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
Moriel Schottlender 1dc21c01e3 Page settings fix-fix
This re-fixes the fix to the frame fix. fix fix.
Two things changed: Background position flipped to the right properly
(was somewhat off before) and text-alignment flipped as well.

Bug: 49613
Change-Id: I0aa317ef674537d20d7ed64e74eaa3cfe8030c8c
2013-07-05 13:44:13 -04: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
Trevor Parscal 4568274949 Template parameter adding
Objective:

* Allow browsing, searching and adding documented parameters

Changes:

ve.ui.MWTransclusionDialog.js
* Replace regular text input with ve.ui.ParameterSearchWidget
* Fix uses of $(), this.frame.$$ is correct

ve.ui.Dialog.css
* Change rules for addParameterFieldset to make search widget auto-size vertically

ve.ui.Widget.css
* Add styles for ve.ui.MWParameterResultWidget

ve.ui.MWParameterSearchWidget.js, ve.ui.MWParameterResultWidget.js
* New classes
* Provides a way to search and select parameter for a template
* Displays parameter label, name, aliases and description

*.php
* Links to new files and messages

Change-Id: Ie5dbe8c44ce5d64c4b49b09517fb66cd30dd7304
2013-07-02 13:40:54 -07:00
jenkins-bot 21476b37ef Merge "Dir fix for iframes and widgets" 2013-07-02 20:22:34 +00:00
Moriel Schottlender c4c9923c91 Dir fix for iframes and widgets
This fix adds a directionality property to the frame objects so directions
can be inherited and manipulated inside the frame <body> tags.
There are also several corrections to flipping positioning of panels
in the GridLayout and of the icons in fieldsets and labeled elements
so they appear properly (right instead of left).

I've added a 've-rtl' / 've-ltr' class to frame content divs to serve as
selectors for rtl fixes and general language fixes. Most CSS corrections
would likely be fixed when CSSJanus works in iframes, but the selectors
would still be useful.

This sets the stage for directionality inheritance inside iframes,
and fixes most of the problem with the Page Settings window in RTL wikis.
It also fixes all the labels with icons across VE interface.

Bug: 49613
Change-Id: I418e669b0999552167683352acb365a4249ab9cc
2013-07-02 20:20:43 +00:00
Rob Moen c472b2fe4a Make local overlays local to surface and remove insane z-indexes
ve.ui.Surface.js
* Make local overlay a child of ve-ui-surface and a sibling to
  ve-ce-surface elements.
** This keeps local overlays relative to their surface and eliminates the
   need for insane z-indexes.

ve.ui.PopupWidget.js
* PopupWidget boundaries are now relative to ve-ce-surface and no longer
  protrude out

ve.ce.Node.css, ve.ui.Window.css
* Removal or replacement of insane z-indexes.

ve.ce.FocusableNode.js, ve.ce.ProtectedNode.js, ve.ce.ResizableNode.js,
ve.ui.Context.js
* Translate offsets from local overlay

ve.init.mw.ViewPageTarget-monobook.css,
ve.init.mw.ViewPageTarget-vector.css
* Skin specific z-indexes for global overlay

ve.init.mw.ViewPageTarget.js
* Applied direction specific mw class to ce.Surface vs ui.Surface to
  prevent mw content styles from being applied to ui elements.

ve.ui.Dialog.css
* Adjustments to surface inside of dialog so that relative offsets for
  local overlays can be properly calculated.

ve.ui.Surface.css
* Explicitly force .ve-ui-surface to be relative so that it's children can
  be relatively positioned.

ve.ui.Widget.css
* Removal of unnecessary font-size properties now that local overlay is
  sibling of surface.

ve.js
* Added get relative position helper method to translate position offsets
  from target parent

Bug: 50241
Change-Id: Ibadce404a2286bc5dcec48f0d9da89004dbbd867
2013-07-02 19:35:43 +00:00
Trevor Parscal 0aac4c7e60 Reference insertion, new and existing
Objectives:

* Split reference dialog (at least for now) an edit and an insert dialog
* Add reference search widget for selecting an existing source, or
  choosing to add a new one
* Abstract reference names, don't allow editing them and generate them
  when needed
* When editing groups, move the internal item and update all references
  to it
* Resolve name conflicts when moving a reference to a new group by
  generating a new list key

Bonus:

* Add getNodeGroups method to internal list
* Add getUniqueListKey method to internal list
* Add destroy functionality to ce.node to release events and references

Bug: 49733
Change-Id: Ib244ff6ad9b4cee1decfd9b9e1d3d4e9cdcfb78c
2013-06-27 18:11:31 -07:00
Trevor Parscal 256ed827d9 Option widget improvements
Objectives:

* Make options unable to be selected or highlighted when disabled
* Add default styles for selected state
* Fix line-height for option labels
* Use default cursor when field is disabled

Change-Id: I8a535cd6b259b092c2abce27ddb10882cdde6cf5
2013-06-28 00:08:00 +00:00
Trevor Parscal ed7d42592f Move some of MediaSelectWidget into SearchWidget
Objectives:

* Break apart MediaSelectWidget for re-use
* Rename classes to follow search/result naming scheme

Change-Id: I65aab3dc3d41e31af13e2754e77b7dd185ac90f1
2013-06-27 23:51:09 +00:00
Trevor Parscal c2196b1fe7 Remove use of filter property for CSS opacity
Was used for IE8 support, no longer needed.

Change-Id: I1e7a1e676022dd7607c808bd44848cbf22a9e958
2013-06-25 16:44:06 -07:00
Trevor Parscal 23b2da91fd Template and content adding
Objectives:

* Allow adding content or templates within a transclusion
* Add template placeholder to model and view which resolves to nothing
  when saving (thus disappearing if not resolved)

Changes:

*.php
* Add links to new messages and files

ve.ui.OutlineControlsWidget.js
* Organize controls into "adders" and "movers"

ve.ui.Widget.css
* Add styles for adders/movers sections of outline controls
* Make adders appear on hover to reduce clutter

ve.ui.Icons-*.css
* Add icon for "add item"

ve.ui.Dialog.css
* Add styles for add template fieldsets
* Make placeholder items in the outline italic

ve.ui.PagedDialog.js
* Pass adders config to outline controls

ve.ui.MWTransclusionDialog.js
* Add support for adding content and templates

ve.dm.MWTransclusionModel.js
* Add addPlaceholder method

ve.dm.MWTemplatePlaceholderModel.js
* New class, pretty much an empty part
* Using this makes the UI much easier to work with - no need to special
  case the outline control for new items
* Because it's not supported specifically in
  ve.dm.MWTransclusionModel.getPlainObject, it produces nothing and goes
  away naturally on apply

Change-Id: I3478560fb53ba2ccd3fb26bafb6a61e6415565eb
2013-06-18 23:37:44 +00:00
Trevor Parscal 00d5c41e02 ve.ui.IconButtonWidget: Extend css transition from 100ms to 200ms
Makes make it look nicer.

Change-Id: Ib7c1021a31f607b6e697f16fe797358c0167acee
2013-06-18 21:45:33 +00:00
jenkins-bot 8b414bf426 Merge "grunt: Also delete QUnit temp files when test fails" 2013-06-17 18:29:21 +00:00
Ed Sanders 4986576cc4 grunt: Also delete QUnit temp files when test fails
Move post-qunit task to qunit.done event which fires both on
success and failure.

Define pre-qunit + qunit as a group test 'unit', so they can
be run from the command line (previously 'grunt qunit' would
fail) as 'grunt unit'.

Also add override comment to css file using non-standard
property so csslint passes again (follows-up b2fbe35).

Bug: 49431
Change-Id: I5079d00a63d43276a12dd78c306bb3819470631d
2013-06-17 11:27:52 -07:00
Trevor Parscal ac26f5fc69 Outline controls
Objectives:

* Allow reordering items in outline widgets using an outline control
  widget
* Use an outline control widget to reorder transclusion parts

Changes:

ve.ui.SelectWidget.js
* Emit add and remove events

ve.ui.OutlineItemWidget.js
* Add movable config options
* Add isMovable method

ve.ui.OutlineControlsWidget.js
* New class
* Displays move up/down buttons which are synchronized with an outline
  widget
* Doesn't actually move items (since an outline widget is probably
  data-driven) just emits events

ve.ui.Widget.css
* Add disabled style for icon button widgets
* Add styles for outline controls widget

ve.ui.Icons*.css
* Add missing icon styles

ve.ui.Dialog.css
* Add styles for outline and controls in editable paged dialogs

ve.ui.GroupElement.js
* Fix bug where items are insertions are in the wrong place when "moving"
  them

ve.ui.PagedDialog.js
* Add editable config option which shows outline controls under the
  outline
* Pass through movable config option when creating pages

ve.ui.MWTranclusionDialog.js
* Configure paged dialog outline as editable
* Add initialize method to connect outline controls widget events
* Make addPart method automatically add parameters when templates are
  added
* Add handler for outline controls move event which re-orders parts
* Make parts movable (params are automatically ordered, so they aren't
  movable)

ve.dm.MWTransclusionModel.js
* Add addPart method and use it within the addContent and addTemplate
  methods
* Fix documentation lies
* Add getPartFromId method

*.php
* Add links to new files and messages

Change-Id: I919d4c3e9b85d07a97a99c0b2e8739a859bdf2b1
2013-06-14 11:56:30 -07:00
jenkins-bot 0bffa7b119 Merge "Improve category widget styling" 2013-06-13 19:27:57 +00:00
Trevor Parscal 6fba13b453 Improve category widget styling
Objectives:

* Get rid of the border and ensure pixel-perfect positioning of the input.
* Always render the arrow on the top right of the category item
* Make the popup positioning based on the arrow div's position and size

Bug 49420
Change-Id: I3ad4ff1c41e6108161b5b7c8718c676eb850de68
2013-06-13 19:26:29 +00:00
Trevor Parscal e2b7504b8e Category popup fixes
Objectives:

* Make category popup show "Category" rather than missing message -
this is more similar to other popups like inspectors, which identify
what that thing is that you are working on
* Fix alignment of icon and label in category popup

Changes:

ve.ui.Widget.css
* Make popup title align properly with the remove button

ve.ui.MWCategoryPopupWidget.js
* Update message key

*.php
* Add new message

Change-Id: Ia8051125bbc9bde47ceb931e1ebf42b2955481ff
2013-06-12 16:44:10 -07:00
Roan Kattouw b2fbe35962 Break words in the category dialog
Of course CSS is perfectly standardized and wonderful, so we need a bunch
of duplicative and non-standard rules.

Also fix the mixin in MWCategoryWidget

Change-Id: I24da0ddb29d2886c450da362fee47d22da8e631d
2013-06-10 16:49:01 -07:00
Trevor Parscal 1fd7e85846 Image insertion
Objective:

* Allow inserting images from local wiki and commons

Changes:

ve.init.mw.ViewPageTarget.js
* Add media insert button to toolbar

ve.init.mw.Platform.js
* Add getMediaSources method - defaults to local wiki and commons

ve.ui.MWMediaInsertDialog.js
* New dialog for inserting media
* Uses a media select widget and inserts block images

ve.ui.Dialog.css
* Added styling for media select widget in media insert dialog

ve.ui.Widget.css
* Added styles for media select widget and media select item widget

ve.ui.MWMediaInsertButtonTool.js
* New tool for inserting media

ve.ui.MediaSelectItemWidget.js
* New item widget for media select widgets

ve.ui.MediaSelectWidget.js
* New widget for searching for and selecting media items

ve.ui.TextInputWidget.js
* Added isPending method

VisualEditor.i18n.php
* New messages for media insert dialog

VisualEditor.php
* Added links to new files and messages

PhantomJS--

Change-Id: Ia803ff3ef518782ce76802d2dab7559686a1bb0a
2013-06-06 17:36:55 -07:00
Trevor Parscal 8a8a337ce5 Pending input refactor
Objective:

* Make all text inputs have the ability to be "pending", not just ones
  with a special mixin

Changes:

* Delete pending input widget
* Move pending input widget implementation to text input widget
* Update all uses of pending input widget
* Make pending image a reusable "texture"
* Update styles of text input widget for pending state
* Get rid of checking for mixin since all text inputs can be pending now

Bonus:

* Get rid of unused images, including .psd and .ai files
* Add transparency texture
* Fix input widget not using documented config value
* Fix documentation in select widget (lies!)

Change-Id: Ib46ab01dc39d706e5c25fd473dee0edce51b7e44
2013-06-06 21:17:35 +00:00
Trevor Parscal eec6b99369 Add icon option to ve.ui.TextInputWidget
Changes:

ve.ui.Widget.css
* Add styles for decorated text input widgets and their icon elements

ve.ui.TextInputWidget.js
* Add icon option which adds an icon before input text

Change-Id: Ib48d795391cb5d110e7dc05658d51129792dfc33
2013-05-29 12:39:07 +01:00
Trevor Parscal da679b7a9c Template dialog cleanup
Objectives:

* Break template page creation into it's own method
* Get rid of styling being applied in JavaScript
* Fix styling issues

Changes:

ve.ui.MWTemplateDialog.js
* Add method for adding a template page
* Replace css calls with addition of classes for styling
* Cleanup of append calls

ve.ui.Dialog.css
* Make inputs in the template dialog full width and a reasonable height

ve.ui.Widget.css
* Swap margins with padding in labels to prevent layout issues
* Prevent textareas from being resized in safari/chrome

Change-Id: I4030d8605aad865251ecd0aeb8cc72d333bed6a4
2013-05-29 11:03:52 +01:00
Catrope dc961f6773 Remove trailing whitespace everywhere
Change-Id: I14f812bd31bd33d9fbd1148a474cbe7a3375d954
2013-05-25 15:04:11 +00:00
Trevor Parscal 2e76271b4e The Great ve.ui.Surface refactor of 2013
Prologue:

Farewell ve.Editor my good chap… Oh, hey there HTML frames - I didn't
see you there! In a world where iframes are outlaws, and symbols like
document and window are global, there were more than a few assumptions
about which document or window was being used. But fear not - for this
commit (probably) tracks them all down, leaving a trail of
iframe-compatible awesomeness in its wake. With the great ve.ui.Surface
now able to be used inside of iframes, let the reference editing
commence. But there, lurking in the darkness is a DM issue so fierce it
may take Roan and/or Ed up to 3 whole hours to sort it out.

Note to Roan and/or Ed:

Editing references seems to work fine, but when saving the page there
are "no changes" which is a reasonable indication to the contrary.

Objectives:

* Make it possible to have multiple surfaces be instantiated, get along
  nicely, and be embedded inside of iframes if needed.
* Make reference content editable within a dialog

Approach:

* Move what's left of ve.Editor to ve.ui.Surface and essentially
  obliterate all use of it
* Make even more stuff inherit from ve.Element (long live this.$$)
* Use the correct document or window anywhere it was being assumed to be
  the top level one
* Resolve stacking order issues by removing the excessive use of z-index
  and introducing global and local overlay elements for each editor
* Add a surface to the reference dialog, load up the reference contents
  and save them back on apply
* Actually destroy what we create in ce and ui surfaces
* Add recursive frame offset calculation method to ve.Element
* Moved ve.ce.Surface's getSelectionRect method to the prototype

Bonus:

* Move ve.ce.DocumentNode.css contents to ve.ce.Node.css (not sure why it
  was separate in the first place, but I'm likely the one to blame)
* Fix blatant lies in documentation
* Whitespace cleanup here and there
* Get rid of ve.ui.Window overlays - not used or needed

Change-Id: Iede83e7d24f7cb249b6ba3dc45d770445b862e08
2013-05-24 14:01:02 +02:00
Trevor Parscal 96e49858fa Multiline option for ve.ui.TextInputWidget.js
Objective:

* Add multiline option to text input widget which uses a text area instead of a text input

Changes:

ve.ui.Widget.css
* Add text area support for styles otherwise only targeting input elements

ve.ui.InputWidget.js
* Initialize input element using a method, so it can be fully customized (like making a text area or select input
* Use val() to set the initial value, using jQuery's abstraction around inputs of various types

ve.ui.TextInputWidget.js
* Add multiline option which uses a text area instead of an input

Change-Id: I1bf17c8c76b7f1708c57ee5e95160c071ddd00e9
2013-05-15 14:41:22 -07:00
Trevor Parscal 55f28eecce Add level option to ve.ui.OutlineItemWidget
Objective:

* Add indentation feature to outline items

Changes:

ve.ui.PagedDialog.js
* Pass level argument through addPage method

ve.ui.Widget.css
* Add styles for non-zero levels of outline items

ve.ui.OutlineItemWidget.js
* Add missing config documentation for icon option
* Add level option, with getLevel/setLevel methods
* Add statically configurable number of levels and level class

Change-Id: Ie24761c64918fdc6cd28070b3cf56743c6288970
2013-05-15 12:54:19 -07:00
Trevor Parscal 8409d16f0f Fieldsets and default sort keys
Objective:
* Add default sort key field to meta dialog
* Replace PagePanelLayout with a generic panel containing one or more FieldsetLayout elements

Changes:

*.php
* Added/removed file links

ve.dm.MWDefaultSortMetaItem.js
* Added getContent method

ve.dm.MetaItem.js
* Added replaceWith method

ve.dm.MetaList.js
* Allow insertion at the end by omitting offset and index

ve.dm.MWMetaDialog.js
* Added default sort key field
* Put category and default sort fields inside fieldsets
* Added loading/saving default sort key

ve.ui.PagedLayout.js
* Changed class used for pages to generic panel layout

ve.ui.PagePanelLayout
* Moved title/icon stuff to field set

ve.ui.FieldsetLayout.js
* New class, adds fieldset with legend

ve.ui.StackPanelLayout.js
* Moved up to the layouts directory

ve.ui.Dialog.css
* Moved style for paged panel from layout stylesheet

ve.ui.Layout.css
* Added styles for fieldsets

ve.ui.Widget.css
* Adjusted margins of input label widgets

ve.ui.MWCategoryWidget.js, ve.ui.MWCategoryPopupWidget.js
* Added setDefaultSortKey method

Change-Id: I979f5e3f08a688790c9f54086206ed1999af13ea
2013-05-10 16:46:08 -07:00
Trevor Parscal e888d7b985 Category UI improvements
Objectives:
* Ensure items don't get moved to the end when their sort-key is edited
* Add placeholder text and pending styling to input
* Auto-expand input to the end of the line
* Make the minimum input width smaller

Changes:

ve.ui.MWMetaDialog.js
* Added calls to fitInput on initialize
* Fixed sort key update and insert handlers to maintain item position when updating

ve.ui.GroupElement.js
* Added index argument to addItems, allowing items to be inserted at a specific location

ve.ui.PagePanelLayout.js
* Fixed CSS class name

ve.ui.StackPanelLayout.js, ve.ui.MenuWidget.js, ve.ui.SelectWidget.js
* Passed index argument through to group element

ve.ui.PanelLayout.js
* Fixed overflow direction for scrolling option

ve.ui.Inspector.css
* Moved border-box properties to text input widget class
* Set input widget within inspectors to be 100% by default

ve.ui.Layout.css
* Updated CSS class name
* Whitespace fixes

ve.ui.Widget.css
* Made text input widgets's wrapper default to 20em wide and the input inside it be 100%, using border-box to ensure proper sizing
* Adjusted category list item and input styles to make input appear more like a category item
* Whitespace fixes

ve.ui.MWCategoryInputWidget.js
* Made category input widget inherit text input widget, rather than just input widget

ve.ui.MWCategoryWidget.js
* Replaced group functionality by mixing in group element
* Added fitInput, which automatically make the input fill the rest of the line or take up the entire next line depending on how much space is left

VisualEditor.i18n.php
* Adjusted placeholder text for category input

Change-Id: I79a18a7b849804027473084a42c36133fdacad57
2013-05-10 00:19:46 +00:00
Moriel Schottlender 29f5630957 RTL fix for VE's link widget
The purpose is to flip the direction of the input inside
the link widget for RTL wikis, but flip it again to LTR
if the user inserts an external URL. This is my first VE
fix, I tried to follow conventions and avoid touching the
parent objects that are unrelated to URLs.

Bug: 47717
Change-Id: Ic13b9c3b155ce2979298cac9518c7419b9d45bac
2013-05-02 20:43:46 +00:00
Trevor Parscal 718db58fd5 Category editing
Modifications:

VisualEditor.php
* Added links to new widgets

VisualEditor.i18n.php
* Added placeholder text for category input

ve.ui.Widget.css
* Added styles for new widgets

New:

ve.ui.MWMetaDialog.js
* Create category widget with categories from dm.
* Listen to metaList for insert and remove events
** insert / remove bound methods to be improved upon additional meta groups
* Add listeners to mwCategoryWidget for new categories and updates

ve.ui.MWCategoryWidget.js
* Top-level category editing widget

ve.ui.MWCategoryItemWidget.js
* Items within a category widget

ve.ui.MWCategoryInputWidget.js
* Input for new categories, handles menu and API requests

ve.ui.MWCategoryPopupWidget.js
* Mini-inspector for a category item

Bug: 39597
Change-Id: I5eafaa484a1924a566d3a1ee1d869293089d0ecf
2013-04-30 17:50:31 +00:00
Trevor Parscal 6a068e7d83 UI Refactor
Changed:

VisualEditor.i18n.php
* Updated Link inspector i18n messages

ve.ui.MetaDialog.js -> ve.ui.PagedDialog
* Moved paging functionality into Paged dialog

ve.ui.EditorPanelLayout -> ve.ui.PagePanelLayout.js
* Renamed from EditorPanelLayout to work nicely with the concept of
  stacks and pages

ve.ui.GroupElement.js
* Added addItem method and change addItems to use it

ve.ui.Dialog.css
* Updated classname as per refactor of meta dialog

ve.ui.StackPanelLayout.js
* Set currentItem property on showItem
* In addItems method, show currentItem with class method
** rather display block on element

ve.ui.Layout.css
* Make editorPanel layout 100% in width.

ve.ui.Widget.css
* Added CategoryWidget and CategoryPopup styles
* Other adjustments

ve.ui.PopupWidget.js
* Added auto-close on loss of focus
* Made friendly with being initialized inside a frame

ve.ui.MWLinkTargetInputWidget.js
* Mixin ve.ui.PendingInputWidget and remove pending methods
* Prevent querying on spaces
* Reintroduce i18n messages for menu sections

ve.ui.MenuWidget.js
* Update cases of $input config property to input

New:

ve.ui.PagedDialog.js
* Refactored base-class for mwMeta dialog (and probably other dialogs
  too)
* Abstracts adding and accessing pages

ve.ui.PendingInputWidget.js
* Moved pushPending and popPending methods into pending class

Change-Id: I29bcd92b7b5641941a4e98e65b2a56424a5263ff
2013-04-26 21:18:13 +00:00
Trevor Parscal a2e59f7c86 Stack panel, element mixins, cleanup
*.php
* Updated links to files

ve.ui.MetaDialog
* Added stack panel that now contains category and language editor panels
* Attached outline widget to stack panel

ve.ui.FlaggableWidget -> ve.ui.FlaggableElement
* Moved to elements

ve.ui.GroupWidget -> ve.ui.GroupElement
* Moved to elements
* Removed invalid event documentation

ve.ui.LabledWidget -> ve.ui.LabledElement
* Moved to elements

ve.ui.StackPanelLayout.js
* New class, mutually exclusive panel container

ve.ui.TitledPanelLayout
* Remvoed, using labeled element instead

ve.ui.Element.css
* Added for elements
* Moved label style here, from widget styles

*.css, ve.ui.ButtonWidget.js, ve.ui.InputLabelWidget, ve.ui.OptionWidget, ve.ui.SelectWidget
* Adjusted class names to reflect widget -> element migration

Change-Id: I32f504c844dba7aae1b286eef06ca046627bdc8d
2013-03-28 12:40:01 -07:00
jenkins-bot ff38fcd4ef Merge "New popup widget" 2013-03-27 18:30:37 +00:00