Summary

Make draft RegionCommentBlock movable and resizable

Review Request #6974 — Created Feb. 23, 2015 and submitted Feb. 27, 2015, 1:54 p.m.

Information

Owner

yyoud88

Repository

Review Board

Branch

master

Bugs

Depends On

Commit

21f6bfd...

Reviewers

Groups

reviewboard, students

People

Description

Make draft RegionCommentBlock movable and resizable.

Currently, a RegionCommentBlock is not movable or resizable, even if it is a draft. This change makes draft RegionCommentBlocks movable or resizable by drag-and-drop'ing left-top or right bottom corner of them. Users finish resizing by mouse-up action, and the draft RegionCommentBlock's new bound is saved on server. RegionCommentBlockView handles mouseup and mousedown, and simulate click event if mouseup happened w/o any drag. Click on RegionCommentBlockView shows the comment inside, and shows an editor to change it, if any comment in the block is a draft.

I made this RR to combine two RRs:
https://reviews.reviewboard.org/r/6886/
https://reviews.reviewboard.org/r/6919/
and fix click/drag-and-drop bugs in them.

Testing Done

Passed all tests in "/js-test/".

Browser test done:
1. Go to file attachment review page, for example, http://localhost:8080/r/7/file/4/
2. Make draft comment
3. Try moving
4. Try resizing
5. Refresh the page
6. See if the bounds updated

Edge cases tested:
1. Open file attachment review page, make resize/move "once" and refresh. => Fixed and working well.
2. Try click-and-drag non-draft commentBlocks. => Non-drafy commentBlcoks are not movable. Working as expected.

Tool: Pyflakes
Processed Files:
    reviewboard/staticbundles.py

Ignored Files:
    reviewboard/static/rb/js/views/abstractCommentBlockView.js
    reviewboard/static/rb/js/utils/mathUtils.js
    reviewboard/static/rb/js/resources/models/tests/baseResourceModelTests.js
    reviewboard/static/rb/css/pages/image-review-ui.less
    reviewboard/static/rb/js/models/regionCommentBlockModel.js
    reviewboard/static/rb/js/views/regionCommentBlockView.js
    reviewboard/static/rb/js/views/imageReviewableView.js
    reviewboard/static/rb/js/resources/models/baseResourceModel.js



Tool: PEP8 Style Checker
Processed Files:
    reviewboard/staticbundles.py

Ignored Files:
    reviewboard/static/rb/js/views/abstractCommentBlockView.js
    reviewboard/static/rb/js/utils/mathUtils.js
    reviewboard/static/rb/js/resources/models/tests/baseResourceModelTests.js
    reviewboard/static/rb/css/pages/image-review-ui.less
    reviewboard/static/rb/js/models/regionCommentBlockModel.js
    reviewboard/static/rb/js/views/regionCommentBlockView.js
    reviewboard/static/rb/js/views/imageReviewableView.js
    reviewboard/static/rb/js/resources/models/baseResourceModel.js

Groups:: students

Running with the latest patch, I seem to be able to resize a comment outside of the image bounds.

yyoud88 Feb. 23, 2015, 5:37 p.m.

I tried to reproduce it several times, but I couldn't. Could you share how you did that? Maybe sharing the image file would be helpful?

david Feb. 23, 2015, 5:41 p.m.

So because of the CSS, while you're dragging, if your mouse leaves the image area, the box will disappear, however, I was still able to keep dragging even though I couldn't see it. Once I released, if I hover over the image again, the region is now partially outside the image. It does seem to clip correctly on the right side, just not the bottom.

Change Summary:

fixed getValidMaxSize function to calculate max-height correctly.

Commit:

3e89a0eb9a3fc6e663ccae384bd40726f6e40744

21f6bfd47e1820edd5af52a0db7ddd2af59606e5

Diff:

Revision 2 (+377 -23)

Show changes

	reviewboard/staticbundles.py
	reviewboard/static/rb/css/pages/image-review-ui.less
	reviewboard/static/rb/js/models/regionCommentBlockModel.js
	reviewboard/static/rb/js/resources/models/baseResourceModel.js
	reviewboard/static/rb/js/resources/models/tests/baseResourceModelTests.js
	reviewboard/static/rb/js/utils/mathUtils.js
	reviewboard/static/rb/js/views/abstractCommentBlockView.js
	reviewboard/static/rb/js/views/imageReviewableView.js
	1 more

Tool: Pyflakes
Processed Files:
    reviewboard/staticbundles.py

Ignored Files:
    reviewboard/static/rb/js/views/abstractCommentBlockView.js
    reviewboard/static/rb/js/utils/mathUtils.js
    reviewboard/static/rb/js/resources/models/tests/baseResourceModelTests.js
    reviewboard/static/rb/css/pages/image-review-ui.less
    reviewboard/static/rb/js/models/regionCommentBlockModel.js
    reviewboard/static/rb/js/views/regionCommentBlockView.js
    reviewboard/static/rb/js/views/imageReviewableView.js
    reviewboard/static/rb/js/resources/models/baseResourceModel.js



Tool: PEP8 Style Checker
Processed Files:
    reviewboard/staticbundles.py

Ignored Files:
    reviewboard/static/rb/js/views/abstractCommentBlockView.js
    reviewboard/static/rb/js/utils/mathUtils.js
    reviewboard/static/rb/js/resources/models/tests/baseResourceModelTests.js
    reviewboard/static/rb/css/pages/image-review-ui.less
    reviewboard/static/rb/js/models/regionCommentBlockModel.js
    reviewboard/static/rb/js/views/regionCommentBlockView.js
    reviewboard/static/rb/js/views/imageReviewableView.js
    reviewboard/static/rb/js/resources/models/baseResourceModel.js

Ship it!

```
Ship It!
```

Status:: Completed
Change Summary:: Pushed to master (9468ea2)