Skip to content

feat(drag-drop): add service for attaching drag&drop to arbitrary DOM nodes #14437

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jan 25, 2019

Conversation

crisbeto
Copy link
Member

@crisbeto crisbeto commented Dec 9, 2018

  • Adds the DragDrop service that simplifies the construction logic for DragRef and DropListRef and allows consumers to attach drag&drop functionality to arbitrary DOM nodes, rather than having to go through the directives.
  • Reworks DragRef and DragDropRef to make them easier to construct.
  • Normalizes some of the instances where some parameters only accept an ElementRef, whereas others accept ElementRef | HTMLElement.

@crisbeto crisbeto added the target: minor This PR is targeted for the next minor release label Dec 9, 2018
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Dec 9, 2018
@@ -21,6 +21,7 @@ import {
createTouchEvent,
} from '@angular/cdk/testing';
import {Directionality} from '@angular/cdk/bidi';
import {of as observbleOf} from 'rxjs';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Typo? observableOf

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ops, thanks for catching it.

@ngbot
Copy link

ngbot bot commented Dec 19, 2018

Hi @crisbeto! This PR has merge conflicts due to recent upstream merges.
Please help to unblock it by resolving these conflicts. Thanks!

Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do you plan to add documentation for the service in a follow-up PR?

.withPlaceholderTemplate(this._placeholderTemplate ? {
templateRef: this._placeholderTemplate.templateRef,
data: this._placeholderTemplate.data,
viewContainer: this._viewContainerRef
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would move the placeholder and preview ternary expressions out into separate variables so that the .with calls are a bit more concise here

import {DragDropRegistry} from './drag-drop-registry';

/**
* Service that allows for drag&drop functionality to be attached to DOM elements.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: "drag-and-drop"

config: DragRefConfig = {
dragStartThreshold: 5,
pointerDirectionChangeThreshold: 5
}): DragRef<T> {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Move this to a DEFAULT_CONFIG const?

* Service that allows for drag&drop functionality to be attached to DOM elements.
*/
@Injectable({providedIn: 'root'})
export class DragDrop {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add unit tests for consuming this service?

@crisbeto
Copy link
Member Author

crisbeto commented Jan 9, 2019

@jelbourn I've addressed the feedback. Regarding docs, I was planning on adding some live examples in a follow-up. As for tests, I'm not sure whether it makes sense to test this service, because all it does is create the refs which is covered by the TS type checking already.

@jelbourn
Copy link
Member

jelbourn commented Jan 9, 2019

It would be good to have at least one test that verifies the services can be injected and invoked correctly from a code coverage standpoint.

… nodes

* Adds the  `DragDrop` service that simplifies the construction logic for `DragRef` and `DropListRef` and allows consumers to attach drag&drop functionality to arbitrary DOM nodes, rather than having to go through the directives.
* Reworks `DragRef` and `DragDropRef` to make them easier to construct.
* Normalizes some of the instances where some parameters only accept an `ElementRef`, whereas others accept `ElementRef | HTMLElement`.
@crisbeto
Copy link
Member Author

@jelbourn this PR should be good to go now.

Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@jelbourn jelbourn added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Jan 24, 2019
@ngbot
Copy link

ngbot bot commented Jan 24, 2019

I see that you just added the pr: merge ready label, but the following checks are still failing:
    failure status "branch-manager" is failing

If you want your PR to be merged, it has to pass all the CI checks.

If you can't get the PR to a green state due to flakes or broken master, please try rebasing to master and/or restarting the CI job. If that fails and you believe that the issue is not due to your change, please contact the caretaker and ask for help.

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: minor This PR is targeted for the next minor release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants