Commit graph

20 commits

Author SHA1 Message Date
Trevor Parscal db9f941fa6 Rename this.$ to this.$element, and this.$$ to this.$
Objectives:
* Rename this.$ to this.$element
* Rename this.$$ to this.$
* Get rid of the need to use this.frame.$$
* Rename OO.ui.Element.get$$ to OO.ui.Element.getJQuery

Changes: (using Sublime Text regex patterns)
* Replace "get$$" with "getJQuery"
* Replace "\.(\$)([^\$a-zA-Z])" with ".$element$2"
* Replace "\.(\$\$)" with ".$"
* Replace "'$$'" with "'$'"
* Set this.$ to null in constructor of OO.ui.Window
* Set this.$ to this.frame.$ in initialize method of OO.ui.Window
* Replace "\.(frame.\$)([^\$a-zA-Z])" with ".\$$2"

Bonus:
* Use this.$() in a bunch of places where $() was erroneously used

Change-Id: If3d870124ab8d10f8223532cda95c2b2b075db94
2013-11-03 23:03:49 -08:00
Trevor Parscal d2dfb9ac4f Split oojs-ui from ve.ui
* Move and rename generic parts of ve.ui to OO.ui
* We now have a UI test suite because ve.Element (outside ve.ui)
  is now part of oojs-ui, so it needs a test suite.
* Added to the MW test run (just like we do for unicodejs).
* Updated csslint config (also added ve-mw and syntaxhighlight
  which were missing).

oojs-ui still depends on the TriggerRegistry in VE, this is addressed
in a follow-up commit.

Change-Id: Iec147155c1ddf20b73a4d15d87b8742207032312
2013-10-28 22:40:08 -07:00
Ed Sanders ac2a839607 Use update rather than show in focusable node re-render
Update checks if there's actually a context menu to show. We also need
to pass through the parameters for show.

This was causing the last-shown context menu to appears after resizing
an inline image (which has no context menu).

Change-Id: I8f46f71e2fba6896fe10054f0d2a679c6f23eb9c
2013-10-23 14:35:55 +01:00
Timo Tijhof 7db65f386c Rename @emits to @fires so we're forward compatible with JSDuck 5
Instead of using @emits in both, use our custom @fires in
production (JSDuck 4), and in the future it'll just naturally
use the native one.

This way we can also index oojs without issues, which seems to
have started using @fires already.

Change-Id: I7c3b56dd112626d57fa87ab995d205fb782a0149
2013-10-22 19:11:16 +00:00
Ed Sanders 79f4755850 Resizable node live preview
Resizes the $resizable element as you drag.
Can be disabled by setting the 'outline' config option.

FocusableNode
* Redraw on resize

ProtectedNode
* Destroy and prevent creation of phantoms on resize

MWInlineImageNode
* Correctly pass this.$image to ResizableNode

Bug: 54298
Change-Id: I7d6d345af8bb4712bbf154072b4704943a5a620d
2013-10-16 14:25:00 +02:00
Ed Sanders e73c97154d Add more resize events
'resize' is actually 'resizeEnd'. Added 'resizeStart' and 'resizing'
which is triggered on mouse move.

Change-Id: I13c6e426cbcc965b3db50082c5294ca76979fe57
2013-10-14 12:18:57 +01:00
Trevor Parscal d602724e83 Stop using ve.isMixedIn() to check if a node is focusable
* Moved isNodeFocusable to ve.ce.NodeFactory
* Added isFocusable static property to ve.ce.Node
* Set isFocusable to true on ve.ce.FocusableNode

Change-Id: I3cf666280abdfce55bf9b0710827bb25c40bfd51
2013-10-11 16:00:34 +02:00
Ed Sanders 241f146c8a Prevent context menu from flickering after FocusableNode redraw
Pass an extra parameter to show() to let it know when the menu is
just being moved, and therefore doesn't need to perform the fade-in
transition.

Change-Id: I2cf2ff07db6cc7d226f3d626755792a06dfcbe54
2013-09-26 21:39:54 +01:00
Ed Sanders 2d720bd6d9 Allow phantoms and focus areas to be overridden
And actually use this functionality on MWBlockImage to
highlight centred images correctly.

FocusableNode
* Actually use $focusable to render the highlight correctly

ProtectedNode
* Allow a $phantomable element to define which element to
  highlight on mouseenter
* As phatoms are built off shields, make sure a shield is
  given to $phantomable

RelocatableNode
* Allow a $relocatable element to define which element the
  relocatable marker is measured against

ui.Context
* Use $focusable (when available) for positioning the popup

Plus some documentation fixes

Change-Id: I370337239af4fc935cd86757b3ce03011bae5ba8
2013-08-30 14:04:17 -07:00
Ed Sanders 37b461fe56 Reposition context menu after rerender
Add rerender event to all image loads in MWExtensioNode.
MWHieroNode's implementation of onParseSuccess is now the same as
its parent so can be deleted.

Change-Id: Iaa4999372f1ba88a7bdf1490fc3f8640af77ceae
2013-08-15 10:43:31 +01:00
Christian Williams 1e298ffbc0 Fix focusable highlights
!$element.is( ':visible' ) - jQuery .is() returns boolean based on the
parameter.

$element.not( ':visible' ) - jQuery .not() returns a filtered jQuery
collection with elements matching the parameter removed.

Change-Id: Iedf55f3453514ee710bbb6d702bbf9a5570a4a1d
2013-07-03 13:49:11 -07:00
Rob Moen c472b2fe4a Make local overlays local to surface and remove insane z-indexes
ve.ui.Surface.js
* Make local overlay a child of ve-ui-surface and a sibling to
  ve-ce-surface elements.
** This keeps local overlays relative to their surface and eliminates the
   need for insane z-indexes.

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

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

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

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

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

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

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

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

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

Bug: 50241
Change-Id: Ibadce404a2286bc5dcec48f0d9da89004dbbd867
2013-07-02 19:35:43 +00:00
Christian Williams 5d44800b53 Correct Rendering for Block Images After Resize Undo
If a block image is resized and undone, there are lots of problems.

* The block image gets the wrong size. When rolling back the
transaction, height and width are passed as strings.
MWBlockImage tries to set the width to: width + 2. A 300px image
became 3002px.

* Resize handles didn't reposition and resize

* Relocatable drag marker didn't reposition and resize

* Focusable highlights didn't reposition and resize.

Change-Id: I8792b567b77da90ce5a2ad132e306705c5706606
2013-07-02 12:08:42 -07:00
Inez Korczyński daa83d2cfa Minor performance optimization and cleanup in FocusableNode
Change-Id: I4385b07c35e330a43827c891b94460424986526d
2013-06-30 13:01:47 -07:00
Rob Moen 57673643a2 Don't draw highlights over hidden elements.
Rational is that you wouldn't want to highlight something that is not
visible.  And, obtaining offsets for hidden slugs in this case does not
return correct values.

Bug: 49818
Change-Id: Ic2818423c26f5bbb2c056c3c94740d822be4f1b8
2013-06-28 15:30:17 -07:00
Ed Sanders f1e1dd7fcb Resize focus highlights on generated content update
Create a new rerender event. Also added a check to see
if the node is actually focused.

Change-Id: I9f74e82f72a9ddfd1e4a9ab7d1c0c8289b6525e8
2013-06-22 00:29:32 +01:00
Christian Williams babaa4118d FocusedNode Selection
Introduction of fake selection for single focused nodes. This
change specifically makes the selection much nicer in appearance
for Chrome users selecting floated FocusableNodes (block images)
for example.

Added ve-ce-surface-highlights DOM element to contain styled
highlight elements.

Made adjustments to getSelectionRect to return fake selection
bounds if necessary.

Replaced old uses of showSelection with model.change().

Change-Id: I96e66567cdce6455ef3eb77568e72f23140448ff
2013-06-07 17:49:35 -07:00
Trevor Parscal 55b5f30edb ve.ui.Context: Add embedding feature
Objectives:

* Make the context menu display in the top right corner of the currently
  focused inspectable node (if there is one)
* Prevent clicking on anything to do with the toolbar or popup from doing
  anything at all, ever

Bonus:

* While we are using the clever feature in jQuery's on method which allows
  passing boolean false to cancel the event - may as well do that in
  ve.ui.Dialog as well

Changes:

ve.ui.FocusableNode
* Add ability to specify the focusable element so that dimensions can be
  derived from it

ve.ce.Surface
* Add quotes to object keys

ve.ui.MediaDialog
* Change association from being MW specific to handling images in general

ve.ui.Context
* Add embedded styles for context
* Add embedded mode, which is triggered when the context is a single
  focusable node, and the node is large enough to fit the context
  reasonably

ve.ui.Dialog
* Inline mousedown handler

ve.ui.Toolbar, ve.ui.PopupWidget
* Cancel stray mousedown events

Change-Id: I4b25d33f64b4bcb8a3ecfd7e9728f54a2d4886f3
2013-05-16 11:23:59 -07:00
Timo Tijhof 13dd31c046 ve.ce.FocusableNode: Fix documentation
The constructor doesn't use any parameter named "$resizable".
And the one usage of it (ve.ce.ImageNode) doesn't pass any
arguments.

Follows-up 3fe3032.

Change-Id: I30530f4199a7c8383933be286b7b7a705c05c26c
2013-05-07 21:51:38 +02:00
Trevor Parscal 3fe30323e5 Allow node focusing
*.php
* Added links to new file

ve.ce.ImageNode.js
* Added focusable node mixin

ve.ce.FocusableNode.js
* New class!
* Adds isFocused and setFocused methods
* When a node is focused or blurred, 'focus' and 'blur' events are emitted
* While a node is focused, it will have the 've-ce-node-focused' class added to it's this.$

ve.ce.Surface.js
* Add detection of node focusing and setting focus and blur on nodes on change

Change-Id: I3f1ad6309571f2bfe568550e2e8f1bd5a0302085
2013-04-18 13:54:37 -07:00