Selaa lähdekoodia

pick file

develop
Robin Thoni 8 vuotta sitten
vanhempi
commit
dfd8062f35

+ 19
- 0
public/app/controllers/upload.controller.js Näytä tiedosto

@@ -4,6 +4,20 @@ angular.module('app')
4 4
 
5 5
             $scope.image = null;
6 6
 
7
+            $scope.input = angular.element(angular.element("#filePicker")[0]);
8
+            $scope.input.on("change", function (e) {
9
+                var reader = new FileReader();
10
+                var f = e.target.files[0];
11
+                reader.readAsBinaryString(f);
12
+                reader.onload = (function(file) {
13
+                    return function(e) {
14
+                        $scope.$apply(function() {
15
+                            $scope.fileDropped(e.target.result, file);
16
+                        });
17
+                    };
18
+                })(f);
19
+            });
20
+
7 21
             $scope.fileDropped = function(content, file)
8 22
             {
9 23
                 $scope.image = {
@@ -11,4 +25,9 @@ angular.module('app')
11 25
                     name: file.name
12 26
                 };
13 27
             };
28
+
29
+            $scope.pickFile = function()
30
+            {
31
+                $scope.input.click();
32
+            };
14 33
     }]);

+ 6
- 0
public/app/less/app.less Näytä tiedosto

@@ -61,4 +61,10 @@
61 61
     width: auto;
62 62
     height: auto;
63 63
   }
64
+}
65
+
66
+.hidden-input {
67
+  width: 0;
68
+  height: 0;
69
+  overflow: hidden;
64 70
 }

+ 2
- 1
public/app/views/upload.html Näytä tiedosto

@@ -4,7 +4,8 @@
4 4
     <div image-dropzone="fileDropped(content, file)" class="dropzone">
5 5
         <img ng-show="image != null" ng-src="{{ image.content | toDataUrl }}">
6 6
         <p ng-hide="image != null">
7
-            Drag a file here
7
+            Drag a file here or <a href="" ng-click="pickFile()">pick one</a>
8 8
         </p>
9 9
     </div>
10
+    <input type="file" class="hidden-input" id="filePicker">
10 11
 </div>

Loading…
Peruuta
Tallenna