Add supports for clipboard events.

[vivekimsit]

I see that the support for the following clipboard events are missing:

http://www.quirksmode.org/dom/events/cutcopypaste.html

[solkimicreb]

Hi! Any event should work with any name (be it custom or native) as NX doesn't rely on a predefined list of events, but adds listener on anything dynamicly. See the relevant code here: https://github.com/RisingStack/nx-framework/blob/master/middlewares/events.js.

Are you sure that clipboard events have issues? If yes, can you please provide a small snippet to reproduce the problem?

Thx (:

Edit: I think I misunderstood you (: I see that the clipboard events are not yet natively supported in many browsers. I think the best solution would be to use a polyfill and NX together, but I could not yet find a polyfill. I will search a bit more and maybe check if writing a new polyfill would be doable.

Edit2: After a second check, I think that the recent browsers all support the most important parts of the api http://caniuse.com/#feat=clipboard.

[vivekimsit]

cool 👍 , I haven't checked it yet but I will before closing this issue.

[vivekimsit]

Hi,

I did some research and found that it not working on below example taken from your site:

<example-app>
  <p>Two way sync on blur and change events:
    <input type="text" name="text" $bind="{mode: 'two-way', on: ['blur', 'cut'], type: 'string'}" autocomplete="off">
  </p>
  <p>state.text: @{text}</p>
</example-app>

I found a similar example on angularjs here which works as expected.

I will try to find the issue soon.

[solkimicreb]

Hi,

thanks for the catch (: I am writing an article now, but I will check the issue in the afternoon.

[solkimicreb]

Hi,

I checked and your example here: http://nx-framework.com/docs/web/bind and copy and paste events works fine. Using cut event for a two-way data binding trigger is problematic though (and a strange use case in my opinion).

The cut operation removes the value from the field, then NX refills the field (because of the two way binding), which results in a strange effect. I will try to figure out something more consistent for this.

If you check the same example with paste or copy events, it should work fine. Cut events also works nicely with one-way binding. The events middleware also works with all 3 of the events.

If they do not work for you can you share your browser (type and version)? Also do you have a concrete use case where you need to bind on these events?

Thx (:

[vivekimsit]

I am using

Google Chrome   53.0.2785.143 (Official Build) (64-bit)

As mentioned angular has provided this API and it works fine there, other than that I am more concerned about the consistency, if copy and paste works fine then cut should work too. I will also check the issue.

[solkimicreb]

Hi,

I checked the angular example and it is an inline event handler API, which works fine in NX too. The NX equivalent would be this. (just like ng-cut, #cut executes the passed value as code on cut events)

<example-app>
  <p>Reaction on cut event:
    <input type="text" #blur,cut="cut = true" autocomplete="off">
    cut: @{cut}
  </p>
</example-app>

You can check it by playing around with the events middleware examples.

The code you provided is not an inline event handling one, but a data binding one. I think two-way data binding doesn't make sense on cut events, because of the way cut works (you can use it and it works as expected, but the expected result is nonsense).

[vivekimsit]

Ah,

Makes sense now. I think you can close this issue.

Thanks,

[solkimicreb]

Sure, thanks (: