Item reordering issues

[mlynch]

A few UX things with the new reorder.

• Icon is too big and too opaque (i.e. try grey instead of black). I know it's the wrong one but could make this one smaller in the meantime
• Icon should animate in instead of just appearing
• Can't reorder above the first one.
• If the drag is canceled the element doesn't animate smoothly back

See video for examples of all:

http://ionic-io-assets.s3.amazonaws.com/reorder.mov

[manucorporat]

@mlynch I think the point 3 was fixed here last night: here

I will check out tonight though :)

[manucorporat]

@mlynch @adamdbradley all the issues have been fixed in the following commits:
f289ac6
8483a43
d993a1b

but "Icon should animate in instead of just appearing" is not that simple.

• We can't use only CSS, but Animate for each one
• What if the list has hundreds of items

I think it is a perfect use case for the new animate hooks of angular 2, but I think we decided to wait until they are more mature, right?

[lbickston]

If the drag is cancelled and the item barely moves and doesn't actually reorder, indexes.to is set to -100 instead of the actual index. Checking if indexes.to < 0 isn't as intuitive as just checking if indexes.from == indexes.to. Agree?

[manucorporat]

@djangojack 100% agree, it is a bug! can you please open an issue?

[lbickston]

@manucorporat done. #7307

[brandyscarney]

There is a PR open to change the icon to the reorder icon. Is this something we want to do? #7450

[manucorporat]

Reorder animation #7651 merged!
Thanks @mhartington

[manucorporat]

#7450 merged! thanks @btroncone
@mlynch closing issue... 👌