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