canjs/canjs

We CAN build the impossible! https://codepen.io/justinbmeyer/pen/yEGGoK

Jeroen Cornelissen

@jeroencornelissen

@pYr0x autofocus only seems to werk first time, not when switching between forms.
With the extra focus attribute I can make it work! :clap:

Julian

@pYr0x

good.. if you can add your working example to the forum, would be nice

or provide a solution

Mohamed Cherif Bouchelaghem

@cherifGsoul

@jeroencornelissen thank you for submiting it in donejs forums

This message was deleted

Christopher Oliphant

@RALifeCoach

in the docs it recommends including css files with components

how best to do that?

is there some way of bringing the file into the component?

Guido Smeets

@gsmeets

Depending on how much css you have I wouldn't bother

Julian

@pYr0x

dont understand the question...

Christopher Oliphant

@RALifeCoach

there is a property on component for template, it would be nice to have a property for css - that could be a css, less or sass string or file

Julian

@pYr0x

what do you mean with property?

Christopher Oliphant

@RALifeCoach

can.Component.extend({
tag: ‘tag-name’
*template*: can.view(’path to stache file’)

wwould tag and template not be properties of the component?

Julian

@pYr0x

include css or less import 'path/to/style.css';

Christopher Oliphant

@RALifeCoach

except this project does not use steal

Julian

@pYr0x

or require();

tried <can-import>?

in the template

https://canjs.com/docs/can|view|stache|system.import.html

Christopher Oliphant

@RALifeCoach

interesting suggestion, can I use it to import a script as well?

Julian

@pYr0x

i think so

try it

Christopher Oliphant

@RALifeCoach

I will, do you know the docs mean when they say that can-import only works with can.autorender?

Julian

@pYr0x

it says with can.autorender or the system plugin

Christopher Oliphant

@RALifeCoach

even still, I am not sure what that means

Julian

@pYr0x

https://canjs.com/docs/can|view|stache|system.html

you have to use stache can/view/stache/system

it means, it works with stache templates and a script tag that is tagged as autorender

Christopher Oliphant

@RALifeCoach

This project is not using steal or system. There is no DI.

Julian

@pYr0x

you dont need steal

or system

it works with stache

and this plugin https://github.com/canjs/canjs/blob/master/view/stache/system.js

which is provided by stache

Christopher Oliphant

@RALifeCoach

okay - I will play with it and see what I can figure out

Christopher Oliphant

@RALifeCoach

I apologize for asking so many questions. And I now have another one.

I have a component like so:

<feature-icon type="photo" types="photos" isActive="{{isActive}}" hasMedia="{{hasMediaContent('photos')}}" profilesURL="options.profilesURL"></feature-icon>

The ‘hasMedia’ attribute changes, but the binding to ‘hasMedia’ doesn’t fire.

    can.Component.extend({
        tag: 'feature-icon',
        template: can.view('/modules/feature-icon/feature-icon.stache'),
        viewModel: can.Map.extend({
            init: function () {
                this.bind('hasMedia', function () {
                    debugger;
                });
            },
            hasMedia: false
        })
    });

Christopher Oliphant

@RALifeCoach

when I examine the element I can see that hasMedia has changed

Julian

@pYr0x

try

https://github.com/canjs/canjs/pull/2086/files#diff-1a99d9511d98825a6894148b69d7cd4dR187

better use the define plugin... getter and setter

for making sideeffects

Christopher Oliphant

@RALifeCoach

The first suggestion didn’t work.

    can.Component.extend({
        tag: 'feature-icon',
        template: can.view('/modules/components/feature-icon/feature-icon.stache'),
        viewModel: can.Map.extend({
            hasMedia: false
        }),
        events: {
            '{viewModel} hasMedia': function () {
                debugger;
            }
        }
    });

Julian

@pYr0x

and how do you change hasMedia?

please notice, that the viewModel is an external var

https://github.com/canjs/canjs/pull/2086/files#diff-1a99d9511d98825a6894148b69d7cd4dR91

Christopher Oliphant

@RALifeCoach

It is contained within another component and set by the parent when the data changes.

In debug, when I examine the component, I can see the value in the attribute has changed, but I don’t see the change within the component.

Where communities thrive

People

Repo info

Activity