These are chat archives for ractivejs/ractive

18th
Jul 2018
serious
@serious_gitlab
Jul 18 2018 13:03
Seems pretty dead in here
like the library it self :(
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:05
we have a time traveler here from v0.73
serious
@serious_gitlab
Jul 18 2018 13:09
Is rativejs still the only html (runtime) template engine?
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:10
...or gitter causes message delays up to 3 years
no, there are lots of template engines out there, like Svelte, Vue, React, Marko, Knockout, ...
Ractive is the only one engine which deserves the logo more than CouchDB
serious
@serious_gitlab
Jul 18 2018 13:13
Yeah but Svelte and Vue are precompiled
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:13
nope, they aren't
serious
@serious_gitlab
Jul 18 2018 13:15
i have to say: what i am planning todo is a project with multiple tenants and i only know at runtime (when a route is hit) which templates i need to generate
because every tenant can have extended or other templates
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:17
let's make something clear: do you need to create a page according to changing url (and data, of course) or do you need to generate whole template according to the url?

for example, if you need to change the page according to url with a static template, you may observe the url and fetch the data accordingly, and display it like so:

<p>Hello, my name is {{name}}</p>

this is a static template with dynamic data

or do you need two very distinct templates to be fetched according to the data?
serious
@serious_gitlab
Jul 18 2018 13:19
yeah they are very dinstinct
/TentantId/EventId/Controller/Action Tenant inherit the templates from a "base" and can overwrite them and Event inherit from Tenant but can also overwrite it.
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:22
so you need to transfer your template too in the runtime, which is possible with async components, I think: https://github.com/ceremcem/async-component-test
serious
@serious_gitlab
Jul 18 2018 13:23
based on ractivejs?
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:23
yes
serious
@serious_gitlab
Jul 18 2018 13:24
currently i am using dotnet core with Razor to generate ractivejs templates, prefilled with the locales of the user and the mustaches
ahm another question
what can i do with ractivejs when i am switching to Typescript?
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:26
what do you want to do?
serious
@serious_gitlab
Jul 18 2018 13:27
I want Intellisense support on vscode :)
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 13:27
I think @fskreuz may answer to this question, as he is keen on Typescript
Joseph
@fskreuz
Jul 18 2018 13:31
Ractive (i think from 0.7 onwards) comes with a *.d.ts, which was gradually improved overtime. This should cover intellisense things.
Joseph
@fskreuz
Jul 18 2018 13:32
I think 0.9 and 0.10 was where it became really extensive (included internal objects) thanks to @evs-chris
serious
@serious_gitlab
Jul 18 2018 13:34
very nice! i'll use it thank!
Joseph
@fskreuz
Jul 18 2018 13:37
And yep, I remember a discussion here where Ractive was used with server-generated templates because of locale-related markup. Not sure if it was @dagnelies or @avoto or @ceremcem
I remember in that discussion the phrase "it's easier to generate locale-specific markup on the server" or something along those lines.
serious
@serious_gitlab
Jul 18 2018 13:38
yeah i do it currently
the server generates the templates based on the users role and permissions and his language
does anybody use server-side rendering for the first hit?
Joseph
@fskreuz
Jul 18 2018 13:40
@PaulMaly_twitter would be that person.
serious
@serious_gitlab
Jul 18 2018 13:42
and who made the new logo?
Chris Reeves
@evs-chris
Jul 18 2018 13:53
@simonlayfield did the rebrand
I have used both server side rendering and server compiled templates cms-style for an spa
multitenancy is fun
Chris Reeves
@evs-chris
Jul 18 2018 13:59
I'm using typescript with ractive in a really big project right now, and it's really nice. Kinda wish typescript could be applied to the templates too, but I don't see a solid way to achieve that.
serious
@serious_gitlab
Jul 18 2018 14:09
@evs-chris sounds very nice. Typescript in the templates, do you mean like in the mustaches?
Chris Reeves
@evs-chris
Jul 18 2018 14:10
yes
Joseph
@fskreuz
Jul 18 2018 14:11
An editor/ide integration would be needed to have the template know what's around it (similar to angular2-inline in VS Code)
serious
@serious_gitlab
Jul 18 2018 14:12
i am thinking about using typescript in dynamic views (ractive-load)
@fskreuz Yes this would be very awesome. The biggest problem is the resolving of the current keypath in the template in an editor
Chris Reeves
@evs-chris
Jul 18 2018 14:14
toppings for data sounds unpleasant, though
mine would mostly end up in any-land
serious
@serious_gitlab
Jul 18 2018 14:16
@evs-chris what do you mean by "toppings for data"
Chris Reeves
@evs-chris
Jul 18 2018 14:16
autocorrect ate typings 😁
unless you want sprinkles and whooped cream
... and I have no idea why whipped is handily changed to whooped on my phone
Joseph
@fskreuz
Jul 18 2018 14:37
:joy:
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 20:28
I think I could monkey-patch Ractive.extend, but it seems not working
origExtend = Ractive.extend;

newExtend = function(opts){
    // do some man-in-the-middle here 
    return origExtend(fixSomething(opts));
}

Ractive.extend = newExtend;
Joseph
@fskreuz
Jul 18 2018 20:45
What does fixSomething do?
Also, what's the error?
Oh wait, Ractive.extend() is set on Ractive using Object.defineProperties() and is not writable.
I think you can't do Ractive.extend = newExtend
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 21:01
fixSomething function replaces template: value with fixHasListener(value) as a workaround for #3253
Joseph
@fskreuz
Jul 18 2018 21:05

trying to write into the non-writable property doesn't change it but doesn't throw an error either.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty#Writable_attribute

Cerem Cem ASLAN
@ceremcem
Jul 18 2018 21:06
maybe the key is Ractive.extendWith
...but I'm not able to understand the usage
I'm trying to pass every template string through the function during Ractive.extend:
fixHasListener = function(template){
    return template.replace(/(\s+)(on-[a-z-]+)=(["'])([a-zA-Z0-9]+)(["'])/g, 
        '$1{{#if @this.getContext().hasListener(\'$4\')}}$2=$3$4$5{{/if}}') 
}
Chris Reeves
@evs-chris
Jul 18 2018 21:53
I'll see if I can poke at yielded events tonight...
they're a little bit extra weird because on-foo-bar="baz" is the same as on-foo="baz" on-bar="baz"
Chris Reeves
@evs-chris
Jul 18 2018 21:59
so declaring events may potentially split up a vdom node e.g. Ractive.extend({ attributes: { events: ['foo'] } }) with on-foo-bar="baz" in the template would need to split the event into two - one on the parent and one to be collected in extra-attributes
Cerem Cem ASLAN
@ceremcem
Jul 18 2018 22:14
I felt like I was so close to make a contribution :/