Index: src/wp-admin/upload.php
===================================================================
--- src/wp-admin/upload.php	(revision 29014)
+++ src/wp-admin/upload.php	(working copy)
@@ -24,6 +24,7 @@
 	wp_enqueue_media();
 	wp_enqueue_script( 'media-grid' );
 	wp_enqueue_script( 'media' );
+	wp_localize_script( 'media-grid', 'mediaGridSettings', array( 'adminUrl' => parse_url( self_admin_url(), PHP_URL_PATH )  ) );
 
 	require_once( ABSPATH . 'wp-admin/admin-header.php' );
 	include( ABSPATH . 'wp-admin/admin-footer.php' );
Index: src/wp-includes/js/media-grid.js
===================================================================
--- src/wp-includes/js/media-grid.js	(revision 29014)
+++ src/wp-includes/js/media-grid.js	(working copy)
@@ -120,6 +120,7 @@
 		 * @global wp.Uploader
 		 */
 		initialize: function() {
+			var self = this;
 			_.defaults( this.options, {
 				title:     l10n.mediaLibraryTitle,
 				modal:     false,
@@ -168,6 +169,21 @@
 			this.createStates();
 			this.bindHandlers();
 			this.render();
+
+			_.defer( function(){
+				wp.media.mediarouter = new media.view.Frame.Router( self );
+				if ( window.history && window.history.pushState ) {
+					Backbone.history.start({
+						root: mediaGridSettings.adminUrl,
+						pushState: true
+					});
+				}
+			});
+
+			$( '#media-search-input' ).on( 'input', _.debounce( function() {
+				wp.media.mediarouter.searchWith( this );
+			}, 250) )
+
 		},
 
 		createSelection: function() {
@@ -210,7 +226,9 @@
 		bindHandlers: function() {
 			this.on( 'content:create:browse', this.browseContent, this );
 			this.on( 'content:render:edit-image', this.editImageContent, this );
+			this.on( 'input #media-search-input', this.search, this );
 
+
 			// Handle a frame-level event for editing an attachment.
 			this.on( 'edit:attachment', this.editAttachment, this );
 			this.on( 'edit:attachment:next', this.editNextAttachment, this );
@@ -324,6 +342,42 @@
 	});
 
 	/**
+	 * A router for handling the browser history and application state
+	 */
+	media.view.Frame.Router = Backbone.Router.extend({
+
+		initialize: function( passedview ){
+			this.passedview = passedview;
+		},
+
+		passedview: '',
+
+		routes: {
+			'upload.php?image=:slug': 'showimage',
+			'upload.php?search=:query': 'search'
+		},
+
+		baseUrl: function( url ) {
+			return 'upload.php' + url;
+		},
+
+		search: function( query ) {
+			$( '#media-search-input' ).val( query ).trigger( 'input' );
+		},
+
+		searchWith: function( s ) {
+			this.navigate( this.baseUrl( '?search=' + $( s ).val() ), {trigger: false, replace: false} );
+		},
+
+		showimage: function( query ) {
+			var library = this.passedview.state().get('library');
+			this.passedview.trigger( 'edit:attachment', library.findWhere( { id: parseInt( query ) } ) );
+		},
+
+	});
+
+
+	/**
 	 * A frame for editing the details of a specific media item.
 	 *
 	 * Opens in a modal by default.
@@ -340,8 +394,9 @@
 			'click':                    'collapse',
 			'click .delete-media-item': 'deleteMediaItem',
 			'click .left':              'previousMediaItem',
-			'click .right':             'nextMediaItem'
-		},
+			'click .right':             'nextMediaItem',
+			'keydown':                  'keyEvent'
+			},
 
 		initialize: function() {
 			var self = this;
@@ -373,10 +428,20 @@
 				// Completely destroy the modal DOM element when closing it.
 				this.modal.close = function() {
 					self.modal.remove();
+					// Reset the browser URL
 				};
 
 				this.modal.content( this );
 				this.modal.open();
+
+				// Update browser url when navigating media details
+				wp.media.mediarouter.navigate( wp.media.mediarouter.baseUrl( '?image=' + this.options.model.id ), {trigger: false, replace: false} );
+
+				// Ensure modal gains focus, otherwise keyboard events lost
+				$( '.attachment-fields input:first' ).focus();
+				$( '.media-modal-backdrop, .media-modal-close' ).on( 'click', function() {
+					self.resetRoute();
+					 } );
 			}
 		},
 
@@ -482,6 +547,32 @@
 				return;
 			this.modal.close();
 			this.options.gridController.trigger( 'edit:attachment:next', this.model );
+		},
+		/**
+		 * Respond to the keyboard events: right arrow, left arrow, escape .
+		 */
+		keyEvent: function( event ) {
+			// The right arrow key
+			if ( event.keyCode === 39 ) {
+				if ( ! this.options.hasNext ) { return; }
+				_.once( this.nextMediaItem() );
+			}
+
+			// The left arrow key
+			if ( event.keyCode === 37 ) {
+				if ( ! this.options.hasPrevious ) { return; }
+				_.once( this.previousMediaItem() );
+			}
+			// Pressing the escape key routes back to main url
+			if ( event.keyCode === 27 ) {
+				this.resetRoute();
+				return event;
+			}
+		},
+
+		resetRoute: function() {
+			wp.media.mediarouter.navigate( wp.media.mediarouter.baseUrl( '' ), { trigger: false } );
+			return;
 		}
 
 	});