Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Example for dragging files from the desktop to any CPView in a Cappuccino app running in a browser.
Objective-J JavaScript
Branch: master
Failed to load latest commit information.
Frameworks
Resources
AppController.j
DCFileDropCollectionViewController.j
DCFileDropCollectionViewItemView.j
DCFileDropController.j
DCFileDropRowView.j
DCFileDropTableViewController.j
DCFileUpload.j
DCFileUploadManager.j
DCFileUploadsPanel.j
DCFileUploadsRowView.j
DCProgressIndicator.j
DragDropUpload.atlasproj
Info.plist
Jakefile
README.markdown
index-debug.html
index.html
main.j
upload.php

README.markdown

Deep Drop Upload

Example

These classes allow you to turn any CPView in a Cappuccino app into a file upload drop zone. It supports multiple files dropped at once. It works in Safari and Chrome. Firefox support is possible, but hasn't been added.

The most useful classes are:

  • DCFileDropController.j
  • DCFileUploadManager.j
  • DCFileUpload.j

Usage

Import these classes:

@import "DCFileDropController.j"
@import "DCFileUploadManager.j"

Apply a DCFileDropController to any CPView:

var fileDropUploadController = [[DCFileDropController alloc] 
    initWithView:anyView 
    dropDelegate:self 
    uploadURL:[CPURL URLWithString:@"upload.php"] 
    uploadManager:[DCFileUploadManager sharedManager]];

If you want to change visual state of the view, you can do that with this dropDelegate method:

- (void)fileDropUploadController:(DCFileDropController)theController setState:(BOOL)visible {
    if (visible) {
        [theController.view setBackgroundColor:[CPColor colorWithRed:0.0 green:0.0 blue:1.0 alpha:0.2]];
    } else {
        [theController.view setBackgroundColor:[CPColor clearColor]];
    }
}

If you want to display progress, you can set the DCFileUploadManager delegate:

[[DCFileUploadManager sharedManager] setDelegate:uploadsPanel];

And process it with this method:

- (void)fileUploadManagerDidChange:(DCFileUploadManager)theManager {
    var fileUploads = [theManager fileUploads];
}

Attribution

This technique is based on code from CSS Ninja.

License

MIT License

Something went wrong with that request. Please try again.