These are chat archives for bvaughn/forms-js

28th
Mar 2015
Mohsen Azimi
@mohsen1
Mar 28 2015 02:57
hey Brian I got web component project structure to some extend working
now I’m wondering how exactly should I use fomsjs? #noobquestion
Brian Vaughn
@bvaughn
Mar 28 2015 03:15
Hey Mohsen.
Want me to take a look? Or we could chat about it sometime this weekend?
I'm flexible :)
Mohsen Azimi
@mohsen1
Mar 28 2015 03:16
One great thing you can do is to write some documentation for how a user of FormsJS should use it
how to create a new instance and how form rendering should work?
those are my main qustions
Brian Vaughn
@bvaughn
Mar 28 2015 03:19
Well... I've been holding off on investing time writing documentation focused on end-users until after we'd all kind of pounded on the library with these adapter spikes. The main point of the adapters (I thought) was to test the concept of the library, see if it would work or if we needed to go back to the drawing board.
I put up an Angular 1.x PR a few days back that showed a working integration. I'd be happy to take a look at the Web Components and kind of do the same.
I thought the email outlines I sent a week or so back were kind of (admittedly rough) documentation...
Mohsen Azimi
@mohsen1
Mar 28 2015 03:21
I can look at the pr on 1x and see if I can learn anything
Brian Vaughn
@bvaughn
Mar 28 2015 03:21
So ... form-rendering is kind of totally up to the adapters. I don't think that's Forms JS's business. But I could give some examples of how to create a Forms JS form and validate, etc.
Mohsen Azimi
@mohsen1
Mar 28 2015 03:21
so adapters provide the templates and all that?
Brian Vaughn
@bvaughn
Mar 28 2015 03:22
Well, yeah.
I think the adapters are going to vary so much.
So React vs Angular 1x vs Web Components for eaxmple
The view parts will look totally different in all 3 cases.
I think they'll all be lightweight though, mainly just passing data to the base library for validation
And wiring up binding in whatever way the framework advises (e.g. $scope.$watch, Object.observe)
Mohsen Azimi
@mohsen1
Mar 28 2015 03:24
does that mean view object is adapter specific?
I can start with polymer paper elements for rendering
Brian Vaughn
@bvaughn
Mar 28 2015 03:28
Well, yes.
So for example
Maybe for Web Components we may start off with something Material-based like Polymer,
For Angular 2 we may do an Angular-Material and a Bootstrap UI
Built on the Angular adapter
I don't think any of that could really go in the base lib
Mohsen Azimi
@mohsen1
Mar 28 2015 03:33
just to make sure, view is optiona right?
Also I don’t like the idea of having per framework view objects
lets unify it
Brian Vaughn
@bvaughn
Mar 28 2015 03:37
I'm really confused.
How would we share view objects between...something like Angular and something like React? or even Angular 1 and 2
The markup, binding, etc. is all very different
We may be able to share CSS between them... if we want to provide our own styles, although really I think we should just go with something like Material or Bootstrap
Mohsen Azimi
@mohsen1
Mar 28 2015 03:42
yeah that’s resonable
Brian Vaughn
@bvaughn
Mar 28 2015 03:43
Having implemented custom styles for formFor...it's a path I think I'd avoid if I were doing this again. :)
Mark Chapman
@mchapman
Mar 28 2015 10:25
I have given up for the time being on Angular 2, but have done a little work on a branch of forms-angular. Unfortunately then I got (for the first time in ages) some interest in my main (social care) project so I need to spend time maximising that opportunity. After Wednesday I will do more on forms-js.
Brian Vaughn
@bvaughn
Mar 28 2015 16:48
I think we all have put Angular 2 on-hold for the moment, from the sounds of it. That's fine...I would just say, if you feel like you might not be working on an adapter or something for a while, consider handing it off. I have bandwidth.
Brian Vaughn
@bvaughn
Mar 28 2015 19:19
In the meanwhile I hacked away on formFor in the evenings this week and added support for material design components. Made me reconsider some things (like radio fields - treating them more like selects than like other inputs).

formFor used to require you to declare radio fields separately like so:

<radio-field attribute="gender" value="Male">
<radio-field attribute="gender" value="Female">

Now you only declare them once:

<radio-field attribute="gender" options="[...]">

I did this initially because of how the material radio group components work, but I think it's probably a better approach over all (and maybe one we could follow with Forms JS).

Mohsen Azimi
@mohsen1
Mar 28 2015 20:44
How does that work when the enums are complex?
David Jensen
@davidlgj
Mar 28 2015 20:50
Hi guys, work has been hectic this week... but I'm gonna hack a bit on the angular 1.x adaptor right now
Mohsen Azimi
@mohsen1
Mar 28 2015 21:11
yo @bvaughn I’m in SF, lemme know if you want to catch up
Brian Vaughn
@bvaughn
Mar 28 2015 22:10
@mohsen1 Whch part of town?
I'm free :)
As for "complex enums" - formFor assumes a :value and :label key in the objects. You can override it by passing a label-attribute or value-attribute value.
Mohsen Azimi
@mohsen1
Mar 28 2015 22:11
Polk and green right now
Brian Vaughn
@bvaughn
Mar 28 2015 22:11
(Essentially it works the same as `<select-field options>
Polk and green... that's 2.7 miles from me.
Mohsen Azimi
@mohsen1
Mar 28 2015 22:11
I have a car
Brian Vaughn
@bvaughn
Mar 28 2015 22:11
I wish I had known. I literally just drove by there on my way back from Richmond.
What are you in town for? Want to grab a cup of coffee somewhere in between?
Mohsen Azimi
@mohsen1
Mar 28 2015 22:13
I just finished up meeting a couple of friends
Brian Vaughn
@bvaughn
Mar 28 2015 22:14
Well I'm currently at 160 Brannan St
But in between us is a lot of things
Westfield Mall, the ferry building, etc.
Could meet for coffee or whatever if you'd like
Mohsen Azimi
@mohsen1
Mar 28 2015 22:14
Yeah. I need parking. Anywhere that parking is easy
Brian Vaughn
@bvaughn
Mar 28 2015 22:15
Westfield has a parking deck on the south side, along Mission street
So that should be an easy meeting spot,
I can snag a muni
Also has a stop there
What time should I meet you there? :)
Mohsen Azimi
@mohsen1
Mar 28 2015 22:16
Could you poste the exact location of their parking door?
Brian Vaughn
@bvaughn
Mar 28 2015 22:16
Yeah one sec.
I'm thinking of "Shopper's Parking" at 833 Mission St
It's right beside the mall
Mohsen Azimi
@mohsen1
Mar 28 2015 22:18
Ok. I have 15 minutes to there
Brian Vaughn
@bvaughn
Mar 28 2015 22:18
My cell is 540-246-5223. SMS me when you park and we'll figure out where to meet. If you're heading there now, I'll head that way also.
Mohsen Azimi
@mohsen1
Mar 28 2015 22:18
Assuming parking and getting out of parking takes time I'll be there in 20-25 minutes
Brian Vaughn
@bvaughn
Mar 28 2015 22:19
Ok! See you then.
Mohsen Azimi
@mohsen1
Mar 28 2015 22:19
310 923-8252 is my cell btw
David Jensen
@davidlgj
Mar 28 2015 22:40
My evening hacking, a PR: forms-js/angular-1x#4
Don't know how much time I'll have this week, so feel free to hack away if you like :)
David Jensen
@davidlgj
Mar 28 2015 22:45
But send a mail so I know!
Mohsen Azimi
@mohsen1
Mar 28 2015 23:44
Notes from our meeting
{
  foo: {
    type: array,
    min: 2,
    items: {
      bar: {
        type: string,
        required: true
      }
    }
  }
}
foo.bar
foo[*].bar

{foo: 1}
{bar: [1]}
viewSchema = {
  foo: {
    groupLabel: 'Foo:'

    a: {
      inputType: 'text'
      group: 'foo'
    }
  },
  b: {
    inputType: 'number'
    label: 'Name'
  }
}

validationSchema = {
  foo: {
    a: {
      required: true
    }
  },
  b: {
    min: 5,
    max: 30,
    required: true
  }
}

formData = {
  foo: {
    a: 'Hi'
  },
  b: 'Brian'
}



---foo--
  a: [    ]
b: [    ]

Input Web Component HTML:

<input type="text" onchange="changeHandler()">

Input Web Component JS:

var attributeMetadata = form.registerAttribute('foo.a');

changeHandler = function() {
  attributeMetadata.validate();
};
dsdf