1 | app = angular.module 'ngFileDrop', []
|
2 | app.directive 'dropZone', ->
|
3 | restrict: 'A'
|
4 | link: (scope, element, attrs) ->
|
5 |
|
6 |
|
7 | angular.element("body").append '<input type=file style="display: none" class="__dropZoneInput">'
|
8 |
|
9 |
|
10 | element[0].addEventListener 'dragover', (event) ->
|
11 | event.preventDefault()
|
12 | event.stopPropagation()
|
13 |
|
14 | element.addClass 'dragging'
|
15 | element[0].addEventListener 'dragleave', (event) ->
|
16 | event.preventDefault()
|
17 | event.stopPropagation()
|
18 |
|
19 | element.removeClass 'dragging'
|
20 |
|
21 | element[0].addEventListener 'drop', (e) ->
|
22 | event.preventDefault()
|
23 | event.stopPropagation()
|
24 |
|
25 | files = e.dataTransfer.files
|
26 |
|
27 | handleFiles files
|
28 |
|
29 | angular.element(".__dropZoneInput").on 'change', ->
|
30 | files = @files
|
31 |
|
32 | handleFiles files
|
33 |
|
34 | element.click ->
|
35 | angular.element(".__dropZoneInput").click()
|
36 |
|
37 | handleFiles = (files) ->
|
38 | reader = new FileReader
|
39 | reader.readAsDataURL files[0]
|
40 | reader.onload = (res) ->
|
41 | scope.$apply ->
|
42 | scope.file = res.target.result
|
43 |
|
44 | count = files.length
|
45 | scope.$apply ->
|
46 | scope.files = []
|
47 | for file in files
|
48 | reader = new FileReader
|
49 | reader.readAsDataURL file
|
50 | reader.onload = (res) ->
|
51 | scope.$apply ->
|
52 | scope.files.push res.target.result
|
53 | count--
|
54 | if count == 0
|
55 | scope.$apply ->
|
56 | do scope.drop
|
57 |
|
58 | scope:
|
59 | file: '=file'
|
60 | files: '=files'
|
61 | drop: '=drop' |
\ | No newline at end of file |