mediawiki-extensions-Visual.../modules/ve/ui/ve.ui.Context.js

407 lines
9.8 KiB
JavaScript
Raw Normal View History

JSDuck: Generated code documentation! See CODING.md for how to run it. Mistakes fixed: * Warning: Unknown type function -> Function * Warning: Unknown type DOMElement -> HTMLElement * Warning: Unknown type DOM Node -> HTMLElement * Warning: Unknown type Integer -> Mixed * Warning: Unknown type Command -> ve.Command * Warning: Unknown type any -> number * Warning: Unknown type ve.Transaction -> ve.dm.Transaction * Warning: Unknown type ve.dm.AnnotationSet -> ve.AnnotationSet * Warning: Unknown type false -> boolean * Warning: Unknown type ve.dm.AlienNode ve.dm doesn't have a generic AlienNode like ve.ce -> Unknown type ve.dm.AlienInlineNode|ve.dm.AlienBlockNode * Warning: Unknown type ve.ve.Surface -> ve.ce.Surface * ve.example.lookupNode: -> Last @param should be @return * ve.dm.Transaction.prototype.pushReplace: -> @param {Array] should be @param {Array} * Warning: ve.BranchNode.js:27: {@link ve.Node#hasChildren} links to non-existing member -> (removed) * Warning: ve.LeafNode.js:21: {@link ve.Node#hasChildren} links to non-existing member -> (removed) Differences fixed: * Variadic arguments are like @param {Type...} [name] instead of @param {Type} [name...] * Convert all file headers from /** to /*! because JSDuck tries to parse all /** blocks and fails to parse with all sorts of errors for "Global property", "Unnamed property", and "Duplicate property". Find: \/\*\*([^@]+)(@copyright) Replace: /*!$1$2 * Indented blocks are considered code examples. A few methods had documentation with numbered lists that were indented, which have now been updated to not be intended. * The free-form text descriptions are parsed with Markdown, which requires lists to be separated from paragraphs by an empty line. And we should use `backticks` instead of {braces} for inline code in text paragraphs. * Doc blocks for classes and their constructor have to be in the correct order (@constructor, @param, @return must be before @class, @abstract, @extends etc.) * `@extends Class` must not have Class {wrapped} * @throws must start with a {Type} * @example means something else. It is used for an inline demo iframe, not code block. For that simply indent with spaces. * @member means something else. Non-function properties are marked with @property, not @member. * To create a link to a class or member, in most cases the name is enough to create a link. E.g. Foo, Foo.bar, Foo.bar#quux, where a hash stands for "instance member", so Foo.bar#quux, links to Foo.bar.prototype.quux (the is not supported, as "prototype" is considered an implementation detail, it only indexes class name and method name). If the magic linker doesn't work for some case, the verbose syntax is {@link #target label}. * @property can't have sub-properties (nested @param and @return values are supported, only @static @property can't be nested). We only have one case of this, which can be worked around by moving those in a new virtual class. The code is unaltered (only moved down so that it isn't with the scope of the main @class block). ve.dm.TransactionProcessor.processors. New: * @mixins: Classes mixed into the current class. * @event: Events that can be emitted by a class. These are also inherited by subclasses. (+ @param, @return and @preventable). So ve.Node#event-attach is inherited to ve.dm.BreakNode, just like @method is. * @singleton: Plain objects such as ve, ve.dm, ve.ce were missing documentation causing a tree error. Documented those as a JSDuck singleton, which they but just weren't documented yet. NB: Members of @singleton don't need @static (if present, triggers a compiler warning). * @chainable: Shorthand for "@return this". We were using "@return {classname}" which is ambiguous (returns the same instance or another instance?), @chainable is specifically for "@return this". Creates proper labels in the generated HTML pages. Removed: * @mixin: (not to be confused with @mixins). Not supported by JSDuck. Every class is standalone anyway. Where needed marked them @class + @abstract instead. Change-Id: I6a7c9e8ee8f995731bc205d666167874eb2ebe23
2013-01-04 08:54:17 +00:00
/*!
* VisualEditor UserInterface Context class.
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
2011-11-29 23:29:02 +00:00
/**
* UserInterface context.
*
2011-11-29 23:29:02 +00:00
* @class
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-20 22:45:50 +00:00
* @extends ve.Element
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-13 00:06:57 +00:00
*
2011-11-29 23:29:02 +00:00
* @constructor
* @param {ve.ui.Surface} surface
* @param {Object} [config] Configuration options
2011-11-29 23:29:02 +00:00
*/
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-20 22:45:50 +00:00
ve.ui.Context = function VeUiContext( surface, config ) {
// Parent constructor
ve.Element.call( this, config );
2011-12-02 00:30:50 +00:00
// Properties
this.surface = surface;
this.inspectors = {};
this.visible = false;
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-13 00:06:57 +00:00
this.showing = false;
this.selecting = false;
this.relocating = false;
this.embedded = false;
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
this.selection = null;
this.toolbar = null;
this.popup = new ve.ui.PopupWidget( { '$$': this.$$, '$container': this.surface.getView().$ } );
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-20 22:45:50 +00:00
this.$menu = this.$$( '<div>' );
this.inspectors = new ve.ui.WindowSet( surface, ve.ui.inspectorFactory );
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
// Initialization
this.$.addClass( 've-ui-context' ).append( this.popup.$ );
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-13 00:06:57 +00:00
this.inspectors.$.addClass( 've-ui-context-inspectors' );
this.popup.$body.append(
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-13 00:06:57 +00:00
this.$menu.addClass( 've-ui-context-menu' ),
this.inspectors.$.addClass( 've-ui-context-inspectors' )
);
// Events
this.surface.getModel().connect( this, { 'change': 'onChange' } );
this.surface.getView().connect( this, {
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-13 00:06:57 +00:00
'selectionStart': 'onSelectionStart',
'selectionEnd': 'onSelectionEnd',
'relocationStart': 'onRelocationStart',
'relocationEnd': 'onRelocationEnd'
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-13 00:06:57 +00:00
} );
this.inspectors.connect( this, {
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-13 00:06:57 +00:00
'setup': 'onInspectorSetup',
'open': 'onInspectorOpen',
'close': 'onInspectorClose'
} );
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-20 22:45:50 +00:00
this.$$( this.getElementWindow() ).on( {
'resize': ve.bind( this.update, this )
} );
this.$.add( this.$menu )
.on( 'mousedown', false );
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
};
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-20 22:45:50 +00:00
/* Inheritance */
ve.inheritClass( ve.ui.Context, ve.Element );
/* Methods */
/**
* Handle change events on the model.
*
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
* Changes are ignored while the user is selecting text.
*
* @method
* @param {ve.dm.Transaction[]} transactions Change transactions
* @param {ve.Range} selection Change selection
*/
ve.ui.Context.prototype.onChange = function ( transactions, selection ) {
if ( selection ) {
if ( this.popup.isVisible() ) {
this.hide();
this.update();
} else if ( !this.selecting && !this.draggingAndDropping ) {
this.update();
}
}
};
/**
* Handle selection start events on the view.
*
* @method
*/
ve.ui.Context.prototype.onSelectionStart = function () {
this.selecting = true;
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
this.hide();
};
/**
* Handle selection end events on the view.
*
* @method
*/
ve.ui.Context.prototype.onSelectionEnd = function () {
this.selecting = false;
if ( !this.relocating ) {
this.update();
}
};
/**
* Handle selection start events on the view.
*
* @method
*/
ve.ui.Context.prototype.onRelocationStart = function () {
this.relocating = true;
this.hide();
};
/**
* Handle selection end events on the view.
*
* @method
*/
ve.ui.Context.prototype.onRelocationEnd = function () {
this.relocating = false;
this.update();
};
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
/**
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-13 00:06:57 +00:00
* Handle an inspector being setup.
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
*
* @method
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-13 00:06:57 +00:00
* @param {ve.ui.Inspector} inspector Inspector that's been setup
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
*/
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-13 00:06:57 +00:00
ve.ui.Context.prototype.onInspectorSetup = function () {
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
this.selection = this.surface.getModel().getSelection();
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-13 00:06:57 +00:00
};
/**
* Handle an inspector being opened.
*
* @method
* @param {ve.ui.Inspector} inspector Inspector that's been opened
*/
ve.ui.Context.prototype.onInspectorOpen = function () {
// Transition between menu and inspector
this.show( true );
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
};
/**
* Handle an inspector being closed.
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
*
* @method
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-13 00:06:57 +00:00
* @param {ve.ui.Inspector} inspector Inspector that's been opened
* @param {boolean} accept Changes have been accepted
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
*/
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-13 00:06:57 +00:00
ve.ui.Context.prototype.onInspectorClose = function () {
Fixed inspector behavior ve.ui.Inspector * Removed disabled state and interfaces - this isn't needed * Renamed prepareSelection to onInitialize * Using event emitter to run onInitialize, onOpen and onClose methods * Left removal up to the child class to handle in the onClose method * Replaced calls on context to close inspector to calling close directly * Renamed prepareSelection stub to onInitialize * Emitting initialize event from within the open method * Added recursion guarding to close method * Changed the close method's argument to be remove instead of accept - the more common case is to save changes, and the only time you wouldn't save changes is if you were to remove the annotation * Moved focus restore to close method ve.ui.Context * Moved the majority of the code in openInspector and closeInspector to event handlers for onInspectorOpen and onInspectorClose * Updated calls to closeInspector re: accept->remove argument change ve.ui.LinkInspector * Renamed prepareSelection to onInitialize and rewrote logic and documentation * Removed unused onLocationInputChange method * Moved restore focus (now it's in the inspector base class) ve.dm.SurfaceFragment * Added word mode for expandRange ve.dm.Surface * Added locking/unlocking while processing transactions - this was not an issue before because this was effectively being done manually throughout ce (which needs to be cleaned up) but once we started using the content action to insert content dm and ce started playing off each other and inserting in a loop - we already do this for undo/redo so it makes sense to do it here as well ve.InspectorAction * Updated arguments re: close method's accept->remove argument change Change-Id: I38995d4101fda71bfb2e6fe516603507ce820937
2012-11-20 22:51:24 +00:00
this.update();
};
/**
* Gets the surface the context is being used in.
*
* @method
* @returns {ve.ui.Surface} Surface of context
*/
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
ve.ui.Context.prototype.getSurface = function () {
return this.surface;
};
/**
* Destroy the context, removing all DOM elements.
*
* @method
* @returns {ve.ui.Context} Context UserInterface
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-20 23:25:12 +00:00
* @chainable
*/
ve.ui.Context.prototype.destroy = function () {
this.$.remove();
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-20 23:25:12 +00:00
return this;
};
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
/**
* Updates the context menu.
*
* @method
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-20 23:25:12 +00:00
* @chainable
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
*/
ve.ui.Context.prototype.update = function () {
var i, nodes, tools, tool,
Death and/or destruction So. It turns out that the design of SurfaceFragment is a little - shall we say - wonky. One of the best things about ve.dm.SurfaceFragment is its magical ability to retain the intention of its range, even as transactions are being processed. This ability is granted by each fragment listening to the surface's change event, and responding by using translateRange for each transaction that gets processed. Surface fragments also have these clever methods that allow you to get a fragment based on another, which makes adjusting the range easy to do inline without having to manually store multiple fragments or modifying the original. This sounded good, and we seemed to all be convinced it was well designed. But if you add a console.log( 'hello' ); to the first line of ve.dm.SurfaceFragment.prototype.onTransact, and then start using the bold tool on various selections of text, you will find that there may indeed be a flaw. What you will probably realize is that the number of times that particular line of code is being called is disturbingly large, and increases each time you do just about anything in the editor. What's going on? How did we get here? Read on… It turns out that fragments are immortal. We create them, they listen to the surface's transact event, we are done with them, but the surface keeps on emitting events to the now long forgotten about fragments. They continue to build up over time, never go out of scope, and bloat the hell out of our program. The same ended up being true of toolbars - and each time the context menu fired up a new one the old one was left in limbo, still responding to events, still taking up memory, but not being visible to the user. All of this immortality was causing strange and difficult to track down problems. This patch fixes this by introducing a destroy method. This method unbinds events, allowing the object to finally fall out of scope and die - and more importantly stop receiving notifications of changes. This is a hack, but Ed will no doubt get this situation sorted out properly by making fragments lazy-evaluate their selections by only storing an identifier of the most recent transaction they were based on, see bug 47343. Change-Id: I18bb986001a44732a7871b9d79dc3015eedfb168
2013-04-18 18:44:40 +00:00
fragment = this.surface.getModel().getFragment( null, false ),
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
selection = fragment.getRange(),
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-13 00:06:57 +00:00
inspector = this.inspectors.getCurrent();
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-13 00:06:57 +00:00
if ( inspector && selection.equals( this.selection ) ) {
// There's an inspector, and the selection hasn't changed, update the position
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
this.show();
} else {
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-13 00:06:57 +00:00
// No inspector is open, or the selection has changed, show a menu of available inspectors
tools = ve.ui.toolFactory.getToolsForAnnotations( fragment.getAnnotations() );
nodes = fragment.getCoveredNodes();
for ( i = 0; i < nodes.length; i++ ) {
if ( nodes[i].range && nodes[i].range.isCollapsed() ) {
nodes.splice( i, 1 );
i--;
}
}
if ( nodes.length === 1 ) {
tool = ve.ui.toolFactory.getToolForNode( nodes[0].node );
if ( tool ) {
tools.push( tool );
}
}
if ( tools.length ) {
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-13 00:06:57 +00:00
// There's at least one inspectable annotation, build a menu and show it
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
this.$menu.empty();
Death and/or destruction So. It turns out that the design of SurfaceFragment is a little - shall we say - wonky. One of the best things about ve.dm.SurfaceFragment is its magical ability to retain the intention of its range, even as transactions are being processed. This ability is granted by each fragment listening to the surface's change event, and responding by using translateRange for each transaction that gets processed. Surface fragments also have these clever methods that allow you to get a fragment based on another, which makes adjusting the range easy to do inline without having to manually store multiple fragments or modifying the original. This sounded good, and we seemed to all be convinced it was well designed. But if you add a console.log( 'hello' ); to the first line of ve.dm.SurfaceFragment.prototype.onTransact, and then start using the bold tool on various selections of text, you will find that there may indeed be a flaw. What you will probably realize is that the number of times that particular line of code is being called is disturbingly large, and increases each time you do just about anything in the editor. What's going on? How did we get here? Read on… It turns out that fragments are immortal. We create them, they listen to the surface's transact event, we are done with them, but the surface keeps on emitting events to the now long forgotten about fragments. They continue to build up over time, never go out of scope, and bloat the hell out of our program. The same ended up being true of toolbars - and each time the context menu fired up a new one the old one was left in limbo, still responding to events, still taking up memory, but not being visible to the user. All of this immortality was causing strange and difficult to track down problems. This patch fixes this by introducing a destroy method. This method unbinds events, allowing the object to finally fall out of scope and die - and more importantly stop receiving notifications of changes. This is a hack, but Ed will no doubt get this situation sorted out properly by making fragments lazy-evaluate their selections by only storing an identifier of the most recent transaction they were based on, see bug 47343. Change-Id: I18bb986001a44732a7871b9d79dc3015eedfb168
2013-04-18 18:44:40 +00:00
if ( this.toolbar ) {
this.toolbar.destroy();
}
this.toolbar = new ve.ui.SurfaceToolbar( this.surface );
this.toolbar.setup( [ { 'include' : tools } ] );
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-20 23:25:12 +00:00
this.$menu.append( this.toolbar.$ );
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-13 00:06:57 +00:00
this.show();
ve.ui.Toolbar: Refactor floating logic for performance == Renamed methods == * enableFloating -> enableFloatable * disableFloating -> disableFloatable * setPosition -> float * resetPosition -> unfloat == Scroll and resize event == Timeline for scroll event reduced from about half a dozen "Recalculate style" and various forced "Paint" down to 0. New timeline for scroll is clean (for me: from ~35 to ~59 fps): * 1 Event (scroll) * 1 Composite Layer The composite layer action is the browser changing the viewport to a different portion of the document drawing. Exactly the one thing a simple scroll should do. Timeline for resize event is still pretty crowded and low fps, but it has improved. Further improvement would likely be around using requestAnimation and going outside ve.ui.Toolbar. == Changes == * New: ve.ui.Toolbar#initialize. Similar to what surface has. Users of Toolbar should decide whether to call enableFloatable, append it to the DOM at some point and then call initialize() once. * Don't compute offset() every time. Eliminated by doing it once in #initialize. These 'top' and 'left' offsets do not change. * Don't compute outerWidth() and $window.width() every time. Reduced by doing it once in #initialize to compute the 'right' offset. Updating it only on resize. * Don't set 'top' every time. This is already in the stylesheet. It was never set to anything else so the abstraction for it in #float has been removed. This also made it obvious that code for "ve-ui-toolbar-bottom" was unused and left behind. Tha class was only ever being removed from something (never added). The one addClass call for it was in a condition that is always false ("if top > 0"). * Don't set 'left' every time. Eliminated by doing it once in #float. * Don't set 'right' every time. Reduced by no longer doing it on scroll. Done once in #float, and on resize after computing the new value for it. * Remove no-op style operations. Wrapped methods in if-floatable, if-floated etc. to reduce a fair amount of easily avoided re-paint overhead. * Avoid double re-paint in mw.ViewPageTarget. Though we prevent a lot of redundant re-paints now, whenever we do repaint we want to do it in 1 repaint instead of 2. ve.ui.Toolbar emits #toolbarPosition, which tells mw.ViewPageTarget to update toolbarTracker which would read the new $bar style properties and copy them over to the $toolbarTracker. However, this read operation forces the browser to do an immediate re-paint half-way just for $bar. Browsers only repaint when style properties are changed and JS has yielded. The exception to this is JS reading style properties: in that case the browser is forced to do those deferred repaints directly and reflect the new values. We can avoid this double repaint by passing the updated values as data instead of requiring the receiver to read the DOM (and thus a keep the deferred repaint). Now toolbarTracker can use them directly whilst the browser hasn't even repainted $bar yet. == Clean up == * Redundant "border-radius: 0". This would reset something, but it never does. None of the things it inherits from set a border-radius. There is one subclass where toolbar is used with a border-radius (".ve-ui-surfaceWidget .ve-ui-toolbar-bar" sets a border-radius) which overrides this on purpose, so the default of 0 is redundant. * Pattern "if ( .. ) addClass() else removeClass()" changed to: "toggleClass( , .. )" Bug: 52014 Change-Id: I9be855148962eee068a77fe83e98eb20bbdcfeec
2013-07-25 02:36:01 +00:00
this.toolbar.initialize();
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-13 00:06:57 +00:00
} else if ( this.visible ) {
// Nothing to inspect
this.hide();
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
}
}
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
// Remember selection for next time
this.selection = selection.clone();
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-20 23:25:12 +00:00
return this;
};
(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-09 21:34:23 +00:00
/**
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-19 22:59:49 +00:00
* Updates the position and size.
(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-09 21:34:23 +00:00
*
* @method
* @param {boolean} [transition=false] Use a smooth transition
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-20 23:25:12 +00:00
* @chainable
(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-09 21:34:23 +00:00
*/
ve.ui.Context.prototype.updateDimensions = function ( transition ) {
var $node, $container, focusableOffset, focusableWidth, nodePosition, cursorPosition, position,
documentOffset, nodeOffset,
surface = this.surface.getView(),
inspector = this.inspectors.getCurrent(),
focusedNode = surface.getFocusedNode(),
surfaceOffset = surface.$.offset(),
rtl = this.surface.view.getDir() === 'rtl';
$container = inspector ? this.inspectors.$ : this.$menu;
if ( focusedNode ) {
// We're on top of a node
$node = focusedNode.$focusable || focusedNode.$;
if ( this.embedded ) {
// Get the position relative to the surface it is embedded in
focusableOffset = ve.Element.getRelativePosition(
$node, this.surface.$
);
position = { 'y': focusableOffset.top };
// When context is embedded in RTL, it requires adjustments to the relative
// positioning (pop up on the other side):
if ( rtl ) {
position.x = focusableOffset.left;
this.popup.align = 'left';
} else {
focusableWidth = $node.outerWidth();
position.x = focusableOffset.left + focusableWidth;
this.popup.align = 'right';
}
} else {
// The focused node may be in a wrapper, so calculate the offset relative to the document
documentOffset = surface.getDocument().documentNode.$.offset();
nodeOffset = $node.offset();
nodePosition = {
top: nodeOffset.top - documentOffset.top,
left: nodeOffset.left - documentOffset.left
};
// Get the position of the focusedNode:
position = { 'x': nodePosition.left, 'y': nodePosition.top + $node.outerHeight() };
// When the context is displayed in LTR, it should be on the right of the node
if ( !rtl ) {
position.x += $node.outerWidth();
}
this.popup.align = 'center';
}
} else {
// We're on top of a selected text
// Get the position of the cursor
cursorPosition = surface.getSelectionRect();
// Correct for surface offset:
position = {
'x': cursorPosition.end.x - surfaceOffset.left,
'y': cursorPosition.end.y - surfaceOffset.top
};
this.popup.align = 'center';
}
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-19 22:59:49 +00:00
this.$.css( { 'left': position.x, 'top': position.y } );
this.popup.display(
position.x,
position.y,
$container.outerWidth( true ),
$container.outerHeight( true ),
transition
);
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-19 22:59:49 +00:00
return this;
};
/**
* Shows the context menu.
*
* @method
* @chainable
*/
ve.ui.Context.prototype.show = function ( transition ) {
var inspector = this.inspectors.getCurrent(),
focusedNode = this.surface.getView().getFocusedNode();
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-19 22:59:49 +00:00
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-13 00:06:57 +00:00
if ( !this.showing ) {
this.showing = true;
this.$.show();
this.popup.show();
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-13 00:06:57 +00:00
// Show either inspector or menu
if ( inspector ) {
this.$menu.hide();
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-19 22:59:49 +00:00
this.inspectors.$.show();
inspector.$.css( 'opacity', 0 );
// Update size and fade the inspector in after animation is complete
setTimeout( ve.bind( function () {
inspector.fitHeightToContents();
this.updateDimensions( transition );
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-19 22:59:49 +00:00
inspector.$.css( 'opacity', 1 );
}, this ), 200 );
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-13 00:06:57 +00:00
} else {
this.inspectors.$.hide();
if (
focusedNode &&
focusedNode.$focusable.outerHeight() > this.$menu.outerHeight() * 2 &&
focusedNode.$focusable.outerWidth() > this.$menu.outerWidth() * 2
) {
this.$.addClass( 've-ui-context-embed' );
this.embedded = true;
} else {
this.$.removeClass( 've-ui-context-embed' );
this.embedded = false;
}
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-13 00:06:57 +00:00
this.$menu.show();
}
this.updateDimensions( transition );
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-13 00:06:57 +00:00
this.visible = true;
this.showing = false;
2011-11-29 23:29:02 +00:00
}
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-20 23:25:12 +00:00
return this;
2011-11-29 23:29:02 +00:00
};
(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-09 21:34:23 +00:00
/**
* Hides the context menu.
*
* @method
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-20 23:25:12 +00:00
* @chainable
(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-09 21:34:23 +00:00
*/
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
ve.ui.Context.prototype.hide = function () {
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-13 00:06:57 +00:00
var inspector = this.inspectors.getCurrent();
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-20 23:25:12 +00:00
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-13 00:06:57 +00:00
if ( inspector ) {
// This will recurse, but inspector will be undefined next time
No more confusing boolean argument for closing windows window.close( true ) thing sucked, and was being named and used inconsistently throughout the code. The new approach uses an action string, so it looks more like window.close( 'accept' ) or window.close( 'back' ). This makes it easy to steer the behavior at any point in the window close code path. Most importantly for the link inspector, this allows us to now restore the previous selection when the user presses escape or clicks the back button, while still moving the cursor to the end and collapsing the selection upon pressing enter and allowing removal by clicking the trash can. This commit also cleans some things up, like the various ways we have to close an inspector which all seem useless because we wouldn't want to just randomly close an inspector on someone. An inspector should be closed only when the user has dealt with it. ve.InspectorAction.js * Removed close method ve.ui.LinkInspector.js * Updated documentation * Passing action to parent method * Updated logic to deal with change from "remove" to "action" argument * Added selection restauration on "back" action ve.ui.Context.js * Added action to call to close * Removed closeInspector method ve.ui.Dialog.js * Moved event handlers to the top * Added actions to calls to close * Added click block event handler to prevent focus changes ve.ui.Inspector.js * Added actions to calls to close * Added storing of previous selection - this is different from initialSelection because it's captured before the selection is modified by setup ve.ui.Window.js * Updated documentation * Updated argument name from "remove" to "action" ve.ui.WindowSet.js * Updated documentation * Removed auto-close, replaced it with error if trying to open a window when another is already open * Removed close method Change-Id: Ie8f72504177dd6ba169fdddbb776fd5397b831c4
2013-04-02 20:01:49 +00:00
inspector.close( 'hide' );
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-13 00:06:57 +00:00
return this;
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
}
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-20 23:25:12 +00:00
this.popup.hide();
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-13 00:06:57 +00:00
this.$.hide();
this.visible = false;
The great inspector and context rewrite of 2012 ve.AnnotationAction * Added filter to the clearAll method to allow clearing all matching annotations only ve.dm.Document * Some variable renaming for consistency ve.dm.SurfaceFragment * Added truncateRange method * Added annotation scope to expandRange method * Added support for passing an annotation object into annotateContent method * Switched to using name instead of type in annotateContent method to match the ve.dm.Annotation class * Fixed logic in annotation mode of expandSelection so that expansion only takes place if the annotation is found ve.ui.LinkInspector * Moved most of the functionality elsewhere * General reorganization * Changed setOverlayPosition to accept 2 arguments instead of an object with 2 properties and renamed it to positionOverlayBelow * Check for annotation object before extracting target information from it * Initialize default target as empty string to avoid undefined being cast to a string and the default target becoming 'undefined' icons.ai, inspector.png, inspector.svg * Added generic inspector icon which will be used when a custom icon is not specified in future inspector subclasses ve.ui.Inspector.Icons * Added inspector icon * Renamed clear icon to remove to match it's actual image ve.ui.Context * Greatly simplified the interface, reducing the number of methods by inlining a few things and combining others * Now always listening to resize events on the window rather than only while document is focused * Not listening to scroll events anymore, they used to affect the top/bottom positioning of the menu which we don't do anymore * Lots of cleanup and reorganization * No need to fallback to empty array since getInspectorsForAnnotations does so already * Only consider fully-covered annotations for inspectors ve.ui.Frame * Simplified the constructor by introducing the createFrame method * General cleanup * Typo fixes ve.ui.Inspector * Generalized lots of functionality previously located in the link inspector class which will be useful to all inspectors (such as title, clear button, saving changes, etc.) * Added setDisabled and isDisabled methods to manage CSS changes and avoid needing to check the CSS to determine the state of the inspector (storing state in the view is evil) * Added getMatchingAnnotations method for convenience * Added prepareSelection stub * Lots of cleanup and documentation * Type pattern is now defined in base class * Added stubs for onOpen and onClose with documentation so that subclass authors know what these methods do * Removed checks for onOpen or onClose methods since they are now noop stubs and are always there * Added stub and removed checks for onRemove * Made esc key close and accept - the illusion is supposed to be that the link changes are applied instantly, even though they are only updated when you close, so all closing except for when removing should apply changes - i.e. esc is now equal to back rather than being a special function that doesn't have an associated affordance * Only consider fully-covered annotations when getting matching annotations ve.ui.InspectorFactory * Depending on type pattern now since it's always there * Added getInspectorsForAnnotations method * Return empty array if annotation set is empty VisualEditor, VisualEditor.i18n * Added default inspector message Change-Id: I1cc008445bcbc8cba6754ca4b6ac0397575980d5
2012-11-16 20:40:05 +00:00
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-20 23:25:12 +00:00
return this;
};
(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-09 21:34:23 +00:00
/**
* Opens a given inspector.
*
* @method
* @param {string} name Symbolic name of inspector
* @param {Object} [config] Configuration options to be sent to the inspector class constructor
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-20 23:25:12 +00:00
* @chainable
(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-09 21:34:23 +00:00
*/
ve.ui.Context.prototype.openInspector = function ( name, config ) {
if ( !this.inspectors.currentWindow ) {
this.inspectors.open( name, config );
}
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-20 23:25:12 +00:00
return this;
};