Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jan 31 2019 21:51

    evs-chris on dev

    safer, though maybe slightly le… minifiable undefineds (compare)

  • Jan 30 2019 20:04
    RustyDev starred ractivejs/ractive
  • Jan 30 2019 10:40

    evs-chris on dev

    fix parent context of component… (compare)

  • Jan 29 2019 08:44
    dashiwa starred ractivejs/ractive
  • Jan 28 2019 21:47

    evs-chris on dev

    fix shuffling when more than on… shuffling binding mystery bug t… don't shuffle an autoshuffling … (compare)

  • Jan 28 2019 19:29
    aligoren starred ractivejs/ractive
  • Jan 28 2019 15:30
    meetajhu starred ractivejs/ractive
  • Jan 27 2019 23:18
    4lm starred ractivejs/ractive
  • Jan 26 2019 10:22
    meetajhu starred ractivejs/ractive
  • Jan 25 2019 22:25

    evs-chris on dev

    fix a few corner cases on autom… (compare)

  • Jan 25 2019 06:22

    evs-chris on dev

    add support for automatically l… (compare)

  • Jan 23 2019 16:37
    frncsdrk starred ractivejs/ractive
  • Jan 20 2019 12:44
    0851 starred ractivejs/ractive
  • Jan 15 2019 15:40
    dagnelies closed #3292
  • Jan 15 2019 15:40
    dagnelies commented #3292
  • Jan 15 2019 15:34
    evs-chris commented #3292
  • Jan 15 2019 15:34
    evs-chris commented #3292
  • Jan 15 2019 15:29
    dagnelies commented #3292
  • Jan 15 2019 15:29
    dagnelies commented #3292
  • Jan 15 2019 15:26
    evs-chris commented #3292
Chris Reeves
@evs-chris
any time the decorated node gets bubbled past in the render cycle (it or downstream content is updated), the invalidate callback will be called, if supplied
ugh, it didn't save my html changes
but the decorator works if the template is set up with <span as-foo>{{bar}}</span><input value="{{bar}}" />
huh
it also missed the duration passed to animate
Dayton Lowell
@daytonlowell
That's awesome! Thanks @evs-chris!
Dayton Lowell
@daytonlowell
What's everyone use for the file extension for the ractive template files?
I've always used .html but I'm it'll be easier to get syntax highlighting of the handlebars if I start using a different extension
image.png
Also VS Code does some weird formatting of handlebars
Chris Reeves
@evs-chris
I use .ractive.html, as pain old html highlighting is usually good enough for me, and the .ractive. part makes it easy to target with tooling
Jijo Joseph
@jijojosephk
I'm looking for suggestions on a design which I'll explain below
I have one main component and a few child components
based on different situations some child components get visible or invisible
when they get visible, they'll have some data rendered from an API call result.
There are situation where when one of child component is get's invisible others need to be visible
What's the best strategy for achiving this?
Imange it's an edit form when I save the form should be invisible and a previous component should get visible
Dayton Lowell
@daytonlowell
Are you using a state router or just handling it all in memory in Ractive?
Dayton Lowell
@daytonlowell
So I'm trying to use component scoped css in Ractive and it seems to work as expected when I throw my css in the css initialization prop in my component. But If I put a <style> tag in the component template instead, it just throws it into a style tag unmodified in the <body>. This bit of the docs seems to imply that component scoped css is supported if I put my css in the component template. https://ractive.js.org/api/#component-files
Am I wrong on that?
I wanted to put it in the template to get css syntax highlighting...
Dayton Lowell
@daytonlowell
oh, you can't put it in the template, you have to put it in the component file itself, which in my case is a .js file
dang
paulie4
@paulie4
We use non-visible Ractive instances as Flux Stores, which visible Ractive instances are linked to. When a visible one dispatches an event, the non-visible one(s) get updated, and the dependent visible ones also get updated as a side-effect.
Dayton Lowell
@daytonlowell
Haven't heard from @evs-chris in a while. Hope all is well.
Chris Reeves
@evs-chris
I'm still kicking around, just swamped a bit at work and trying to avoid burn out. I appreciate the thought!
Simon Layfield
@simonlayfield
Hello again Ractivians
Chris Reeves
@evs-chris
👋
Norbert Haberl
@nhaberl
Hi, is there a way to force an update over all decorators globally?
Chris Reeves
@evs-chris
Not natively, but there a few things you could possibly do to orchestrate something like that. What sorry of scenario are you looking at?
Norbert Haberl
@nhaberl
We have plenty of decoratos (dropdowns) which should be reset on given click ... same to other decorators
Something like ractive.clear() and all dropdowns etc. are empty
Chris Reeves
@evs-chris
You could have the decorators watch a shared path e.g. this.observe('@shared.mydecoratortrigger', () => timeToReset()) (an don't forget to cancel the observer in the decorator teardown)
Then when whatever happens that should trigger the reset, you could on-click="doWhatever(), @.add('@shared.mydecoratortrigger')"
you could also do a similar thing with a feww ractive instance that the decorate module initializes and uses as an event bus
Dayton Lowell
@daytonlowell
When I have an on- directive in a section, does Ractive rewrite the event to be on the parent or something? When I look in the browser dev tools, I don't see the event on the element I put it on.
I'm having issues where a stopPropagation call is seemingly not working as expected when I call it in a section. But I'm still trying to narrow it down.
Dayton Lowell
@daytonlowell
And here's a vanilla JS fiddle of the same concept. https://jsfiddle.net/nq5etswh/
Chris Reeves
@evs-chris
ractive does event delegation by default, and currently has no way of knowing when propagation is stopped unless you return false from your handler
you can also disable delegation
Chris Reeves
@evs-chris
it only affects elements within an iterative section
I suppose we could override the stopPropagation method to do some detection
Dayton Lowell
@daytonlowell
Cool, I was wondering if I could disable the behavior for a given ractive instance. Thanks!
Dayton Lowell
@daytonlowell
Overriding stopPropagation would be magical. It would essentially completely abstract away the event delegation from the user(other than if they're looking at registered event listeners in the dev tools :-P)
Dayton Lowell
@daytonlowell
I guess it'd probably have to do preventDefault as well.
Chris Reeves
@evs-chris
@daytonlowell I've implemented experimental stop/prevent overrides on edge if you want to give it a try and let me know if it satisfies your use case
you can hit them directly in the event handler on the element with something like on-click="@.doSomething(), @event.stopImmediatePropagation()"
stop immediate will stop processing all ractive handlers as well
it's still not quite the same as a non-delegated event, because for certain event reasons, delegates always use capture, so if you have captures in the middle that are not handled by ractive, you will see things fire a little out of order
Dayton Lowell
@daytonlowell
Thanks @evs-chris!