             <br/>
             <Radio name="profile_image_options" value="adorable" checked={state == "adorable"} onChange={@handleImageOptions} inline>Adorable</Radio>
             <br/>
-            <Radio name="profile_image_options" value="custom" checked={state == "custom"} onChange={@handleImageOptions} inline>Custom</Radio>
-            {if @state.show_image_upload then <label>Upload file: <input type="file" onChange={@handle_image_file_upload}/></label> else undefined}
+            <div
+                onDrop={@handle_image_file_drop}
+                onPaste={@handle_image_file_paste}
+                style={{cursor:"pointer",minWidth:"100px",minHeight:"100px",display:"block",border:"2px solid black",padding:"10px",margin:"5px"}}
+            >
+                Drag or paste an image here or upload one.
+                <br/>
+                <input type="file" onChange={@handle_image_file_input}/>
+            </div>
         </FormGroup>
 
     render: ->

        else if state == "custom"
            @setState({show_image_upload: true})
        else if state == "default"
            url = @get_default_url()
        @props.redux.getTable('account').set(profile : {image: url})

    get_gravatar_url: -> "https://www.gravatar.com/avatar/#{md5 @props.email_address.toLowerCase()}?d=identicon&s=#{30}"

    get_adorable_url: -> "https://api.adorable.io/avatars/100/#{md5 @props.email_address.toLowerCase()}.png"

    get_default_url: -> ""

    get_custom_url: -> @props.profile.get("image_custom")

    handle_image_file_upload: (e) ->
        console.log(e.target)

            state = "gravatar"
        else if image == @get_adorable_url()
            state = "adorable"
        else if image == @get_default_image_url()
            state = "default"
        else if image?.startsWith?("data:image")
            state = "custom"
