craigburke/angular-template-asset-pipeline

AngularJs Template module for the Asset Pipeline

angular-template-asset-pipeline's Issues

angular-template-asset-pipeline 2.0.1 does not appear to be working

I have a simple test grails app that uses angular-template-asset-pipeline in Grails 2.4.4. It works fine using the following versions in BuildConfig.groovy:

    compile ":asset-pipeline:1.9.9"
    compile ":angular-template-asset-pipeline:1.4.2"

But does not when using current versions:

    compile ":asset-pipeline:2.0.10"
    compile ":angular-template-asset-pipeline:2.0.1"

In 2.0.1, I do not see the JavaScript files generated by the plugin to cache the templates that should be included by a require_tree directive in my main JavaScript file.

Module name problem on windows

Hi,

I'm currently using :
asset-pipeline 1.9.9
angular-template-asset-pipeline 1.3.0

And I'm trying to update to versions :
asset-pipeline:2.1.1
angular-template-asset-pipeline:2.0.3

Unfortunately, the module names generated by the plugin in the .js file are not valid anymore. For example :

/assets/my-app/app-section/templates/hello.js Returns :

angular.module('myApp/appSection/templates/hello.tpl.htm').run(['$templateCache', function($templateCache) {
    $templateCache.put('hello.htm', '<h1>Hello World!</h1>');
}]);

With version 1.3.0, it got :

angular.module('my-app/app-section').run(['$templateCache', function($templateCache) {
    $templateCache.put('hello.htm', '<h1>Hello World!</h1>');
}]);

Perhaps the problem is coming from the fact that you use File.separator to split the path. File.separator on windows is '', but even on windows the path contains '/' ...

Line ends are broken when template html is minimized for <script> tag

Having following code:

<div>
   some content
</div>
<script type="text/ng-template" id="myTemplate.html">
   <div>
      test
   </div>
</script>

is compressed to:
<div>some content</div><script type="text/ng-template" id="myTemplate.html"> n<div> n test n n </div> n</script>

I found some similar issues of the past...
#7
#11

Module name in Windows

Module name isn't generating correctly (using whole path instead of the part relative to the asset root).

Display issue when using templates

removed content.

Strange issue during "Grails War" command

I'm using Grails 2.4.1 & the Asset Pipeline 1.9.7.

I don't THINK this is necessarily an issue with this plugin but i'm hoping for some help since it seems i'm stuck...

When building my application using 'run-app' or 'war' locally on my development PC everything seems to be fine and the angularjs templates are being included now just fine. However; when I attempt to build from Jenkins I get the following very strange lines of output related to the Angular Template Asset pipeline and the build fails:

Uninstalled plugin [angular-template-asset-pipeline]
| Error WAR packaging error: com.craigburke.angular.HtmlTemplateAssetFile
Build step 'Build With Grails' marked build as failure

Any thoughts on what could be causing this?

New properties to add all templates to a single module

Something like this:
config = [templateModuleName: 'foo']

This would add all templates to the foo module (regardless of the path and the value of the moduleNameBase property).

Template file not being added to the cache

Hi Craig, I left a comment on your blog about my implementation of the templates plugin not working with my templates, my comment was:

Hi Craig. I am currently attempting to implement a angular front end in to my grails applications following your example application and other examples that I have come across. I am using grails 2.4.3 and have tried using a number of versions of angular template and angular annotation plugin version but I have not been able to get it to work seamlessly.

The problem that I am having is with partial templates. I have followed all guidelines in the documentation regarding module names, template location and unique file names but whenever I try to reference a template in my directives I receive a 404 not found error for the template file I am referencing.

When I start the grails app the following is logged out which would suggest the templates are not being inserted into the cache:

Cache [:]
Cache [:]
Cache [:]

Also, when using the developer tools in chrome I notice that the asset directory does not contain the template directory I created to hold the template files.

Could you help?

The test application is on git hub at https://github.com/JCDubs/AngularGrails. It contains all of the files and the angular implementation for reference.

Line breaks are not formatted properly

When the TemplateProcessorUtil.formatHtml() is complete, a back slash is put on the next line.

As a result, I am getting 'Unterminated String Literal' in FireFox and 'Unexpected token ILLEGAL' in Chrome. Every template breaks.

create-edit.tpl.html:

<button class="btn btn-default" ng-click="onClick()" ng-disabled="isDisabled">
    <span class="fa fa-plus-circle"></span> Create {{resourceName}}
</button>

Is being generated as:

            angular.module('grails.directives.buttons').run(['$templateCache', function($templateCache) {
                $templateCache.put('create-button.html', '<button class="btn btn-default" ng-click="onClick()" ng-disabled="isDisabled">
 \
    <span class="fa fa-plus-circle"></span> Create {{resourceName}}
 \
</button>');
            }]);

Preserve comments in HTML compression

Need to make sure HTML comments are preserved (or at least provide the option) for the edge case that someone is applying a directive using a comment.

Mismatch in path vs cache name

When I try to use this plugin the resulting JS outputs a.getAssetUrl("templates/grParticipantTemplate.tpl.html") but (later in the same file) the templateCache is hydrated with a different key: a.put("/common/grParticipantTemplate.html",'<div...'). I'm assuming the code is trying to fetch the grParticipantTemplate.tmp.html file because of the cache mismatch. Obviously that file doesnt exist because the .tmp.html file is not copied into the assets directory.

My directive looks like this (directives/grParticipant.js):

(function(_) {
    'use strict';

    angular.module('member.common').directive('grParticipant', [
        'urlService',
        function(urlService) {
            return {
                controller: grParticipantController,
                restrict: 'E',
                scope: {
                    participant: '=',
                    coverageDate: '=?',
                    productType: '='
                },
                templateUrl:'templates/grParticipantTemplate.tpl.html'
            };
        }
    ]);
    grParticipantController.$inject = [
        '$scope',
        'enums',
        'enumService'
    ];
    ...

Directory structure:

module.js:

//= require_self
//= require_tree .
(function() {
    'use strict';

    angular.module('member.common', [
        'domain',
        'ui.bootstrap'
    ]);
})();

Config:

        grails.assets.angular = [
                moduleNameBase: 'member'
        ]
        grails.assets.minifyOptions = [
                languageMode: 'ES5',
                targetLanguage: 'ES5',
                optimizationLevel: 'SIMPLE'
        ]

Multi Module Support

ngmodule "app" -> with own templatecache
ngmodule "app.submodule1" -> with own templatecache
ngmodule "app.submodule2" -> with own templatecache

CRLF not supported in templates

in TemplateProcessorUtil.formatHtml() are only escaped "/n", if we have "/r/n", all will be broken.

Camel Case

When naming directories using camel case, the toCamelCase is transforming to lower case and breaking module template caches via case dependent pathing. As a case of irony, the toCamelCase actually destroys camel case. This is problematic due to the usage module imports through out the site still using the camel case. A temporary workaround it to lowercase or add - to all module directories, but this creates a disconnect with the actual module names on the other imports and the directory in which they live.

configOptions take no effect for Grails 3 in build.gradle

I have to use 2.1.0, since the latest Version is compiled with Java 8.

I want to set includePathInName to true, since its not default in that version (build.gradle):

assets {
    configOptions = [
        angular : [
            templateFolder: 'templates',
            moduleNameBase: '',
            compressHtml: true,
            preserveHtmlComments: false,
            includePathInName: true
        ]
    ]
}

No matter what I change here, it will change nothing. It always loads the template without path

I18n

Hello, I use gsp for templating and internationalization of angularjs views and want to move away from getting templates from server and use html templates without every time rendering.

Your plugin suggests, as I see, using of templateCache for caching templates, it's cool and I used this approach a lot, but I would like to know the way to make internationalization.

For now I see several solutions:

• Use grails controller for rendering of gsp and use rendered html from with templateCache in angular.
• Make pre-rending of gsp files and put result (html files into assets folder) for every language
• same as previous, but use something like angular-translate

So, could you say, what's the most correct solution in your opinion?

Please, ignore my message, if this isn't a good place to ask.

Thanks

Is it possbile to have multiple template folders?

We want to have a project structure like:

• assets/javascripts/
  • featureA
    • templateA.html
    • controllerA.js
  • featureB
    • templateB.html
    • controllerB.js

Plugin poping errors at runtime

WAR packaging error: No signature of method: static asset.pipeline.AssetHelper.getAssetPathsByPlugin() is applicable for argument types: () values: []

Here is the error that comes out when I build my server after adding the line runtime ":angular-template-asset-pipeline:2.0.3" to my BuildConfig.groovy file

File path tokenize fails with the use of GenericAssetFile

@craigburke adding windows related issues here which can be discussed separately and closed if not needed.

I tested using GenericAssetFile

public String getName() {
    path.split("/")[-1]
}

but 6 tests failed, one of them is

Condition not satisfied:

TemplateProcessorUtil.getTemplateName(assetFile, 'templates', withPath) == result
                      |               |                       |         |  |
                      |               |                       true      |  \foo-bar1\foo-bar2\foo-bar3\foo-bar4\foobar.html
                      |               |                                 false
                      |               |                                 36 differences (57% similarity)
                      |               |                                 \\foo-bar1\\foo-bar2\\foo-bar3\\foo-bar4\\foo(-)bar(1\\foo-bar2\\foo-bar3\\foo-bar4\\foobar).html
                      |               |                                 \\foo-bar1\\foo-bar2\\foo-bar3\\foo-bar4\\foo(-)bar(--~---------~---------~---------~------).html
                      |               asset.pipeline.GenericAssetFile@11427db
                      \foo-bar1\foo-bar2\foo-bar3\foo-bar4\foo-bar1\foo-bar2\foo-bar3\foo-bar4\foobar.html

    at com.craigburke.angular.TemplateProcessorUtilUnitSpec.covert path: #path to template name #withPathDescription(TemplateProcessorUtilSpec.groovy:46)

Compress content inside a script tag with type text/ng-template

<script type="text/ng-template" id="ng-table/filters/codigoFilter.html">

<p>
content...
</p>

</script>

the htmlcompressor will only compress it is the type of tag to text/x-jquery-tmpl according to documentation.

"Any content within <pre>, <textarea>, <script> and <style> tags will be preserved and remain untouched (with the exception of <script type="text/x-jquery-tmpl"> tags which are compressed as HTML). Inline javascript inside tags (onclick="test()") will be preserved as well. You can wrap any part of the page in <!-- {{{ -->...<!-- }}} --> comments to preserve it, or provide a set of your own preservation rules (out of the box <?php...?>, <%...%>, and <!--#... --> are also supported)"

Doesn't seem to be adding anything to the $templateCache

There's a lot of information out on this stack overflow question - http://stackoverflow.com/questions/25390307/how-do-i-reference-a-static-html-rsource-using-the-grails-asset-plugin

Any feedback would be greatly appreciated.

Thanks!

Error 500 on generated template js files

in app.js

//= require_self(1)
//= require_tree /app/templates

i get an exception for the templates loaded

template is in the path
sampleapp/assets/app/templates/operations/test.tpl.htm

below is the exception thrown

URI /sampleapp/assets/app/templates/operations/test.js
Class java.lang.NoSuchMethodError
Message asset.pipeline.AssetPipelineConfigHolder.getConfig()Ljava/util/Map;

----------------------------------------------------------------------------------------------------------------

  Line | Method
->>  449 | executeChain     in org.apache.shiro.web.servlet.AbstractShiroFilter
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
|    365 | call             in org.apache.shiro.web.servlet.AbstractShiroFilter$1
|     90 | doCall . . . . . in org.apache.shiro.subject.support.SubjectCallable
|     83 | call             in     ''
|    383 | execute . . . .  in org.apache.shiro.subject.support.DelegatingSubject
|    362 | doFilterInternal in org.apache.shiro.web.servlet.AbstractShiroFilter
|    125 | doFilter . . . . in org.apache.shiro.web.servlet.OncePerRequestFilter
|   1110 | runWorker        in java.util.concurrent.ThreadPoolExecutor
|    603 | run . . . . . .  in java.util.concurrent.ThreadPoolExecutor$Worker
^    722 | run              in java.lang.Thread

Caused by NoSuchMethodError: asset.pipeline.AssetPipelineConfigHolder.getConfig()Ljava/util/Map;
->>   16 | process          in com.craigburke.angular.HTMLTemplateProcessor
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
|     87 | processedStream  in asset.pipeline.AbstractAssetFile
|    291 | fileContents . . in asset.pipeline.DirectiveProcessor
|     65 | serveUncompiledAsset in asset.pipeline.AssetPipeline
|     98 | doFilter . . . . in AssetPipelineFilter.groovy
|    449 | executeChain     in org.apache.shiro.web.servlet.AbstractShiroFilter
|    365 | call . . . . . . in org.apache.shiro.web.servlet.AbstractShiroFilter$1
|     90 | doCall           in org.apache.shiro.subject.support.SubjectCallable
|     83 | call . . . . . . in     ''
|    383 | execute          in org.apache.shiro.subject.support.DelegatingSubject
|    362 | doFilterInternal in org.apache.shiro.web.servlet.AbstractShiroFilter
|    125 | doFilter         in org.apache.shiro.web.servlet.OncePerRequestFilter
|   1110 | runWorker . . .  in java.util.concurrent.ThreadPoolExecutor
|    603 | run              in java.util.concurrent.ThreadPoolExecutor$Worker
^    722 | run . . . . . .  in java.lang.Thread

what am i doing wrong?

Allow for module name default

Working with plugin for the first time. Does not seem to be discovering the module name of my app declared above. Tried it with both unchained and chained method calls styles. Am I missing something?

Attached is a screengrab showing the ".unminified." output after the JS was processed.

assets.configOptions.angular is not found when application is run in dev environment (no war))

I had to redundantly place the plugin configuration params (templateFolder, templateModuleName) in application.groovy and build.gradle, so that they get applied when running in dev environment without war deployment and as well while building a war. In application.groovy I had to unwrap the angular specific configurations from configOptions. This is a bug that should be fixed. (HTMLTemplateProcessor)

Wrong module name if Grails 3 project name is written with snake case

If I create the following project my_todo by doing:
grails create-app --profile angular -features hibernate,json-views my_todo
and running:
grails run-app

When I browse to http://localhost:8080/, I get the following error:
angular.js?compile=false:68 Uncaught Error: [$injector:nomod] Module 'myTodo.index' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. http://errors.angularjs.org/1.5.7/$injector/nomod?p0=myTodo.index(anonymous function) @ angular.js?compile=false:68(anonymous function) @ angular.js?compile=false:2075ensure @ angular.js?compile=false:1999(anonymous function) @ index.js?compile=false:1 angular.js?compile=false:11881 GET http://localhost:8080/my_todo/index/index.html 404 (Not Found)(anonymous function) @ angular.js?compile=false:11881sendReq @ angular.js?compile=false:11642serverRequest @ angular.js?compile=false:11352processQueue @ angular.js?compile=false:16170(anonymous function) @ angular.js?compile=false:16186$digest @ angular.js?compile=false:17257$apply @ angular.js?compile=false:17552bootstrapApply @ angular.js?compile=false:1754doBootstrap @ angular.js?compile=false:1752angularInit @ angular.js?compile=false:1657(anonymous function) @ angular.js?compile=false:31468trigger @ angular.js?compile=false:3198defaultHandlerWrapper @ angular.js?compile=false:3488eventHandler @ angular.js?compile=false:3476

If I create an other project todo by doing:
grails create-app --profile angular -features hibernate,json-views todo
and running:
grails run-app

Everything is fine.

The problem is coming from how /assets/my_todo/index/templates/index.js?compile=false is built.
It points to angular.module('myTodo.index') that does not exists. I guess it should be my_todo.index

• Operating System: Windows 7 64 bits
• Grails Version: grails-3.2.0.M1
• JDK Version: jdk1.8.0_92

Templates do not work in Grails 3 Jar

Create a new Grails 3 (latest snapshot, not RC1) sample project using Angular.js templates. Then run ./gradlew assemble to build a runnable Jar. This Jar can be run in place java -jar build/libs/sample-0.1.jar and everything works, but if you copy the Jar to another location on your hard-drive, it will fail to run just for pages that use these Angular.js templates.

There was a very similar Grails 3 bug for GSPs recently: https://jira.grails.org/browse/GRAILS-12077

Release 2.4.0

Hi Craig,

I was after a feature in version 2.4.0. But realised that it has not been published. I am wondering if you plans to release version 2.4.0 soon?

temi