update README and module structure

vpegado · Nov 2, 2014 · 8a9d992 · 8a9d992
1 parent 86c2270
commit 8a9d992
Show file tree

Hide file tree

Showing 6 changed files with 67 additions and 29 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+bower_components/
diff --git a/README.md b/README.md
@@ -4,33 +4,36 @@ angular-file-directive
 File parsing directive for AngularJS
 
 ## Installation
-Install with [Bower](http://bower.io/):
-
-    $ bower install angular-file-directive
-
-Include from a [RawGit](https://rawgit.com/)'s CDN:
 
-    <script src="//cdn.rawgit.com/vpegado/angular-file-directive/v1.1.0/file.js"></script>
-
-Or [download](https://github.com/vpegado/angular-file-directive/archive/master.zip) manually.
+Install with [Bower](http://bower.io/):
+```bash
+$ bower install angular-file-directiv
+```
 
 ## Usage
-`app.js`
-
-    angular.module('myApp', ['file']);
-
-
-`view.html`
 
-    <!-- Bind the values to $scope.files -->
-    <input type="file"
-      file="files"
-      accept="image/*"
-      multiple>
-
-    <!-- Render the selected files directly in the view -->
-    <div ng-repeat="file in files">
-      <h4>{{ file.name }}</h4>
-      <img alt="{{ file.name }}"
+Include the library:
+```html
+<script src="/bower_components/angular-file-directive/angular-file-directive.js"></script>
+```
+
+Import it to the angular applicaiton:
+```javascript
+angular.module('myApp', ['ngFile']);
+```
+
+Use it in the view:
+```html
+<!-- Bind the values to $scope.files -->
+<input  type="file"
+        file="files"
+        accept="image/*"
+        multiple>
+
+<!-- Render the selected files directly in the view -->
+<div ng-repeat="file in files">
+  <h4>{{ file.name }}</h4>
+  <img  alt="{{ file.name }}"
         ng-src="data:{{ file.type }};base64,{{ file.body }}">
-    </div>
+</div>
+```
diff --git a/file.js → angular-file-directive.js b/file.js → angular-file-directive.js
@@ -1,6 +1,6 @@
 'use strict';
 
-angular.module('file', [])
+angular.module('ngFile', [])
   .directive('file', [function () {
     return {
       scope: {

diff --git a/bower.json b/bower.json
@@ -1,12 +1,15 @@
 {
   "name": "angular-file-directive",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "homepage": "https://github.com/vpegado/angular-file-directive",
   "authors": [
     "Victor Pegado <[email protected]>"
   ],
   "description": "Angular directive for parsing files",
-  "main": "file.js",
+  "main": "angular-file-directive.js",
+  "ignore": [
+    "example/*"
+  ],
   "keywords": [
     "angular",
     "file",
@@ -15,6 +18,6 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "angular": ">=1.2.*"
+    "angular": "1.2.*"
   }
 }
diff --git a/example/app.js b/example/app.js
@@ -0,0 +1,4 @@
+angular.module('fileApp', ['ngFile'])
+  .controller('FileCtrl', ['$scope', function($scope){
+    // Example controller
+  }]);
diff --git a/example/index.html b/example/index.html
@@ -0,0 +1,27 @@
+<html>
+  <head>
+    <title>Example</title>
+    <script src="../bower_components/angular/angular.min.js"></script>
+    <script src="../angular-file-directive.js"></script>
+    <script src="app.js"></script>
+  </head>
+  <body ng-app="fileApp" ng-controller="FileCtrl">
+    <h1>Example</h1>
+
+    <!-- Bind the values to $scope.files -->
+    <input  type="file"
+            file="files"
+            accept="image/*"
+            multiple>
+
+    <!-- Render the selected files directly in the view -->
+    <div ng-repeat="file in files">
+      <h4>{{ file.name }}</h4>
+      <img  alt="{{ file.name }}"
+            ng-src="data:{{ file.type }};base64,{{ file.body }}">
+      <pre>{{ file | json }}</pre>
+    </div>
+
+
+  </body>
+</html>