tillre / cores-ng Goto Github PK

First off - thanks so much for this contribution - I am wanting to use hapi with angular and couchdb - so couldn't believe it when I stumbled across cores-ng!

I've got it all working locally, just wanted to mention that my local test showed 3 errors, i.e.

okapi:cores-ng rob$ grunt test
Running "db:create" task

Running "server:test" task
loading models
started server on port: 3333

Running "karma:run" (karma) task
INFO [karma]: Karma server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 28.0 (Mac)]: Connected on socket id FXe4kJqJ4vnonrL3OuZD
Chrome 28.0 (Mac) cores crValidation should set error FAILED
        TypeError: Object #<Object> has no method '$on'
            at /Users/rob/dev/cores-ng/lib/services/validation.js:87:13
            at /Users/rob/dev/cores-ng/test/test.js:83:24
            at Context.run (/Users/rob/dev/cores-ng/test/test.js:54:20)
Chrome 28.0 (Mac) cores crValidation should remove error FAILED
        TypeError: Object #<Object> has no method '$on'
            at /Users/rob/dev/cores-ng/lib/services/validation.js:87:13
            at /Users/rob/dev/cores-ng/test/test.js:93:24
            at Context.run (/Users/rob/dev/cores-ng/test/test.js:54:20)
Chrome 28.0 (Mac) cores crValidation should add constraint FAILED
        Error: timeout of 2000ms exceeded
Chrome 28.0 (Mac): Executed 65 of 65 (3 FAILED) (3.483 secs / NaN secs)

Not sure how significant these are, but thought you might want to know. Wish I could contribute a PR, but I am very much a beginner here :)

Not an existing issue, but if you upgrade to a more recent version of grunt-angular-templates, be aware that they have dropped support for custom options base and prepend (in favour of standard grunt cwd).

The new prefix option doesn't replace prepend, because you end up with a forward slash before the filename ($templateCache.put('cr-/model-form.html',...), so you can use a custom url function to append the cr- prefix instead, e.g.

...
ngtemplates: {
  cores: {
    src: '*.html',
    cwd: 'templates',
    dest: 'templates/templates.js',
    options: {
      module: 'cores.templates',
      url: function(url) {
        return 'cr-' + url;
      }
    }
  }
},
...

I think I've come across a bug to do with how resources are loaded. I first came across it in my own project when testing in Safari, but I can also reproduce it in the cores-ng project:

Basically, when you refresh a page (server), sometimes you get an error of the type:

Error: Resource with type not found: Bar

You can see this when refreshing the following page in your project:

http://localhost:3333/#/bars

The problem is more pronounced inSafari, i.e. the page will often load fine the first time, but each subsequent page refresh produces this error and no model is available use in the page.

The error is not produced if the page is accessed client-side - it's only when a server-side refresh is in initiated. The problem happens occasionally in Chrome and Firefox, leading me to believe it is related to the browser engine and the order in which some functions run, i.e. angular promises take care of things client-side, but the same order is not being observed on server-side refreshes.

My limited troubleshooting led me to the resource.js service and the get method:

Resources.prototype.get = function(type) {
   var r = this._resources[type];
      if (!r) {
         throw new Error('Resource with type not found: ' + type);
      }
   return r;
};

Essentially, r is sometimes undefined when the route is loaded via server-side refresh.

I appreciate angular apps generally run client-side, so this problem won't surface provided the user never refreshes, but I think it's important every page can load equally well from client and server (performance differences notwithstanding).

Have you come across this and have any ideas to fix? Ive tried a few things, but am at the limits of my knowledge :)

Hi Till,

Currently, the 'has-error' class is applied to fields when the form loads using the hasErrors() function. I would prefer to have the error class set only when the field is dirty.

I have tried numerous things, including extending the ng-class expression in the templates, e.g. with the String template:

<div class="form-group" ng-class="{ 'has-error': hasErrors() && modelForm.{{name}}.$dirty }">
<input class="form-control" type="text" ng-model="model" name="{{name}}">

... or something to that effect. I can't seem to get it to work, and naturally would prefer it in the validation.js service. Any ideas how to implement this?

Hope this makes some sense!

Cheers, Rob

Hi Till,

I thought you might be interested in an example application I'm building based on your cores libraries:

angular-hapi-couch

Screenshots are here:

https://github.com/iotaweb/angular-hapi-couch/wiki/Screens

As you can see, it is an attempt to use your library for a simple CRUD application.
Hopefully having someone developing a more realistic application will give you useful feedback on what your core libraries might need to support :)

Regards, Rob