BoxShot v2.0: Mango, Logo, Pictures hub and more

So I got a fair bit of feedback from the old BoxShot logo and how most of my users disliked it (some even called it offensive). Now that I’ve had my fun I decided to put together a serious update for the app, here is what this new update (that I am calling v2.0) includes:

Icon173

NEW LOGO!

As mentioned before I have changed the logo, this gives the app a more professional look and fits in much better with the Metro UI of Windows Phone. Hope you all like it.

 

 

Its now Mango…

This version is build for Mango so it takes advantage of fast app switching and general Mango goodness.

Picture Hub Integration

BoxShot now integrates into the Pictures Hub, so you can share your photos through BoxShot to your dropbox folder.

New Dropbox API

Dropbox have recently updated their API to be more secure. For a user this pretty much means the login process has changed, so now instead of giving the app the Email and Password you login to the dropbox mobile site and give permission to BoxShot.Tile - Copy

Background Live Tile

The Live Tiles are now generated on the phone itself with a background agent, this makes them much more stable.

EmulatorContentsWhite

Referrals

BoxShot now lets you send out referral links to email or social networks so you can get that extra free space!

Others?

  • Some UI fixes (better following the metro style guide)
  • Few bug fixes (to do with ads and the tile colour picker)
  • Picture view now rotates and can pinch to zoom

 

 

 

 

 

Download it now from the Windows Phone Marketplace!

Ad-Free Version:

Free Version:

 

Future Versions

I’m always open to feedback about what new features users would like to see but heres a list of whats on the roadmap.

  • Pin Folders to start screen (maybe files as well)
  • Thumbnails for pictures
  • Fix bug when uploading files with international characters

Update:

All of the above features have now been implemented in v2.2 (Thumbnails and international characters fixed in v2.1)

BoxShot gets a live tile!

Following the recent release of my Windows Phone 7 app BoxShot, I have implemented a live tile displaying your dropbox.com quota info.

Boring old tile Fancy new tile Another fancy new tile
Default Blue Pink

 

Screen3Also, you can customise the colour of the tile from the settings screen.

Thats pretty much it for now, be sure to leave feedback for any new features you want!

BoxShot – Its like Dropbox on your phone…

BoxShotPanoramaPhone

BoxShot is a dropbox app for Windows Phone 7.

Screen1

Features:

  • Open files from your Dropbox using their default apps (Office files, PDFs, etc.)
  • View/Edit text files within BoxShot with the built in editor
  • View Image files within BoxShot and save them to your library
  • Copy/Move files or folders within your dropbox folder
  • Delete files or folder from your Dropbox folder
  • Rename files or folders in your Dropbox folder
  • Email a public file link
  • View Account usage information

 

 

 

 

Screen2BoxShot also lets you add your frequently used folder to a favourites list which are displayed on the main Panorama.

Premium Version:

Free Version:

DroppedBoxx v1.1 – Dropbox for Windows Mobile

So I have been developing a Dropbox Client for Windows Mobile called DroppedBoxx and I thought I’d take some time to talk about how it works, my plans for its future and talk about some of the new features of the latest version v1.1 which has now been released to the Windows Phone Marketplace and Handango.

 

Firstly, the new features in v1.1 include: (Full Changelog)

  • Two-way Syncing of selected folders
  • Updated UI (Labeled buttons, Background Uploading, Sync Folders screen is updated so you know when its syncing)
  • Bug fixes for the Attach to Email and errors caused by loss of connection
  • Added settings for camera resolution

Login:ScreenShot2

This screen is where the User Logs in user their dropbox account. Login button trys to login, keyboard button shows the Windows Mobile SIP keyboard. Exit button exits the app. Remember me saves your login details so next time you run the app your automatically logged in.

 

Sync Folders/Home Screen:

This is pretty much the Home screen for the application. From here you can add folders for Syncing by clicking New and browsing the phones file system and selecting a Folder to add. The Logout button on the top right obviously logs you out returning to the login screen.

The 5 Buttons down the bottom:

  • The Sync button starts the “Sync” process syncing the folders in the list to your dropbox account into a folder called “Droppedboxx” (Note: this feature is unavailable in the Beta versions, more on that later)
  • The Dropbox Button opens up the root folder of dropbox for you to browse.
  • The settings button opens the settings screen where you can change app settings (such as Clearing saved login, max file sizes and camera resolution.
  • The Info button is to show the dropbox User info, including quota and usage but also DroppedBoxx version information and data used by this DroppedBoxx session.
  • The Exit button closes the app.

ScreenShot3

Browse Dropbox:

This is where most of the functionality is, from this screen we can upload, download, delete, etc. files from Dropbox. Starting at the top, the Back Button takes you “up” a directory in the Dropbox file system or, if your in the dropbox root, takes you back to the Home Screen. The Upload button lets you browse the phones file system and select a file to upload.

Here you have a list of Files and folders that are in the current folder on Dropbox selecting a folder opens up that folder.

The bottom button panel:

  • The Camera button opens up the Windows Mobile camera application and when you take a photo it uploads it to the folder you are currently in in the Dropbox browser.
  • The new folder button simply creates a new folder in the current folder, opening up a dialog to enter the Name.
  • The Delete folder button Deletes the current folder your in (asking for confirmation first)
  • The Paste button is for moving/copying files, if you have a file in the “clipboard” pressing this button will ask if you want to copy or move the file to this folder. (More info in file menu)
  • The Back Button goes back to the sync folders screen (The Back button on the top left goes up a directory or back to sync folders if your in the dropbox root)

ScreenShot4 The File Menu:

This is the menu that comes up after selecting a dropbox file.

  • Save Button Downloads the selected file (opening a file system browser to set the download folder)
  • Email button, downloads the file to a temp folder and attaches it to a New email message in Pocket Outlook (assuming this is set up it firsts asks you to select the account)
  • The Copy button puts the selected file in the “clipboard” so you can paste it somewhere else in the dropbox file system (giving you options to Copy or Move the file)
  • The bin button deletes the selected file (asking for confirmation first)
  • The –Menu button simply closes the file menu (to allow access to the Folder menu again)

Settings:ScreenShot10

Here you can change the Settings of the application such as clearing saved login details, setting a max filesize for sycning and setting the camera resolution for camera uploads.

Information:

This screen displays application and user info. It shows the DroppedBoxx version number and data sent and received by the application for this session. As well as the users dropbox quota information.

 

DroppedBoxx can be downloaded from the Windows Phone Marketplace or Handango.

Also you can follow the discussion about this app by going to the thread on XDA.

Dropbox API, RestSharp and C# Part 2: The Revenge!

Following on from my previous post where I showed you how to Login and get the Account Info for a Dropbox account. Today we dive into the Box full of files. Uploading, Downloading and Deleting!

 

A lot has changed since my last post in the way of RestSharp with OAuth. OAuth is now available Out-of-the-box (this can be downloaded from Github). Ok, Time for some code…

Download File:

Update: Fixed a bug in the code that only allowed for text based files to be downloaded. Using restClient.DownloadData now instead of Execute to get the response’s raw Data.

public byte[] DownloadFile(string path)
{
    var restClient = new RestClient("http://api-content.dropbox.com");
    //load the JsonDeserializer for all types
    restClient.ClearHandlers();
    restClient.AddHandler("*", new JsonDeserializer());
    if (!path.StartsWith("/")) path = "/" + path;

    restClient.Authenticator = new OAuthAuthenticator(restClient.BaseUrl, _apiKey, _appsecret, _userLogin.Token, _userLogin.Secret);

    var request = new RestRequest(Method.GET);
    request.Resource = "{version}/files/dropbox{path}";
    request.AddParameter("version", _version, ParameterType.UrlSegment);
    request.AddParameter("path", path, ParameterType.UrlSegment);

    var responseData = restClient.DownloadData(request);

    return responseData;
}

Note: This is assuming the user has already logged in and we have the token/secret (_userLogin).

Starting from the top, we create a new Instance of the RestSharp Client with the baseUrl then set the Json Deserializer for all requests. We then set the RestClient’s Authenticator to the OAuthAuthenticator and give it our baseUrl, all our secrets and that is all we need to do for OAuth (the rest is build into RestSharp, awesome?!). Now we create the Request up, its a GET method, set the version and path of the file to download call Execute and you have just downloaded your first Dropbox API file! I then converted this to a stream so save back to a local file.

Delete File:

public bool DeleteFile(string path)
{
    var restClient = new RestClient("http://api.dropbox.com");
    //load the JsonDeserializer for all types
    restClient.ClearHandlers();
    restClient.AddHandler("*", new JsonDeserializer());

    if (!path.StartsWith("/")) path = "/" + path;

    restClient.Authenticator = new OAuthAuthenticator(_restClient.BaseUrl, _apiKey, _appsecret, _userLogin.Token, _userLogin.Secret);

    var request = new RestRequest(Method.GET);
    request.Resource = "{version}/fileops/delete";
    request.AddParameter("version", _version, ParameterType.UrlSegment);

    request.AddParameter("path", path);
    request.AddParameter("root", "dropbox");

    var response = restClient.Execute(request);

    return response.StatusCode == System.Net.HttpStatusCode.OK;
}

Delete is pretty similar to Download, only differences is the Url, the response and this time the path is sent as a parameter instead of part of the Url. The “root” parameter is for applications that only have sandbox access (they would set this to sandbox) who only get access to a “sandbox” folder on the users dropbox account.

Upload File:

Now this is where I had the most difficulties, many “Forbidden” messages later I finally came up with the solution!

public bool UploadFile(string path, FileInfo localFile)
{
    var restClient = new RestClient("http://api-content.dropbox.com");
    //load the JsonDeserializer for all types
    restClient.ClearHandlers();
    restClient.AddHandler("*", new JsonDeserializer());

    if (!path.StartsWith("/")) path = "/" + path;

    //Get the file stream
    byte[] bytes = null;
    FileStream fs = new FileStream(localFile.FullName, FileMode.Open, FileAccess.Read);
    BinaryReader br = new BinaryReader(fs);
    long numBytes = localFile.Length;
    bytes = br.ReadBytes((int)numBytes);

    restClient.Authenticator = new OAuthAuthenticator(_restClient.BaseUrl, _apiKey, _appsecret, _userLogin.Token, _userLogin.Secret);

    var request = new RestRequest(Method.POST);
    request.Resource = "{version}/files/dropbox{path}";
    request.AddParameter("version", _version, ParameterType.UrlSegment);
    request.AddParameter("path", path, ParameterType.UrlSegment);
    //Need to add the "file" parameter with the file name
    request.AddParameter("file", localFile.Name);

    request.AddFile(new FileParameter { Data = bytes, FileName = localFile.Name, ParameterName = "file" });

    var response = restClient.Execute(request);

    return response.StatusCode == System.Net.HttpStatusCode.OK;
}

Ok to start with the “path” variable/parameter is the folder path (not the file).

Starts off the same with the RestClient, JsonDeserializer and the OAuthAuthenticator. We also need to read the file as a byte array. Now this request is a POST so we set that in the RestRequest object then add the version and path Url parameters. We also need to add the Filename as a “file” parameter for this request as well as adding the actual file to the Request. Execute that and: {\"result\": \"winner!\"} we just uploaded a file to dropbox!

 

This code was taken from my Dropbox open source .NET project called DropNet.

Dropbox API and RestSharp for a C# developer

The Dropbox API has foiled my development of “Droppedboxx” for some time now. Mainly because the on site documentation is average for anyone not planning on developing for the iphone (dropbox, you used to be cool). Being a C# developer this was bad news for me but I decided to give it a go anyway and after a few weeks of failed attempts and a few emails to support about my issues I realised the API documentation on the dropbox website is slightly wrong.

So now that I have it working I thought i’d share this with my fellow .NET developers (and anyone else who will care to listen).

What you will need (What i used):

  • RestSharp (What would i do without you…)
  • Oauth Library for C# (this one seems the easiest to use with RestSharp)
  • Access to the Dropbox API and an APIKey/Secret for your app

I guess I should start with the Setup of it, I started this as a Windows Mobile application but I switched to a .NET library so I could test it easier and also use RestSharp (might open source the library if I get around to it).

 

Login, this is possibly the easiest method if you have the right URL (the API documentation give you the wrong URL). We should be using “https://api.getdropbox.com/0/token” Code you say?

Update: Got some helpful advice about using the request.Resource property with parameters instead of a string.format.

public UserLogin Login(string email, string password)
{
    var restClient = new RestClient("https://api.getdropbox.com");
    var request = new RestRequest(Method.GET);
    request.Resource = "{version}/token";
    request.AddParameter("version", _version, ParameterType.UrlSegment);

    request.AddParameter("oauth_consumer_key", _apiKey);

    request.AddParameter("email", email);
    request.AddParameter("password", password);

    var response = restClient.Execute<UserLogin>(request);

    _userLogin = response.Data;

    return response.Data;
}

Seems pretty easy right? Most of thats RestSharp (with the JSONDeserializer), I then have the UserLogin class which is returned by this function.

public class UserLogin
{
    public string Token { get; set; }
    public string Secret { get; set; }
}

And now your user is logged in, you will then want to store the Users Token and Secret (storing UserLogin object would probably be better) as its used for the rest of the requests. I’ll just show you how to get the User Info as the other requests differ from the login (that is where we’ll need the Oauth stuff).

 

Account/Info, I’ll start with the Response classes this time…

public class AccountInfo
{
    public string Country { get; set; }
    public string Display_Name { get; set; }
    public QuotaInfo Quota_Info { get; set; }
    public string Uid { get; set; }
}

public class QuotaInfo
{
    public string Shared { get; set; }
    public string Quota { get; set; }
    public string Normal { get; set; }
}

These are the classes for RestSharp to Deserialize the JSON to. Pretty simple, this is straight off the API Documentation site. Now for the actual request…

public AccountInfo Account_Info()
{
    var restClient = new RestClient("http://api.dropbox.com");
    OAuthBase oAuth = new OAuthBase();
    string nonce = oAuth.GenerateNonce();
    string timeStamp = oAuth.GenerateTimeStamp();
    string normalizedUrl;
    string normalizedRequestParameters;
    string sig = oAuth.GenerateSignature(new Uri(string.Format("{0}/{1}/account/info", restClient.BaseUrl, _version)),
        _apiKey, _appsecret,
        _userLogin.Token, _userLogin.Secret,
        "GET", timeStamp, nonce, out normalizedUrl, out normalizedRequestParameters);
    sig = HttpUtility.UrlEncode(sig);

    var request = new RestRequest(Method.GET);
    request.Resource = string.Format("{0}/account/info", _version);
    request.AddParameter("oauth_consumer_key", _apiKey);
    request.AddParameter("oauth_token", _userLogin.Token);
    request.AddParameter("oauth_nonce", nonce);
    request.AddParameter("oauth_timestamp", timeStamp);
    request.AddParameter("oauth_signature_method", "HMAC-SHA1");
    request.AddParameter("oauth_version", "1.0");
    request.AddParameter("oauth_signature", sig);

    var response = restClient.Execute<AccountInfo>(request);

    return response.Data;
}

Now, this request has a different Base Url to the Login function and this uses OAuth. So firstly we create an instance of the RestSharp client and the OAutheBase classes. The OAuthBase class then handles all of the oauth parameters that we need to make the Request (nonce, timestamp, etc.). GenerateSignature is the main 1 that rolls up the request path and the tokens/secrets into a hash for extra security. As for the dropbox part of this, we dont need any extra parameters as we are just getting the logged in users Account Info. Then its just a matter of adding these parameters to the RestRequest object, notice the oauth_token is actually the UserLogin.Token that we got from our Login method?

 

Stay tuned for more, Tales of interest!

 

Update: I have added a Part 2 to this post.