These are chat archives for canjs/canjs

24th
Oct 2017
Nico R.
@nriesco
Oct 24 2017 03:29
Hi, I found this in the docs: https://canjs.com/doc/can-validate.html but couldn’t understand how to use it in a form, any ideas?
I was looking for an easy way to support HTML “required” fields
Nico R.
@nriesco
Oct 24 2017 03:35
or providing a custom method
swipie
@swipie
Oct 24 2017 09:07
We get a lot of warnings about a property that is not in the current scope and that the property is read from the parent scope. It is resolved when we do {{ ../myprop}} instead of {{myprop}} but is this the right way to solve these warnings?
Kevin Phillips
@phillipskevin
Oct 24 2017 13:24
Sorry the docs that warning links to haven't been published yet. There are a few ways to resolve this
image.png
Hopefully you can read that. Yes, if you want to read the prop from the parent scope, ../myProp is the correct way to do it.
Kevin Phillips
@phillipskevin
Oct 24 2017 13:54
if there are places where you think ../myprop isn't the right way to do it, let us know @swipie
Brad Momberger
@bmomberger-bitovi
Oct 24 2017 16:01
Got ninja'd by @phillipskevin, but I was going to add that reading explicitly from the scope level where your prop exists will help ease the upgrade process to future major revisions of can-stache
Frank Lemanschik
@frank-dspeed
Oct 24 2017 19:55
lol ninjaed
new term :)
i use normaly outsmartned
Brad Momberger
@bmomberger-bitovi
Oct 24 2017 19:56
It's not quite outsmarted, just that someone else got in a correct or agreeing response while you were composing your own.
Frank Lemanschik
@frank-dspeed
Oct 24 2017 19:58
ok if you say so
Frank Lemanschik
@frank-dspeed
Oct 24 2017 19:59

Streaming can-component

const Nils = require('../../')
const defineMap = require('can-define/map/map')
const Component = require('can-component')
const view = require('index.stache')

const app = new Nils()

const viewModel = defineMap.extend({sealed: false},{})


// Init ViewModel
// could be also a defineMap->Stream
app.stream.of({
  inputX: '',
  inputY: ''
})
// Observe DOM Elements
// return { update, assign }
.combineArray((observed)=>observed,[
  app.fromInput(document.querySelector('input.x'))
  .map((val)=>{
  return { inputX: val }
  }),
  app.fromInput(document.querySelector('input.y'))
  .map((val)=>{
    return { inputY: val }
  })
])
// Returns the ViewModelUpdating State aka can-x-connect :)
// This can also be a complet Can Component
// its only for demo
.loop(function applyVM(lastSetVal, setVal){
  let seed = lastSetVal.viewModel.updateDeep(setVal)
  return return { seed, value: seed };
},Component.extend({
  tag: 'kasse-login',
  ViewModel,
  view
}))
// Acticvate the Stream All gets executed as sideEffect
.map((comp)=>comp.render())
.drain()
what do you think about that?
for small components you can even drop can component and directly render stach
Brad Momberger
@bmomberger-bitovi
Oct 24 2017 20:00
You named your app for @nlundquist ?
Frank Lemanschik
@frank-dspeed
Oct 24 2017 20:01
no thats the name from my son
here you can read about Nils
:D

What is Nils?

Nils is the short form of Nikolaos (Santa Claus) it is composed from the greek words Nike and Laos

    Nike = Winner

    Laos = Public

= Winner of the Public! It offers DOM Diffing, Streams, Workflows for WebDevelopment
i am at present composing a new framework
that is canjs compatible
as i use canjs as legacy layer for old browsers
:D
i simply take a little stuff from canjs like can-component for compatiblity with browsers that don't support web components
rest ist webcomponent based
and my standart observe able is not can-compute its a stream
the stream is A+
Promise compilant
i also will use steal for easyer development
but a total new ssr technology
here you see a rendered component where i atach the viewModel as soon as JS gets executed
that allows me to return fast simple html
Frank Lemanschik
@frank-dspeed
Oct 24 2017 20:06
the core framework turns any HTML into Observe Able :)
thats why it includes domDiffing
the component isolation encapsulation happens already as webcomponent
incremental loading and such stuff is a standart feature
and the standart behavier
it even got incremental rendering line by line :)
it supports stuff like complex loading algos for execution priority and all that
so that you get the fastes possible first view
and then getting incremental interactiv
all in all i think i can use it and release it over the next month and till Christmas it will be mature
as i use diffrent components already
Brad Momberger
@bmomberger-bitovi
Oct 24 2017 20:12
https://github.com/canjsx/canjsx/blame/master/experiments/can-component-element-ssr-existing-tag/README.md#L82 seems like an opportunity for metaprogramming. Wouldn't that pattern be used all the time everywhere?
Frank Lemanschik
@frank-dspeed
Oct 24 2017 20:14
no
it is not
its a bit more complex to explain all the context and that
but if your interrested we can have a hangout
and i teach you why this is cool and how it works in context
Brad Momberger
@bmomberger-bitovi
Oct 24 2017 20:15
No time for it right now.
Frank Lemanschik
@frank-dspeed
Oct 24 2017 20:15
Webcomponent <script tag> for example gets executed on global window
Brad Momberger
@bmomberger-bitovi
Oct 24 2017 20:15
But do make some screencasts
Frank Lemanschik
@frank-dspeed
Oct 24 2017 20:15
i will i will
i am a single person
:)
i am at present happy that it works and that i found the pattern
to use streams all over
that makes coding a lot of easyer
and now i can compose done-applications
on a single page
:D