Skip to content

Instantly share code, notes, and snippets.

@heijmerikx
Forked from lsiv568/dropzone.coffee
Created September 5, 2013 14:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save heijmerikx/6451207 to your computer and use it in GitHub Desktop.
Save heijmerikx/6451207 to your computer and use it in GitHub Desktop.
'use strict';
angular.module('reusableThings')
.directive('fileDropzone', () ->
restrict: 'A'
scope: {
file: '='
fileName: '='
}
link: (scope, element, attrs) ->
# function to prevent default behavior (browser loading image)
processDragOverOrEnter = (event) ->
event?.preventDefault()
event.dataTransfer.effectAllowed = 'copy'
false
validMimeTypes = attrs.fileDropzone
# if the max file size is provided and the size of dropped file is greater than it,
# it's an invalid file and false is returned
checkSize = (size) ->
if attrs.maxFileSize in [undefined, ''] or (size / 1024) / 1024 < attrs.maxFileSize
true
else
alert "File must be smaller than #{attrs.maxFileSize} MB"
false
isTypeValid = (type) ->
if validMimeTypes in [undefined, ''] or validMimeTypes.indexOf(type) > -1
true
else
# return true if no mime types are provided
alert "Invalid file type. File must be one of following types #{validMimeTypes}"
false
# for dragover and dragenter (IE) we stop the browser from handling the
# event and specify copy as the allowable effect
element.bind 'dragover', processDragOverOrEnter
element.bind 'dragenter', processDragOverOrEnter
# on drop events we stop browser and read the dropped file via the FileReader
# the resulting droped file is bound to the image property of the scope of this directive
element.bind 'drop', (event) ->
event?.preventDefault()
reader = new FileReader()
reader.onload = (evt) ->
if checkSize(size) and isTypeValid(type)
scope.$apply ->
scope.file = evt.target.result
scope.fileName = name if angular.isString scope.fileName
file = event.dataTransfer.files[0]
name = file.name
type = file.type
size = file.size
reader.readAsDataURL(file)
return false
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment