Using Docker with Angularjs

[FamularoA]

Hello Jeff,

We are building a Single Page Application with Angularjs 1.4.7.

Have you some suggestions how we can to use your library with Angular.

I am thinking about the event propagation.

Regards, Alexander

[phfatmonkey]

Hi, @FamularoA. Our team is using AngularJS with wcDocker. Without knowing exactly what your use case is, it's hard to give you specifics, but we find it's fairly simple to integrate them. Each docker panel is it's own Angular directive.

As for events (I assume you mean wcDocker events), I has some issues of EVENT.INIT and EVENT.LOADED getting called before the directive was loaded, so I had to handle those events outside of individual directives and instead inside the module that instantiated wcDocker. Hope that makes sense. :)

Maybe we can put together some sample code soon.

[azeyad]

@phfatmonkey, is it possible that you provide a plunker sample for such integration with angularjs?

[ghost]

I am interested in this too. I am looking to use wcDocker with Polymer. I would be interested in working on a tiny example with someone if they are interested.

[azeyad]

I am not sure if this can help, but here is what I can imagine for an integration with AngularJS:

1- Inside the controller's template of any given state inside the APP, we can put a single HTML element that holds a directive for the wcdocker logic(let's name it: stateOneMainPanel)

2- Within the stateOneMainPanel directive's link function we can create the wcdocker instance and start registering every panel that can be shown within this state.

3- In the onCreate event handler for each panel, we can add a simple string for an html element that has nothing but the directive for our actual window along with the attributes and the parameters we need to pass down to our directive, after that we can use the $compile service to compile it as following:

link: function (scope, element, attrs) {
                wcdockerInst = new wcDocker(element, {
                    themePath: '/Themes'
                });             
        wcdockerInst .registerPanelType('somepanel', {
            faicon: 'wordpress',
            title: '1st panel'
            onCreate: function (myPanel) {
                var template =  "<my-directive on-action= doSomething() date-model=date />";
                compiled = $compile(template)(scope);
                myPanel.layout().addItem($(compiled));
                    }});
}

[phfatmonkey]

@gbaumgart @azeyad Thanks for looking into this. I didn't do the initial integration in our project and the programmers weren't in a good position to provide a plunker sample. I'm glad you got it working. :)