Commit graph

39 commits

Author SHA1 Message Date
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
Trevor Parscal d25a04b35b New popup widget
This will make the popup with callout functionality easy to reuse elsewhere - in the first case most likely the popup menus for the category widget.

*.php
* Added links to the new widget

ve.ui.Context.css, ve.ui.Widget.css
* Moved styles to the widget stylesheet

ve.ui.Context.js, ve.ui.PopupWidget
* Moved "popup" specific stuff to the new popup widget

Change-Id: I823c6e2c5e1ec11088898e9621d93e983c3b76f3
2013-03-27 11:27:25 -07:00
Trevor Parscal 63567654a2 Link inspector suggestion sections
ve.ui.Widget.css
* Made sections use a default cursor - they aren't clickable so they shouldn't appear to be

Change-Id: Id74288040080c18b8595f2903239bc82e8bc1ab2
2013-03-26 16:57:30 -07:00
Trevor Parscal fb22e4df50 Group, Select, Option, Outline and MenuSection widgets
Objective: Refactor menu widgets so that the majority of their code can be reused, and then add an outline widget which shares the same base classes.

ve.ui.Dialog.css
* Make dialog a fixed width and have a minimum and maximum height while always being centered in the window.
* Add style for the outline panel
* Add border below the title
* Move font-size adjustment to child elements to preserve layout scale

ve.ui.Inspector.css
* Make inspectors fade in when being opened (will happen after the size transition is complete)
* Add initial size for inspector to prevent the default size of the unfinished contents from making it too large while loading

ve.ui.Tool.css
* Update classes according to changes in labeled widgets

ve.ui.Widget.css
* Add display: block to widget labels to support use of autoEllipsis on them
* Update classes according to changes in labeled widgets
* Add styles for new select, option and outline item widgets
* Remove unused group and items classes for menu widgets (which are now subclasses of the select widget and no longer have grouping built-in)

ve.ui.Window.css.js
* Moved selection disabling rules up to the head to prevent selection drawing around the title

ve.ui.GroupWidget.js
* New widget that manages "items", allowing getting, adding, removing and clearing

ve.ui.MenuSectionItemWidget.js
* New widget that can be used inside a menu to create an unselectable, unhighlightable item that describes a section of the menu

ve.ui.OptionWidget.js
* New widget to be used with select widgets, provides select and highlight functionality

ve.ui.OutlineItemWidget.js
* New widget to be used with outline widgets, extends option and adds support for an icon to be rendered to the left of the label

ve.ui.OutlineWidget.js
* New widget that provides a vertically stacked list of mutually exclusive options, extends select

ve.ui.SelectWidget.js
* New widget that implements most of what menu once did, only now it also handles all the events for it's child elements internally

ve.ui.MetaDialog.js
* Hacked in support for an outline widget in the outline pane
* Added classes for styling purposes

ve.ui.FormatDropDownTool.js
* Modified call to menu item constructor as per changes therein
* Reorganized options config to make construction simpler
* Changed to setLabel after selecting the item to prevent the label from being changed to the wrong value as a side-effect of setting the item

ve.ui.DropDownTool.js
* Added $$ in config for menu widget - just in case later on we use a drop-down inside of a frame
* Using jQuery .text() method to propagate the selected item's text to the label rather than keeping around a plain text copy of the label in a property

ve.ui.Context.js
* Improve context/inspector behavior in regards to initial sizing

ve.ui.js
* Added context property to $$ returned by get$$ so it's easy to get the document object (for event binding) wherever you have a $$

ve.ui.Window.js
* Fixed incorrect case for boolean type in comment
* Added getFrame method

ve.ui.ButtonWidget.js
* Removed extra class being set on label

ve.ui.LabeledWidget.js
* Added class on label
* Added fitLabel method which uses autoEllipsis internally

ve.ui.MenuItemWidget.js
* Moved nearly all of the implementation to option so it could be reused

ve.ui.Menu.js
* Moved most of the implementation to select and group

ve.ui.MWLinkTargetInputWidget
* Prevent aborting and re-querying if the value hasn't actually changed
* Updated populateMenu method as per changes in menu class

*.php
* Added links to new files

Change-Id: I2271b5cc0554973b13cfbff94caf16901c02caa5
2013-03-20 22:55:32 +00:00
Trevor Parscal ec912dc2d1 Link inspector menu not appearing in the right place
ve.ui.Widget.css
* Adjust menu up a few pixels to match other uses of ve.ui.MenuWidget (the format drop down)

ve.ui.LinkInspector.js
* Moved the form value initialization to a timeout that fires well after the animation of the inspector - this is only important because the first element has a menu that pops up and the menu was rendering in the wrong location

ve.ui.Frame.js
* Added reference to frame within this.$$ by passing it to get$$

ve.ui.Inspector.js
* Removed auto-focus on open from inspector base class - this will be done in a more specific and controlled way instead

ve.ui.js
* Added optional frame argument to get$$ so that it's easy to get the frame from any $$ that's bound to an iframe document

ve.ui.Window.js
* Removed duplicate static member assignments
* Added auto-focus on the window's frame before calling onOpen
* Added auto-blur of anything focused within the iframe after calling onClose

ve.ui.MWLinkTargetInputWidget.js
* Auto-highlight the selected item when populating a menu so that pressing enter always keeps the currently selected item selected

ve.ui.TextInputMenuWidget.js
* Take the frame's position into account when positioning a menu below an input

Change-Id: I334f7db29af6b821bcfc8dc3c0ccba2636d4d9b1
2013-03-14 16:56:04 -07:00
Trevor Parscal 1572ec1569 Context, frame, window, dialog and inspector refactor
This is a major refactor of user interface context, frame, dialog
and inspector classes, including adding several new classes which
generalize managing inspectors/dialogs (which are now subclasses
of window).

New classes:
* ve.ui.Window.js - base class for inspector and dialog classes
* ve.ui.WindowSet.js - manages mutually exclusive windows, used
  by surface and context for dialogs and inspectors respectively
* ve.ui.DialogFactory - generates dialogs
* ve.ui.IconButtonWidget - used in inspector for buttons in the head

Refactored classes:
* ve.ui.Context - moved inspector management to window set
* ve.ui.Frame - made iframes initialize asynchronously
* ve.ui.Dialog and ve.ui.Inspector - moved initialization to async
  initialize method

Other interesting bits:

ve.ui.*Icons*.css, *.svg, *.png, *.ai
* Merged icon stylesheets so all icons are available inside windows
* Renamed inspector icon to window

ve.ui.*.css
* Reorganized styles so that different windows can include only
  what they need
* Moved things to where they belonged (some things were in strange places)

ve.init.Target.js, ve.init.mw.ViewPageTarget.js, ve.init.sa.Target.js
* Removed dialog management - dialogs are managed by the surface now

ve.ui.*Dialog.js
* Renamed title message static property
* Added registration

ve.ui.*Inspector.js
* Switch to accept surface object rather than context, which conforms
  to the more general window class without losing any functionality
  (in fact, most of the time the surface was what we actually wanted)

ve.ui.MenuWidget.js, ve.ui.MWLinkTargetInputWidget.js
* Using surface overly rather than passing an overlay around
  through constructors

Change-Id: Ifd16a1003ff44c48ee7b2c66928cf9cc858b2564
2013-03-14 00:03:31 +00:00
Trevor Parscal a5aeca3ff5 Major UI refactoring and improvements
Objective:

Refactor UI widgets, improve usability and accessibility of menus, general cleanup and style improvements.

Extras:
Fixed documentation in a few other files to make descriptions of jQuery event arguments more consistent, classes inherit correctly, and made use of the @cfg functionality in jsduck.

Changes:

.docs/config.json
* Added window, HTMLDocument, HTMLElement, DocumentFragment and XMLHttpRequest to externals, so jsduck doesn't throw warnings when they are used

demos/ve/index.php, modules/ve/test/index.php, VisualEditor.php
* Moved widgets above tools (since tools use widgets)

demos/ve/index.php
* Refactored widget initialization to use options
* Renamed variables to match widget names

ve.init.mw.ViewPageTarget.css
* Adjusted text sizes to make widgets work normally
* Added margins for buttons in toolbar (since button widgets
don't have any)
* Removed styles for init buttons (button widgets now)

ve.init.mw.ViewPageTarget.js
* Switched to using button widgets (involved moving things around
a bit)

ve.ui.LinkInspector.js, ve.ui.MWLinkInspector.js
* Renamed static property "inputWidget" to
"linkTargetInputWidget" to better reflect the required base class
for the properties value

icons.ai, check.png, check.svg
* Added "check" icon, used in menu right now to show which item
is selected

ve.ui.Icons-raster.css, ve.ui.Icons-vector.css
* Added check icon
* Removed :before pseudo selectors from most of the icon classes (not need by button tool anymore, makes them more reusable now)

ve.ui.Tool.css
* Adjusted drop down tool styles so menu appears below, instead
of on top, of the label
* Adjusted paragraph font size to better match actual content
* Updated class names to still work with menu widget changes
(items are their own widgets now)
* Updated selectors as per changes in the structure of button tools

ve.ui.Widget.css
* Added styles for buttons and menu items
* Adjusted menu styles

ve.ui.*ButtonTool.js
* Added config options argument passthrough

ve.ui.ButtonTool.js
* Moved var statement to the top inside constructor
* Switched to using "a" tag to get cross-browser :active support
* Added icon to inside of button to make icon styles more reusable
* Removed disabled support (now provided by widget parent class)

ve.ui.FormatDropDownTool.js
* Updated options initialization to construct menu item objects
* Modified handling of items to account for changes in menu and
item classes
* Optimized onUpdateState method a bit, adding early exit to
inner loop

ve.ui.ButtonTool.js, ve.ui.DropdownTool.js, ve.ui.Context.js,
ve.ui.Frame, ve.ui.Tool.js, ve.ui.Widget.js
* Added chain ability to non-getter methods

ve.ui.DropdownTool.js
* Removed items argument to constructor
* Updated code as per changes in menu class
* Fixed inconsistent naming of event handler methods
* Removed item event handling (now handled by items directly)
* Made use of this.$$ to ensure tool works in other frames

ve.ui.Tool.js
* Made tools inherit from widget
* Moved trigger registry event handler to a method

ve.ui.Context.js
* Switched from using menu to contain toolbar to a simple wrapper

ve.ui.js
* Added get$$ method, a convenience function for binding jQuery
to a specific document context

ve.ui.*Widget.js
* Switched to using a config options object instead of individual arguments
* Added options
* Factored out flags and labels into their own classes
* Refactored value setting methods for inputs

ve.ui.MenuWidget.js, ve.ui.MenuItemWidget.js
* Broke items out into their own classes
* Redesigned API
* Updated code that uses these classes
* Added support for keyboard interaction
* Made items flash when selected (delaying the hiding of the menu for 200ms)

ve.ui.LinkTargetInputWidget.js, ve.ui.MWLinkTargetInputWidget
* Refactored annotation setting methods

Change-Id: I7769bd5a5b79f1ab36f258ef9f2be583ca503ce6
2013-02-26 12:29:08 -08:00
Trevor Parscal 59c67e1e94 Modify styles, add disabled and read-only for widgets
demos/ve/demo.css, demos/ve/index.php
* Style changes for utilities and dump output
* Initially disable the log range button, activate when there's a range to log
* Make range inputs read-only
* Rename some widget variables
* Add extra structure and classes to dump output

ve.ui.Widget.css
* Remove left/right margin for buttons
* Simplify opaque white color
* Modify selector for disabled buttons - see changes in ve.ui.Widget.js
* Added styles for text input widget's readonly and disabled states

ve.ui.Widget.js
* Added disabled state

ve.ui.ButtonWidget.js
* Moved click event handler to method

ve.ui.InputLabelWidget.js
* Moved click event handler to method

ve.ui.InputWidget.js
* Moved input change event handler to method
* Added readOnly state

ve.ui.LinkTargetInputWidget.js
* Corrected documentation

ve.ui.MenuWidget.js
* Blocked interaction while widget is disabled

ve.ui.MWLinkTargetInputWidget.js
* Corrected documentation
* Blocked interaction while widget is disabled

ve.ui.TextInputMenuWidget.js
* Blocked interaction while widget is disabled

Change-Id: I7ea89873b50a98d058d1dd1e309e3e8b7c8e7b2e
2013-02-25 12:10:26 -08:00
James D. Forrester 82114467f1 Bump copyright notice year range to -2013 over -2012
199 files touched. Whee!

Change-Id: Id82ce4a32f833406db4a1cc585674f2bdb39ba0d
2013-02-19 15:37:34 -08:00
Trevor Parscal d0ff691f9e Add user interface widgets
* New! Button and InputLabel widgets
* Using new buttons in the demo
* Moved styles around to generalize input styles

Change-Id: Ic42e133f8fe0fffcb61374c09dd5668db82a4799
TODO: Use these buttons other places! (like ve.init)
2013-02-13 18:04:04 -08:00
Trevor Parscal bf5ba1ea2b Fixed documentation errors
Many of these problems were introduced in I859b5871a9d2f17d970c002067c8ff24f3513e9f

Change-Id: Ifc2dc4934f782c4ce5107e3a356e357aef754083
2013-01-22 23:38:01 +00:00
Trevor Parscal f31dc45da8 (bug 43841) Major ve.ui rewrite, especially ve.ui.LinkInspector
Objectives:

* Make the link inspector easier to use
* Try to resolve a few bugs (bug 43841, bug 43063, bug 42986)
* Stop using jquery.multiSuggest (which didn't really understand annotations)
* Better divide MediaWiki specifics from generic implementations

Changes:

VisualEditor.php, modules/ve/test/index.php, demos/ve/index.php
* Updated links to files

ve.Registry
* Fixed mistake where registry was initialized as an array - this didn't cause any errors because you can add arbitrary properties to an array and use it like any other object

ve.Factory
* Removed duplicate initialization of registry property
* Added entries property, which is an array that's appended to for tracking the order of registrations

ve.CommandRegistry
* Added mwLink command which opens the mwLink inspector

ve.ui.TextInputWidget
* Added basic widget class for text inputs

ve.ui.TextInputMenuWidget
* Added widget that provides a menu of options for a text input widget

ve.ui.MWLinkTargetInputWidget
* Added MediaWiki specific link target widget

ve.ui.MenuWidget
* Converted ve.ui.Menu into a widget
* Moved the body of onSelect to onMouseUp

ve.ui.LinkTargetInputWidget
* Added link target widget which adds link annotation functionality to a normal text input

ve.ui.InputWidget
* Added generic input widget which emits reliable and instant change events and synchronizes a value property with the DOM value

ve.ui.Widget
* Added base widget class
* Widgets can be used in any frame

ve.ui.Tool
* Fixed line length issues

ve.ui.InspectorFactory
* Made use of new entries property for factories to select the most recently added inspector if more than one match a given annotation

ve.ui.Inspector
* Added auto-focus on the first visible input element on open
* Moved afterClose event to after re-focus on document on close
* Added documentation

ve.ui.Frame
* Adjusted documentation
* Added binding of $$ to the frame context so it can be passed around
* Added documentation

ve.ui.Context
* Added ve.ui.Widget.css to iframes
* Updated code as per moving of ve.ui.Menu to ve.ui.MenuWidget
* Removed unused positionBelowOverlay method
* Added CSS settings to set overlay left and width properties according to context size
* Added documentation

ve.ui.DropdownTool
* Updated code as per moving of ve.ui.Menu to ve.ui.MenuWidget

ve.ui.FormatDropdownTool
* Added documentation

ve.ui.MWLinkButtonTool
* Added MediaWiki specific version of ve.ui.LinkButtonTool, which opens the mwLink inspector

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

ve.ui.Tool.css, ve.init.sa.css, ve.init.mw.ViewPageTarget.css, ve.init.mw.ViewPageTarget-apex.css
* Updated code as per moving of ve.ui.Menu to ve.ui.MenuWidget

ve.ui.Menu.css
* Deleted (merged into ve.ui.Widget.css)

ve.ui.Menu.css
* Deleted suggest styles (no longer used)

pending.gif, pending.psd
* Added diagonal stripe animation to indicate a pending request to the API

ve.ui.MWLinkInspector
* Added MediaWiki specific inspector which uses MediaWiki specific annotations and widgets

ve.ui.LinkInspector
* Removed mw global hint (not needed anymore)
* Switched from comparing targets to annotations (since the target text is ambiguous in some situations)
* Switched to using input widget, which is configured using a static property
* Removed use of jquery.multiSuggest
* Moved MediaWiki specifics to their own class (ve.ui.MWLinkInspector)

ve.init.mw.ViewPageTarget
* Added MediaWiki specific toolbar and command options

Change-Id: I859b5871a9d2f17d970c002067c8ff24f3513e9f
2013-01-15 15:05:11 -08:00