Merge pull request #52 from pc035860/support-prefixed-directives

Support prefixed directives

Author: pc035860

Gruntfile.js

@@ -52,8 +52,8 @@ module.exports = function(grunt) {
                 '}));'
       },
       build: {
-        src: '<%= dir.src %>/<%= pkg.name %>.js',
-        dest: '<%= dir.build %>/<%= pkg.name %>.js'
+        src: '<%= ngAnnotate.build.dest %>',
+        dest: '<%= ngAnnotate.build.dest %>'
       }
     },
     uglify: {
@@ -63,7 +63,7 @@ module.exports = function(grunt) {
         banner: '<%= meta.banner %>\n'
       },
       build: {
-        src: '<%= dir.build %>/<%= pkg.name %>.js',
+        src: '<%= concat.build.dest %>',
         dest: '<%= dir.build %>/<%= pkg.name %>.min.js'
       }
     },
@@ -93,6 +93,12 @@ module.exports = function(grunt) {
           keepalive: true
         }
       }
+    },
+    ngAnnotate: {
+      build: {
+        src: '<%= dir.src %>/<%= pkg.name %>.js',
+        dest: '<%= dir.build %>/<%= pkg.name %>.js'
+      }
     }
   });
 
@@ -102,10 +108,11 @@ module.exports = function(grunt) {
   grunt.loadNpmTasks('grunt-contrib-connect');
   grunt.loadNpmTasks('grunt-contrib-concat');
   grunt.loadNpmTasks('grunt-contrib-copy');
+  grunt.loadNpmTasks('grunt-ng-annotate');
 
   grunt.registerTask('default', [
     'jshint:beforeuglify',
-    'concat:build', 'uglify:build', 'copy:build'
+    'ngAnnotate:build', 'concat:build', 'uglify:build', 'copy:build'
   ]);
 };
 

README.md

@@ -20,13 +20,13 @@ Follow the instructions [here](http://softwaremaniacs.org/soft/highlight/en/down
 Using a prebuilt version of highlight.js hosted at Yandex here.
 ```html
 <!-- personal preference: github theme -->
-<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.3/styles/github.min.css">
-<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.3/highlight.min.js"></script>
+<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/styles/github.min.css">
+<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/highlight.min.js"></script>
 ```
 
 Include `angular-highlightjs` module script with AngularJS script on your page.
 ```html
-<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
+<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
 <script src="http://pc035860.github.io/angular-highlightjs/angular-highlightjs.min.js"></script>
 ```
 
@@ -70,7 +70,7 @@ myApp.config(function (hljsServiceProvider) {
 ### hljs
 This is a required directive. Without any other supportive directives, it provides basic inline highlight function. For better understanding, some notes about using it are specified in the live example page.
 
-The directive automatically escapes its content HTML entities by default. Can be turned off with explicitly configuration `escape="{expression evaled to false}"` or `no-escape`, and **they're only applicable for "just-`hljs`" usage**.
+The directive automatically escapes its content HTML entities by default. Can be turned off with explicitly configuration `hljs-escape="{expression evaled to false}"` or `hljs-no-escape`, and **they're only applicable for "just-`hljs`" usage**.
 
 [Live example](http://pc035860.github.io/angular-highlightjs/example/#/hljs)
 
@@ -82,16 +82,16 @@ The directive automatically escapes its content HTML entities by default. Can be
 <!-- hljs end -->
 
 <!-- Will get the same result as above -->
-<div hljs no-escape>
+<div hljs hljs-no-escape>
 &lt;!-- put your codes here --&gt;
 </div>
 ```
 
-#### source (optional)
+#### hljs-source (optional)
 Type: `expression`
 Default: `undefined`
 
-If `source` is presented, the `hljs` directive will evaluate the expression and highlight the result string. This is pretty useful for dynamically changed content.
+If `hljs-source` is presented, the `hljs` directive will evaluate the expression and highlight the result string. This is pretty useful for dynamically changed content.
 
 [Live example](http://pc035860.github.io/angular-highlightjs/example/#/hljs-source)
 
@@ -105,17 +105,17 @@ Dynamically changed content.
 <div ng-show="subSource">
   <br>
   <!-- hljs connected with $scope.subSource -->
-  <div hljs source="subSource"></div>
+  <div hljs hljs-source="subSource"></div>
 </div>
 ```
 
 The expression. Beware of single-quotes.
 ```html
 <!-- hljs connected with independent string -->
-<div hljs source="'<html><head><body></body></head></html>'"></div>
+<div hljs hljs-source="'<html><head><body></body></head></html>'"></div>
 ```
 
-#### include (optional)
+#### hljs-include (optional)
 Type: `expression`
 Default: `undefined`
 
@@ -126,16 +126,16 @@ Works as the built-in `ng-include` directive, utilizes `$templateCache` and `$ht
 From `text/ng-template` script `localOne`. Beware of single-quotes in the expression.
 ```html
 <!-- load text/ng-template named 'localOne' -->
-<div hljs include="'localOne'"></div>
+<div hljs hljs-include="'localOne'"></div>
 ```
 
 From `partials/lang-perl` XHR. Again, beware of single-quotes.
 ```html
 <!-- load "partials/lang-perl" -->
-<div hljs include="'partials/lang-perl'"></div>
+<div hljs hljs-include="'partials/lang-perl'"></div>
 ```
 
-#### language (optional)
+#### hljs-language (optional)
 Type: `string`
 Default: `undefined`
 
@@ -145,25 +145,25 @@ Tells the highlight.js which language syntax should be used to highlight the cod
 
 ```html
 <!-- PHP codes highlight with language detection -->
-<div hljs include="'partials/lang-php'"></div>
+<div hljs hljs-include="'partials/lang-php'"></div>
 
 <!-- PHP codes highlight with specified language: perl -->
-<div hljs include="'partials/lang-php'" language="perl"></div>
+<div hljs hljs-include="'partials/lang-php'" hljs-language="perl"></div>
 ```
 
 
-#### compile (optional)
+#### hljs-interpolate (optional)
 Type: `expression`
 Default: `undefined`
 
-Compiles the highlighted code and links it with current scope. The expression will be evaluated after every actual highlight action.
+Interpolates the highlighted code and links it with current scope.
 
-The attribute works with all methhods of highlighting: `hljs`, `hljs source` and `hljs include`.
+The attribute works with all methods of highlighting: `hljs`, `hljs-source` and `hljs-include`.
 
 [Live example](http://pc035860.github.io/angular-highlightjs/example/#/hljs-compile)
 
 ```html
-<div hljs include="'compile-me'" compile="true"></div>
+<div hljs hljs-include="'interpolate-me'" hljs-interpolate="true"></div>
 ```
 
 ### Happy highlighting!!!