upgrade Font-Awsome from 3 to 4

nickperkinslondon · nickperkinslondon · commit a697d685d7f6 · 2014-03-15T16:17:08.000-04:00
diff --git a/README.md b/README.md
@@ -45,6 +45,13 @@ But there are other attributes to customize the tree:
         initial-selection = "Vegetable">      
     ></abn-tree>
 
+The example uses Font-Awesome 3, but Font-Awsome 4 also works.
+Use the following syntax:
+
+    icon-leaf = "fa fa-file"
+    
+( in general, use spaces to apply multiple classes to icon elements )
+
 
 The data to create the tree is defined in your controller, and could be as simple as this:
 
diff --git a/dist/abn_tree_directive.js b/dist/abn_tree_directive.js
@@ -19,13 +19,13 @@ module.directive('abnTree', function($timeout) {
         return void 0;
       };
       if (attrs.iconExpand == null) {
-        attrs.iconExpand = 'icon-plus';
+        attrs.iconExpand = 'fa fa-plus';
       }
       if (attrs.iconCollapse == null) {
-        attrs.iconCollapse = 'icon-minus';
+        attrs.iconCollapse = 'fa fa-minus';
       }
       if (attrs.iconLeaf == null) {
-        attrs.iconLeaf = 'icon-chevron-right';
+        attrs.iconLeaf = 'fa fa-file';
       }
       if (attrs.expandLevel == null) {
         attrs.expandLevel = '3';
diff --git a/src/abn_tree_directive.coffee b/src/abn_tree_directive.coffee
@@ -20,10 +20,10 @@ module.directive 'abnTree',($timeout)->
       return undefined
 
 
-    # default values
-    attrs.iconExpand   ?= 'icon-plus'    
-    attrs.iconCollapse ?= 'icon-minus'
-    attrs.iconLeaf     ?= 'icon-chevron-right'
+    # default values ( Font-Awesome 3 or 4 )
+    attrs.iconExpand   ?= 'fa fa-plus'    
+    attrs.iconCollapse ?= 'fa fa-minus'
+    attrs.iconLeaf     ?= 'fa fa-file'
     attrs.expandLevel  ?= '3'
 
     expand_level = parseInt attrs.expandLevel,10
diff --git a/src/abn_tree_directive.js b/src/abn_tree_directive.js
diff --git a/src/abn_tree_template.jade b/src/abn_tree_template.jade
@@ -10,6 +10,10 @@ ul.nav.nav-list.nav-pills.nav-stacked.abn-tree
 
     a(ng-click="user_clicks_branch(row.branch)")
 
+      //- i.fa.fa-plus
+
+      //- div(style='border:1px solid red;padding:10px;')
+        //- span {{ row.tree_icon }}
       i.indented.tree-icon(
         ng-class="row.tree_icon"
         ng-click="row.branch.expanded = !row.branch.expanded"
diff --git a/test/bs2_ng115_test_page.html b/test/bs2_ng115_test_page.html
@@ -10,7 +10,7 @@
     <!---->
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
     <!-- Font Awesome (optional)-->
-    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
+    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
     <!-- Live Reload ( for development )-->
     <script src="http://localhost:35729/livereload.js"></script>
     <!--/-->
@@ -56,7 +56,7 @@ <h4>Angular 1.1.5</h4>
             <tr>
               <td>
                 <div style="width:250px;margin-left:100px;background:whitesmoke;border:1px solid lightgray;border-radius:5px;">
-                  <abn-tree tree-data="example_treedata" icon-leaf="icon-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
+                  <abn-tree tree-data="example_treedata" icon-leaf="fa fa-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
                 </div>
               </td>
               <td style="padding:20px;vertical-align:top;">
diff --git a/test/bs2_ng120_test_page.html b/test/bs2_ng120_test_page.html
@@ -11,7 +11,7 @@
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular-animate.js"></script>
     <!-- Font Awesome (optional)-->
-    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
+    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
     <!-- Live Reload ( for development )-->
     <script src="http://localhost:35729/livereload.js"></script>
     <!--/-->
@@ -57,7 +57,7 @@ <h4>Angular 1.2.0-rc.3</h4>
             <tr>
               <td>
                 <div style="width:250px;margin-left:100px;background:whitesmoke;border:1px solid lightgray;border-radius:5px;">
-                  <abn-tree tree-data="example_treedata" icon-leaf="icon-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
+                  <abn-tree tree-data="example_treedata" icon-leaf="fa fa-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
                 </div>
               </td>
               <td style="padding:20px;vertical-align:top;">
diff --git a/test/bs3_ng115_test_page.html b/test/bs3_ng115_test_page.html
@@ -10,7 +10,7 @@
     <!---->
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
     <!-- Font Awesome (optional)-->
-    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
+    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
     <!-- Live Reload ( for development )-->
     <script src="http://localhost:35729/livereload.js"></script>
     <!--/-->
@@ -56,7 +56,7 @@ <h4>Angular 1.1.5</h4>
             <tr>
               <td>
                 <div style="width:250px;margin-left:100px;background:whitesmoke;border:1px solid lightgray;border-radius:5px;">
-                  <abn-tree tree-data="example_treedata" icon-leaf="icon-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
+                  <abn-tree tree-data="example_treedata" icon-leaf="fa fa-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
                 </div>
               </td>
               <td style="padding:20px;vertical-align:top;">
diff --git a/test/bs3_ng120_test_page.html b/test/bs3_ng120_test_page.html
@@ -11,7 +11,7 @@
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular-animate.js"></script>
     <!-- Font Awesome (optional)-->
-    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
+    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
     <!-- Live Reload ( for development )-->
     <script src="http://localhost:35729/livereload.js"></script>
     <!--/-->
@@ -57,7 +57,7 @@ <h4>Angular 1.2.0-rc.3</h4>
             <tr>
               <td>
                 <div style="width:250px;margin-left:100px;background:whitesmoke;border:1px solid lightgray;border-radius:5px;">
-                  <abn-tree tree-data="example_treedata" icon-leaf="icon-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
+                  <abn-tree tree-data="example_treedata" icon-leaf="fa fa-file" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith"></abn-tree>
                 </div>
               </td>
               <td style="padding:20px;vertical-align:top;">
diff --git a/test/test_page.jade b/test/test_page.jade
@@ -24,7 +24,9 @@ html(ng-app='AbnTest')
 
 
 		// Font Awesome (optional)
-		link(href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css",rel="stylesheet")
+		//- link(href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css",rel="stylesheet")
+		link(href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css",rel="stylesheet")
+
 
 		// Live Reload ( for development )
 		script(src="http://localhost:35729/livereload.js")
@@ -48,8 +50,6 @@ html(ng-app='AbnTest')
 		style="margin:20px"
 		)
 
-
-
 		h2 angular-bootstrap-nav-tree
 		table
 			tr
@@ -92,7 +92,7 @@ html(ng-app='AbnTest')
 									)
 									abn-tree(
 										tree-data         = "example_treedata"
-										icon-leaf         = "icon-file"
+										icon-leaf         = "fa fa-file"
 										on-select         = "my_tree_handler(branch)"
 										expand-level      = "2"
 										initial-selection = "Granny Smith"

Original file line number	Diff line number	Diff line change
`@@ -19,13 +19,13 @@ module.directive('abnTree', function($timeout) {`
`19`	`19`	`return void 0;`
`20`	`20`	`};`
`21`	`21`	`if (attrs.iconExpand == null) {`
`22`		`- attrs.iconExpand = 'icon-plus';`
	`22`	`+ attrs.iconExpand = 'fa fa-plus';`
`23`	`23`	`}`
`24`	`24`	`if (attrs.iconCollapse == null) {`
`25`		`- attrs.iconCollapse = 'icon-minus';`
	`25`	`+ attrs.iconCollapse = 'fa fa-minus';`
`26`	`26`	`}`
`27`	`27`	`if (attrs.iconLeaf == null) {`
`28`		`- attrs.iconLeaf = 'icon-chevron-right';`
	`28`	`+ attrs.iconLeaf = 'fa fa-file';`
`29`	`29`	`}`
`30`	`30`	`if (attrs.expandLevel == null) {`
`31`	`31`	`attrs.expandLevel = '3';`