rxjs-docs icon indicating copy to clipboard operation
rxjs-docs copied to clipboard

RxMarbles integration

Open ladyleet opened this issue 7 years ago • 23 comments

Created based on suggestion in https://github.com/ReactiveX/rxjs-docs/issues/12 for visualization

ladyleet avatar Oct 02 '17 13:10 ladyleet

@staltz hey andre! have ideas on how we could integrate this, etc into the new docs? we are making plans to do so! would love help if you have time.

ladyleet avatar Oct 02 '17 13:10 ladyleet

Hi @ladyleet :) Actually on reactivex.io we already have rx marbles as web components, for instance http://reactivex.io/documentation/operators/map.html

That was possible due to this: https://github.com/staltz/rxmarbles/blob/e34558bf288ce57548ca8d8048ea6bdc040f3820/test-custom-element.html (nowadays outdated)

That said, I'd also like to include @philpl in this conversation, since he built https://github.com/philpl/rxjs-diagrams which could be used for this purpose.

Actually I'm completely surprised about this repository and initiative. As the person who wrote most of the docs for http://reactivex.io/rxjs, I would expect to be at least consulted when an initiative like docs rewrite is up for discussion.

staltz avatar Oct 02 '17 19:10 staltz

Hiya, I haven’t heard of this initiative either, but I’m pleasantly surprised of the effort to make RxJS even more accessible!

I also haven’t heard of RxViz before. It seems that it operates in real time only though, right? It’d be amazing if we could combine efforts to have RxViz display an editable “mock time” stream as well. I haven’t worked on my library a lot after using it for a talk, but it’d be great to implement the gist of it in a more production-ready library

kitten avatar Oct 02 '17 19:10 kitten

@staltz yes, we have been discussing during the core team meetings and offline - we just wanted to finally get things started since it's been a topic since contributor days at the beginning of the year about improving the docs. not sure if you had logged off during that time! happy to have any guidance on docs related to this. :) do let me know!

ladyleet avatar Oct 02 '17 19:10 ladyleet

@philpl hey phil! yes did we talk about this before? i'm pretty sure we did a few months back but i can't remember now. i think combining efforts would be really great. if you'd like to be included in the upcoming meeting, send me an email? [email protected]

ladyleet avatar Oct 02 '17 19:10 ladyleet

@staltz i added you to the initial planning meeting btw! :) but most of the stuff we are planning is in here already issue https://github.com/ReactiveX/rxjs-docs/issues/4

ladyleet avatar Oct 02 '17 19:10 ladyleet

@staltz so, are you saying we use rxjs diagrams as well as rx marbles? or in lieu of?

ladyleet avatar Oct 02 '17 19:10 ladyleet

@ladyleet apparently both rxjs-diagrams and rxmarbles aren't in a production-ready state to be embeddable and usable within docs. It's not hard to fix the rxmarbles feature as a web component, though. I think the choice on which one depends on how many different operators can each render. The more challenging operators to render are concatAll, mergeMap/switchMap, groupBy, and some odd ones like do, observeOn, etc.

staltz avatar Oct 03 '17 11:10 staltz

@staltz love! Thanks for taking some time to think through this. Do you want me to create an issue or... and do you want someone else to help with this or might you have time? What do you think of having this as a separate route? Also @manekinekko I know has experience in web components use in angular so woot!

ladyleet avatar Oct 03 '17 11:10 ladyleet

Hi Tracy, I probably don't have the time, but I can help review and merge a PR. It's mostly about restoring this functionality (a small file) that was lost when the codebase was updated to RxJS v5, and probably also updating the Web Component spec to WC v1, using the right polyfills too.

staltz avatar Oct 03 '17 12:10 staltz

@ladyleet hiya, I don’t think we’ve met in person yet actually 🤔 I hope we can meet one day though

I’m currently a bit swamped with OSS work but I’d be happy to assist here. AFAIK the rxjs-diagrams Core Code to make the simulated streams work is still in good shape and should support all operators except of course demoing do and observeOn etc

I’d be happy to be involved, since I’ve gotten some interesting ideas that we’ve implemented when writing the styles-components docs. Feel free to mail me if you want to chat about some ideas: [email protected]

kitten avatar Oct 03 '17 14:10 kitten

@ladyleet I'll be glad to help or collaborate on this. Lmk.

manekinekko avatar Oct 04 '17 14:10 manekinekko

@manekinekko cool! I think maybe just creating a separate route and then integrating rxmarbles would be really awesome. And maybe seeking help from @staltz as questions arise? Happy to get you the help you need and assist during the process as much as possible so that we can actually get this integrated :-)

ladyleet avatar Oct 05 '17 00:10 ladyleet

@ladyleet @manekinekko Count me in for this ! LMK what I can help with

inf3cti0n95 avatar Oct 05 '17 03:10 inf3cti0n95

@ladyleet I have a local version of RxMarbles custom elements working with newest Web Component spec and this polyfill. I can have a PR submitted to RxMarbles this week. @staltz, should I open up an issue in that repo?

That doesn't mean the integration will be done by any means, we'll still have to address updating the operators and integrating with Angular, but that can hopefully help get things started for folks who aren't Cycle.js savvy?

xtianjohns avatar Oct 09 '17 22:10 xtianjohns

@xtianjohns that would be great, thanks for the initiative!

staltz avatar Oct 10 '17 07:10 staltz

@xtianjohns Awesome! Could you provide a link to your repo?

manekinekko avatar Oct 10 '17 09:10 manekinekko

I've opened an issue, and PR is here, @manekinekko.

xtianjohns avatar Oct 11 '17 17:10 xtianjohns

@xtianjohns Awesome work! I was able to get the rx-marbles web component integrated with the Angular app. @ladyleet

We should be able to close this once #34 is merged 👍

Demo

btroncone avatar Oct 17 '17 02:10 btroncone

You guys are also amazing!

ladyleet avatar Oct 17 '17 15:10 ladyleet

Hi guys as my first task I'm going through the issues. oldest to newest and I'll try to clean up the list a bit. For this one, it mentions that it can be closed once #34 is merged.

#34 is merged. Is there any outstanding work towards this feature? Can we close it now?

@btroncone @xtianjohns @ladyleet

dance-cmdr avatar Mar 28 '18 13:03 dance-cmdr

@alexandros-s There was actually an issue with RxMarbles integration I ran into when switching between operators so it was disabled as we were thinking about launching imminently. This may not be a problem now with the new navigation patterns but I have not had a chance to go back and look. It appears the code for the web component is just commented out right now.

https://github.com/ReactiveX/rxjs-docs/blob/937bc7d1330f447ea2e519b914d4bbafbd7a4604/src/app/operators/components/marble-diagram/marble-diagram.component.html#L7-L9

btroncone avatar Mar 28 '18 14:03 btroncone

Thanks, @btroncone. I'll try to have a look at it.

dance-cmdr avatar Apr 10 '18 13:04 dance-cmdr