diff --git a/apps/gallery/index.html b/apps/gallery/index.html
index dffce4c34561..3997224a2329 100644
--- a/apps/gallery/index.html
+++ b/apps/gallery/index.html
@@ -45,10 +45,14 @@
 
     <!-- Specific code -->
     <script defer src="js/config.js"></script>
+    <script defer src="js/utils.js"></script>
     <script defer src="js/thumbnail_item.js"></script>
     <script defer src="js/thumbnail_date_group.js"></script>
     <script defer src="js/thumbnail_list.js"></script>
     <script defer src="js/ensure_file_backed_blob.js"></script>
+    <script defer src="js/spinner.js"></script>
+    <script defer src="js/overlay.js"></script>
+    <script defer src="js/nfc.js"></script>
     <script defer src="js/gallery.js"></script>
   </head>
 
@@ -233,10 +237,12 @@ <h1 id="edit-title" data-l10n-id="edit"></h1>
       <div id="throbber"></div>
     </div>
 
+    <!-- See spinner.js -->
     <!-- a spinner that we display in the center of the screen when -->
     <!-- doing time-consuming operations like rotating images -->
     <progress id="spinner" class="hidden"></progress>
 
+    <!-- See overlay.js -->
     <!-- display messages like "No Photos" and "No SD Card" here -->
     <form id="overlay" role="dialog" data-type="confirm" class="hidden">
       <section id="overlay-content">
diff --git a/apps/gallery/js/ImageEditor.js b/apps/gallery/js/ImageEditor.js
index b0e0803c01ae..f23e241541ac 100644
--- a/apps/gallery/js/ImageEditor.js
+++ b/apps/gallery/js/ImageEditor.js
@@ -84,11 +84,11 @@ function editPhoto(n) {
     var maxsize = CONFIG_MAX_EDIT_PIXEL_SIZE || CONFIG_MAX_IMAGE_PIXEL_SIZE;
 
     if (metadata.rotation || metadata.mirrored || imagesize > maxsize) {
-      showSpinner();
+      Spinner.show();
       cropResizeRotate(file, null, maxsize || null,
                        null, metadata,
                        function(error, rotatedBlob) {
-                         hideSpinner();
+                         Spinner.hide();
                          if (error) {
                            console.error('Error while rotating image:', error);
                            rotatedBlob = file;
diff --git a/apps/gallery/js/frames.js b/apps/gallery/js/frames.js
index 312867ccea16..86ddb321fdaf 100644
--- a/apps/gallery/js/frames.js
+++ b/apps/gallery/js/frames.js
@@ -44,10 +44,11 @@ fullscreenButtons.delete.onclick = deleteSingleItem;
 
 // Clicking the Edit button while viewing a photo switches to edit mode
 fullscreenButtons.edit.onclick = function() {
-  loader.load(['js/ImageEditor.js', 'shared/js/media/crop_resize_rotate.js'],
-              function() {
-                editPhotoIfCardNotFull(currentFileIndex);
-              });
+  LazyLoader.load(['js/ImageEditor.js',
+                   'shared/js/media/crop_resize_rotate.js'],
+                  function() {
+                    editPhotoIfCardNotFull(currentFileIndex);
+                  });
 };
 
 // In fullscreen mode, the share button shares the current item
@@ -55,10 +56,10 @@ fullscreenButtons.share.onclick = shareSingleItem;
 
 // Clicking the information button will display information about the photo.
 fullscreenButtons.info.onclick = function() {
-  loader.load(['js/info.js', 'shared/style/confirm.css', 'style/info.css'],
-              function() {
-                showFileInformation(files[currentFileIndex]);
-              });
+  LazyLoader.load(['js/info.js', 'shared/style/confirm.css', 'style/info.css'],
+                  function() {
+                    showFileInformation(files[currentFileIndex]);
+                  });
 };
 
 // Use the GestureDetector.js library to handle gestures.
@@ -133,7 +134,7 @@ function deleteSingleItem() {
     msg = 'delete-photo?';
   }
   // We need to disable NFC sharing when showing delete confirmation dialog
-  setNFCSharing(false);
+  NFC.unshare();
 
   Dialogs.confirm({
     messageId: msg,
@@ -149,10 +150,10 @@ function deleteSingleItem() {
 
     deleteFile(currentFileIndex);
     // Enable NFC sharing when done deleting and returns to fullscreen view
-    setNFCSharing(true);
+    NFC.share(getCurrentFile);
   }, function() { // onCancel
     // Enable NFC sharing when cancels delete and returns to fullscreen view
-    setNFCSharing(true);
+    NFC.share(getCurrentFile);
   });
 }
 
@@ -178,8 +179,8 @@ function shareSingleItem() {
       // This is only tricky case. If we are sharing an image that uses
       // EXIF orientation for correct display, rotate it before sharing
       // so that the recieving app doesn't have to know about EXIF
-      loader.load(['shared/js/media/crop_resize_rotate.js'],
-                  shareModifiedImage);
+      LazyLoader.load(['shared/js/media/crop_resize_rotate.js'],
+                      shareModifiedImage);
     }
   }
 
@@ -187,7 +188,7 @@ function shareSingleItem() {
     var metadata = fileinfo.metadata;
     var button = fullscreenButtons.share;
     button.classList.add('disabled');
-    showSpinner();
+    Spinner.show();
     var maxsize = CONFIG_MAX_PICK_PIXEL_SIZE || CONFIG_MAX_IMAGE_PIXEL_SIZE;
     cropResizeRotate(currentFrame.imageblob, null,
                      maxsize || null, null, metadata,
@@ -197,7 +198,7 @@ function shareSingleItem() {
                          rotatedBlob = currentFrame.imageblob;
                        }
                        ensureFileBackedBlob(rotatedBlob, function(file) {
-                         hideSpinner();
+                         Spinner.hide();
                          button.classList.remove('disabled');
                          share([file], currentFrame.imageblob.name);
                        });
diff --git a/apps/gallery/js/gallery.js b/apps/gallery/js/gallery.js
index 6a8a3ba472c2..e597c18841a0 100644
--- a/apps/gallery/js/gallery.js
+++ b/apps/gallery/js/gallery.js
@@ -42,8 +42,6 @@ var TRANSITION_SPEED = 0.75;
 // Batch sizes are based on this.
 var PAGE_SIZE = 15;
 
-function $(id) { return document.getElementById(id); }
-
 // UI elements
 var thumbnails = $('thumbnails');
 
@@ -108,7 +106,8 @@ var videostorage;
 
 var isInitThumbnail = false;
 
-var loader = LazyLoader;
+// If we're doing a pick activity, this variable will be true
+var picking;
 
 // Flag that indicates that we've edited a picture and just saved it
 var justSavedEditedImage = false;
@@ -117,8 +116,6 @@ var justSavedEditedImage = false;
 // selected thumbnails.
 var lastFocusedThumbnail = null;
 
-var currentOverlay;  // The id of the current overlay or null if none.
-
 // Have we completed our first scan yet?
 var firstScanDone = false;
 
@@ -132,7 +129,7 @@ navigator.mozL10n.once(function showBody() {
 
   // load frame_script.js for preview mode and show loading background
   if (!isPhone) {
-    loader.load('js/frame_scripts.js');
+    LazyLoader.load('js/frame_scripts.js');
   }
 
   // Now initialize the rest of the app.
@@ -149,15 +146,6 @@ function init() {
   $('selected-header').addEventListener('action',
     setView.bind(null, LAYOUT_MODE.list));
 
-  // Clicking on the pick back button cancels the pick activity.
-  $('pick-header').addEventListener('action', cancelPick);
-
-  // In crop view, the back button goes back to pick view
-  $('crop-top').addEventListener('action', function() {
-    setView(LAYOUT_MODE.pick);
-    cleanupCrop();
-  });
-
   if (!isPhone) {
     $('fullscreen-toolbar-header').addEventListener('action', function() {
       setView(LAYOUT_MODE.list);
@@ -168,7 +156,7 @@ function init() {
   fullscreenButtons.camera.onclick = launchCameraApp;
 
   $('thumbnails-camera-button').onclick = launchCameraApp;
-  $('overlay-camera-button').onclick = launchCameraApp;
+  Overlay.addEventListener('camera', launchCameraApp);
 
   // Clicking on the delete button in thumbnail select mode deletes all
   // selected items
@@ -177,9 +165,12 @@ function init() {
   // Clicking on the share button in select mode shares all selected images
   $('thumbnails-share-button').onclick = shareSelectedItems;
 
-  $('overlay-cancel-button').onclick = function() {
-    cancelPick();
-  };
+  Overlay.addEventListener('cancel', function() {
+    if (picking) {
+      Pick.cancel();
+    }
+  });
+
   // Handle resize events
   window.onresize = resizeHandler;
 
@@ -220,12 +211,9 @@ function init() {
       }
       break;
     case 'pick':
-      if (pendingPick) // I don't think this can really happen anymore
-        cancelPick();
-      pendingPick = a; // We need pendingPick set before calling initDB()
-      if (!photodb)
-        initDB();
-      startPick();
+      picking = true;
+      initDB();
+      LazyLoader.load('js/pick.js', function() { Pick.start(a); });
       break;
     }
   });
@@ -255,8 +243,8 @@ function initDB() {
       return;
     }
 
-    loader.load(['js/metadata_scripts.js',
-                 'shared/js/media/crop_resize_rotate.js'], function() {
+    LazyLoader.load(['js/metadata_scripts.js',
+                     'shared/js/media/crop_resize_rotate.js'], function() {
       loaded = true;
       metadataParser(file, onsuccess, onerror, bigFile);
     });
@@ -264,7 +252,7 @@ function initDB() {
 
   // show dialog in upgradestart, when it finished, it will turned to ready.
   photodb.onupgrading = function(evt) {
-    showOverlay('upgrade');
+    Overlay.show('upgrade');
   };
 
   // This is called when DeviceStorage becomes unavailable because the
@@ -287,16 +275,16 @@ function initDB() {
     // Lock the user out of the app, and tell them why
     var why = event.detail;
     if (why === MediaDB.NOCARD)
-      showOverlay('nocard');
+      Overlay.show('nocard');
     else if (why === MediaDB.UNMOUNTED)
-      showOverlay('pluggedin');
+      Overlay.show('pluggedin');
   };
 
   photodb.onready = function() {
     // Hide the nocard or pluggedin overlay if it is displayed
-    if (currentOverlay === 'nocard' || currentOverlay === 'pluggedin' ||
-        currentOverlay === 'upgrade')
-      showOverlay(null);
+    if (Overlay.current === 'nocard' || Overlay.current === 'pluggedin' ||
+        Overlay.current === 'upgrade')
+      Overlay.hide();
 
     initThumbnails();
   };
@@ -313,8 +301,8 @@ function initDB() {
     // Allows the user to edit images when scanning is finished
     fullscreenButtons.edit.classList.remove('disabled');
 
-    if (currentOverlay === 'scanning')
-      showOverlay('emptygallery');
+    if (Overlay.current === 'scanning')
+      Overlay.show('emptygallery');
     else if (!isPhone && !currentFrame.displayingImage &&
              !currentFrame.displayingVideo) {
       // focus on latest one if client hasn't clicked any of
@@ -342,8 +330,8 @@ function initDB() {
   // a photo that is no longer available.
   photodb.oncardremoved = function oncardremoved() {
     // If the user pulls the sdcard while trying to pick an image, give up
-    if (pendingPick) {
-      cancelPick();
+    if (picking) {
+      Pick.cancel();
       return;
     }
 
@@ -376,6 +364,29 @@ function getVideoFile(filename, callback) {
   };
 }
 
+// Return a Promise that resolves to the File object of the currently
+// displayed image or video.
+// XXX This function is temporarily added here as part of NFC
+// refactoring, but will be moved into the model module.
+function getCurrentFile() {
+  return new Promise(function(resolve, reject) {
+    var fileInfo = files[currentFileIndex];
+
+    if (fileInfo.metadata.video) {
+      getVideoFile(fileInfo.metadata.video, function(file) {
+        resolve(file);
+      });
+    } else {
+      // share photo
+      photodb.getFile(fileInfo.name, function(file) {
+        resolve(file);
+      }, function(errmsg) {
+        reject(errmsg);
+      });
+    }
+  });
+}
+
 // This comparison function is used for sorting arrays and doing binary
 // search on the resulting sorted arrays.
 function compareFilesByDate(a, b) {
@@ -427,7 +438,7 @@ function initThumbnails() {
   photodb.enumerate('date', null, 'prev', function(fileinfo) {
     if (fileinfo) {
       // For a pick activity, don't display videos
-      if (pendingPick && fileinfo.metadata.video)
+      if (picking && fileinfo.metadata.video)
         return;
 
       // Bug 1003036 fixed an issue where explicitly created preview
@@ -474,7 +485,7 @@ function initThumbnails() {
   function done() {
     flush();
     if (files.length === 0) { // If we didn't find anything
-      showOverlay('scanning');
+      Overlay.show('scanning');
     }
 
     // Send a custom event to performance monitors to note that we're done
@@ -561,7 +572,7 @@ function fileDeleted(filename) {
   if (files.length === 0) {
     if (currentView !== LAYOUT_MODE.pick)
       setView(LAYOUT_MODE.list);
-    showOverlay('emptygallery');
+    Overlay.show('emptygallery');
   }
 }
 
@@ -594,7 +605,7 @@ function deleteFile(n) {
 function fileCreated(fileinfo) {
   // If the new file is a video and we're handling an image pick activity
   // then we won't display the new file.
-  if (pendingPick && fileinfo.metadata.video)
+  if (picking && fileinfo.metadata.video)
     return;
 
   // The fileinfo object that MediaDB sends us has a thumbnail blob in it,
@@ -608,8 +619,8 @@ function fileCreated(fileinfo) {
     var insertPosition;
 
     // If we were showing the 'no pictures' overlay, hide it
-    if (currentOverlay === 'emptygallery' || currentOverlay === 'scanning')
-      showOverlay(null);
+    if (Overlay.current === 'emptygallery' || Overlay.current === 'scanning')
+      Overlay.hide();
 
     // Create a thumbnailItem for this image and insert it at the right spot
     var thumbnailItem = thumbnailList.addItem(fileinfo);
@@ -711,12 +722,12 @@ function setView(view) {
       scrollToShowThumbnail(currentFileIndex);
       if (currentView === LAYOUT_MODE.fullscreen) {
         // only do it when we back from fullscreen.
-        setNFCSharing(false);
+        NFC.unshare();
       }
       break;
     case LAYOUT_MODE.fullscreen:
       resizeFrames();
-      setNFCSharing(true);
+      NFC.share(getCurrentFile);
       break;
     case LAYOUT_MODE.select:
       clearSelection();
@@ -725,7 +736,7 @@ function setView(view) {
         currentFrame.video.pause();
       break;
     case LAYOUT_MODE.edit:
-      setNFCSharing(false);
+      NFC.unshare();
       break;
   }
 
@@ -742,321 +753,6 @@ function setView(view) {
   currentView = view;
 }
 
-function setNFCSharing(enable) {
-  if (!window.navigator.mozNfc) {
-    return;
-  }
-
-  if (enable) {
-    // If we have NFC, we need to put the callback to have shrinking UI.
-    window.navigator.mozNfc.onpeerready = function(event) {
-      // The callback function is called when user confirm to share the
-      // content, send it with NFC Peer.
-      var fileInfo = files[currentFileIndex];
-      if (fileInfo.metadata.video) {
-        // share video
-        getVideoFile(fileInfo.metadata.video, function(file) {
-          event.peer.sendFile(file);
-        });
-      } else {
-        // share photo
-        photodb.getFile(fileInfo.name, function(file) {
-          event.peer.sendFile(file);
-        });
-      }
-    };
-  } else {
-    // We need to remove onpeerready while out of fullscreen view.
-    window.navigator.mozNfc.onpeerready = null;
-  }
-}
-
-//
-// Pick activity
-//
-
-var pendingPick;
-var pickType;
-var pickWidth, pickHeight;
-var pickedFileInfo;
-var cropEditor;
-
-function startPick() {
-  pickType = pendingPick.source.data.type;
-
-  if (pendingPick.source.data.width && pendingPick.source.data.height) {
-    pickWidth = pendingPick.source.data.width;
-    pickHeight = pendingPick.source.data.height;
-  }
-  else {
-    pickWidth = pickHeight = 0;
-  }
-
-  setView(LAYOUT_MODE.pick);
-
-  var pickHeading = $('pick-header-title');
-  // re-run the font-fit logic when header is visible
-   pickHeading.textContent = pickHeading.textContent;
-}
-
-// Called when the user clicks on a thumbnail in pick mode
-function cropPickedImage(fileinfo) {
-  pickedFileInfo = fileinfo;
-
-  // Do we actually want to allow the user to crop the image?
-  var nocrop = pendingPick.source.data.nocrop;
-
-  if (nocrop) {
-    // If we're not cropping show file name in the title bar
-    // XXX: UX will probably get rid of this title bar soon, anyway.
-    var fileName = pickedFileInfo.name.split('/').pop();
-    $('crop-header').textContent =
-     fileName.substr(0, fileName.lastIndexOf('.')) || fileName;
-  }
-
-  setView(LAYOUT_MODE.crop);
-
-  // Before the picked image is loaded, the done button is disabled
-  // to avoid users picking a black/empty image.
-  var doneButton = $('crop-done-button');
-  doneButton.disabled = true;
-
-  // We need all of these for cropping the photo:
-  //  - ImageEditor to display the crop overlay.
-  //  - frame_scripts because it has gesture_detector in it.
-  //  - crop_resize_rotate.js scripts for cropResizeRotate().
-  loader.load(['js/frame_scripts.js',
-               'shared/js/media/crop_resize_rotate.js',
-               'js/ImageEditor.js'], gotScripts);
-
-  // When the scripts we need are loaded, load the picked file we need
-  function gotScripts() {
-    photodb.getFile(pickedFileInfo.name, gotFile);
-  }
-
-  // This is called with the file that needs to be cropped
-  function gotFile(pickedFile) {
-    var previewData = pickedFileInfo.metadata.preview;
-    if (!previewData) {
-      // If there is no preview at all, this is a small image and
-      // it is its own preview. Just crop with the full-size image
-      startCrop();
-    }
-    else if (previewData.filename) {
-      // If there is an external preview file, use that. This means that
-      // the EXIF preview was not big enough
-      var storage = navigator.getDeviceStorage('pictures');
-      var getreq = storage.get(previewData.filename);
-      getreq.onsuccess = function() {
-        startCrop(getreq.result);
-      };
-      // If we fail to get the preview file, just use the full-size image
-      getreq.onerror = function() {
-        startCrop();
-      };
-    }
-    else {
-      // Otherwise, use the internal EXIF preview.
-      // This should be the normal case.
-      startCrop(pickedFile.slice(previewData.start,
-                                 previewData.end,
-                                 'image/jpeg'));
-    }
-
-    function startCrop(previewBlob) {
-      // Before the user can crop the image we have to create a
-      // preview of the image at the correct size and orientation
-      // if we do not already have one.
-      var blob, metadata, outputSize, useSpinner;
-
-      if (previewBlob) {
-        // If there is a preview, use it at full size. If we're using
-        // a preview we need to pass the size of the preview, but the
-        // EXIF orientation data from the fullsize image.
-        blob = previewBlob;
-        metadata = {
-          width: previewData.width,
-          height: previewData.height,
-          rotation: pickedFileInfo.metadata.rotation,
-          mirrored: pickedFileInfo.metadata.mirrored
-        };
-        outputSize = null;
-        useSpinner = false;
-      }
-      else {
-        // If there is no preview, use the picked file, but specify a maximum
-        // size so we don't decode at a size larger than needed.
-        blob = pickedFile;
-        metadata = pickedFileInfo.metadata;
-        var windowSize = window.innerWidth * window.innerHeight *
-          window.devicePixelRatio * window.devicePixelRatio;
-        outputSize = Math.min(windowSize,
-                              CONFIG_MAX_PICK_PIXEL_SIZE ||
-                              CONFIG_MAX_IMAGE_PIXEL_SIZE);
-        useSpinner = metadata.width * metadata.height > outputSize;
-      }
-
-      // Make sure the image is rotated correctly so that it appears
-      // right side up in the crop UI. Note that we only display a spinner
-      // here if we have to downsample a large image.
-      if (useSpinner) {
-        showSpinner();
-      }
-      cropResizeRotate(blob, null, outputSize, null, metadata, gotRotatedBlob);
-    }
-
-    function gotRotatedBlob(error, rotatedBlob) {
-      hideSpinner();
-      if (error) {
-        console.error('Error while rotating image:', error);
-        rotatedBlob = pickedFile;
-      }
-      cropEditor = new ImageEditor(rotatedBlob, $('crop-frame'), {},
-                                   cropEditorReady, true);
-    }
-
-    function cropEditorReady() {
-      // Enable the done button so that users can finish picking image.
-      doneButton.onclick = cropAndEndPick;
-      doneButton.disabled = false;
-
-      // If the initiating app doesn't want to allow the user to crop
-      // the image, we don't display the crop overlay. But we still use
-      // this image editor to preview the image.
-      if (nocrop) {
-        // Set a fake crop region even though we won't display it
-        // so that hasBeenCropped() works.
-        cropEditor.cropRegion.left = cropEditor.cropRegion.top = 0;
-        cropEditor.cropRegion.right = cropEditor.dest.w;
-        cropEditor.cropRegion.bottom = cropEditor.dest.h;
-        return;
-      }
-
-      cropEditor.showCropOverlay();
-      if (pickWidth)
-        cropEditor.setCropAspectRatio(pickWidth, pickHeight);
-      else
-        cropEditor.setCropAspectRatio(); // free form cropping
-    }
-
-    function cropAndEndPick() {
-      // First, figure out what kind of image to return to the requesting app.
-      // If the activity request specifically included 'image/jpeg' or
-      // 'image/png', then we'll use that type. Otherwise, if a generic
-      // 'image/*' was requested (or if an unsupported type was requested)
-      // then we use null as the type. This value is passed to
-      // cropResizeRotate() and will leave the image unchanged if possible
-      // or will use jpeg if changes are needed.
-      if (Array.isArray(pickType)) {
-        if (pickType.indexOf(pickedFileInfo.type) !== -1) {
-          pickType = pickedFileInfo.type;
-        }
-        else if (pickType.indexOf('image/jpeg') !== -1) {
-          pickType = 'image/jpeg';
-        }
-        else if (pickType.indexOf('image/png') !== -1) {
-          pickType = 'image/png';
-        }
-        else {
-          pickType = null; // Return unchanged or convert to JPEG
-        }
-      }
-      else if (pickType === 'image/*') {
-        pickType = null;   // Return unchanged or convert to JPEG
-      }
-
-      if (pickType && pickType !== 'image/jpeg' && pickType !== 'image/png')
-        pickType = null;   // Return unchanged or convert to JPEG
-
-      // In order to determine the cropRegion and outputSize arguments to
-      // cropResizeRotate() below we need to know the actual image size.
-      // If the image has EXIF rotation, we need to take that into account.
-      var fullImageWidth, fullImageHeight;
-      var rotation = pickedFileInfo.metadata.rotation || 0;
-      if (rotation === 90 || rotation === 270) {
-        fullImageWidth = pickedFileInfo.metadata.height;
-        fullImageHeight = pickedFileInfo.metadata.width;
-      }
-      else {
-        fullImageWidth = pickedFileInfo.metadata.width;
-        fullImageHeight = pickedFileInfo.metadata.height;
-      }
-
-      var cropRegion;
-
-      if (pendingPick.source.data.nocrop || !cropEditor.hasBeenCropped()) {
-        cropRegion = null;
-      }
-      else {
-        // Get the user's crop region from the crop editor
-        cropRegion = cropEditor.getCropRegion();
-
-        // Scale to match the actual image size
-        cropRegion.left = Math.round(cropRegion.left * fullImageWidth);
-        cropRegion.top = Math.round(cropRegion.top * fullImageHeight);
-        cropRegion.width = Math.round(cropRegion.width * fullImageWidth);
-        cropRegion.height = Math.round(cropRegion.height * fullImageHeight);
-      }
-
-      var outputSize;
-      if (pickWidth && pickHeight) {
-        outputSize = { width: pickWidth, height: pickHeight };
-      }
-      else {
-        outputSize = CONFIG_MAX_PICK_PIXEL_SIZE || CONFIG_MAX_IMAGE_PIXEL_SIZE;
-      }
-
-      // show spinner if cropResizeRotate will decode and modify the image
-      if (cropRegion !== null ||
-          typeof outputSize === 'object' ||
-          outputSize < fullImageWidth * fullImageHeight ||
-          pickedFileInfo.metadata.rotation ||
-          pickedFileInfo.metadata.mirrored) {
-        showSpinner();
-      }
-      cropResizeRotate(pickedFile, cropRegion, outputSize, pickType,
-                       pickedFileInfo.metadata,
-                       function(error, blob) {
-                         hideSpinner();
-                         if (error) {
-                           console.error('while resizing image: ' + error);
-                           blob = pickedFile;
-                         }
-                         endPick(blob);
-                       });
-    }
-  }
-}
-
-function endPick(blob) {
-  ensureFileBackedBlob(blob, function(file) {
-    pendingPick.postResult({
-      type: blob.type,
-      blob: file
-    });
-    cleanupPick();
-  });
-}
-
-function cancelPick() {
-  pendingPick.postError('pick cancelled');
-  cleanupPick();
-}
-
-function cleanupCrop() {
-  if (cropEditor) {
-    cropEditor.destroy();
-    cropEditor = null;
-  }
-}
-
-function cleanupPick() {
-  cleanupCrop();
-  pendingPick = null;
-  pickedFileInfo = null;
-  setView(LAYOUT_MODE.list);
-}
-
 //
 // Event handlers
 //
@@ -1071,12 +767,12 @@ function thumbnailClickHandler(evt) {
     return;
 
   var index = getFileIndex(target.dataset.filename);
-  if (currentView === LAYOUT_MODE.pick && index >= 0) {
-      cropPickedImage(files[index]);
+  if (picking && currentView === LAYOUT_MODE.pick && index >= 0) {
+      Pick.select(files[index]);
   } else if (currentView === LAYOUT_MODE.select) {
     updateSelection(target);
   } else {
-    loader.load('js/frame_scripts.js', function() {
+    LazyLoader.load('js/frame_scripts.js', function() {
       if (isPortrait || isPhone) {
         setView(LAYOUT_MODE.fullscreen);
       }
@@ -1352,21 +1048,6 @@ function resizeHandler() {
   }
 }
 
-//
-// Overlay messages
-//
-function showOverlay(id) {
-  currentOverlay = id;
-  Dialogs.showOverlay(id);
-}
-
-// XXX
-// Until https://bugzilla.mozilla.org/show_bug.cgi?id=795399 is fixed,
-// we have to add a dummy click event handler on the overlay in order to
-// make it opaque to touch events. Without this, it does not prevent
-// the user from interacting with the UI.
-$('overlay').addEventListener('click', function dummyHandler() {});
-
 // Change the thumbnails quality while scrolling using the scrollstart/scrollend
 // events from shared/js/scroll_detector.js.
 window.addEventListener('scrollstart', function onScrollStart(e) {
@@ -1377,14 +1058,6 @@ window.addEventListener('scrollend', function onScrollEnd(e) {
   thumbnails.classList.remove('scrolling');
 });
 
-function showSpinner() {
-  $('spinner').classList.remove('hidden');
-}
-
-function hideSpinner() {
-  $('spinner').classList.add('hidden');
-}
-
 /*
  * This is a temporary workaround to bug 1039943: when the user launches
  * the gallery and then switches to another app gallery's scanning and
diff --git a/apps/gallery/js/imagesize.js b/apps/gallery/js/imagesize.js
deleted file mode 100644
index 8674c1469516..000000000000
--- a/apps/gallery/js/imagesize.js
+++ /dev/null
@@ -1,63 +0,0 @@
-/*
- * Determine the pixel dimensions of an image without actually
- * decoding the image. Passes an object of metadata to the callback
- * function on success or an error message to the error function on
- * failure. The metadata object will include type, width and height
- * properties. Supported image types are GIF, PNG and JPEG. JPEG
- * metadata may also include information about an EXIF preview image.
- *
- * Because of shortcomings in the way Gecko handles images, the
- * Gallery app will crash with an OOM error if it attempts to decode
- * and display an image that is too big. Images require 4 bytes per
- * pixel, so a 10 megapixel photograph requires 40 megabytes of image
- * memory. This function gives the gallery app a way to reject images
- * that are too large.
- *
- * Requires the BlobView class from shared/js/blobview.js and the
- * parseJPEGMetadata() function from shared/js/media/jpeg_metadata_parser.js
- */
-function getImageSize(blob, callback, error) {
-  BlobView.get(blob, 0, Math.min(1024, blob.size), function(data) {
-    // Make sure we are at least 8 bytes long before reading the first 8 bytes
-    if (data.byteLength <= 8) {
-      error('corrupt image file');
-      return;
-    }
-    var magic = data.getASCIIText(0, 8);
-    if (magic.substring(0, 4) === 'GIF8') {
-      try {
-        callback({
-          type: 'gif',
-          width: data.getUint16(6, true),
-          height: data.getUint16(8, true)
-        });
-      }
-      catch (e) {
-        error(e.toString());
-      }
-    }
-    else if (magic.substring(0, 8) === '\x89PNG\r\n\x1A\n') {
-      try {
-        callback({
-          type: 'png',
-          width: data.getUint32(16, false),
-          height: data.getUint32(20, false)
-        });
-      }
-      catch (e) {
-        error(e.toString());
-      }
-    }
-    else if (magic.substring(0, 2) === '\xFF\xD8') {
-      parseJPEGMetadata(blob,
-                        function(metadata) {
-                          metadata.type = 'jpeg';
-                          callback(metadata);
-                        },
-                        error);
-    }
-    else {
-      error('unknown image type');
-    }
-  });
-}
diff --git a/apps/gallery/js/info.js b/apps/gallery/js/info.js
index 6a550379dc4b..b88b14804570 100644
--- a/apps/gallery/js/info.js
+++ b/apps/gallery/js/info.js
@@ -1,7 +1,7 @@
 // Hide the information view again, when clicking on cancel
 $('info-close-button').onclick = function hideFileInformation() {
   // Enable NFC sharing when user closes info and returns to fullscreen view
-  setNFCSharing(true);
+  NFC.share(getCurrentFile);
   $('info-view').classList.add('hidden');
 };
 
@@ -17,7 +17,7 @@ function showFileInformation(fileinfo) {
     populateMediaInfo(fileinfo);
   }
   // We need to disable NFC sharing when showing file info view
-  setNFCSharing(false);
+  NFC.unshare();
   $('info-view').classList.remove('hidden');
 
   function populateMediaInfo(fileinfo) {
diff --git a/apps/gallery/js/nfc.js b/apps/gallery/js/nfc.js
new file mode 100644
index 000000000000..66fe52ddd7db
--- /dev/null
+++ b/apps/gallery/js/nfc.js
@@ -0,0 +1,35 @@
+/* exported NFC */
+
+'use strict';
+
+/*
+ * This module helps to manage NFC sharing in an app.
+ * Call share() when the UI displays an object that can be shared as a file.
+ * Pass the file or blob object itself or a function that returns a Promise
+ * that resolves to the file.
+ * When the UI changes so that no sharable object is visible, call unshare().
+ */
+var NFC = {
+  share: function share(f) {
+    // Enable NFC sharing by defining a "peerready" callback that
+    // calls sendFile() to transfer the current image or video to the peer
+    if (navigator.mozNfc) {
+      navigator.mozNfc.onpeerready = function(event) {
+        if (typeof f === 'function') {
+          var promise = f();
+          promise.then(function(file) { event.peer.sendFile(file); });
+        }
+        else {
+          event.peer.sendFile(f);
+        }
+      };
+    }
+  },
+
+  unshare: function unshare() {
+    // Disable NFC sharing simply by removing the callback
+    if (navigator.mozNfc) {
+      navigator.mozNfc.onpeerready = null;
+    }
+  }
+};
diff --git a/apps/gallery/js/open.js b/apps/gallery/js/open.js
index 8f4633d54eec..3848ad935c28 100644
--- a/apps/gallery/js/open.js
+++ b/apps/gallery/js/open.js
@@ -66,7 +66,7 @@ navigator.mozL10n.once(function() {
 
     blob = activityData.blob;
     open(blob);
-    setNFCSharing(true);
+    NFC.share(blob);
   }
 
   // Display the specified blob, unless it is too big to display
@@ -218,7 +218,7 @@ navigator.mozL10n.once(function() {
   function done() {
     activity.postResult({ saved: saved });
     activity = null;
-    setNFCSharing(false);
+    NFC.unshare();
   }
 
   function handleDoubleTap(e) {
@@ -294,23 +294,4 @@ navigator.mozL10n.once(function() {
   function baseName(filename) {
     return filename.substring(filename.lastIndexOf('/') + 1);
   }
-
-  function setNFCSharing(enable) {
-    if (!window.navigator.mozNfc) {
-      return;
-    }
-
-    if (enable) {
-      // If we have NFC, we need to put the callback to have shrinking UI.
-      window.navigator.mozNfc.onpeerready = function(event) {
-        var peer = event.peer;
-        if (peer) {
-          peer.sendFile(blob);
-        }
-      };
-    } else {
-      // We need to remove onpeerready while out of fullscreen view.
-      window.navigator.mozNfc.onpeerready = null;
-    }
-  }
 });
diff --git a/apps/gallery/js/overlay.js b/apps/gallery/js/overlay.js
new file mode 100644
index 000000000000..c032290e95f4
--- /dev/null
+++ b/apps/gallery/js/overlay.js
@@ -0,0 +1,127 @@
+/* global $, LazyLoader, picking */
+/* exported Overlay */
+
+'use strict';
+
+/*
+ * This module handles the display of Gallery app overlays: these are full
+ * screen dialogs that are displayed when the app cannot be used transiently
+ * or permanenty (when there is no sdcard, e.g.)
+ *
+ * Different overlays are identified by with a string. Pass the id of an
+ * overlay to Overlay.show() to show that overlay. Call Overlay.hide() to
+ * hide the current overlay. Overlay.current holds the id of the current
+ * overlay, or null if no overlay is displayed.
+ *
+ * Supported ids include:
+ *
+ *   nocard: no sdcard is installed in the phone
+ *   pluggedin: the sdcard is being used by USB mass storage
+ *   emptygallery: no pictures found
+ *   scanning: scanning the sdcard for photo's, but none found yet
+ *
+ * Localization is done using the specified id with "-title" and "-text"
+ * suffixes.
+ *
+ * Some overlays have a cancel button (for cancelling a pick activity) and
+ * some have a camera button (for switching to the Camera) app. When those
+ * buttons are clicked, we dispatch synthetic "cancel" and "camera" events.
+ * Use the addEventListener() and removeEventListener() functions to manage
+ * listeners for these events.
+ */
+var Overlay = {
+  current: null,
+
+  hide: function hide() {
+    Overlay.current = null;
+    $('overlay').classList.add('hidden');
+  },
+
+  show: function show(id) {
+    Overlay.current = id;
+    LazyLoader.load('shared/style/confirm.css', function() {
+      // hide any special elements
+      $('overlay-camera-button').classList.add('hidden');
+      $('overlay-cancel-button').classList.add('hidden');
+      $('overlay-menu').classList.add('hidden');
+      var title, text;
+      switch (id) {
+        case null:
+          Overlay.hide();
+          return;
+        case 'nocard':
+          title = 'nocard3-title';
+          text = 'nocard4-text';
+          if (picking) {
+            $('overlay-cancel-button').classList.remove('hidden');
+            $('overlay-menu').classList.remove('hidden');
+          }
+          break;
+        case 'pluggedin':
+          title = 'pluggedin2-title';
+          text = 'pluggedin2-text';
+          if (picking) {
+            $('overlay-cancel-button').classList.remove('hidden');
+            $('overlay-menu').classList.remove('hidden');
+          }
+          break;
+        case 'scanning':
+          title = 'scanning-title';
+          text = 'scanning-text';
+          if (picking) {
+            $('overlay-cancel-button').classList.remove('hidden');
+            $('overlay-menu').classList.remove('hidden');
+          }
+          break;
+        case 'emptygallery':
+          title = picking ? 'emptygallery2-title-pick' :
+                                'emptygallery2-title';
+          text = 'emptygallery2-text';
+          $('overlay-menu').classList.remove('hidden');
+          if (picking) {
+            $('overlay-cancel-button').classList.remove('hidden');
+          } else {
+            $('overlay-camera-button').classList.remove('hidden');
+          }
+          break;
+        case 'upgrade':
+          title = 'upgrade-title';
+          text = 'upgrade-text';
+          if (picking) {
+            $('overlay-cancel-button').classList.remove('hidden');
+            $('overlay-menu').classList.remove('hidden');
+          }
+          break;
+        default:
+          console.warn('Reference to undefined overlay', id);
+          if (picking) {
+            $('overlay-cancel-button').classList.remove('hidden');
+            $('overlay-menu').classList.remove('hidden');
+          }
+          return;
+      }
+
+      $('overlay-title').setAttribute('data-l10n-id', title);
+      $('overlay-text').setAttribute('data-l10n-id', text);
+      $('overlay').classList.remove('hidden');
+    });
+  },
+
+  addEventListener: function(type, listener) {
+    $('overlay').addEventListener(type, listener);
+  },
+
+  removeEventListener: function(type, listener) {
+    $('overlay').removeEventListener(type, listener);
+  },
+};
+
+// Register handlers on the button elements that dispatch higher-level
+// events on the overlay itself.
+$('overlay-cancel-button').addEventListener('click', function() {
+  $('overlay').dispatchEvent(new CustomEvent('cancel'));
+});
+
+$('overlay-camera-button').addEventListener('click', function() {
+  $('overlay').dispatchEvent(new CustomEvent('camera'));
+});
diff --git a/apps/gallery/js/pick.js b/apps/gallery/js/pick.js
new file mode 100644
index 000000000000..58b35bdbb232
--- /dev/null
+++ b/apps/gallery/js/pick.js
@@ -0,0 +1,333 @@
+/* global $, setView, LAYOUT_MODE, photodb, LazyLoader, Spinner, ImageEditor */
+/* global cropResizeRotate */
+/* global CONFIG_MAX_PICK_PIXEL_SIZE, CONFIG_MAX_IMAGE_PIXEL_SIZE */
+/* exported Pick */
+
+'use strict';
+
+// XXX: the pick activity could, and probably should be handled with a
+// completely different entry point from regular invocations of
+// Gallery.  If we can modularize the bootstrap/startup code and the
+// thumbnail display code enough that we can use it in both entry
+// points, it would probably be better to do it that way.
+
+/*
+ *  A pick activity can be in two distinct states:
+ *
+ *   1) the picking state where the user is browsing thumbnails.
+ *      Tapping a thumbnail moves to state 2. Tapping the cancel
+ *      button cancels the activity and the app exits.
+ *
+ *   2) the preview/cropping phase where the user sees a full-screen
+ *     image and may have the option to crop it and also sees
+ *     cancel and done buttons. Tapping cancel moves back to state 1.
+ *     Tapping Done ends the pick activity and the app exits.
+ *
+ *  This Pick module defines start(), select(), end(), cancel()
+ *  and restart() methods to handle these state transitions.
+ *  Note that this is not a Pick class, just a module of interacting
+ *  functions for managing picks. The gallery code needs to call
+ *  Pick.start() and Pick.crop().
+ */
+var Pick = (function() {
+  var request;
+  var pickType;
+  var pickWidth, pickHeight;
+  var pickedFileInfo;
+  var pickedFile;
+  var cropEditor;
+
+  // Called when we are first start up with the activity request object
+  function start(activity) {
+    request = activity;
+    pickType = request.source.data.type;
+
+    if (request.source.data.width && request.source.data.height) {
+      pickWidth = request.source.data.width;
+      pickHeight = request.source.data.height;
+    }
+    else {
+      pickWidth = pickHeight = 0;
+    }
+
+    setView(LAYOUT_MODE.pick);
+
+    // re-run the font-fit logic when header is visible
+    var pickHeading = $('pick-header-title');
+    pickHeading.textContent = pickHeading.textContent;
+
+    // Clicking on the pick back button cancels the pick activity.
+    $('pick-header').addEventListener('action', cancel);
+
+    // In crop view, the back button goes back to pick view
+    $('crop-top').addEventListener('action', restart);
+
+    // In crop view, the Done button crops crops the image and returns
+    // it to the invoking app;
+    $('crop-done-button').addEventListener('click', end);
+  }
+
+  // Called when the user selects a thumbnail in pick mode.
+  function select(fileinfo) {
+    pickedFileInfo = fileinfo;
+
+    // Do we actually want to allow the user to crop the image?
+    var nocrop = request.source.data.nocrop;
+
+    if (nocrop) {
+      // If we're not cropping show file name in the title bar
+      var fileName = pickedFileInfo.name.split('/').pop();
+      $('crop-header').textContent =
+        fileName.substr(0, fileName.lastIndexOf('.')) || fileName;
+    }
+
+    setView(LAYOUT_MODE.crop);
+
+    // Before the picked image is loaded, the done button is disabled
+    // to avoid users picking a black/empty image.
+    var doneButton = $('crop-done-button');
+    doneButton.disabled = true;
+
+    // We need all of these for cropping the photo:
+    //  - ImageEditor to display the crop overlay.
+    //  - frame_scripts because it has gesture_detector in it.
+    //  - crop_resize_rotate.js scripts for cropResizeRotate().
+    LazyLoader.load(['js/frame_scripts.js',
+                     'shared/js/media/crop_resize_rotate.js',
+                     'js/ImageEditor.js'], gotScripts);
+
+    // When the scripts we need are loaded, load the picked file we need
+    function gotScripts() {
+      photodb.getFile(pickedFileInfo.name, gotFile);
+    }
+
+    // This is called with the file that needs to be cropped
+    function gotFile(file) {
+      pickedFile = file;
+      var previewData = pickedFileInfo.metadata.preview;
+      if (!previewData) {
+        // If there is no preview at all, this is a small image and
+        // it is its own preview. Just crop with the full-size image
+        startCrop();
+      }
+      else if (previewData.filename) {
+        // If there is an external preview file, use that. This means that
+        // the EXIF preview was not big enough
+        var storage = navigator.getDeviceStorage('pictures');
+        var getreq = storage.get(previewData.filename);
+        getreq.onsuccess = function() {
+          startCrop(getreq.result);
+        };
+        // If we fail to get the preview file, just use the full-size image
+        getreq.onerror = function() {
+          startCrop();
+        };
+      }
+      else {
+        // Otherwise, use the internal EXIF preview.
+        // This should be the normal case.
+        startCrop(pickedFile.slice(previewData.start,
+                                   previewData.end,
+                                   'image/jpeg'));
+      }
+
+      function startCrop(previewBlob) {
+        // Before the user can crop the image we have to create a
+        // preview of the image at the correct size and orientation
+        // if we do not already have one.
+        var blob, metadata, outputSize, useSpinner;
+
+        if (previewBlob) {
+          // If there is a preview, use it at full size. If we're using
+          // a preview we need to pass the size of the preview, but the
+          // EXIF orientation data from the fullsize image.
+          blob = previewBlob;
+          metadata = {
+            width: previewData.width,
+            height: previewData.height,
+            rotation: pickedFileInfo.metadata.rotation,
+            mirrored: pickedFileInfo.metadata.mirrored
+          };
+          outputSize = null;
+          useSpinner = false;
+        }
+        else {
+          // If there is no preview, use the picked file, but specify a maximum
+          // size so we don't decode at a size larger than needed.
+          blob = pickedFile;
+          metadata = pickedFileInfo.metadata;
+          var windowSize = window.innerWidth * window.innerHeight *
+            window.devicePixelRatio * window.devicePixelRatio;
+          outputSize = Math.min(windowSize,
+                                CONFIG_MAX_PICK_PIXEL_SIZE ||
+                                CONFIG_MAX_IMAGE_PIXEL_SIZE);
+          useSpinner = metadata.width * metadata.height > outputSize;
+        }
+
+        // Make sure the image is rotated correctly so that it appears
+        // right side up in the crop UI. Note that we only display a spinner
+        // here if we have to downsample a large image.
+        if (useSpinner) {
+          Spinner.show();
+        }
+        cropResizeRotate(blob, null, outputSize, null, metadata,
+                         gotRotatedBlob);
+      }
+
+      function gotRotatedBlob(error, rotatedBlob) {
+        Spinner.hide();
+        if (error) {
+          console.error('Error while rotating image:', error);
+          rotatedBlob = pickedFile;
+        }
+        cropEditor = new ImageEditor(rotatedBlob, $('crop-frame'), {},
+                                     cropEditorReady, true);
+      }
+
+      function cropEditorReady() {
+        // Enable the done button so that users can finish picking image.
+        doneButton.disabled = false;
+
+        // If the initiating app doesn't want to allow the user to crop
+        // the image, we don't display the crop overlay. But we still use
+        // this image editor to preview the image.
+        if (nocrop) {
+          // Set a fake crop region even though we won't display it
+          // so that hasBeenCropped() works.
+          cropEditor.cropRegion.left = cropEditor.cropRegion.top = 0;
+          cropEditor.cropRegion.right = cropEditor.dest.w;
+          cropEditor.cropRegion.bottom = cropEditor.dest.h;
+          return;
+        }
+
+        cropEditor.showCropOverlay();
+        if (pickWidth) {
+          cropEditor.setCropAspectRatio(pickWidth, pickHeight);
+        }
+        else {
+          cropEditor.setCropAspectRatio(); // free form cropping
+        }
+      }
+    }
+  }
+
+  function end() {
+    // First, figure out what kind of image to return to the requesting app.
+    // If the activity request specifically included 'image/jpeg' or
+    // 'image/png', then we'll use that type. Otherwise, if a generic
+    // 'image/*' was requested (or if an unsupported type was requested)
+    // then we use null as the type. This value is passed to
+    // cropResizeRotate() and will leave the image unchanged if possible
+    // or will use jpeg if changes are needed.
+    if (Array.isArray(pickType)) {
+      if (pickType.indexOf(pickedFileInfo.type) !== -1) {
+        pickType = pickedFileInfo.type;
+      }
+      else if (pickType.indexOf('image/jpeg') !== -1) {
+        pickType = 'image/jpeg';
+      }
+      else if (pickType.indexOf('image/png') !== -1) {
+        pickType = 'image/png';
+      }
+      else {
+        pickType = null; // Return unchanged or convert to JPEG
+      }
+    }
+    else if (pickType === 'image/*') {
+      pickType = null;   // Return unchanged or convert to JPEG
+    }
+
+    if (pickType && pickType !== 'image/jpeg' && pickType !== 'image/png') {
+      pickType = null;   // Return unchanged or convert to JPEG
+    }
+
+    // In order to determine the cropRegion and outputSize arguments to
+    // cropResizeRotate() below we need to know the actual image size.
+    // If the image has EXIF rotation, we need to take that into account.
+    var fullImageWidth, fullImageHeight;
+    var rotation = pickedFileInfo.metadata.rotation || 0;
+    if (rotation === 90 || rotation === 270) {
+      fullImageWidth = pickedFileInfo.metadata.height;
+      fullImageHeight = pickedFileInfo.metadata.width;
+    }
+    else {
+      fullImageWidth = pickedFileInfo.metadata.width;
+      fullImageHeight = pickedFileInfo.metadata.height;
+    }
+
+    var cropRegion;
+
+    if (request.source.data.nocrop || !cropEditor.hasBeenCropped()) {
+      cropRegion = null;
+    }
+    else {
+      // Get the user's crop region from the crop editor
+      cropRegion = cropEditor.getCropRegion();
+
+      // Scale to match the actual image size
+      cropRegion.left = Math.round(cropRegion.left * fullImageWidth);
+      cropRegion.top = Math.round(cropRegion.top * fullImageHeight);
+      cropRegion.width = Math.round(cropRegion.width * fullImageWidth);
+      cropRegion.height = Math.round(cropRegion.height * fullImageHeight);
+    }
+
+    var outputSize;
+    if (pickWidth && pickHeight) {
+      outputSize = { width: pickWidth, height: pickHeight };
+    }
+    else if (CONFIG_MAX_PICK_PIXEL_SIZE) {
+      outputSize = CONFIG_MAX_PICK_PIXEL_SIZE;
+    }
+    else {
+      outputSize = null;
+    }
+
+    // show spinner if cropResizeRotate will downsample image
+    if (cropRegion !== null ||
+        outputSize !== null ||
+        (pickedFileInfo.metadata !== undefined &&
+         pickedFileInfo.metadata.rotation !== undefined &&
+         pickedFileInfo.metadata.rotation) ||
+        (pickedFileInfo.metadata.mirrored !== undefined &&
+         pickedFileInfo.metadata.mirrored)) {
+      Spinner.show();
+    }
+    cropResizeRotate(pickedFile, cropRegion, outputSize, pickType,
+                     pickedFileInfo.metadata,
+                     function(error, blob) {
+                       Spinner.hide();
+                       if (error) {
+                         console.error('while resizing image: ' + error);
+                         blob = pickedFile;
+                       }
+
+                       // Finally, return the blob to the invoking app
+                       request.postResult({
+                         type: blob.type,
+                         blob: blob
+                       });
+                     });
+  }
+
+  function cancel() {
+    request.postError('pick cancelled');
+  }
+
+  // Stop cropping the image and go back to picking mode
+  function restart() {
+    pickedFileInfo = pickedFile = null;
+    if (cropEditor) {
+      cropEditor.destroy();
+      cropEditor = null;
+    }
+    setView(LAYOUT_MODE.pick);
+  }
+
+  return {
+    start: start,
+    select: select,
+    cancel: cancel,
+    restart: restart,
+    end: end
+  };
+}());
diff --git a/apps/gallery/js/spinner.js b/apps/gallery/js/spinner.js
new file mode 100644
index 000000000000..0b33068f8bd9
--- /dev/null
+++ b/apps/gallery/js/spinner.js
@@ -0,0 +1,14 @@
+/* global $ */
+/* exported Spinner */
+
+'use strict';
+
+var Spinner = {
+  show: function show() {
+    $('spinner').classList.remove('hidden');
+  },
+
+  hide: function hide() {
+    $('spinner').classList.add('hidden');
+  }
+};
diff --git a/apps/gallery/js/utils.js b/apps/gallery/js/utils.js
new file mode 100644
index 000000000000..8b0039d4b4a9
--- /dev/null
+++ b/apps/gallery/js/utils.js
@@ -0,0 +1,4 @@
+/* exported $ */
+'use strict';
+
+function $(id) { return document.getElementById(id); }
diff --git a/apps/gallery/open.html b/apps/gallery/open.html
index 17e6214d7d7a..ea1994b83d2c 100644
--- a/apps/gallery/open.html
+++ b/apps/gallery/open.html
@@ -23,6 +23,7 @@
     <script type="text/javascript" defer src="shared/js/device_storage/get_unused_filename.js"></script>
     <!-- Specific code -->
     <script type="text/javascript" defer src="js/config.js"></script>
+    <script type="text/javascript" defer src="js/nfc.js"></script>
     <script type="text/javascript" defer src="js/open.js"></script>
     <!-- Web Components -->
     <script defer src="shared/elements/config.js"></script>
diff --git a/apps/gallery/test/unit/.jshintrc b/apps/gallery/test/unit/.jshintrc
index 6c3899859fd1..e46d7fde5e45 100644
--- a/apps/gallery/test/unit/.jshintrc
+++ b/apps/gallery/test/unit/.jshintrc
@@ -12,6 +12,7 @@
     "requireApp",
     "sinon",
     "mocha",
-    "loadBodyHTML"
+    "loadBodyHTML",
+    "MocksHelper"
   ]
 }
diff --git a/apps/gallery/test/unit/mock_image_editor.js b/apps/gallery/test/unit/mock_image_editor.js
new file mode 100644
index 000000000000..c11b5150c95e
--- /dev/null
+++ b/apps/gallery/test/unit/mock_image_editor.js
@@ -0,0 +1,51 @@
+'use strict';
+/* exported MockImageEditor */
+
+var MockImageEditor = (function() {
+  var MockImageEditor = function(imageBlob, container, edits, ready, croponly) {
+    this.imageBlob = imageBlob;
+    this.container = container;
+    this.edits = edits;
+    this.ready = ready;
+    this.croponly = croponly;
+    
+    this.dest = {};
+    this.cropRegion = {};
+
+    setTimeout(ready);
+  };
+
+  MockImageEditor.prototype.showCropOverlay = sinon.spy();
+  MockImageEditor.prototype.setCropAspectRatio = sinon.spy();
+  MockImageEditor.prototype.destroy = sinon.spy();
+
+  MockImageEditor.prototype.hasBeenCropped = function() {
+    return (this.cropRegion.left !== 0 ||
+            this.cropRegion.top !== 0 ||
+            this.cropRegion.right !== this.dest.width ||
+            this.cropRegion.bottom !== this.dest.height);
+  };
+
+  MockImageEditor.prototype.getCropRegion = function() {
+    var region = this.cropRegion;
+    var previewRect = this.dest;
+
+    // Convert the preview crop region to fractions
+    var left = region.left / previewRect.width;
+    var right = region.right / previewRect.width;
+    var top = region.top / previewRect.height;
+    var bottom = region.bottom / previewRect.height;
+
+    return {
+      left: left,
+      top: top,
+      width: right - left,
+      height: bottom - top
+    };
+  };
+
+  sinon.spy(MockImageEditor.prototype, 'hasBeenCropped');
+  sinon.spy(MockImageEditor.prototype, 'getCropRegion');
+
+  return MockImageEditor;
+})();
diff --git a/apps/gallery/test/unit/mock_spinner.js b/apps/gallery/test/unit/mock_spinner.js
new file mode 100644
index 000000000000..397027beeba2
--- /dev/null
+++ b/apps/gallery/test/unit/mock_spinner.js
@@ -0,0 +1,7 @@
+'use strict';
+/* exported MockSpinner */
+
+var MockSpinner = {
+  show: sinon.spy(),
+  hide: sinon.spy()
+};
diff --git a/apps/gallery/test/unit/nfc_test.js b/apps/gallery/test/unit/nfc_test.js
new file mode 100644
index 000000000000..2fbd133abf5a
--- /dev/null
+++ b/apps/gallery/test/unit/nfc_test.js
@@ -0,0 +1,71 @@
+/*jshint maxlen:false, sub:true*/
+/*global NFC*/
+'use strict';
+
+requireApp('/gallery/js/nfc.js');
+
+suite('nfc', function() {
+
+  var realMozNfc;
+
+  setup(function() {
+    realMozNfc = navigator.mozNfc;
+
+    navigator.mozNfc = {};
+  });
+
+  teardown(function() {
+    navigator.mozNfc = realMozNfc;
+  });
+
+  suite('share', function() {
+    test('Should attach `onpeerready` event handler', function() {
+      NFC.share();
+      assert.equal(typeof navigator.mozNfc.onpeerready, 'function');
+    });
+
+    test('Should pass Blob to `peer.sendFile()`', function() {
+      var event = {
+        peer: {
+          sendFile: sinon.spy()
+        }
+      };
+
+      var blob = new Blob();
+
+      NFC.share(blob);
+      navigator.mozNfc.onpeerready(event);
+
+      assert.ok(event.peer.sendFile.calledWith(blob));
+    });
+
+    test('Should resolve Promise to pass Blob to `peer.sendFile()`', function(done) {
+      var event = {
+        peer: {
+          sendFile: sinon.spy()
+        }
+      };
+
+      NFC.share(function() {
+        return {
+          then: function(callback) {
+            var blob = new Blob();
+            callback(blob);
+
+            assert.ok(event.peer.sendFile.calledWith(blob));
+            done();
+          }
+        };
+      });
+      navigator.mozNfc.onpeerready(event);
+    });
+  });
+
+  suite('unshare', function() {
+    test('Should remove `onpeerready` event handler', function() {
+      NFC.unshare();
+      assert.equal(navigator.mozNfc.onpeerready, null);
+    });
+  });
+
+});
diff --git a/apps/gallery/test/unit/overlay_test.js b/apps/gallery/test/unit/overlay_test.js
new file mode 100644
index 000000000000..0b6548d2bd30
--- /dev/null
+++ b/apps/gallery/test/unit/overlay_test.js
@@ -0,0 +1,131 @@
+/*jshint maxlen:false, sub:true*/
+/*global MocksHelper, Overlay*/
+'use strict';
+
+require('/shared/test/unit/mocks/mock_lazy_loader.js');
+requireApp('/gallery/js/overlay.js');
+
+var mocksHelper = new MocksHelper([
+  'LazyLoader'
+]).init();
+
+suite('overlay', function() {
+
+  mocksHelper.attachTestHelpers();
+
+  var real$;
+  
+  var selectors;
+
+  setup(function() {
+    selectors = {};
+  });
+
+  suiteSetup(function() {
+    real$ = window.$;
+
+    window.$ = function(selector) {
+      return (selectors[selector] = selectors[selector] || {
+        addEventListener: sinon.spy(),
+        removeEventListener: sinon.spy(),
+        classList: {
+          add: sinon.spy(),
+          remove: sinon.spy()
+        },
+        setAttribute: sinon.spy()
+      });
+    };
+
+    window.picking = false;
+  });
+
+  suiteTeardown(function() {
+    window.$ = real$;
+  });
+
+  suite('hide', function() {
+    test('Should set `Overlay.current` to `null`', function() {
+      Overlay.current = 'not `null`';
+      Overlay.hide();
+      assert.equal(Overlay.current, null);
+    });
+
+    test('Should add "hidden" to #overlay classList', function() {
+      Overlay.hide();
+      assert.ok(selectors['overlay'].classList.add.calledWith('hidden'));
+    });
+  });
+
+  suite('show', function() {
+    test('Should set `Overlay.current` to `foo`', function() {
+      Overlay.show('foo');
+      assert.equal(Overlay.current, 'foo');
+    });
+
+    test('Should add "hidden" to #overlay-camera-button', function() {
+      Overlay.show('foo');
+      assert.ok(selectors['overlay-camera-button'].classList.add.calledWith('hidden'));
+    });
+
+    test('Should add "hidden" to #overlay-cancel-button', function() {
+      Overlay.show('foo');
+      assert.ok(selectors['overlay-cancel-button'].classList.add.calledWith('hidden'));
+    });
+
+    test('Should add "hidden" to #overlay-menu', function() {
+      Overlay.show('foo');
+      assert.ok(selectors['overlay-menu'].classList.add.calledWith('hidden'));
+    });
+
+    test('Should call `Overlay.hide` if `id` is `null`', function() {
+      var realHide = Overlay.hide;
+      Overlay.hide = sinon.spy();
+      Overlay.show(null);
+      assert.ok(Overlay.hide.called);
+      Overlay.hide = realHide;
+    });
+
+    test('Should set "data-l10n-id" attribute on #overlay-title for a valid overlay `id`',
+      function() {
+        Overlay.show('nocard');
+        assert.ok(selectors['overlay-title'].setAttribute.calledWith('data-l10n-id'));
+      }
+    );
+
+    test('Should set "data-l10n-id" attribute on #overlay-text for a valid overlay `id`',
+      function() {
+        Overlay.show('nocard');
+        assert.ok(selectors['overlay-text'].setAttribute.calledWith('data-l10n-id'));
+      }
+    );
+
+    test('Should *NOT* set "data-l10n-id" attribute on #overlay-title for an invalid overlay `id`',
+      function() {
+        Overlay.show('foo');
+        assert.ok(!selectors['overlay-title']);
+      }
+    );
+
+    test('Should *NOT* set "data-l10n-id" attribute on #overlay-text for an invalid overlay `id`',
+      function() {
+        Overlay.show('foo');
+        assert.ok(!selectors['overlay-text']);
+      }
+    );
+  });
+
+  suite('addEventListener', function() {
+    test('Should add event listener to #overlay', function() {
+      Overlay.addEventListener('foo', 'bar');
+      assert.ok(selectors['overlay'].addEventListener.calledWith('foo', 'bar'));
+    });
+  });
+
+  suite('removeEventListener', function() {
+    test('Should remove event listener from #overlay', function() {
+      Overlay.removeEventListener('foo', 'bar');
+      assert.ok(selectors['overlay'].removeEventListener.calledWith('foo', 'bar'));
+    });
+  });
+
+});
diff --git a/apps/gallery/test/unit/pick_test.js b/apps/gallery/test/unit/pick_test.js
new file mode 100644
index 000000000000..b00a3263ab0e
--- /dev/null
+++ b/apps/gallery/test/unit/pick_test.js
@@ -0,0 +1,268 @@
+/*jshint maxlen:false, sub:true*/
+/*global MockGetDeviceStorage, MockCropResizeRotate*/
+/*global MocksHelper, LAYOUT_MODE, MediaDB, ImageEditor, Pick*/
+'use strict';
+
+require('/shared/test/unit/mocks/mock_lazy_loader.js');
+require('/shared/test/unit/mocks/mock_mediadb.js');
+require('/shared/test/unit/mocks/mock_crop_resize_rotate.js');
+require('/shared/test/unit/mocks/mock_navigator_getdevicestorage.js');
+requireApp('/gallery/test/unit/mock_image_editor.js');
+requireApp('/gallery/test/unit/mock_spinner.js');
+requireApp('/gallery/js/pick.js');
+
+var mocksHelper = new MocksHelper([
+  'LazyLoader',
+  'MediaDB',
+  'ImageEditor',
+  'Spinner'
+]).init();
+
+suite('pick', function() {
+
+  mocksHelper.attachTestHelpers();
+
+  var real$;
+
+  var selectors;
+
+  setup(function() {
+    selectors = {};
+  });
+
+  suiteSetup(function() {
+    window.cropResizeRotate = sinon.spy(MockCropResizeRotate);
+    navigator.getDeviceStorage = sinon.spy(MockGetDeviceStorage);
+
+    real$ = window.$;
+
+    window.$ = function(selector) {
+      return (selectors[selector] = selectors[selector] || {
+        addEventListener: sinon.spy()
+      });
+    };
+
+    window.LAYOUT_MODE = {
+      pick: 'pick',
+      crop: 'crop'
+    };
+
+    window.CONFIG_MAX_PICK_PIXEL_SIZE = 800 * 600;
+
+    window.setView = sinon.spy();
+
+    window.photodb = new MediaDB('pictures');
+  });
+
+  suiteTeardown(function() {
+    window.$ = real$;
+  });
+
+  suite('start', function() {
+    var activity = {
+      source: {
+        data: {
+          type: 'image/jpeg'
+        }
+      }
+    };
+
+    test('Should call `setView` with `LAYOUT_MODE.pick`', function() {
+      window.setView.reset();
+
+      Pick.start(activity);
+      assert.ok(window.setView.calledWith(LAYOUT_MODE.pick));
+    });
+
+    test('Should add "action" event listener to #pick-header', function() {
+      Pick.start(activity);
+      assert.ok(selectors['pick-header'].addEventListener.calledWith('action'));
+    });
+
+    test('Should add "action" event listener to #crop-top', function() {
+      Pick.start(activity);
+      assert.ok(selectors['crop-top'].addEventListener.calledWith('action'));
+    });
+
+    test('Should add "click" event listener to #crop-done-button', function() {
+      Pick.start(activity);
+      assert.ok(selectors['crop-done-button'].addEventListener.calledWith('click'));
+    });
+  });
+
+  suite('select', function() {
+    var activity = {
+      source: {
+        data: {
+          type: 'image/jpeg'
+        }
+      }
+    };
+
+    var fileinfo = {
+      name: '/foo/bar/baz.jpg',
+      metadata: {}
+    };
+
+    test('Should show file name in the title bar if `nocrop` flag is set', function() {
+      activity.source.data.nocrop = true;
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      assert.equal(selectors['crop-header'].textContent, 'baz');
+      delete activity.source.data.nocrop;
+    });
+
+    test('Should call `setView` with `LAYOUT_MODE.crop`', function() {
+      window.setView.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      assert.ok(window.setView.calledWith(LAYOUT_MODE.crop));
+    });
+
+    test('Should disable #crop-done-button', function() {
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      assert.isTrue(selectors['crop-done-button'].disabled);
+    });
+
+    test('Should get file from MediaDB', function() {
+      window.photodb.getFile.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      assert.ok(window.photodb.getFile.calledWith(fileinfo.name));
+    });
+
+    test('Should crop/resize/rotate file', function() {
+      window.cropResizeRotate.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      assert.ok(window.cropResizeRotate.called);
+    });
+
+    test('Should use external preview file if specified', function() {
+      navigator.getDeviceStorage.reset();
+
+      fileinfo.metadata.preview = {
+        filename: '/foo/bar/baz_preview.jpg'
+      };
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      assert.ok(navigator.getDeviceStorage.calledWith('pictures'));
+    });
+  });
+
+  suite('cancel', function() {
+    var activity = {
+      source: {
+        data: {
+          type: 'image/jpeg'
+        }
+      },
+      postError: sinon.spy()
+    };
+
+    var fileinfo = {
+      name: '/foo/bar/baz.jpg',
+      metadata: {}
+    };
+
+    test('Should post "pick cancelled" error', function() {
+      activity.postError.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      Pick.cancel();
+      assert.ok(activity.postError.calledWith('pick cancelled'));
+    });
+  });
+
+  suite('restart', function() {
+    var activity = {
+      source: {
+        data: {
+          type: 'image/jpeg'
+        }
+      }
+    };
+
+    var fileinfo = {
+      name: '/foo/bar/baz.jpg',
+      metadata: {}
+    };
+
+    test('Should destroy `ImageEditor`', function(done) {
+      ImageEditor.prototype.destroy.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      setTimeout(function() {
+        Pick.restart();
+        assert.ok(ImageEditor.prototype.destroy.called);
+        done();
+      });
+    });
+
+    test('Should call `setView` with `LAYOUT_MODE.pick`', function(done) {
+      window.setView.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      setTimeout(function() {
+        Pick.restart();
+        assert.ok(window.setView.calledWith(LAYOUT_MODE.pick));
+        done();
+      });
+    });
+  });
+
+  suite('end', function() {
+    var activity = {
+      source: {
+        data: {
+          type: 'image/jpeg'
+        }
+      },
+      postResult: sinon.spy()
+    };
+
+    var fileinfo = {
+      name: '/foo/bar/baz.jpg',
+      metadata: {}
+    };
+
+    test('Should call `getCropRegion` on `ImageEditor`', function() {
+      ImageEditor.prototype.getCropRegion.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      Pick.end();
+      assert.ok(ImageEditor.prototype.getCropRegion.called);
+    });
+
+    test('Should *NOT* call `getCropRegion` on `ImageEditor` if `nocrop` specified',
+      function() {
+        ImageEditor.prototype.getCropRegion.reset();
+        activity.source.data.nocrop = true;
+
+        Pick.start(activity);
+        Pick.select(fileinfo);
+        Pick.end();
+        assert.ok(ImageEditor.prototype.getCropRegion.notCalled);
+        delete activity.source.data.nocrop;
+      });
+
+    test('Should call `postResult`', function() {
+      activity.postResult.reset();
+
+      Pick.start(activity);
+      Pick.select(fileinfo);
+      Pick.end();
+      assert.ok(activity.postResult.called);
+    });
+  });
+
+});
diff --git a/apps/gallery/test/unit/setup.js b/apps/gallery/test/unit/setup.js
new file mode 100644
index 000000000000..e60c03bc2faa
--- /dev/null
+++ b/apps/gallery/test/unit/setup.js
@@ -0,0 +1,7 @@
+'use strict';
+
+require('/shared/test/unit/mocks/mocks_helper.js');
+require('/shared/test/unit/load_body_html_helper.js');
+
+// Gaia Grid/ Element requires
+require('/shared/js/component_utils.js');
diff --git a/apps/gallery/test/unit/spinner_test.js b/apps/gallery/test/unit/spinner_test.js
new file mode 100644
index 000000000000..39ff9899d626
--- /dev/null
+++ b/apps/gallery/test/unit/spinner_test.js
@@ -0,0 +1,48 @@
+/*jshint maxlen:false, sub:true*/
+/*global Spinner*/
+'use strict';
+
+requireApp('/gallery/js/spinner.js');
+
+suite('spinner', function() {
+
+  var real$;
+  
+  var selectors;
+
+  setup(function() {
+    selectors = {};
+  });
+
+  suiteSetup(function() {
+    real$ = window.$;
+
+    window.$ = function(selector) {
+      return (selectors[selector] = selectors[selector] || {
+        classList: {
+          add: sinon.spy(),
+          remove: sinon.spy()
+        }
+      });
+    };
+  });
+
+  suiteTeardown(function() {
+    window.$ = real$;
+  });
+
+  suite('show', function() {
+    test('Should remove "hidden" from #spinner', function() {
+      Spinner.show();
+      assert.ok(selectors['spinner'].classList.remove.calledWith('hidden'));
+    });
+  });
+
+  suite('hide', function() {
+    test('Should add "hidden" to #spinner', function() {
+      Spinner.hide();
+      assert.ok(selectors['spinner'].classList.add.calledWith('hidden'));
+    });
+  });
+
+});
diff --git a/shared/js/dialogs.js b/shared/js/dialogs.js
index de341a65b730..90f74c57bb43 100644
--- a/shared/js/dialogs.js
+++ b/shared/js/dialogs.js
@@ -1,5 +1,5 @@
 /* jshint unused: true */
-/* global LazyLoader, $, pendingPick */
+/* global LazyLoader, $ */
 /* exported Dialogs */
 
 'use strict';
@@ -77,88 +77,5 @@ var Dialogs = {
       confirmButton.addEventListener('click', onConfirmClick);
 
     });
-  },
-  //
-  // If id is null then hide the overlay. Otherwise, look up the localized
-  // text for the specified id and display the overlay with that text.
-  // Supported ids include:
-  //
-  //   nocard: no sdcard is installed in the phone
-  //   pluggedin: the sdcard is being used by USB mass storage
-  //   emptygallery: no pictures found
-  //   scanning: scanning the sdcard for photo's, but none found yet
-  //
-  // Localization is done using the specified id with "-title" and "-text"
-  // suffixes.
-  //
-  showOverlay: function(id) {
-    LazyLoader.load('shared/style/confirm.css', function() {
-
-      // hide any special elements
-      $('overlay-camera-button').classList.add('hidden');
-      $('overlay-cancel-button').classList.add('hidden');
-      $('overlay-menu').classList.add('hidden');
-      var title, text;
-      switch (id) {
-        case null:
-          $('overlay').classList.add('hidden');
-          return;
-        case 'nocard':
-          title = 'nocard3-title';
-          text = 'nocard4-text';
-          if (pendingPick) {
-            $('overlay-cancel-button').classList.remove('hidden');
-            $('overlay-menu').classList.remove('hidden');
-          }
-          break;
-        case 'pluggedin':
-          title = 'pluggedin2-title';
-          text = 'pluggedin2-text';
-          if (pendingPick) {
-            $('overlay-cancel-button').classList.remove('hidden');
-            $('overlay-menu').classList.remove('hidden');
-          }
-          break;
-        case 'scanning':
-          title = 'scanning-title';
-          text = 'scanning-text';
-          if (pendingPick) {
-            $('overlay-cancel-button').classList.remove('hidden');
-            $('overlay-menu').classList.remove('hidden');
-          }
-          break;
-        case 'emptygallery':
-          title = pendingPick ? 'emptygallery2-title-pick' :
-                                'emptygallery2-title';
-          text = 'emptygallery2-text';
-          $('overlay-menu').classList.remove('hidden');
-          if (pendingPick) {
-            $('overlay-cancel-button').classList.remove('hidden');
-          } else {
-            $('overlay-camera-button').classList.remove('hidden');
-          }
-          break;
-        case 'upgrade':
-          title = 'upgrade-title';
-          text = 'upgrade-text';
-          if (pendingPick) {
-            $('overlay-cancel-button').classList.remove('hidden');
-            $('overlay-menu').classList.remove('hidden');
-          }
-          break;
-        default:
-          console.warn('Reference to undefined overlay', id);
-          if (pendingPick) {
-            $('overlay-cancel-button').classList.remove('hidden');
-            $('overlay-menu').classList.remove('hidden');
-          }
-          return;
-      }
-
-      $('overlay-title').setAttribute('data-l10n-id', title);
-      $('overlay-text').setAttribute('data-l10n-id', text);
-      $('overlay').classList.remove('hidden');
-    });
   }
-
 };
diff --git a/shared/test/unit/mocks/mock_crop_resize_rotate.js b/shared/test/unit/mocks/mock_crop_resize_rotate.js
new file mode 100644
index 000000000000..4672e0c1edf5
--- /dev/null
+++ b/shared/test/unit/mocks/mock_crop_resize_rotate.js
@@ -0,0 +1,41 @@
+'use strict';
+/*jshint maxlen:false*/
+/*exported MockCropResizeRotate*/
+
+var MockCropResizeRotate =
+  function(blob, cropRegion, outputSize, outputType, metadata, callback) {
+    // The 2nd, 3rd, 4th and 5th arguments are optional, so fix things up if we're
+    // called with fewer than 6 args. The last argument is always the callback.
+    switch (arguments.length) {
+    case 2:
+      callback = cropRegion;
+      cropRegion = outputSize = outputType = metadata = null;
+      break;
+
+    case 3:
+      callback = outputSize;
+      outputSize = outputType = metadata = null;
+      break;
+
+    case 4:
+      callback = outputType;
+      outputType = metadata = null;
+      break;
+
+    case 5:
+      callback = metadata;
+      metadata = null;
+      break;
+
+    case 6:
+      // everything fine. do nothing here
+      break;
+
+    default:
+      throw new Error('wrong number of arguments: ' + arguments.length);
+    }
+
+    if (typeof callback === 'function') {
+      callback(null, blob);
+    }
+  };
diff --git a/shared/test/unit/mocks/mock_mediadb.js b/shared/test/unit/mocks/mock_mediadb.js
new file mode 100644
index 000000000000..769b8b128fe1
--- /dev/null
+++ b/shared/test/unit/mocks/mock_mediadb.js
@@ -0,0 +1,29 @@
+'use strict';
+/* exported MockMediaDB */
+
+var MockMediaDB = (function() {
+
+  function MockMediaDB(blob) {
+    this.blob = blob;
+
+    this.OPENING = 'opening';     // this is initializing itself
+    this.UPGRADING = 'upgrading'; // this is upgrading database
+    this.READY = 'ready';         // this is available and ready for use
+    this.NOCARD = 'nocard';       // Unavailable because there is no sd card
+    this.UNMOUNTED = 'unmounted'; // Unavailable because card unmounted
+    this.CLOSED = 'closed';       // Unavailable because closed() was called
+  }
+
+  MockMediaDB.prototype = {
+    getFile: function getFile(filename, callback) {
+      callback(this.blob);
+    },
+
+    updateMetadata: sinon.spy()
+  };
+
+  sinon.spy(MockMediaDB.prototype, 'getFile');
+
+  return MockMediaDB;
+
+}());