Add some icons from http://materialdesignicons.com

README.md

@@ -3,7 +3,7 @@ angular-material-icons
 
 AngularJS directive to use Material Design icons with custom fill-color and size.
 
-This project encompasses all svg icons from [Google's official Material Design Icon repository](https://github.com/google/material-design-icons) in form of angular directive that gives option to specify custom fill-color and size.
+This project encompasses all SVG icons from [Google's official Material Design Icon repository](https://github.com/google/material-design-icons) and few hand-picked icons from community-led [MaterialDesignIcons.com](http://materialdesignicons.com/) in form of angular directive that gives option to specify custom fill-color and size.
 
 Changes to icon will go through delightful morphing if [SVG-Morpheus](https://github.com/alexk111/SVG-Morpheus) is also included in your application.
 

demo.js

@@ -1,14 +1,17 @@
 angular.module('demoapp', ['ngMdIcons'])
     .controller('democtrl', function($scope) {
-        var icons = ['accessibility', 'alarm', 'aspect_ratio', 'autorenew', 'bookmark_outline', 'dashboard', 'dns', 'favorite_outline', 'get_app', 'highlight_remove', 'history', 'list', 'picture_in_picture', 'print', 'settings_ethernet', 'settings_power', 'shopping_cart', 'spellcheck', 'swap_horiz', 'swap_vert', 'thumb_up', 'thumbs_up_down', 'translate', 'trending_up', 'visibility', 'warning', 'mic', 'play_circle_outline', 'repeat', 'skip_next', 'call', 'chat', 'clear_all', 'dialpad', 'dnd_on', 'forum', 'location_on', 'vpn_key', 'filter_list', 'inbox', 'link', 'remove_circle_outline', 'save', 'text_format', 'access_time', 'airplanemode_on', 'bluetooth', 'data_usage', 'gps_fixed', 'now_wallpaper', 'now_widgets', 'storage', 'wifi_tethering', 'attach_file', 'format_line_spacing', 'format_list_numbered', 'format_quote', 'vertical_align_center', 'wrap_text', 'cloud_queue', 'file_download', 'folder_open', 'cast', 'headset', 'keyboard_backspace', 'mouse', 'speaker', 'watch', 'audiotrack', 'edit', 'brush', 'looks', 'crop_free', 'camera', 'filter_vintage', 'hdr_strong', 'photo_camera', 'slideshow', 'timer', 'directions_bike', 'hotel', 'local_library', 'directions_walk', 'local_cafe', 'local_pizza', 'local_florist', 'my_location', 'navigation', 'pin_drop', 'arrow_back', 'menu', 'close', 'more_horiz', 'more_vert', 'refresh', 'phone_paused', 'vibration', 'cake', 'group', 'mood', 'person', 'notifications_none', 'plus_one', 'school', 'share', 'star_outline'];
+        var icons = [
+            'office', 'facebook', 'twitter', 'apple', 'whatsapp', 'linkedin', 'windows',
+            'accessibility', 'alarm', 'aspect_ratio', 'autorenew', 'bookmark_outline', 'dashboard', 'dns', 'favorite_outline', 'get_app', 'highlight_remove', 'history', 'list', 'picture_in_picture', 'print', 'settings_ethernet', 'settings_power', 'shopping_cart', 'spellcheck', 'swap_horiz', 'swap_vert', 'thumb_up', 'thumbs_up_down', 'translate', 'trending_up', 'visibility', 'warning', 'mic', 'play_circle_outline', 'repeat', 'skip_next', 'call', 'chat', 'clear_all', 'dialpad', 'dnd_on', 'forum', 'location_on', 'vpn_key', 'filter_list', 'inbox', 'link', 'remove_circle_outline', 'save', 'text_format', 'access_time', 'airplanemode_on', 'bluetooth', 'data_usage', 'gps_fixed', 'now_wallpaper', 'now_widgets', 'storage', 'wifi_tethering', 'attach_file', 'format_line_spacing', 'format_list_numbered', 'format_quote', 'vertical_align_center', 'wrap_text', 'cloud_queue', 'file_download', 'folder_open', 'cast', 'headset', 'keyboard_backspace', 'mouse', 'speaker', 'watch', 'audiotrack', 'edit', 'brush', 'looks', 'crop_free', 'camera', 'filter_vintage', 'hdr_strong', 'photo_camera', 'slideshow', 'timer', 'directions_bike', 'hotel', 'local_library', 'directions_walk', 'local_cafe', 'local_pizza', 'local_florist', 'my_location', 'navigation', 'pin_drop', 'arrow_back', 'menu', 'close', 'more_horiz', 'more_vert', 'refresh', 'phone_paused', 'vibration', 'cake', 'group', 'mood', 'person', 'notifications_none', 'plus_one', 'school', 'share', 'star_outline'
+        ];
         var colors = ['lightgreen', 'pink', 'wheat', '#cc99ff', '#abcdef'];
         $scope.cnt = Math.floor(Math.random() * icons.length);
         $scope.icon = icons[$scope.cnt];
         $scope.fill = colors[0];
         $scope.size = 48;
 
         $scope.clickIcon = 'thumb_up';
-        $scope.clickIconMorph = function () {
+        $scope.clickIconMorph = function() {
             if ($scope.clickIcon == 'thumb_up')
                 $scope.clickIcon = 'thumb_down';
             else

index.html

@@ -97,10 +97,10 @@ <h1>Angular Material Icons v0.4.0</h1>
             <br>
         </li>
         <li>This directive is tested on Chrome and Firefox.
-        	<br>For IE, use <code>ng-attr-style</code> instead of <code>style</code>. Also refer AngularJS documentation on <a href="https://docs.angularjs.org/guide/ie" target="_blank">IE Compatibility</a>.
+            <br>For IE, use <code>ng-attr-style</code> instead of <code>style</code>. Also refer AngularJS documentation on <a href="https://docs.angularjs.org/guide/ie" target="_blank">IE Compatibility</a>.
         </li>
         <li>Optional: Include <a href="https://github.com/alexk111/SVG-Morpheus" target="_blank">SVG-Morpheus</a> in your project and changes to <code>icon</code> attribute that you do through your controller will go through delightful morphing as seen above.
-        	<br>Refer code for this page (index.html and demo.js) for details.
+            <br>Refer code for this page (index.html and demo.js) for details.
             <br><code>&lt;script src="//cdnjs.cloudflare.com/ajax/libs/SVG-Morpheus/0.1.8/svg-morpheus.js"&gt;&lt;/script&gt;</code>
             <br>
             <br>When SVG-Morpheus is included, you can use <code>options</code> attribute to control <a href="https://github.com/alexk111/SVG-Morpheus#options" target="_blank">morphing options</a>.
@@ -116,6 +116,28 @@ <h1>Angular Material Icons v0.4.0</h1>
     </ul>
 
     <h1>Full list of icons:</h1>
+
+    <h2>From <a href="http://materialdesignicons.com" target="_blank">MaterialDesignIcons.com</a></h2>
+    <div><ng-md-icon icon="amazon" size="48"></ng-md-icon><br>amazon</div>
+    <div><ng-md-icon icon="apple" size="48"></ng-md-icon><br>apple</div>
+    <div><ng-md-icon icon="facebook-box" size="48"></ng-md-icon><br>facebook-box</div>
+    <div><ng-md-icon icon="facebook-messenger" size="48"></ng-md-icon><br>facebook-messenger</div>
+    <div><ng-md-icon icon="facebook" size="48"></ng-md-icon><br>facebook</div>
+    <div><ng-md-icon icon="github-box" size="48"></ng-md-icon><br>github-box</div>
+    <div><ng-md-icon icon="github-circle" size="48"></ng-md-icon><br>github-circle</div>
+    <div><ng-md-icon icon="google-plus-box" size="48"></ng-md-icon><br>google-plus-box</div>
+    <div><ng-md-icon icon="google-plus" size="48"></ng-md-icon><br>google-plus</div>
+    <div><ng-md-icon icon="hangouts" size="48"></ng-md-icon><br>hangouts</div>
+    <div><ng-md-icon icon="linkedin-box" size="48"></ng-md-icon><br>linkedin-box</div>
+    <div><ng-md-icon icon="linkedin" size="48"></ng-md-icon><br>linkedin</div>
+    <div><ng-md-icon icon="login" size="48"></ng-md-icon><br>login</div>
+    <div><ng-md-icon icon="logout" size="48"></ng-md-icon><br>logout</div>
+    <div><ng-md-icon icon="office" size="48"></ng-md-icon><br>office</div>
+    <div><ng-md-icon icon="twitter" size="48"></ng-md-icon><br>twitter</div>
+    <div><ng-md-icon icon="whatsapp" size="48"></ng-md-icon><br>whatsapp</div>
+    <div><ng-md-icon icon="windows" size="48"></ng-md-icon><br>windows</div>
+
+    <h2>From <a href="https://github.com/google/material-design-icons" target="_blank">Material Design icons by Google</a></h2>
     <h2>action</h2>
     <div><ng-md-icon icon="3d_rotation" size="48"></ng-md-icon><br>3d_rotation</div>
     <div><ng-md-icon icon="accessibility" size="48"></ng-md-icon><br>accessibility</div>
@@ -283,7 +305,7 @@ <h2>action</h2>
     <h2>alert</h2>
     <div><ng-md-icon icon="error" size="48"></ng-md-icon><br>error</div>
     <div><ng-md-icon icon="warning" size="48"></ng-md-icon><br>warning</div>
-    <h2>av</h2>
+    <h2>AV</h2>
     <div><ng-md-icon icon="album" size="48"></ng-md-icon><br>album</div>
     <div><ng-md-icon icon="av_timer" size="48"></ng-md-icon><br>av_timer</div>
     <div><ng-md-icon icon="closed_caption" size="48"></ng-md-icon><br>closed_caption</div>