initial

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+.idea

.npmignore

@@ -0,0 +1 @@
+node_modules

LICENSE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 Toby Rahilly
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,2 +1,107 @@
-# ng-md-theme-loader
-Adds your AngularJS Material custom theme css into your webpack Javascript Bundle
+# AngularJS Material Custom Theme loader for [webpack](http://webpack.github.io/)
+
+Adds your AngularJS Material custom theme css into your webpack Javascript Bundle.
+
+ng-md-theme-loader does not minify or process your css at all, and instead uses standard loaders such as [sass-loader](https://github.com/webpack-contrib/sass-loader). This gives you enough flexibility to pick and choose your loaders.
+
+## Install
+
+```bash
+npm install ng-md-theme-loader --save-dev
+```
+
+## Usage
+
+[Documentation: Using loaders](https://webpack.js.org/concepts/loaders/#using-loaders)
+
+[Documentation: ng-material's theme implementation](https://github.com/angular/material/blob/master/docs/guides/THEMES_IMPL_NOTES.md#the-mini-dsl)
+
+ng-md-theme-loader creates a JS module that registers MD CSS template with [$mdThemingProvider](https://material.angularjs.org/1.1.4/#custom-theme-styles)  e.g.
+
+``` javascript
+require('!ng-md-theme-loader!file.theme.css');
+// => generates the javascript:
+// angular.module('ngMaterial').run(['$mdThemingProvider', function(c) { c.registerStyles('content of the ?.theme.css file') }]);
+```
+
+
+### `module`
+
+By default ng-md-theme-loader adds a run method to the global 'ngMaterial' module which should be explicitly required by your app for using Angular Material.
+You can override this by setting the `module` parameter, e.g.
+
+``` javascript
+require('!ng-md-theme-loader?module=myApp!file.theme.css');
+// => generates the javascript:
+// angular.module('myApp').run(['$mdThemingProvider', function(c) { c.registerStyles('content of the ?.theme.css file') }]);
+```
+
+NOTE: specified module should be preliminary defined in your application
+
+### Parameter Interpolation
+
+`module` parameter is interpolated using 
+[Webpack's standard interpolation rules](https://github.com/webpack/loader-utils#interpolatename).
+
+### Using with npm requires
+
+This module relies on angular being available on `window` object. However, in cases angular is connected from `node_modules` via `require('angular')`, option to force this module to get the angular should be used:
+
+```javascript
+require('!ng-md-theme-loader?requireAngular!file.theme.css');
+
+// => generates the javascript:
+// var angular = require('angular');
+// angular.module('ngMaterial').run(['$mdThemingProvider', function(c) { c.registerStyles('content of the ?.theme.css file') }]);
+```
+
+## Webpack Config
+
+It's recommended to adjust your `webpack.config` so `ng-md-theme-loader` is applied automatically on all files ending with e.g. `.theme.css`. For Webpack 1 this would be something like:
+
+``` javascript
+module.exports = {
+  module: {
+    loaders: [
+      {
+        test: /\.theme\.css$/,
+        loader: 'ng-md-theme'
+      },
+      {
+        test: /\.theme\.sass$/,
+        loader: 'ng-md-theme!sass'
+      }
+      // other loaders...
+    ]
+  }
+};
+```
+For Webpack 2 this would be something like:
+
+``` javascript
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.theme\.css$/,
+        use: [
+          { loader: 'ng-md-theme-loader'},
+        ]
+      },
+      {
+        test: /\.theme\.sass$/,
+        use: [
+          { loader: 'ng-md-theme-loader'},
+          { loader: 'sass-loader' }
+        ]
+      }
+      // other loaders...
+    ]
+  }
+};
+```
+Make sure you already have `sass-loader` installed. Then you only need to write: `require('file.theme.css')`.
+
+## License
+
+MIT (http://www.opensource.org/licenses/mit-license.php)

index.js

@@ -0,0 +1,45 @@
+var loaderUtils = require('loader-utils');
+
+module.exports = function(content) {
+  console.log(content);
+  this.cacheable && this.cacheable();
+
+  var options = loaderUtils.getOptions(this) || {};
+  var ngModule = getAndInterpolateOption.call(this, 'module', 'ngMaterial'); // ngMaterial is the global angular module that does not need to explicitly required
+  var requireAngular = !!options.requireAngular || false;
+
+  var theme;
+
+  if (content.match(/^module\.exports/)) {
+    var firstQuote = findQuote(content, false);
+    var secondQuote = findQuote(content, true);
+    theme = content.substr(firstQuote, secondQuote - firstQuote + 1);
+  } else {
+    theme = JSON.stringify(content);
+  }
+
+  return 'var theme = ' + theme + ';\n' +
+    (requireAngular ? 'var angular = require(\'angular\');\n' : 'window.') +
+    'angular.module(\'' + ngModule + '\').config([\'$mdThemingProvider\', function(c) { c.registerStyles(theme) }]);';
+
+  function getAndInterpolateOption(optionKey, def) {
+    return options[optionKey]
+      ? loaderUtils.interpolateName(this, options[optionKey], {
+        context: options.context,
+        content: content,
+        regExp: options[optionKey + 'RegExp'] || options['regExp']
+      })
+      : def;
+  }
+
+  function findQuote(content, backwards) {
+    var i = backwards ? content.length - 1 : 0;
+    while (i >= 0 && i < content.length) {
+      if (content[i] === '"' || content[i] === '\'') {
+        return i;
+      }
+      i += backwards ? -1 : 1;
+    }
+    return -1;
+  }
+};

package.json

@@ -0,0 +1,31 @@
+{
+  "name": "ng-md-theme-loader",
+  "version": "1.0.0",
+  "description": "Adds AngularJS Material custome theme CSS templates in the Webpack bundle.",
+  "main": "index.js",
+  "scripts": {
+    "test": ""
+  },
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/WearyMonkey/ngtemplate-loader.git"
+  },
+  "keywords": [
+    "webpack",
+    "angularjs",
+    "loader",
+    "angular material",
+    "theme"
+  ],
+  "author": "Urrri",
+  "licenses": [
+    {
+      "type": "MIT",
+      "url": "http://www.opensource.org/licenses/mit-license.php"
+    }
+  ],
+  "dependencies": {
+    "loader-utils": "^1.1.0"
+  },
+  "devDependencies": {}
+}