Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Commit

Permalink
chore(ngSanitize): extract $sanitize, ngBindHtml, linkyFilter into a …
Browse files Browse the repository at this point in the history
…module

Create build for other modules as well (ngResource, ngCookies):
- wrap into a function
- add license
- add version

Breaks `$sanitize` service, `ngBindHtml` directive and `linky` filter were moved to the `ngSanitize` module. Apps that depend on any of these will need to load `angular-sanitize.js` and include `ngSanitize` in their dependency list: `var myApp = angular.module('myApp', ['ngSanitize']);`
  • Loading branch information
vojtajina committed Apr 11, 2012
1 parent e1743cc commit 5bcd719
Show file tree
Hide file tree
Showing 20 changed files with 301 additions and 244 deletions.
24 changes: 20 additions & 4 deletions Rakefile
Original file line number Diff line number Diff line change
Expand Up @@ -82,15 +82,23 @@ task :compile => [:init, :compile_scenario, :compile_jstd_scenario_adapter] do
'src/loader.js',
'src/loader.suffix'])

FileUtils.cp 'src/ngMock/angular-mocks.js', path_to('angular-mocks.js')
FileUtils.cp 'src/ngResource/resource.js', path_to('angular-resource.js')
FileUtils.cp 'src/ngCookies/cookies.js', path_to('angular-cookies.js')

concat_module('sanitize', [
'src/ngSanitize/sanitize.js',
'src/ngSanitize/directive/ngBindHtml.js',
'src/ngSanitize/filter/linky.js'])

concat_module('resource', ['src/ngResource/resource.js'])
concat_module('cookies', ['src/ngCookies/cookies.js'])


FileUtils.cp 'src/ngMock/angular-mocks.js', path_to('angular-mocks.js')

closure_compile('angular.js')
closure_compile('angular-cookies.js')
closure_compile('angular-loader.js')
closure_compile('angular-resource.js')
closure_compile('angular-sanitize.js')

end

Expand Down Expand Up @@ -121,6 +129,8 @@ task :package => [:clean, :compile, :docs] do
path_to('angular-cookies.min.js'),
path_to('angular-resource.js'),
path_to('angular-resource.min.js'),
path_to('angular-sanitize.js'),
path_to('angular-sanitize.min.js'),
path_to('angular-scenario.js'),
path_to('jstd-scenario-adapter.js'),
path_to('jstd-scenario-adapter-config.js'),
Expand All @@ -147,7 +157,8 @@ task :package => [:clean, :compile, :docs] do
rewrite_file(src) do |content|
content.sub!('angular.js', "angular-#{NG_VERSION.full}.js").
sub!('angular-resource.js', "angular-resource-#{NG_VERSION.full}.js").
sub!('angular-cookies.js', "angular-cookies-#{NG_VERSION.full}.js")
sub!('angular-cookies.js', "angular-cookies-#{NG_VERSION.full}.js").
sub!('angular-sanitize.js', "angular-sanitize-#{NG_VERSION.full}.js")
end
end

Expand Down Expand Up @@ -290,6 +301,11 @@ def concat_file(filename, deps, footer='')
end


def concat_module(name, files)
concat_file('angular-' + name + '.js', ['src/module.prefix'] + files + ['src/module.suffix'])
end


def rewrite_file(filename)
File.open(filename, File::RDWR) do |f|
content = f.read
Expand Down
15 changes: 13 additions & 2 deletions angularFiles.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,6 @@ angularFiles = {
'src/ng/route.js',
'src/ng/routeParams.js',
'src/ng/rootScope.js',
'src/ng/sanitize.js',
'src/ng/sniffer.js',
'src/ng/window.js',
'src/ng/http.js',
Expand Down Expand Up @@ -65,6 +64,9 @@ angularFiles = {
'angularSrcModules': [
'src/ngCookies/cookies.js',
'src/ngResource/resource.js',
'src/ngSanitize/sanitize.js',
'src/ngSanitize/directive/ngBindHtml.js',
'src/ngSanitize/filter/linky.js',
'src/ngMock/angular-mocks.js'
],

Expand Down Expand Up @@ -98,6 +100,9 @@ angularFiles = {
'test/ng/filter/*.js',
'test/ngCookies/*.js',
'test/ngResource/*.js',
'test/ngSanitize/*.js',
'test/ngSanitize/directive/*.js',
'test/ngSanitize/filter/*.js',
'test/ngMock/*.js'
],

Expand Down Expand Up @@ -136,10 +141,16 @@ angularFiles = {
'src/ngMock/angular-mocks.js',
'src/ngCookies/cookies.js',
'src/ngResource/resource.js',
'src/ngSanitize/sanitize.js',
'src/ngSanitize/directive/ngBindHtml.js',
'src/ngSanitize/filter/linky.js',
'test/matchers.js',
'test/ngMock/*.js',
'test/ngCookies/*.js',
'test/ngResource/*.js'
'test/ngResource/*.js',
'test/ngSanitize/*.js',
'test/ngSanitize/directive/*.js',
'test/ngSanitize/filter/*.js'
],

'jstdPerf': [
Expand Down
2 changes: 1 addition & 1 deletion docs/content/cookbook/deeplinking.ngdoc
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ The two partials are defined in the following URLs:
<doc:example module="deepLinking">
<doc:source jsfiddle="false">
<script>
angular.module('deepLinking', [])
angular.module('deepLinking', ['ngSanitize'])
.config(function($routeProvider) {
$routeProvider.when("/welcome", {template:'./examples/welcome.html', controller:WelcomeCntl});
$routeProvider.when("/settings", {template:'./examples/settings.html', controller:SettingsCntl});
Expand Down
3 changes: 2 additions & 1 deletion docs/src/templates/docs.js
Original file line number Diff line number Diff line change
Expand Up @@ -146,7 +146,8 @@ function TutorialInstructionsCtrl($scope, $cookieStore) {
};
}

angular.module('ngdocs', ['ngdocs.directives', 'ngResource', 'ngCookies'], function($locationProvider, $filterProvider, $compileProvider) {
angular.module('ngdocs', ['ngdocs.directives', 'ngResource', 'ngCookies', 'ngSanitize'],
function($locationProvider, $filterProvider, $compileProvider) {
$locationProvider.html5Mode(true).hashPrefix('!');

$filterProvider.register('title', function(){
Expand Down
1 change: 1 addition & 0 deletions docs/src/templates/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@
addTag('script', {src: path('angular.js')}, sync);
addTag('script', {src: path('angular-resource.js') }, sync);
addTag('script', {src: path('angular-cookies.js') }, sync);
addTag('script', {src: path('angular-sanitize.js') }, sync);
addTag('script', {src: 'docs-combined.js'}, sync);
addTag('script', {src: 'docs-keywords.js'}, sync);

Expand Down
2 changes: 0 additions & 2 deletions src/AngularPublic.js
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,6 @@ function publishExternalAPI(angular){
style: styleDirective,
option: optionDirective,
ngBind: ngBindDirective,
ngBindHtml: ngBindHtmlDirective,
ngBindHtmlUnsafe: ngBindHtmlUnsafeDirective,
ngBindTemplate: ngBindTemplateDirective,
ngClass: ngClassDirective,
Expand Down Expand Up @@ -123,7 +122,6 @@ function publishExternalAPI(angular){
$routeParams: $RouteParamsProvider,
$rootScope: $RootScopeProvider,
$q: $QProvider,
$sanitize: $SanitizeProvider,
$sniffer: $SnifferProvider,
$templateCache: $TemplateCacheProvider,
$window: $WindowProvider
Expand Down
6 changes: 6 additions & 0 deletions src/module.prefix
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
/**
* @license AngularJS v"NG_VERSION_FULL"
* (c) 2010-2012 AngularJS http://angularjs.org
* License: MIT
*/
(function(angular) {
2 changes: 2 additions & 0 deletions src/module.suffix
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@

})(window.angular);
73 changes: 25 additions & 48 deletions src/ng/directive/ngBind.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,54 +55,6 @@ var ngBindDirective = ngDirective(function(scope, element, attr) {
});


/**
* @ngdoc directive
* @name angular.module.ng.$compileProvider.directive.ngBindHtmlUnsafe
*
* @description
* Creates a binding that will innerHTML the result of evaluating the `expression` into the current
* element. *The innerHTML-ed content will not be sanitized!* You should use this directive only if
* {@link angular.module.ng.$compileProvider.directive.ngBindHtml ngBindHtml} directive is too
* restrictive and when you absolutely trust the source of the content you are binding to.
*
* See {@link angular.module.ng.$sanitize $sanitize} docs for examples.
*
* @element ANY
* @param {expression} ngBindHtmlUnsafe {@link guide/dev_guide.expressions Expression} to evaluate.
*/
var ngBindHtmlUnsafeDirective = ngDirective(function(scope, element, attr) {
element.addClass('ng-binding').data('$binding', attr.ngBindHtmlUnsafe);
scope.$watch(attr.ngBindHtmlUnsafe, function(value) {
element.html(value || '');
});
});


/**
* @ngdoc directive
* @name angular.module.ng.$compileProvider.directive.ngBindHtml
*
* @description
* Creates a binding that will sanitize the result of evaluating the `expression` with the
* {@link angular.module.ng.$sanitize $sanitize} service and innerHTML the result into the current
* element.
*
* See {@link angular.module.ng.$sanitize $sanitize} docs for examples.
*
* @element ANY
* @param {expression} ngBindHtml {@link guide/dev_guide.expressions Expression} to evaluate.
*/
var ngBindHtmlDirective = ['$sanitize', function($sanitize) {
return function(scope, element, attr) {
element.addClass('ng-binding').data('$binding', attr.ngBindHtml);
scope.$watch(attr.ngBindHtml, function(value) {
value = $sanitize(value);
element.html(value || '');
});
}
}];


/**
* @ngdoc directive
* @name angular.module.ng.$compileProvider.directive.ngBindTemplate
Expand Down Expand Up @@ -160,3 +112,28 @@ var ngBindTemplateDirective = ['$interpolate', function($interpolate) {
});
}
}];


/**
* @ngdoc directive
* @name angular.module.ng.$compileProvider.directive.ngBindHtmlUnsafe
*
* @description
* Creates a binding that will innerHTML the result of evaluating the `expression` into the current
* element. *The innerHTML-ed content will not be sanitized!* You should use this directive only if
* {@link angular.module.ng.$compileProvider.directive.ngBindHtml ngBindHtml} directive is too
* restrictive and when you absolutely trust the source of the content you are binding to.
*
* See {@link angular.module.ng.$sanitize $sanitize} docs for examples.
*
* @element ANY
* @param {expression} ngBindHtmlUnsafe {@link guide/dev_guide.expressions Expression} to evaluate.
*/
var ngBindHtmlUnsafeDirective = [function() {
return function(scope, element, attr) {
element.addClass('ng-binding').data('$binding', attr.ngBindHtmlUnsafe);
scope.$watch(attr.ngBindHtmlUnsafe, function(value) {
element.html(value || '');
});
};
}];
1 change: 0 additions & 1 deletion src/ng/filter.js
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,6 @@ function $FilterProvider($provide) {
register('filter', filterFilter);
register('json', jsonFilter);
register('limitTo', limitToFilter);
register('linky', linkyFilter);
register('lowercase', lowercaseFilter);
register('number', numberFilter);
register('orderBy', orderByFilter);
Expand Down
107 changes: 0 additions & 107 deletions src/ng/filter/filters.js
Original file line number Diff line number Diff line change
Expand Up @@ -439,110 +439,3 @@ var lowercaseFilter = valueFn(lowercase);
* @see angular.uppercase
*/
var uppercaseFilter = valueFn(uppercase);


/**
* @ngdoc filter
* @name angular.module.ng.$filter.linky
* @function
*
* @description
* Finds links in text input and turns them into html links. Supports http/https/ftp/mailto and
* plain email address links.
*
* @param {string} text Input text.
* @returns {string} Html-linkified text.
*
* @example
<doc:example>
<doc:source>
<script>
function Ctrl($scope) {
$scope.snippet =
'Pretty text with some links:\n'+
'http://angularjs.org/,\n'+
'mailto:[email protected],\n'+
'[email protected],\n'+
'and one more: ftp://127.0.0.1/.';
}
</script>
<div ng-controller="Ctrl">
Snippet: <textarea ng-model="snippet" cols="60" rows="3"></textarea>
<table>
<tr>
<td>Filter</td>
<td>Source</td>
<td>Rendered</td>
</tr>
<tr id="linky-filter">
<td>linky filter</td>
<td>
<pre>&lt;div ng-bind-html="snippet | linky"&gt;<br>&lt;/div&gt;</pre>
</td>
<td>
<div ng-bind-html="snippet | linky"></div>
</td>
</tr>
<tr id="escaped-html">
<td>no filter</td>
<td><pre>&lt;div ng-bind="snippet"&gt;<br>&lt;/div&gt;</pre></td>
<td><div ng-bind="snippet"></div></td>
</tr>
</table>
</doc:source>
<doc:scenario>
it('should linkify the snippet with urls', function() {
expect(using('#linky-filter').binding('snippet | linky')).
toBe('Pretty text with some links:&#10;' +
'<a href="http://angularjs.org/">http://angularjs.org/</a>,&#10;' +
'<a href="mailto:[email protected]">[email protected]</a>,&#10;' +
'<a href="mailto:[email protected]">[email protected]</a>,&#10;' +
'and one more: <a href="ftp://127.0.0.1/">ftp://127.0.0.1/</a>.');
});
it ('should not linkify snippet without the linky filter', function() {
expect(using('#escaped-html').binding('snippet')).
toBe("Pretty text with some links:\n" +
"http://angularjs.org/,\n" +
"mailto:[email protected],\n" +
"[email protected],\n" +
"and one more: ftp://127.0.0.1/.");
});
it('should update', function() {
input('snippet').enter('new http://link.');
expect(using('#linky-filter').binding('snippet | linky')).
toBe('new <a href="http://link">http://link</a>.');
expect(using('#escaped-html').binding('snippet')).toBe('new http://link.');
});
</doc:scenario>
</doc:example>
*/
function linkyFilter() {
var LINKY_URL_REGEXP = /((ftp|https?):\/\/|(mailto:)?[A-Za-z0-9._%+-]+@)\S*[^\s\.\;\,\(\)\{\}\<\>]/,
MAILTO_REGEXP = /^mailto:/;

return function(text) {
if (!text) return text;
var match;
var raw = text;
var html = [];
var writer = htmlSanitizeWriter(html);
var url;
var i;
while ((match = raw.match(LINKY_URL_REGEXP))) {
// We can not end in these as they are sometimes found at the end of the sentence
url = match[0];
// if we did not match ftp/http/mailto then assume mailto
if (match[2] == match[3]) url = 'mailto:' + url;
i = match.index;
writer.chars(raw.substr(0, i));
writer.start('a', {href:url});
writer.chars(match[0].replace(MAILTO_REGEXP, ''));
writer.end('a');
raw = raw.substring(i + match[0].length);
}
writer.chars(raw);
return html.join('');
};
}
26 changes: 26 additions & 0 deletions src/ngSanitize/directive/ngBindHtml.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@



/**
* @ngdoc directive
* @name angular.module.ngSanitize.directive.ngBindHtml
*
* @description
* Creates a binding that will sanitize the result of evaluating the `expression` with the
* {@link angular.module.ng.$sanitize $sanitize} service and innerHTML the result into the current
* element.
*
* See {@link angular.module.ng.$sanitize $sanitize} docs for examples.
*
* @element ANY
* @param {expression} ngBindHtml {@link guide/dev_guide.expressions Expression} to evaluate.
*/
angular.module('ngSanitize').directive('ngBindHtml', ['$sanitize', function($sanitize) {
return function(scope, element, attr) {
element.addClass('ng-binding').data('$binding', attr.ngBindHtml);
scope.$watch(attr.ngBindHtml, function(value) {
value = $sanitize(value);
element.html(value || '');
});
};
}]);
Loading

0 comments on commit 5bcd719

Please sign in to comment.