Dropbox Selector

1.  PMG Dropbox Selector: used to browse a users dropbox and user can select a file.  The file info is saved in umbraco.

 

2.  PMG Dropbox Save: allows a user to save a media item to dropbox.  For now this ONLY works on images inside of the media section because I haven't figured out how to generate the public url for a node using the umbraco angular services.

 

You will need to sign up for a dropbox dropins api key here:  https://www.dropbox.com/developers/apps/create

 

Enter your api key on the data type.

 

Add the data type to your document type and you can now select a file from dropbox.

  

The information is stored in the following format (JSON):

{

    // Name of the file.

    name: "filename.txt",

    // URL to access the file, which varies depending on the linkType specified when the

    // Chooser was triggered.

    link: "https://...",

    // Size of the file in bytes.

    bytes: 464,

    // URL to a 64x64px icon for the file based on the file's extension.

    icon: "https://...",

    // A thumbnail URL generated when the user selects images and videos.

    // If the user didn't select an image or video, no thumbnail will be included.

    thumbnailLink: "https://...?bounding_box=75&mode=fit",

}

 

Assuming you have a document property named "dropbox",  you can extract the json info like this:

 var dropBoxFile = Json.Decode<Dictionary<string, string>>(Umbraco.Field("dropbox").ToString());

 ...

 <h1>@dropBoxFile["name"]</h1>

  

  

Just add it to a media type and the user can click to save their media image file to dropbox.  This won't work from localhost.

******************

  

Notes:

You need to sign up for an api key

 

You must touch the web.config/flush cache after installing.

 

This package uses the dropbox dropin javascript component.  It doesn't allow much configuration of how it looks when it opens.