Skip to content
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

v2 Proposed Enhancement: fooTargetsChanged callback #336

Closed
leastbad opened this issue Sep 24, 2020 · 2 comments
Closed

v2 Proposed Enhancement: fooTargetsChanged callback #336

leastbad opened this issue Sep 24, 2020 · 2 comments

Comments

@leastbad
Copy link
Contributor

The ValueChanged callback has been a joy to work with, and it would be amazing to apply a similar mechanism to targets as well.

Having a fooTargetsChanged() callback would be good. fooTargetAdded(element) and fooTargetRemoved(element) would be great. Both would be sublime.

As an example, here is a controller that flashes the last target in a collection when it is inserted with a CableReady insert_adjacent_html operation:

import { Controller } from 'stimulus'
import { gsap } from 'gsap'
export default class extends Controller {
  static targets = ['location']
  connect () {
    this.element.addEventListener('cable-ready:after-insert-adjacent-html', this.locationInserted)
  }
  disconnect () {
    this.element.removeEventListener('cable-ready:after-insert-adjacent-html', this.locationInserted)
  }
  locationInserted = () => {
    gsap.fromTo(this.locationTargets[this.locationTargets.length - 1], { backgroundColor: "#FF0" }, { backgroundColor: "transparent" })
  }
}

If the proposed callback was implemented, this controller could be dramatically simplified:

import { Controller } from 'stimulus'
import { gsap } from 'gsap'
export default class extends Controller {
  static targets = ['location']
  locationTargetAdded (element) {
    gsap.fromTo(element, { backgroundColor: "#FF0" }, { backgroundColor: "transparent" })
  }
}
@leastbad
Copy link
Contributor Author

Talk to us, @panoply! I welcome other good ideas. How would you tackle this?

seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Jan 20, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Jan 20, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Jan 20, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Jan 20, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Jan 20, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Feb 7, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Mar 25, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Mar 25, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Mar 26, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Scope`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Mar 27, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Context`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: https://3.basecamp.com/2914079/buckets/20224425/todos/3391985862
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Mar 27, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Context`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: hotwired#336
seanpdoyle added a commit to seanpdoyle/stimulus that referenced this issue Apr 8, 2021
Closes [hotwired#336][]

---

Implements the `TargetObserver` to monitor when elements declaring
`[data-${identifier}-target]` are added or removed from a `Context`
_after_ being connected and _before_ being disconnected.

In support of iterating through target tokens, export the
`TokenListObserver` module's `parseTokenString` function.

[hotwired#336]: hotwired#336
@dhh
Copy link
Member

dhh commented Jul 3, 2021

Now implemented through #350.

@dhh dhh closed this as completed Jul 3, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging a pull request may close this issue.

2 participants