Skip to content

Separated components into files #24

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 27 additions & 4 deletions Gruntfile.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,14 @@
'use strict';

module.exports = function(grunt) {
var npmTasks = [
'grunt-contrib-uglify',
'grunt-karma',
'grunt-ng-annotate'
];

grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),

karma: {
unit: {
options: {
Expand All @@ -27,7 +32,23 @@ module.exports = function(grunt) {
singleRun: true
}
},

ngAnnotate: {
options: {
singleQuotes: true
},
angularCss: {
files: {
'angular-css.js': [
'src/prefix.js',
'src/$css-provider.js',
'src/$cssLinks-filter.js',
'src/angularCSS-module.js',
'src/angularHack.js',
'src/suffix.js'
]
}
}
},
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= pkg.version %> | Copyright (c) <%= grunt.template.today("yyyy") %> DOOR3, Alex Castillo | MIT License */'
Expand All @@ -40,12 +61,14 @@ module.exports = function(grunt) {
}
});

grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-karma');
npmTasks.forEach(function (task) {
grunt.loadNpmTasks(task);
});

grunt.registerTask('test', ['karma']);

grunt.registerTask('default', [
'ngAnnotate',
'test',
'uglify'
]);
Expand Down
214 changes: 104 additions & 110 deletions angular-css.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,33 +10,19 @@

(function (angular) {

/**
* AngularCSS Module
* Contains: config, constant, provider and run
**/
var angularCSS = angular.module('door3.css', []);

// Config
angularCSS.config(['$logProvider', function ($logProvider) {
// Turn off/on in order to see console logs during dev mode
$logProvider.debugEnabled(false);
}]);

// Provider
angularCSS.provider('$css', [function $cssProvider() {

// Defaults - default options that can be overridden from application config
var defaults = this.defaults = {
element: 'link',
rel: 'stylesheet',
type: 'text/css',
container: 'head',
method: 'append',
weight: 0
};
function $cssProvider() {

// Defaults - default options that can be overridden from application config
var defaults = this.defaults = {
element: 'link',
rel: 'stylesheet',
type: 'text/css',
container: 'head',
method: 'append',
weight: 0
};

this.$get = ['$rootScope','$injector','$q','$window','$timeout','$compile','$http','$filter','$log',
function $get($rootScope, $injector, $q, $window, $timeout, $compile, $http, $filter, $log) {
this.$get = /** @ngInject */ ['$rootScope', '$injector', '$q', '$window', '$timeout', '$compile', '$http', '$filter', '$log', function $get($rootScope, $injector, $q, $window, $timeout, $compile, $http, $filter, $log) {

var $css = {};

Expand Down Expand Up @@ -105,7 +91,7 @@
stylesheet.media = options.breakpoints[stylesheet.breakpoint];
}
delete stylesheet.breakpoints;
}
}
}

/**
Expand Down Expand Up @@ -199,7 +185,7 @@
// Media query object
mediaQuery[stylesheet.href] = $window.matchMedia(stylesheet.media);
// Media Query Listener function
mediaQueryListener[stylesheet.href] = function(mediaQuery) {
mediaQueryListener[stylesheet.href] = function (mediaQuery) {
// Trigger digest
$timeout(function () {
if (mediaQuery.matches) {
Expand Down Expand Up @@ -246,11 +232,11 @@
}
return !!(
// Check for media query setting
stylesheet.media
stylesheet.media
// Check for media queries to be ignored
&& (mediaQueriesToIgnore.indexOf(stylesheet.media) === -1)
&& (mediaQueriesToIgnore.indexOf(stylesheet.media) === -1)
// Check for matchMedia support
&& $window.matchMedia
&& $window.matchMedia
);
}

Expand Down Expand Up @@ -349,12 +335,12 @@
if (angular.isDefined(state.css)) {
// For multiple stylesheets
if (angular.isArray(state.css)) {
angular.forEach(state.css, function (itemCss) {
if (angular.isFunction(itemCss)) {
dynamicPaths.push(parse(itemCss));
}
result.push(parse(itemCss));
});
angular.forEach(state.css, function (itemCss) {
if (angular.isFunction(itemCss)) {
dynamicPaths.push(parse(itemCss));
}
result.push(parse(itemCss));
});
// For single stylesheets
} else {
if (angular.isFunction(state.css)) {
Expand Down Expand Up @@ -413,7 +399,7 @@
stylesheets = [stylesheets];
}
var stylesheetLoadPromises = [];
angular.forEach(stylesheets, function(stylesheet, key) {
angular.forEach(stylesheets, function (stylesheet, key) {
stylesheet = stylesheets[key] = parse(stylesheet);
stylesheetLoadPromises.push(
// Preload via ajax request
Expand All @@ -432,7 +418,7 @@
/**
* Bind: binds css in scope with own scope create/destroy events
**/
$css.bind = function (css, $scope) {
$css.bind = function (css, $scope) {
if (!css || !$scope) {
return $log.error('No scope or stylesheets provided');
}
Expand All @@ -451,7 +437,7 @@
$css.remove(result);
$log.debug('$css.bind(): Removed', result);
});
};
};

/**
* Add: adds stylesheets to scope
Expand All @@ -463,10 +449,10 @@
if (!angular.isArray(stylesheets)) {
stylesheets = [stylesheets];
}
angular.forEach(stylesheets, function(stylesheet) {
angular.forEach(stylesheets, function (stylesheet) {
stylesheet = parse(stylesheet);
// Avoid adding duplicate stylesheets
if (stylesheet.href && !$filter('filter')($rootScope.stylesheets, { href: stylesheet.href }).length) {
if (stylesheet.href && !$filter('filter')($rootScope.stylesheets, {href: stylesheet.href}).length) {
// Bust Cache feature
bustCache(stylesheet)
// Media Query add support check
Expand Down Expand Up @@ -497,7 +483,7 @@
stylesheets = $filter('filter')(stylesheets, function (stylesheet) {
return !stylesheet.persist;
});
angular.forEach(stylesheets, function(stylesheet) {
angular.forEach(stylesheets, function (stylesheet) {
stylesheet = parse(stylesheet);
// Get index of current item to be removed based on href
var index = $rootScope.stylesheets.indexOf($filter('filter')($rootScope.stylesheets, {
Expand Down Expand Up @@ -533,81 +519,89 @@

}];

}]);
}

/**
* Links filter - renders the stylesheets array in html format
**/
angularCSS.filter('$cssLinks', function () {
return function (stylesheets) {
if (!stylesheets || !angular.isArray(stylesheets)) {
return stylesheets;
}
var result = '';
angular.forEach(stylesheets, function (stylesheet) {
result += '<link rel="' + stylesheet.rel + '" type="' + stylesheet.type + '" href="' + stylesheet.href + '"';
result += (stylesheet.media ? ' media="' + stylesheet.media + '"' : '')
result += '>\n\n';
});
return result;
/**
* Links filter - renders the stylesheets array in html format
**/
function $cssLinksFilter() {
return function $cssLinks(stylesheets) {
if (!stylesheets || !angular.isArray(stylesheets)) {
return stylesheets;
}
});
var result = '';
angular.forEach(stylesheets, function (stylesheet) {
result += '<link rel="' + stylesheet.rel + '" type="' + stylesheet.type + '" href="' + stylesheet.href + '"';
result += (stylesheet.media ? ' media="' + stylesheet.media + '"' : '')
result += '>\n\n';
});
return result;
};
}

angular
.module('door3.css', [])
.config(['$logProvider', function ($logProvider) {
// Turn off/on in order to see console logs during dev mode
$logProvider.debugEnabled(false);
}])
/**
* Run - auto instantiate the $css provider by injecting it in the run phase of this module
**/
angularCSS.run(['$css', function ($css) { } ]);
.run(['$css', function ($css) { }])
.provider('$css', [$cssProvider])
.filter('$cssLinks', $cssLinksFilter);

/**
* AngularJS hack - This way we can get and decorate all custom directives
* in order to broadcast a custom $directiveAdd event
**/
var $directives = [];
var originalModule = angular.module;
angular.module = function () {
var module = originalModule.apply(this, arguments);
var originalDirective = module.directive;
module.directive = function(directiveName, directiveFactory) {
var originalDirectiveFactory = angular.isFunction(directiveFactory) ?
/**
* AngularJS hack - This way we can get and decorate all custom directives
* in order to broadcast a custom $directiveAdd event
**/
var $directives = [];
var originalModule = angular.module;
angular.module = function () {
var module = originalModule.apply(this, arguments);
var originalDirective = module.directive;
module.directive = function (directiveName, directiveFactory) {
var originalDirectiveFactory = angular.isFunction(directiveFactory) ?
directiveFactory : directiveFactory[directiveFactory.length - 1];
try {
var directive = angular.copy(originalDirectiveFactory)();
directive.directiveName = directiveName;
if (directive.hasOwnProperty('css')) {
$directives.push(directive);
}
} catch (e) { }
return originalDirective.apply(this, arguments);
};
module.config(['$provide','$injector', function ($provide, $injector) {
angular.forEach($directives, function ($directive) {
var dirProvider = $directive.directiveName + 'Directive';
if ($injector.has(dirProvider)) {
$provide.decorator(dirProvider, ['$delegate', '$rootScope', '$timeout', function ($delegate, $rootScope, $timeout) {
var directive = $delegate[0];
var compile = directive.compile;
if (directive.css) {
$directive.css = directive.css;
}
directive.compile = function() {
var link = compile ? compile.apply(this, arguments): false;
return function(scope) {
var linkArgs = arguments;
$timeout(function () {
if (link) {
link.apply(this, linkArgs);
}
});
$rootScope.$broadcast('$directiveAdd', directive, scope);
};
};
return $delegate;
}]);
}
});
}]);
return module;
try {
var directive = angular.copy(originalDirectiveFactory)();
directive.directiveName = directiveName;
if (directive.hasOwnProperty('css')) {
$directives.push(directive);
}
} catch (e) {
}
return originalDirective.apply(this, arguments);
};
/* End of hack */
module.config(['$provide', '$injector', function ($provide, $injector) {
angular.forEach($directives, function ($directive) {
var dirProvider = $directive.directiveName + 'Directive';
if ($injector.has(dirProvider)) {
$provide.decorator(dirProvider, ['$delegate', '$rootScope', '$timeout', function ($delegate, $rootScope, $timeout) {
var directive = $delegate[0];
var compile = directive.compile;
if (directive.css) {
$directive.css = directive.css;
}
directive.compile = function () {
var link = compile ? compile.apply(this, arguments) : false;
return function (scope) {
var linkArgs = arguments;
$timeout(function () {
if (link) {
link.apply(this, linkArgs);
}
});
$rootScope.$broadcast('$directiveAdd', directive, scope);
};
};
return $delegate;
}]);
}
});
}]);
return module;
};

})(angular);
Loading