<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[26986] trunk/src/wp-includes/js/media-views.js: Add initial JSDoc blocks to `media-views.js`.</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://core.trac.wordpress.org/changeset/26986">26986</a></dd>
<dt>Author</dt> <dd>wonderboymusic</dd>
<dt>Date</dt> <dd>2014-01-20 23:41:42 +0000 (Mon, 20 Jan 2014)</dd>
</dl>

<h3>Log Message</h3>
<pre>Add initial JSDoc blocks to `media-views.js`. The initial blocks are a baseline to work from and invite future iterations. Initial commit is to avoid commits this large in the future.

See <a href="http://core.trac.wordpress.org/ticket/26870">#26870</a>.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcwpincludesjsmediaviewsjs">trunk/src/wp-includes/js/media-views.js</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcwpincludesjsmediaviewsjs"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-includes/js/media-views.js (26985 => 26986)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-includes/js/media-views.js  2014-01-20 23:39:44 UTC (rev 26985)
+++ trunk/src/wp-includes/js/media-views.js     2014-01-20 23:41:42 UTC (rev 26986)
</span><span class="lines">@@ -1,9 +1,6 @@
</span><span class="cx"> /* global _wpMediaViewsL10n, confirm, getUserSetting, setUserSetting */
</span><span class="cx"> (function($){
</span><del>-       var media       = wp.media,
-               Attachment  = media.model.Attachment,
-               Attachments = media.model.Attachments,
-               l10n;
</del><ins>+        var media = wp.media, l10n;
</ins><span class="cx"> 
</span><span class="cx">  // Link any localized strings.
</span><span class="cx">  l10n = media.view.l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n;
</span><span class="lines">@@ -34,7 +31,13 @@
</span><span class="cx">          };
</span><span class="cx">  }());
</span><span class="cx"> 
</span><del>-       // Makes it easier to bind events using transitions.
</del><ins>+        /**
+        * Makes it easier to bind events using transitions.
+        *
+        * @param {string} selector
+        * @param {Number} sensitivity
+        * @returns {Promise}
+        */
</ins><span class="cx">   media.transition = function( selector, sensitivity ) {
</span><span class="cx">          var deferred = $.Deferred();
</span><span class="cx"> 
</span><span class="lines">@@ -66,6 +69,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.controller.Region
</span><ins>+        *
+        * @constructor
+        * @augments Backbone.Model
+        *
+        * @param {Object} [options={}]
</ins><span class="cx">    */
</span><span class="cx">  media.controller.Region = function( options ) {
</span><span class="cx">          _.extend( this, _.pick( options || {}, 'id', 'view', 'selector' ) );
</span><span class="lines">@@ -75,13 +83,24 @@
</span><span class="cx">  media.controller.Region.extend = Backbone.Model.extend;
</span><span class="cx"> 
</span><span class="cx">  _.extend( media.controller.Region.prototype, {
</span><ins>+               /**
+                * Switch modes
+                *
+                * @param {string} mode
+                *
+                * @fires wp.media.controller.Region#{id}:activate:{mode}
+                * @fires wp.media.controller.Region#{id}:deactivate:{mode}
+                *
+                * @returns {wp.media.controller.Region} Returns itself to allow chaining
+                */
</ins><span class="cx">           mode: function( mode ) {
</span><del>-                       if ( ! mode )
</del><ins>+                        if ( ! mode ) {
</ins><span class="cx">                           return this._mode;
</span><del>-
</del><ins>+                        }
</ins><span class="cx">                   // Bail if we're trying to change to the current mode.
</span><del>-                       if ( mode === this._mode )
</del><ins>+                        if ( mode === this._mode ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.trigger('deactivate');
</span><span class="cx">                  this._mode = mode;
</span><span class="lines">@@ -89,12 +108,24 @@
</span><span class="cx">                  this.trigger('activate');
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * Render a new mode, the view is set in the `create` callback method
+                *   of the extending class
+                *
+                * If no mode is provided, just re-render the current mode.
+                * If the provided mode isn't active, perform a full switch.
+                *
+                * @param {string} mode
+                *
+                * @fires wp.media.controller.Region#{id}:create:{mode}
+                * @fires wp.media.controller.Region#{id}:render:{mode}
+                *
+                * @returns {wp.media.controller.Region} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function( mode ) {
</span><del>-                       // If no mode is provided, just re-render the current mode.
-                       // If the provided mode isn't active, perform a full switch.
-                       if ( mode && mode !== this._mode )
</del><ins>+                        if ( mode && mode !== this._mode ) {
</ins><span class="cx">                           return this.mode( mode );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  var set = { view: null },
</span><span class="cx">                          view;
</span><span class="lines">@@ -102,26 +133,43 @@
</span><span class="cx">                  this.trigger( 'create', set );
</span><span class="cx">                  view = set.view;
</span><span class="cx">                  this.trigger( 'render', view );
</span><del>-                       if ( view )
</del><ins>+                        if ( view ) {
</ins><span class="cx">                           this.set( view );
</span><ins>+                       }
</ins><span class="cx">                   return this;
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @returns {wp.media.View} Returns the selector's first subview
+                */
</ins><span class="cx">           get: function() {
</span><span class="cx">                  return this.view.views.first( this.selector );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {Array|Object} views
+                * @param {Object} [options={}]
+                * @returns {wp.Backbone.Subviews} Subviews is returned to allow chaining
+                */
</ins><span class="cx">           set: function( views, options ) {
</span><del>-                       if ( options )
</del><ins>+                        if ( options ) {
</ins><span class="cx">                           options.add = false;
</span><ins>+                       }
</ins><span class="cx">                   return this.view.views.set( this.selector, views, options );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * Helper function to trigger view events based on {id}:{event}:{mode}
+                *
+                * @param {string} event
+                * @returns {undefined|wp.media.controller.Region} Returns itself to allow chaining
+                */
</ins><span class="cx">           trigger: function( event ) {
</span><span class="cx">                  var base, args;
</span><span class="cx"> 
</span><del>-                       if ( ! this._mode )
</del><ins>+                        if ( ! this._mode ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  args = _.toArray( arguments );
</span><span class="cx">                  base = this.id + ':' + event;
</span><span class="lines">@@ -139,6 +187,13 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.controller.StateMachine
</span><ins>+        *
+        * @constructor
+        * @augments Backbone.Model
+        * @mixin
+        * @mixes Backbone.Events
+        *
+        * @param {Array} states
</ins><span class="cx">    */
</span><span class="cx">  media.controller.StateMachine = function( states ) {
</span><span class="cx">          this.states = new Backbone.Collection( states );
</span><span class="lines">@@ -149,34 +204,52 @@
</span><span class="cx"> 
</span><span class="cx">  // Add events to the `StateMachine`.
</span><span class="cx">  _.extend( media.controller.StateMachine.prototype, Backbone.Events, {
</span><del>-
-               // Fetch a state.
-               //
-               // If no `id` is provided, returns the active state.
-               //
-               // Implicitly creates states.
</del><ins>+                /**
+                * Fetch a state.
+                *
+                * If no `id` is provided, returns the active state.
+                *
+                * Implicitly creates states.
+                *
+                * Ensure that the `states` collection exists so the `StateMachine`
+                *   can be used as a mixin.
+                *
+                * @param {string} id
+                * @returns {wp.media.controller.State} Returns a State model
+                *       from the StateMachine collection
+                */
</ins><span class="cx">           state: function( id ) {
</span><del>-                       // Ensure that the `states` collection exists so the `StateMachine`
-                       // can be used as a mixin.
</del><span class="cx">                   this.states = this.states || new Backbone.Collection();
</span><span class="cx"> 
</span><span class="cx">                  // Default to the active state.
</span><span class="cx">                  id = id || this._state;
</span><span class="cx"> 
</span><del>-                       if ( id && ! this.states.get( id ) )
</del><ins>+                        if ( id && ! this.states.get( id ) ) {
</ins><span class="cx">                           this.states.add({ id: id });
</span><ins>+                       }
</ins><span class="cx">                   return this.states.get( id );
</span><span class="cx">          },
</span><span class="cx"> 
</span><del>-               // Sets the active state.
</del><ins>+                /**
+                * Sets the active state.
+                *
+                * Bail if we're trying to select the current state, if we haven't
+                * created the `states` collection, or are trying to select a state
+                * that does not exist.
+                *
+                * @param {string} id
+                *
+                * @fires wp.media.controller.State#deactivate
+                * @fires wp.media.controller.State#activate
+                *
+                * @returns {wp.media.controller.StateMachine} Returns itself to allow chaining
+                */
</ins><span class="cx">           setState: function( id ) {
</span><span class="cx">                  var previous = this.state();
</span><span class="cx"> 
</span><del>-                       // Bail if we're trying to select the current state, if we haven't
-                       // created the `states` collection, or are trying to select a state
-                       // that does not exist.
-                       if ( ( previous && id === previous.id ) || ! this.states || ! this.states.get( id ) )
</del><ins>+                        if ( ( previous && id === previous.id ) || ! this.states || ! this.states.get( id ) ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( previous ) {
</span><span class="cx">                          previous.trigger('deactivate');
</span><span class="lines">@@ -189,18 +262,27 @@
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><span class="cx"> 
</span><del>-               // Returns the previous active state.
-               //
-               // Call the `state()` method with no parameters to retrieve the current
-               // active state.
</del><ins>+                /**
+                * Returns the previous active state.
+                *
+                * Call the `state()` method with no parameters to retrieve the current
+                * active state.
+                *
+                * @returns {wp.media.controller.State} Returns a State model
+                *       from the StateMachine collection
+                */
</ins><span class="cx">           lastState: function() {
</span><del>-                       if ( this._lastState )
</del><ins>+                        if ( this._lastState ) {
</ins><span class="cx">                           return this.state( this._lastState );
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  // Map methods from the `states` collection to the `StateMachine` itself.
</span><span class="cx">  _.each([ 'on', 'off', 'trigger' ], function( method ) {
</span><ins>+               /**
+                * @returns {wp.media.controller.StateMachine} Returns itself to allow chaining
+                */
</ins><span class="cx">           media.controller.StateMachine.prototype[ method ] = function() {
</span><span class="cx">                  // Ensure that the `states` collection exists so the `StateMachine`
</span><span class="cx">                  // can be used as a mixin.
</span><span class="lines">@@ -211,9 +293,12 @@
</span><span class="cx">          };
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-
-       // wp.media.controller.State
-       // ---------------------------
</del><ins>+        /**
+        * wp.media.controller.State
+        *
+        * @constructor
+        * @augments Backbone.Model
+        */
</ins><span class="cx">   media.controller.State = Backbone.Model.extend({
</span><span class="cx">          constructor: function() {
</span><span class="cx">                  this.on( 'activate', this._preActivate, this );
</span><span class="lines">@@ -224,23 +309,44 @@
</span><span class="cx">                  this.on( 'reset', this.reset, this );
</span><span class="cx">                  this.on( 'ready', this._ready, this );
</span><span class="cx">                  this.on( 'ready', this.ready, this );
</span><ins>+                       /**
+                        * Call parent constructor with passed arguments
+                        */
</ins><span class="cx">                   Backbone.Model.apply( this, arguments );
</span><span class="cx">                  this.on( 'change:menu', this._updateMenu, this );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @abstract
+                */
</ins><span class="cx">           ready: function() {},
</span><ins>+               /**
+                * @abstract
+                */
</ins><span class="cx">           activate: function() {},
</span><ins>+               /**
+                * @abstract
+                */
</ins><span class="cx">           deactivate: function() {},
</span><ins>+               /**
+                * @abstract
+                */
</ins><span class="cx">           reset: function() {},
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _ready: function() {
</span><span class="cx">                  this._updateMenu();
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _preActivate: function() {
</span><span class="cx">                  this.active = true;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _postActivate: function() {
</span><span class="cx">                  this.on( 'change:menu', this._menu, this );
</span><span class="cx">                  this.on( 'change:titleMode', this._title, this );
</span><span class="lines">@@ -255,8 +361,9 @@
</span><span class="cx">                  this._content();
</span><span class="cx">                  this._router();
</span><span class="cx">          },
</span><del>-
-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _deactivate: function() {
</span><span class="cx">                  this.active = false;
</span><span class="cx"> 
</span><span class="lines">@@ -267,57 +374,75 @@
</span><span class="cx">                  this.off( 'change:content', this._content, this );
</span><span class="cx">                  this.off( 'change:toolbar', this._toolbar, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _title: function() {
</span><span class="cx">                  this.frame.title.render( this.get('titleMode') || 'default' );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _renderTitle: function( view ) {
</span><span class="cx">                  view.$el.text( this.get('title') || '' );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _router: function() {
</span><span class="cx">                  var router = this.frame.router,
</span><span class="cx">                          mode = this.get('router'),
</span><span class="cx">                          view;
</span><span class="cx"> 
</span><span class="cx">                  this.frame.$el.toggleClass( 'hide-router', ! mode );
</span><del>-                       if ( ! mode )
</del><ins>+                        if ( ! mode ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.frame.router.render( mode );
</span><span class="cx"> 
</span><span class="cx">                  view = router.get();
</span><del>-                       if ( view && view.select )
</del><ins>+                        if ( view && view.select ) {
</ins><span class="cx">                           view.select( this.frame.content.mode() );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _menu: function() {
</span><span class="cx">                  var menu = this.frame.menu,
</span><span class="cx">                          mode = this.get('menu'),
</span><span class="cx">                          view;
</span><span class="cx"> 
</span><del>-                       if ( ! mode )
</del><ins>+                        if ( ! mode ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  menu.mode( mode );
</span><span class="cx"> 
</span><span class="cx">                  view = menu.get();
</span><del>-                       if ( view && view.select )
</del><ins>+                        if ( view && view.select ) {
</ins><span class="cx">                           view.select( this.id );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _updateMenu: function() {
</span><span class="cx">                  var previous = this.previous('menu'),
</span><span class="cx">                          menu = this.get('menu');
</span><span class="cx"> 
</span><del>-                       if ( previous )
</del><ins>+                        if ( previous ) {
</ins><span class="cx">                           this.frame.off( 'menu:render:' + previous, this._renderMenu, this );
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( menu )
</del><ins>+                        if ( menu ) {
</ins><span class="cx">                           this.frame.on( 'menu:render:' + menu, this._renderMenu, this );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @access private
+                */
</ins><span class="cx">           _renderMenu: function( view ) {
</span><span class="cx">                  var menuItem = this.get('menuItem'),
</span><span class="cx">                          title = this.get('title'),
</span><span class="lines">@@ -326,27 +451,38 @@
</span><span class="cx">                  if ( ! menuItem && title ) {
</span><span class="cx">                          menuItem = { text: title };
</span><span class="cx"> 
</span><del>-                               if ( priority )
</del><ins>+                                if ( priority ) {
</ins><span class="cx">                                   menuItem.priority = priority;
</span><ins>+                               }
</ins><span class="cx">                   }
</span><span class="cx"> 
</span><del>-                       if ( ! menuItem )
</del><ins>+                        if ( ! menuItem ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  view.set( this.id, menuItem );
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  _.each(['toolbar','content'], function( region ) {
</span><ins>+               /**
+                * @access private
+                */
</ins><span class="cx">           media.controller.State.prototype[ '_' + region ] = function() {
</span><span class="cx">                  var mode = this.get( region );
</span><del>-                       if ( mode )
</del><ins>+                        if ( mode ) {
</ins><span class="cx">                           this.frame[ region ].render( mode );
</span><ins>+                       }
</ins><span class="cx">           };
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.controller.Library
-       // ---------------------------
</del><ins>+        /**
+        * wp.media.controller.Library
+        *
+        * @constructor
+        * @augments wp.media.controller.State
+        * @augments Backbone.Model
+        */
</ins><span class="cx">   media.controller.Library = media.controller.State.extend({
</span><span class="cx">          defaults: {
</span><span class="cx">                  id:         'library',
</span><span class="lines">@@ -369,15 +505,18 @@
</span><span class="cx">                  syncSelection: true
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * If a library isn't provided, query all media items.
+                * If a selection instance isn't provided, create one.
+                */
</ins><span class="cx">           initialize: function() {
</span><span class="cx">                  var selection = this.get('selection'),
</span><span class="cx">                          props;
</span><span class="cx"> 
</span><del>-                       // If a library isn't provided, query all media items.
-                       if ( ! this.get('library') )
</del><ins>+                        if ( ! this.get('library') ) {
</ins><span class="cx">                           this.set( 'library', media.query() );
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       // If a selection instance isn't provided, create one.
</del><span class="cx">                   if ( ! (selection instanceof media.model.Selection) ) {
</span><span class="cx">                          props = selection;
</span><span class="cx"> 
</span><span class="lines">@@ -446,28 +585,42 @@
</span><span class="cx">                  };
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {wp.media.model.Attachment} attachment
+                * @returns {Backbone.Model}
+                */
</ins><span class="cx">           display: function( attachment ) {
</span><span class="cx">                  var displays = this._displays;
</span><span class="cx"> 
</span><del>-                       if ( ! displays[ attachment.cid ] )
</del><ins>+                        if ( ! displays[ attachment.cid ] ) {
</ins><span class="cx">                           displays[ attachment.cid ] = new Backbone.Model( this.defaultDisplaySettings( attachment ) );
</span><del>-
</del><ins>+                        }
</ins><span class="cx">                   return displays[ attachment.cid ];
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {wp.media.model.Attachment} attachment
+                * @returns {Object}
+                */
</ins><span class="cx">           defaultDisplaySettings: function( attachment ) {
</span><span class="cx">                  var settings = this._defaultDisplaySettings;
</span><del>-                       if ( settings.canEmbed = this.canEmbed( attachment ) )
</del><ins>+                        if ( settings.canEmbed = this.canEmbed( attachment ) ) {
</ins><span class="cx">                           settings.link = 'embed';
</span><ins>+                       }
</ins><span class="cx">                   return settings;
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {wp.media.model.Attachment} attachment
+                * @returns {Boolean}
+                */
</ins><span class="cx">           canEmbed: function( attachment ) {
</span><span class="cx">                  // If uploading, we know the filename but not the mime type.
</span><span class="cx">                  if ( ! attachment.get('uploading') ) {
</span><span class="cx">                          var type = attachment.get('type');
</span><del>-                               if ( type !== 'audio' && type !== 'video' )
</del><ins>+                                if ( type !== 'audio' && type !== 'video' ) {
</ins><span class="cx">                                   return false;
</span><ins>+                               }
</ins><span class="cx">                   }
</span><span class="cx"> 
</span><span class="cx">                  return _.contains( media.view.settings.embedExts, attachment.get('filename').split('.').pop() );
</span><span class="lines">@@ -477,8 +630,9 @@
</span><span class="cx">                  var selection = this.get('selection'),
</span><span class="cx">                          manager = this.frame._selection;
</span><span class="cx"> 
</span><del>-                       if ( ! this.get('syncSelection') || ! manager || ! selection )
</del><ins>+                        if ( ! this.get('syncSelection') || ! manager || ! selection ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // If the selection supports multiple items, validate the stored
</span><span class="cx">                  // attachments based on the new selection's conditions. Record
</span><span class="lines">@@ -494,17 +648,20 @@
</span><span class="cx">                  selection.single( manager.single );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * Record the currently active attachments, which is a combination
+                * of the selection's attachments and the set of selected
+                * attachments that this specific selection considered invalid.
+                * Reset the difference and record the single attachment.
+                */
</ins><span class="cx">           recordSelection: function() {
</span><span class="cx">                  var selection = this.get('selection'),
</span><span class="cx">                          manager = this.frame._selection;
</span><span class="cx"> 
</span><del>-                       if ( ! this.get('syncSelection') || ! manager || ! selection )
</del><ins>+                        if ( ! this.get('syncSelection') || ! manager || ! selection ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       // Record the currently active attachments, which is a combination
-                       // of the selection's attachments and the set of selected
-                       // attachments that this specific selection considered invalid.
-                       // Reset the difference and record the single attachment.
</del><span class="cx">                   if ( selection.multiple ) {
</span><span class="cx">                          manager.attachments.reset( selection.toArray().concat( manager.difference ) );
</span><span class="cx">                          manager.difference = [];
</span><span class="lines">@@ -515,49 +672,67 @@
</span><span class="cx">                  manager.single = selection._single;
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * If the state is active, no items are selected, and the current
+                * content mode is not an option in the state's router (provided
+                * the state has a router), reset the content mode to the default.
+                */
</ins><span class="cx">           refreshContent: function() {
</span><span class="cx">                  var selection = this.get('selection'),
</span><span class="cx">                          frame = this.frame,
</span><span class="cx">                          router = frame.router.get(),
</span><span class="cx">                          mode = frame.content.mode();
</span><span class="cx"> 
</span><del>-                       // If the state is active, no items are selected, and the current
-                       // content mode is not an option in the state's router (provided
-                       // the state has a router), reset the content mode to the default.
-                       if ( this.active && ! selection.length && router && ! router.get( mode ) )
</del><ins>+                        if ( this.active && ! selection.length && router && ! router.get( mode ) ) {
</ins><span class="cx">                           this.frame.content.render( this.get('content') );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><ins>+               /**
+                * If the uploader was selected, navigate to the browser.
+                *
+                * Automatically select any uploading attachments.
+                *
+                * Selections that don't support multiple attachments automatically
+                * limit themselves to one attachment (in this case, the last
+                * attachment in the upload queue).
+                *
+                * @param {wp.media.model.Attachment} attachment
+                */
</ins><span class="cx">           uploading: function( attachment ) {
</span><span class="cx">                  var content = this.frame.content;
</span><span class="cx"> 
</span><del>-                       // If the uploader was selected, navigate to the browser.
-                       if ( 'upload' === content.mode() )
</del><ins>+                        if ( 'upload' === content.mode() ) {
</ins><span class="cx">                           this.frame.content.mode('browse');
</span><del>-
-                       // Automatically select any uploading attachments.
-                       //
-                       // Selections that don't support multiple attachments automatically
-                       // limit themselves to one attachment (in this case, the last
-                       // attachment in the upload queue).
</del><ins>+                        }
</ins><span class="cx">                   this.get('selection').add( attachment );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * Only track the browse router on library states.
+                */
</ins><span class="cx">           saveContentMode: function() {
</span><del>-                       // Only track the browse router on library states.
-                       if ( 'browse' !== this.get('router') )
</del><ins>+                        if ( 'browse' !== this.get('router') ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  var mode = this.frame.content.mode(),
</span><span class="cx">                          view = this.frame.router.get();
</span><span class="cx"> 
</span><del>-                       if ( view && view.get( mode ) )
</del><ins>+                        if ( view && view.get( mode ) ) {
</ins><span class="cx">                           setUserSetting( 'libraryContent', mode );
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.controller.GalleryEdit
-       // -------------------------------
</del><ins>+        /**
+        * wp.media.controller.GalleryEdit
+        *
+        * @constructor
+        * @augments wp.media.controller.Library
+        * @augments wp.media.controller.State
+        * @augments Backbone.Model
+        */
</ins><span class="cx">   media.controller.GalleryEdit = media.controller.Library.extend({
</span><span class="cx">          defaults: {
</span><span class="cx">                  id:         'gallery-edit',
</span><span class="lines">@@ -580,12 +755,17 @@
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><span class="cx">                  // If we haven't been provided a `library`, create a `Selection`.
</span><del>-                       if ( ! this.get('library') )
</del><ins>+                        if ( ! this.get('library') ) {
</ins><span class="cx">                           this.set( 'library', new media.model.Selection() );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // The single `Attachment` view to be used in the `Attachments` view.
</span><del>-                       if ( ! this.get('AttachmentView') )
</del><ins>+                        if ( ! this.get('AttachmentView') ) {
</ins><span class="cx">                           this.set( 'AttachmentView', media.view.Attachment.EditLibrary );
</span><ins>+                       }
+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.initialize.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -599,7 +779,9 @@
</span><span class="cx">                  this.get('library').observe( wp.Uploader.queue );
</span><span class="cx"> 
</span><span class="cx">                  this.frame.on( 'content:render:browse', this.gallerySettings, this );
</span><del>-
</del><ins>+                        /**
+                        * call 'activate' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.activate.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -608,15 +790,21 @@
</span><span class="cx">                  this.get('library').unobserve( wp.Uploader.queue );
</span><span class="cx"> 
</span><span class="cx">                  this.frame.off( 'content:render:browse', this.gallerySettings, this );
</span><del>-
</del><ins>+                        /**
+                        * call 'deactivate' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.deactivate.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {Object} browser
+                */
</ins><span class="cx">           gallerySettings: function( browser ) {
</span><span class="cx">                  var library = this.get('library');
</span><span class="cx"> 
</span><del>-                       if ( ! library || ! browser )
</del><ins>+                        if ( ! library || ! browser ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  library.gallery = library.gallery || new Backbone.Model();
</span><span class="cx"> 
</span><span class="lines">@@ -639,8 +827,14 @@
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.controller.GalleryAdd
-       // ---------------------------------
</del><ins>+        /**
+        * wp.media.controller.GalleryAdd
+        *
+        * @constructor
+        * @augments wp.media.controller.Library
+        * @augments wp.media.controller.State
+        * @augments Backbone.Model
+        */
</ins><span class="cx">   media.controller.GalleryAdd = media.controller.Library.extend({
</span><span class="cx">          defaults: _.defaults({
</span><span class="cx">                  id:           'gallery-library',
</span><span class="lines">@@ -656,11 +850,16 @@
</span><span class="cx">                  syncSelection: false
</span><span class="cx">          }, media.controller.Library.prototype.defaults ),
</span><span class="cx"> 
</span><ins>+               /**
+                * If we haven't been provided a `library`, create a `Selection`.
+                */
</ins><span class="cx">           initialize: function() {
</span><del>-                       // If we haven't been provided a `library`, create a `Selection`.
-                       if ( ! this.get('library') )
</del><ins>+                        if ( ! this.get('library') ) {
</ins><span class="cx">                           this.set( 'library', media.query({ type: 'image' }) );
</span><del>-
</del><ins>+                        }
+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.initialize.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -674,7 +873,12 @@
</span><span class="cx">                  // Accepts attachments that exist in the original library and
</span><span class="cx">                  // that do not exist in gallery's library.
</span><span class="cx">                  library.validator = function( attachment ) {
</span><del>-                               return !! this.mirroring.get( attachment.cid ) && ! edit.get( attachment.cid ) && media.model.Selection.prototype.validator.apply( this, arguments );
</del><ins>+                                return !! this.mirroring.get( attachment.cid )
+                                       && ! edit.get( attachment.cid )
+                                       /**
+                                        * call 'validator' directly on wp.media.model.Selection
+                                        */
+                                       && media.model.Selection.prototype.validator.apply( this, arguments );
</ins><span class="cx">                   };
</span><span class="cx"> 
</span><span class="cx">                  // Reset the library to ensure that all attachments are re-added
</span><span class="lines">@@ -683,13 +887,21 @@
</span><span class="cx">                  library.reset( library.mirroring.models, { silent: true });
</span><span class="cx">                  library.observe( edit );
</span><span class="cx">                  this.editLibrary = edit;
</span><del>-
</del><ins>+                        /**
+                        * call 'activate' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.activate.apply( this, arguments );
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.controller.FeaturedImage
-       // ---------------------------------
</del><ins>+        /**
+        * wp.media.controller.FeaturedImage
+        *
+        * @constructor
+        * @augments wp.media.controller.Library
+        * @augments wp.media.controller.State
+        * @augments Backbone.Model
+        */
</ins><span class="cx">   media.controller.FeaturedImage = media.controller.Library.extend({
</span><span class="cx">          defaults: _.defaults({
</span><span class="cx">                  id:         'featured-image',
</span><span class="lines">@@ -706,9 +918,12 @@
</span><span class="cx">                  var library, comparator;
</span><span class="cx"> 
</span><span class="cx">                  // If we haven't been provided a `library`, create a `Selection`.
</span><del>-                       if ( ! this.get('library') )
</del><ins>+                        if ( ! this.get('library') ) {
</ins><span class="cx">                           this.set( 'library', media.query({ type: 'image' }) );
</span><del>-
</del><ins>+                        }
+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.initialize.apply( this, arguments );
</span><span class="cx"> 
</span><span class="cx">                  library    = this.get('library');
</span><span class="lines">@@ -720,12 +935,13 @@
</span><span class="cx">                          var aInQuery = !! this.mirroring.get( a.cid ),
</span><span class="cx">                                  bInQuery = !! this.mirroring.get( b.cid );
</span><span class="cx"> 
</span><del>-                               if ( ! aInQuery && bInQuery )
</del><ins>+                                if ( ! aInQuery && bInQuery ) {
</ins><span class="cx">                                   return -1;
</span><del>-                               else if ( aInQuery && ! bInQuery )
</del><ins>+                                } else if ( aInQuery && ! bInQuery ) {
</ins><span class="cx">                                   return 1;
</span><del>-                               else
</del><ins>+                                } else {
</ins><span class="cx">                                   return comparator.apply( this, arguments );
</span><ins>+                               }
</ins><span class="cx">                   };
</span><span class="cx"> 
</span><span class="cx">                  // Add all items in the selection to the library, so any featured
</span><span class="lines">@@ -736,11 +952,17 @@
</span><span class="cx">          activate: function() {
</span><span class="cx">                  this.updateSelection();
</span><span class="cx">                  this.frame.on( 'open', this.updateSelection, this );
</span><ins>+                       /**
+                        * call 'activate' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.activate.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          deactivate: function() {
</span><span class="cx">                  this.frame.off( 'open', this.updateSelection, this );
</span><ins>+                       /**
+                        * call 'deactivate' directly on the parent class
+                        */
</ins><span class="cx">                   media.controller.Library.prototype.deactivate.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -750,7 +972,7 @@
</span><span class="cx">                          attachment;
</span><span class="cx"> 
</span><span class="cx">                  if ( '' !== id && -1 !== id ) {
</span><del>-                               attachment = Attachment.get( id );
</del><ins>+                                attachment = media.model.Attachment.get( id );
</ins><span class="cx">                           attachment.fetch();
</span><span class="cx">                  }
</span><span class="cx"> 
</span><span class="lines">@@ -758,9 +980,13 @@
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-
-       // wp.media.controller.Embed
-       // -------------------------
</del><ins>+        /**
+        * wp.media.controller.Embed
+        *
+        * @constructor
+        * @augments wp.media.controller.State
+        * @augments Backbone.Model
+        */
</ins><span class="cx">   media.controller.Embed = media.controller.State.extend({
</span><span class="cx">          defaults: {
</span><span class="cx">                  id:      'embed',
</span><span class="lines">@@ -785,6 +1011,9 @@
</span><span class="cx">                  this.on( 'scan', this.scanImage, this );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @fires wp.media.controller.Embed#scan
+                */
</ins><span class="cx">           scan: function() {
</span><span class="cx">                  var scanners,
</span><span class="cx">                          embed = this,
</span><span class="lines">@@ -796,8 +1025,9 @@
</span><span class="cx">                  // Scan is triggered with the list of `attributes` to set on the
</span><span class="cx">                  // state, useful for the 'type' attribute and 'scanners' attribute,
</span><span class="cx">                  // an array of promise objects for asynchronous scan operations.
</span><del>-                       if ( this.props.get('url') )
</del><ins>+                        if ( this.props.get('url') ) {
</ins><span class="cx">                           this.trigger( 'scan', attributes );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( attributes.scanners.length ) {
</span><span class="cx">                          scanners = attributes.scanners = $.when.apply( $, attributes.scanners );
</span><span class="lines">@@ -812,7 +1042,9 @@
</span><span class="cx">                  attributes.loading = !! attributes.scanners;
</span><span class="cx">                  this.set( attributes );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} attributes
+                */
</ins><span class="cx">           scanImage: function( attributes ) {
</span><span class="cx">                  var frame = this.frame,
</span><span class="cx">                          state = this,
</span><span class="lines">@@ -826,8 +1058,9 @@
</span><span class="cx">                  image.onload = function() {
</span><span class="cx">                          deferred.resolve();
</span><span class="cx"> 
</span><del>-                               if ( state !== frame.state() || url !== state.props.get('url') )
</del><ins>+                                if ( state !== frame.state() || url !== state.props.get('url') ) {
</ins><span class="cx">                                   return;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          state.set({
</span><span class="cx">                                  type: 'image'
</span><span class="lines">@@ -850,8 +1083,9 @@
</span><span class="cx">          reset: function() {
</span><span class="cx">                  this.props.clear().set({ url: '' });
</span><span class="cx"> 
</span><del>-                       if ( this.active )
</del><ins>+                        if ( this.active ) {
</ins><span class="cx">                           this.refresh();
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="lines">@@ -861,52 +1095,74 @@
</span><span class="cx">   * ========================================================================
</span><span class="cx">   */
</span><span class="cx"> 
</span><del>-       // wp.media.View
-       // -------------
-       //
-       // The base view class.
-       //
-       // Undelegating events, removing events from the model, and
-       // removing events from the controller mirror the code for
-       // `Backbone.View.dispose` in Backbone 0.9.8 development.
-       //
-       // This behavior has since been removed, and should not be used
-       // outside of the media manager.
</del><ins>+        /**
+        * wp.media.View
+        * -------------
+        *
+        * The base view class.
+        *
+        * Undelegating events, removing events from the model, and
+        * removing events from the controller mirror the code for
+        * `Backbone.View.dispose` in Backbone 0.9.8 development.
+        *
+        * This behavior has since been removed, and should not be used
+        * outside of the media manager.
+        *
+        * @constructor
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.View = wp.Backbone.View.extend({
</span><span class="cx">          constructor: function( options ) {
</span><del>-                       if ( options && options.controller )
</del><ins>+                        if ( options && options.controller ) {
</ins><span class="cx">                           this.controller = options.controller;
</span><del>-
</del><ins>+                        }
</ins><span class="cx">                   wp.Backbone.View.apply( this, arguments );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.View} Returns itself to allow chaining
+                */
</ins><span class="cx">           dispose: function() {
</span><span class="cx">                  // Undelegating events, removing events from the model, and
</span><span class="cx">                  // removing events from the controller mirror the code for
</span><span class="cx">                  // `Backbone.View.dispose` in Backbone 0.9.8 development.
</span><span class="cx">                  this.undelegateEvents();
</span><span class="cx"> 
</span><del>-                       if ( this.model && this.model.off )
</del><ins>+                        if ( this.model && this.model.off ) {
</ins><span class="cx">                           this.model.off( null, null, this );
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( this.collection && this.collection.off )
</del><ins>+                        if ( this.collection && this.collection.off ) {
</ins><span class="cx">                           this.collection.off( null, null, this );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Unbind controller events.
</span><del>-                       if ( this.controller && this.controller.off )
</del><ins>+                        if ( this.controller && this.controller.off ) {
</ins><span class="cx">                           this.controller.off( null, null, this );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.View} Returns itself to allow chaining
+                */
</ins><span class="cx">           remove: function() {
</span><span class="cx">                  this.dispose();
</span><ins>+                       /**
+                        * call 'remove' directly on the parent class
+                        */
</ins><span class="cx">                   return wp.Backbone.View.prototype.remove.apply( this, arguments );
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Frame
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        * @mixes wp.media.controller.StateMachine
</ins><span class="cx">    */
</span><span class="cx">  media.view.Frame = media.View.extend({
</span><span class="cx">          initialize: function() {
</span><span class="lines">@@ -927,7 +1183,9 @@
</span><span class="cx">                          });
</span><span class="cx">                  }, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @fires wp.media.controller.State#ready
+                */
</ins><span class="cx">           _createStates: function() {
</span><span class="cx">                  // Create the default `states` collection.
</span><span class="cx">                  this.states = new Backbone.Collection( null, {
</span><span class="lines">@@ -940,10 +1198,13 @@
</span><span class="cx">                          model.trigger('ready');
</span><span class="cx">                  }, this );
</span><span class="cx"> 
</span><del>-                       if ( this.options.states )
</del><ins>+                        if ( this.options.states ) {
</ins><span class="cx">                           this.states.add( this.options.states );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Frame} Returns itself to allow chaining
+                */
</ins><span class="cx">           reset: function() {
</span><span class="cx">                  this.states.invoke( 'trigger', 'reset' );
</span><span class="cx">                  return this;
</span><span class="lines">@@ -955,13 +1216,26 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.MediaFrame
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Frame
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        * @mixes wp.media.controller.StateMachine
</ins><span class="cx">    */
</span><span class="cx">  media.view.MediaFrame = media.view.Frame.extend({
</span><span class="cx">          className: 'media-frame',
</span><span class="cx">          template:  media.template('media-frame'),
</span><span class="cx">          regions:   ['menu','title','content','toolbar','router'],
</span><span class="cx"> 
</span><ins>+               /**
+                * @global wp.Uploader
+                */
</ins><span class="cx">           initialize: function() {
</span><ins>+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Frame.prototype.initialize.apply( this, arguments );
</span><span class="cx"> 
</span><span class="cx">                  _.defaults( this.options, {
</span><span class="lines">@@ -985,8 +1259,9 @@
</span><span class="cx"> 
</span><span class="cx">                  // Force the uploader off if the upload limit has been exceeded or
</span><span class="cx">                  // if the browser isn't supported.
</span><del>-                       if ( wp.Uploader.limitExceeded || ! wp.Uploader.browser.supported )
</del><ins>+                        if ( wp.Uploader.limitExceeded || ! wp.Uploader.browser.supported ) {
</ins><span class="cx">                           this.options.uploader = false;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Initialize window-wide uploader.
</span><span class="cx">                  if ( this.options.uploader ) {
</span><span class="lines">@@ -1009,53 +1284,74 @@
</span><span class="cx">                  // Bind default menu.
</span><span class="cx">                  this.on( 'menu:create:default', this.createMenu, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.MediaFrame} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  // Activate the default state if no active state exists.
</span><del>-                       if ( ! this.state() && this.options.state )
</del><ins>+                        if ( ! this.state() && this.options.state ) {
</ins><span class="cx">                           this.setState( this.options.state );
</span><del>-
</del><ins>+                        }
+                       /**
+                        * call 'render' directly on the parent class
+                        */
</ins><span class="cx">                   return media.view.Frame.prototype.render.apply( this, arguments );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} title
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           createTitle: function( title ) {
</span><span class="cx">                  title.view = new media.View({
</span><span class="cx">                          controller: this,
</span><span class="cx">                          tagName: 'h1'
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} menu
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           createMenu: function( menu ) {
</span><span class="cx">                  menu.view = new media.view.Menu({
</span><span class="cx">                          controller: this
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} toolbar
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           createToolbar: function( toolbar ) {
</span><span class="cx">                  toolbar.view = new media.view.Toolbar({
</span><span class="cx">                          controller: this
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} router
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           createRouter: function( router ) {
</span><span class="cx">                  router.view = new media.view.Router({
</span><span class="cx">                          controller: this
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} options
+                */
</ins><span class="cx">           createIframeStates: function( options ) {
</span><span class="cx">                  var settings = media.view.settings,
</span><span class="cx">                          tabs = settings.tabs,
</span><span class="cx">                          tabUrl = settings.tabUrl,
</span><span class="cx">                          $postId;
</span><span class="cx"> 
</span><del>-                       if ( ! tabs || ! tabUrl )
</del><ins>+                        if ( ! tabs || ! tabUrl ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Add the post ID to the tab URL if it exists.
</span><span class="cx">                  $postId = $('#post_ID');
</span><del>-                       if ( $postId.length )
</del><ins>+                        if ( $postId.length ) {
</ins><span class="cx">                           tabUrl += '&post_id=' + $postId.val();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Generate the tab states.
</span><span class="cx">                  _.each( tabs, function( title, id ) {
</span><span class="lines">@@ -1074,6 +1370,10 @@
</span><span class="cx">                  this.on( 'close', this.restoreThickbox, this );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {Object} content
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           iframeContent: function( content ) {
</span><span class="cx">                  this.$el.addClass('hide-toolbar');
</span><span class="cx">                  content.view = new media.view.Iframe({
</span><span class="lines">@@ -1084,8 +1384,9 @@
</span><span class="cx">          iframeMenu: function( view ) {
</span><span class="cx">                  var views = {};
</span><span class="cx"> 
</span><del>-                       if ( ! view )
</del><ins>+                        if ( ! view ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  _.each( media.view.settings.tabs, function( title, id ) {
</span><span class="cx">                          views[ 'iframe:' + id ] = {
</span><span class="lines">@@ -1100,8 +1401,9 @@
</span><span class="cx">          hijackThickbox: function() {
</span><span class="cx">                  var frame = this;
</span><span class="cx"> 
</span><del>-                       if ( ! window.tb_remove || this._tb_remove )
</del><ins>+                        if ( ! window.tb_remove || this._tb_remove ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this._tb_remove = window.tb_remove;
</span><span class="cx">                  window.tb_remove = function() {
</span><span class="lines">@@ -1113,8 +1415,9 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          restoreThickbox: function() {
</span><del>-                       if ( ! this._tb_remove )
</del><ins>+                        if ( ! this._tb_remove ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  window.tb_remove = this._tb_remove;
</span><span class="cx">                  delete this._tb_remove;
</span><span class="lines">@@ -1123,18 +1426,33 @@
</span><span class="cx"> 
</span><span class="cx">  // Map some of the modal's methods to the frame.
</span><span class="cx">  _.each(['open','close','attach','detach','escape'], function( method ) {
</span><ins>+               /**
+                * @returns {wp.media.view.MediaFrame} Returns itself to allow chaining
+                */
</ins><span class="cx">           media.view.MediaFrame.prototype[ method ] = function() {
</span><del>-                       if ( this.modal )
</del><ins>+                        if ( this.modal ) {
</ins><span class="cx">                           this.modal[ method ].apply( this.modal, arguments );
</span><ins>+                       }
</ins><span class="cx">                   return this;
</span><span class="cx">          };
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.MediaFrame.Select
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.MediaFrame
+        * @augments wp.media.view.Frame
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        * @mixes wp.media.controller.StateMachine
</ins><span class="cx">    */
</span><span class="cx">  media.view.MediaFrame.Select = media.view.MediaFrame.extend({
</span><span class="cx">          initialize: function() {
</span><ins>+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.MediaFrame.prototype.initialize.apply( this, arguments );
</span><span class="cx"> 
</span><span class="cx">                  _.defaults( this.options, {
</span><span class="lines">@@ -1159,7 +1477,7 @@
</span><span class="cx">                  }
</span><span class="cx"> 
</span><span class="cx">                  this._selection = {
</span><del>-                               attachments: new Attachments(),
</del><ins>+                                attachments: new media.model.Attachments(),
</ins><span class="cx">                           difference: []
</span><span class="cx">                  };
</span><span class="cx">          },
</span><span class="lines">@@ -1167,8 +1485,9 @@
</span><span class="cx">          createStates: function() {
</span><span class="cx">                  var options = this.options;
</span><span class="cx"> 
</span><del>-                       if ( this.options.states )
</del><ins>+                        if ( this.options.states ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Add the default states.
</span><span class="cx">                  this.states.add([
</span><span class="lines">@@ -1204,7 +1523,12 @@
</span><span class="cx">                  });
</span><span class="cx">          },
</span><span class="cx"> 
</span><del>-               // Content
</del><ins>+                /**
+                * Content
+                *
+                * @param {Object} content
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           browseContent: function( content ) {
</span><span class="cx">                  var state = this.state();
</span><span class="cx"> 
</span><span class="lines">@@ -1226,6 +1550,10 @@
</span><span class="cx">                  });
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                *
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           uploadContent: function() {
</span><span class="cx">                  this.$el.removeClass('hide-toolbar');
</span><span class="cx">                  this.content.set( new media.view.UploaderInline({
</span><span class="lines">@@ -1233,7 +1561,13 @@
</span><span class="cx">                  }) );
</span><span class="cx">          },
</span><span class="cx"> 
</span><del>-               // Toolbars
</del><ins>+                /**
+                * Toolbars
+                *
+                * @param {Object} toolbar
+                * @param {Object} [options={}]
+                * @this wp.media.controller.Region
+                */
</ins><span class="cx">           createSelectToolbar: function( toolbar, options ) {
</span><span class="cx">                  options = options || this.options.button || {};
</span><span class="cx">                  options.controller = this;
</span><span class="lines">@@ -1244,6 +1578,15 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.MediaFrame.Post
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.MediaFrame.Select
+        * @augments wp.media.view.MediaFrame
+        * @augments wp.media.view.Frame
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        * @mixes wp.media.controller.StateMachine
</ins><span class="cx">    */
</span><span class="cx">  media.view.MediaFrame.Post = media.view.MediaFrame.Select.extend({
</span><span class="cx">          initialize: function() {
</span><span class="lines">@@ -1252,7 +1595,9 @@
</span><span class="cx">                          editing:   false,
</span><span class="cx">                          state:    'insert'
</span><span class="cx">                  });
</span><del>-
</del><ins>+                        /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.MediaFrame.Select.prototype.initialize.apply( this, arguments );
</span><span class="cx">                  this.createIframeStates();
</span><span class="cx">          },
</span><span class="lines">@@ -1318,6 +1663,9 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          bindHandlers: function() {
</span><ins>+                       /**
+                        * call 'bindHandlers' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.MediaFrame.Select.prototype.bindHandlers.apply( this, arguments );
</span><span class="cx">                  this.on( 'menu:create:gallery', this.createMenu, this );
</span><span class="cx">                  this.on( 'toolbar:create:main-insert', this.createToolbar, this );
</span><span class="lines">@@ -1326,23 +1674,23 @@
</span><span class="cx">                  this.on( 'toolbar:create:main-embed', this.mainEmbedToolbar, this );
</span><span class="cx"> 
</span><span class="cx">                  var handlers = {
</span><del>-                                       menu: {
-                                               'default': 'mainMenu',
-                                               'gallery': 'galleryMenu'
-                                       },
</del><ins>+                                menu: {
+                                       'default': 'mainMenu',
+                                       'gallery': 'galleryMenu'
+                               },
</ins><span class="cx"> 
</span><del>-                                       content: {
-                                               'embed':          'embedContent',
-                                               'edit-selection': 'editSelectionContent'
-                                       },
</del><ins>+                                content: {
+                                       'embed':          'embedContent',
+                                       'edit-selection': 'editSelectionContent'
+                               },
</ins><span class="cx"> 
</span><del>-                                       toolbar: {
-                                               'main-insert':      'mainInsertToolbar',
-                                               'main-gallery':     'mainGalleryToolbar',
-                                               'gallery-edit':     'galleryEditToolbar',
-                                               'gallery-add':      'galleryAddToolbar'
-                                       }
-                               };
</del><ins>+                                toolbar: {
+                                       'main-insert':      'mainInsertToolbar',
+                                       'main-gallery':     'mainGalleryToolbar',
+                                       'gallery-edit':     'galleryEditToolbar',
+                                       'gallery-add':      'galleryAddToolbar'
+                               }
+                       };
</ins><span class="cx"> 
</span><span class="cx">                  _.each( handlers, function( regionHandlers, region ) {
</span><span class="cx">                          _.each( regionHandlers, function( callback, handler ) {
</span><span class="lines">@@ -1352,6 +1700,9 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          // Menus
</span><ins>+               /**
+                * @param {wp.Backbone.View} view
+                */
</ins><span class="cx">           mainMenu: function( view ) {
</span><span class="cx">                  view.set({
</span><span class="cx">                          'library-separator': new media.View({
</span><span class="lines">@@ -1360,7 +1711,9 @@
</span><span class="cx">                          })
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {wp.Backbone.View} view
+                */
</ins><span class="cx">           galleryMenu: function( view ) {
</span><span class="cx">                  var lastState = this.lastState(),
</span><span class="cx">                          previous = lastState && lastState.id,
</span><span class="lines">@@ -1426,6 +1779,10 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          // Toolbars
</span><ins>+
+               /**
+                * @param {wp.Backbone.View} view
+                */
</ins><span class="cx">           selectionStatusToolbar: function( view ) {
</span><span class="cx">                  var editable = this.state().get('editable');
</span><span class="cx"> 
</span><span class="lines">@@ -1442,6 +1799,9 @@
</span><span class="cx">                  }).render() );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {wp.Backbone.View} view
+                */
</ins><span class="cx">           mainInsertToolbar: function( view ) {
</span><span class="cx">                  var controller = this;
</span><span class="cx"> 
</span><span class="lines">@@ -1453,6 +1813,9 @@
</span><span class="cx">                          text:     l10n.insertIntoPost,
</span><span class="cx">                          requires: { selection: true },
</span><span class="cx"> 
</span><ins>+                               /**
+                                * @fires wp.media.controller.State#insert
+                                */
</ins><span class="cx">                           click: function() {
</span><span class="cx">                                  var state = controller.state(),
</span><span class="cx">                                          selection = state.get('selection');
</span><span class="lines">@@ -1463,6 +1826,9 @@
</span><span class="cx">                  });
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {wp.Backbone.View} view
+                */
</ins><span class="cx">           mainGalleryToolbar: function( view ) {
</span><span class="cx">                  var controller = this;
</span><span class="cx"> 
</span><span class="lines">@@ -1513,6 +1879,9 @@
</span><span class="cx">                                          priority: 80,
</span><span class="cx">                                          requires: { library: true },
</span><span class="cx"> 
</span><ins>+                                               /**
+                                                * @fires wp.media.controller.State#update
+                                                */
</ins><span class="cx">                                           click: function() {
</span><span class="cx">                                                  var controller = this.controller,
</span><span class="cx">                                                          state = controller.state();
</span><span class="lines">@@ -1539,6 +1908,9 @@
</span><span class="cx">                                          priority: 80,
</span><span class="cx">                                          requires: { selection: true },
</span><span class="cx"> 
</span><ins>+                                               /**
+                                                * @fires wp.media.controller.State#reset
+                                                */
</ins><span class="cx">                                           click: function() {
</span><span class="cx">                                                  var controller = this.controller,
</span><span class="cx">                                                          state = controller.state(),
</span><span class="lines">@@ -1556,6 +1928,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Modal
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Modal = media.View.extend({
</span><span class="cx">          tagName:  'div',
</span><span class="lines">@@ -1578,19 +1955,26 @@
</span><span class="cx">                          freeze:    true
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {Object}
+                */
</ins><span class="cx">           prepare: function() {
</span><span class="cx">                  return {
</span><span class="cx">                          title: this.options.title
</span><span class="cx">                  };
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           attach: function() {
</span><del>-                       if ( this.views.attached )
</del><ins>+                        if ( this.views.attached ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( ! this.views.rendered )
</del><ins>+                        if ( ! this.views.rendered ) {
</ins><span class="cx">                           this.render();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.$el.appendTo( this.options.container );
</span><span class="cx"> 
</span><span class="lines">@@ -1601,24 +1985,33 @@
</span><span class="cx">                  return this.propagate('attach');
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           detach: function() {
</span><del>-                       if ( this.$el.is(':visible') )
</del><ins>+                        if ( this.$el.is(':visible') ) {
</ins><span class="cx">                           this.close();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.$el.detach();
</span><span class="cx">                  this.views.attached = false;
</span><span class="cx">                  return this.propagate('detach');
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           open: function() {
</span><span class="cx">                  var $el = this.$el,
</span><span class="cx">                          options = this.options;
</span><span class="cx"> 
</span><del>-                       if ( $el.is(':visible') )
</del><ins>+                        if ( $el.is(':visible') ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( ! this.views.attached )
</del><ins>+                        if ( ! this.views.attached ) {
</ins><span class="cx">                           this.attach();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // If the `freeze` option is set, record the window's scroll position.
</span><span class="cx">                  if ( options.freeze ) {
</span><span class="lines">@@ -1631,11 +2024,16 @@
</span><span class="cx">                  return this.propagate('open');
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {Object} options
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           close: function( options ) {
</span><span class="cx">                  var freeze = this._freeze;
</span><span class="cx"> 
</span><del>-                       if ( ! this.views.attached || ! this.$el.is(':visible') )
</del><ins>+                        if ( ! this.views.attached || ! this.$el.is(':visible') ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.$el.hide();
</span><span class="cx">                  this.propagate('close');
</span><span class="lines">@@ -1645,37 +2043,54 @@
</span><span class="cx">                          $( window ).scrollTop( freeze.scrollTop );
</span><span class="cx">                  }
</span><span class="cx"> 
</span><del>-                       if ( options && options.escape )
</del><ins>+                        if ( options && options.escape ) {
</ins><span class="cx">                           this.propagate('escape');
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           escape: function() {
</span><span class="cx">                  return this.close({ escape: true });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           escapeHandler: function( event ) {
</span><span class="cx">                  event.preventDefault();
</span><span class="cx">                  this.escape();
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {Array|Object} content Views to register to '.media-modal-content'
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           content: function( content ) {
</span><span class="cx">                  this.views.set( '.media-modal-content', content );
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><span class="cx"> 
</span><del>-               // Triggers a modal event and if the `propagate` option is set,
-               // forwards events to the modal's controller.
</del><ins>+                /**
+                * Triggers a modal event and if the `propagate` option is set,
+                * forwards events to the modal's controller.
+                *
+                * @param {string} id
+                * @returns {wp.media.view.Modal} Returns itself to allow chaining
+                */
</ins><span class="cx">           propagate: function( id ) {
</span><span class="cx">                  this.trigger( id );
</span><span class="cx"> 
</span><del>-                       if ( this.options.propagate )
</del><ins>+                        if ( this.options.propagate ) {
</ins><span class="cx">                           this.controller.trigger( id );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           keydown: function( event ) {
</span><span class="cx">                  // Close the modal when escape is pressed.
</span><span class="cx">                  if ( 27 === event.which ) {
</span><span class="lines">@@ -1686,8 +2101,14 @@
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.view.FocusManager
-       // ----------------------------
</del><ins>+        /**
+        * wp.media.view.FocusManager
+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.FocusManager = media.View.extend({
</span><span class="cx">          events: {
</span><span class="cx">                  keydown: 'recordTab',
</span><span class="lines">@@ -1695,8 +2116,9 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          focus: function() {
</span><del>-                       if ( _.isUndefined( this.index ) )
</del><ins>+                        if ( _.isUndefined( this.index ) ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Update our collection of `$tabbables`.
</span><span class="cx">                  this.$tabbables = this.$(':tabbable');
</span><span class="lines">@@ -1704,42 +2126,57 @@
</span><span class="cx">                  // If tab is saved, focus it.
</span><span class="cx">                  this.$tabbables.eq( this.index ).focus();
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           recordTab: function( event ) {
</span><span class="cx">                  // Look for the tab key.
</span><del>-                       if ( 9 !== event.keyCode )
</del><ins>+                        if ( 9 !== event.keyCode ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // First try to update the index.
</span><del>-                       if ( _.isUndefined( this.index ) )
</del><ins>+                        if ( _.isUndefined( this.index ) ) {
</ins><span class="cx">                           this.updateIndex( event );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // If we still don't have an index, bail.
</span><del>-                       if ( _.isUndefined( this.index ) )
</del><ins>+                        if ( _.isUndefined( this.index ) ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  var index = this.index + ( event.shiftKey ? -1 : 1 );
</span><span class="cx"> 
</span><del>-                       if ( index >= 0 && index < this.$tabbables.length )
</del><ins>+                        if ( index >= 0 && index < this.$tabbables.length ) {
</ins><span class="cx">                           this.index = index;
</span><del>-                       else
</del><ins>+                        } else {
</ins><span class="cx">                           delete this.index;
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           updateIndex: function( event ) {
</span><span class="cx">                  this.$tabbables = this.$(':tabbable');
</span><span class="cx"> 
</span><span class="cx">                  var index = this.$tabbables.index( event.target );
</span><span class="cx"> 
</span><del>-                       if ( -1 === index )
</del><ins>+                        if ( -1 === index ) {
</ins><span class="cx">                           delete this.index;
</span><del>-                       else
</del><ins>+                        } else {
</ins><span class="cx">                           this.index = index;
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.view.UploaderWindow
-       // ----------------------------
</del><ins>+        /**
+        * wp.media.view.UploaderWindow
+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.UploaderWindow = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="cx">          className: 'uploader-window',
</span><span class="lines">@@ -1757,15 +2194,17 @@
</span><span class="cx">                  });
</span><span class="cx"> 
</span><span class="cx">                  // Ensure the dropzone is a jQuery collection.
</span><del>-                       if ( uploader.dropzone && ! (uploader.dropzone instanceof $) )
</del><ins>+                        if ( uploader.dropzone && ! (uploader.dropzone instanceof $) ) {
</ins><span class="cx">                           uploader.dropzone = $( uploader.dropzone );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.controller.on( 'activate', this.refresh, this );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          refresh: function() {
</span><del>-                       if ( this.uploader )
</del><ins>+                        if ( this.uploader ) {
</ins><span class="cx">                           this.uploader.refresh();
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          ready: function() {
</span><span class="lines">@@ -1773,12 +2212,13 @@
</span><span class="cx">                          dropzone;
</span><span class="cx"> 
</span><span class="cx">                  // If the uploader already exists, bail.
</span><del>-                       if ( this.uploader )
</del><ins>+                        if ( this.uploader ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( postId )
</del><ins>+                        if ( postId ) {
</ins><span class="cx">                           this.options.uploader.params.post_id = postId;
</span><del>-
</del><ins>+                        }
</ins><span class="cx">                   this.uploader = new wp.Uploader( this.options.uploader );
</span><span class="cx"> 
</span><span class="cx">                  dropzone = this.uploader.dropzone;
</span><span class="lines">@@ -1808,6 +2248,14 @@
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><ins>+       /**
+        * wp.media.view.UploaderInline
+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.UploaderInline = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="cx">          className: 'uploader-inline',
</span><span class="lines">@@ -1819,11 +2267,13 @@
</span><span class="cx">                          status:  true
</span><span class="cx">                  });
</span><span class="cx"> 
</span><del>-                       if ( ! this.options.$browser && this.controller.uploader )
</del><ins>+                        if ( ! this.options.$browser && this.controller.uploader ) {
</ins><span class="cx">                           this.options.$browser = this.controller.uploader.$browser;
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( _.isUndefined( this.options.postId ) )
</del><ins>+                        if ( _.isUndefined( this.options.postId ) ) {
</ins><span class="cx">                           this.options.postId = media.view.settings.post.id;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( this.options.status ) {
</span><span class="cx">                          this.views.set( '.upload-inline-status', new media.view.UploaderStatus({
</span><span class="lines">@@ -1831,10 +2281,16 @@
</span><span class="cx">                          }) );
</span><span class="cx">                  }
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.UploaderInline} Returns itself to allow chaining
+                */
</ins><span class="cx">           dispose: function() {
</span><del>-                       if ( this.disposing )
</del><ins>+                        if ( this.disposing ) {
+                               /**
+                                * call 'dispose' directly on the parent class
+                                */
</ins><span class="cx">                           return media.View.prototype.dispose.apply( this, arguments );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Run remove on `dispose`, so we can be sure to refresh the
</span><span class="cx">                  // uploader with a view-less DOM. Track whether we're disposing
</span><span class="lines">@@ -1842,8 +2298,13 @@
</span><span class="cx">                  this.disposing = true;
</span><span class="cx">                  return this.remove();
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.UploaderInline} Returns itself to allow chaining
+                */
</ins><span class="cx">           remove: function() {
</span><ins>+                       /**
+                        * call 'remove' directly on the parent class
+                        */
</ins><span class="cx">                   var result = media.View.prototype.remove.apply( this, arguments );
</span><span class="cx"> 
</span><span class="cx">                  _.defer( _.bind( this.refresh, this ) );
</span><span class="lines">@@ -1853,10 +2314,13 @@
</span><span class="cx">          refresh: function() {
</span><span class="cx">                  var uploader = this.controller.uploader;
</span><span class="cx"> 
</span><del>-                       if ( uploader )
</del><ins>+                        if ( uploader ) {
</ins><span class="cx">                           uploader.refresh();
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.UploaderInline}
+                */
</ins><span class="cx">           ready: function() {
</span><span class="cx">                  var $browser = this.options.$browser,
</span><span class="cx">                          $placeholder;
</span><span class="lines">@@ -1865,8 +2329,9 @@
</span><span class="cx">                          $placeholder = this.$('.browser');
</span><span class="cx"> 
</span><span class="cx">                          // Check if we've already replaced the placeholder.
</span><del>-                               if ( $placeholder[0] === $browser[0] )
</del><ins>+                                if ( $placeholder[0] === $browser[0] ) {
</ins><span class="cx">                                   return;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          $browser.detach().text( $placeholder.text() );
</span><span class="cx">                          $browser[0].className = $placeholder[0].className;
</span><span class="lines">@@ -1880,6 +2345,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.UploaderStatus
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.UploaderStatus = media.View.extend({
</span><span class="cx">          className: 'media-uploader-status',
</span><span class="lines">@@ -1900,9 +2370,15 @@
</span><span class="cx">                  this.errors.on( 'add remove reset', this.visibility, this );
</span><span class="cx">                  this.errors.on( 'add', this.error, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @global wp.Uploader
+                * @returns {wp.media.view.UploaderStatus}
+                */
</ins><span class="cx">           dispose: function() {
</span><span class="cx">                  wp.Uploader.queue.off( null, null, this );
</span><ins>+                       /**
+                        * call 'dispose' directly on the parent class
+                        */
</ins><span class="cx">                   media.View.prototype.dispose.apply( this, arguments );
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><span class="lines">@@ -1932,12 +2408,14 @@
</span><span class="cx">                  var queue = this.queue,
</span><span class="cx">                          $bar = this.$bar;
</span><span class="cx"> 
</span><del>-                       if ( ! $bar || ! queue.length )
</del><ins>+                        if ( ! $bar || ! queue.length ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  $bar.width( ( queue.reduce( function( memo, attachment ) {
</span><del>-                               if ( ! attachment.get('uploading') )
</del><ins>+                                if ( ! attachment.get('uploading') ) {
</ins><span class="cx">                                   return memo + 100;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          var percent = attachment.get('percent');
</span><span class="cx">                          return memo + ( _.isNumber( percent ) ? percent : 100 );
</span><span class="lines">@@ -1948,8 +2426,9 @@
</span><span class="cx">                  var queue = this.queue,
</span><span class="cx">                          index = 0, active;
</span><span class="cx"> 
</span><del>-                       if ( ! queue.length )
</del><ins>+                        if ( ! queue.length ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  active = this.queue.find( function( attachment, i ) {
</span><span class="cx">                          index = i;
</span><span class="lines">@@ -1960,11 +2439,16 @@
</span><span class="cx">                  this.$total.text( queue.length );
</span><span class="cx">                  this.$filename.html( active ? this.filename( active.get('filename') ) : '' );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} filename
+                * @returns {string}
+                */
</ins><span class="cx">           filename: function( filename ) {
</span><span class="cx">                  return media.truncate( _.escape( filename ), 24 );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Backbone.Model} error
+                */
</ins><span class="cx">           error: function( error ) {
</span><span class="cx">                  this.views.add( '.upload-errors', new media.view.UploaderStatusError({
</span><span class="cx">                          filename: this.filename( error.get('file').name ),
</span><span class="lines">@@ -1972,17 +2456,31 @@
</span><span class="cx">                  }), { at: 0 });
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @global wp.Uploader
+                *
+                * @param {Object} event
+                */
</ins><span class="cx">           dismiss: function( event ) {
</span><span class="cx">                  var errors = this.views.get('.upload-errors');
</span><span class="cx"> 
</span><span class="cx">                  event.preventDefault();
</span><span class="cx"> 
</span><del>-                       if ( errors )
</del><ins>+                        if ( errors ) {
</ins><span class="cx">                           _.invoke( errors, 'remove' );
</span><ins>+                       }
</ins><span class="cx">                   wp.Uploader.errors.reset();
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><ins>+       /**
+        * wp.media.view.UploaderStatusError
+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.UploaderStatusError = media.View.extend({
</span><span class="cx">          className: 'upload-error',
</span><span class="cx">          template:  media.template('uploader-status-error')
</span><span class="lines">@@ -1990,6 +2488,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Toolbar
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Toolbar = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="lines">@@ -2010,23 +2513,36 @@
</span><span class="cx"> 
</span><span class="cx">                  this.views.set([ this.secondary, this.primary ]);
</span><span class="cx"> 
</span><del>-                       if ( this.options.items )
</del><ins>+                        if ( this.options.items ) {
</ins><span class="cx">                           this.set( this.options.items, { silent: true });
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( ! this.options.silent )
</del><ins>+                        if ( ! this.options.silent ) {
</ins><span class="cx">                           this.render();
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( selection )
</del><ins>+                        if ( selection ) {
</ins><span class="cx">                           selection.on( 'add remove reset', this.refresh, this );
</span><del>-                       if ( library )
</del><ins>+                        }
+
+                       if ( library ) {
</ins><span class="cx">                           library.on( 'add remove reset', this.refresh, this );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Toolbar} Returns itsef to allow chaining
+                */
</ins><span class="cx">           dispose: function() {
</span><del>-                       if ( this.selection )
</del><ins>+                        if ( this.selection ) {
</ins><span class="cx">                           this.selection.off( null, null, this );
</span><del>-                       if ( this.library )
</del><ins>+                        }
+
+                       if ( this.library ) {
</ins><span class="cx">                           this.library.off( null, null, this );
</span><ins>+                       }
+                       /**
+                        * call 'dispose' directly on the parent class
+                        */
</ins><span class="cx">                   return media.View.prototype.dispose.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -2034,6 +2550,12 @@
</span><span class="cx">                  this.refresh();
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {string} id
+                * @param {Backbone.View|Object} view
+                * @param {Object} [options={}]
+                * @returns {wp.media.view.Toolbar} Returns itself to allow chaining
+                */
</ins><span class="cx">           set: function( id, view, options ) {
</span><span class="cx">                  var list;
</span><span class="cx">                  options = options || {};
</span><span class="lines">@@ -2058,23 +2580,32 @@
</span><span class="cx">                          this[ list ].set( id, view, options );
</span><span class="cx">                  }
</span><span class="cx"> 
</span><del>-                       if ( ! options.silent )
</del><ins>+                        if ( ! options.silent ) {
</ins><span class="cx">                           this.refresh();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} id
+                * @returns {wp.media.view.Button}
+                */
</ins><span class="cx">           get: function( id ) {
</span><span class="cx">                  return this._views[ id ];
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} id
+                * @param {Object} options
+                * @returns {wp.media.view.Toolbar} Returns itself to allow chaining
+                */
</ins><span class="cx">           unset: function( id, options ) {
</span><span class="cx">                  delete this._views[ id ];
</span><span class="cx">                  this.primary.unset( id, options );
</span><span class="cx">                  this.secondary.unset( id, options );
</span><span class="cx"> 
</span><del>-                       if ( ! options || ! options.silent )
</del><ins>+                        if ( ! options || ! options.silent ) {
</ins><span class="cx">                           this.refresh();
</span><ins>+                       }
</ins><span class="cx">                   return this;
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -2084,8 +2615,9 @@
</span><span class="cx">                          selection = state.get('selection');
</span><span class="cx"> 
</span><span class="cx">                  _.each( this._views, function( button ) {
</span><del>-                               if ( ! button.model || ! button.options || ! button.options.requires )
</del><ins>+                                if ( ! button.model || ! button.options || ! button.options.requires ) {
</ins><span class="cx">                                   return;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          var requires = button.options.requires,
</span><span class="cx">                                  disabled = false;
</span><span class="lines">@@ -2095,18 +2627,25 @@
</span><span class="cx">                                  return attachment.get('uploading') === true;
</span><span class="cx">                          });
</span><span class="cx"> 
</span><del>-                               if ( requires.selection && selection && ! selection.length )
</del><ins>+                                if ( requires.selection && selection && ! selection.length ) {
</ins><span class="cx">                                   disabled = true;
</span><del>-                               else if ( requires.library && library && ! library.length )
</del><ins>+                                } else if ( requires.library && library && ! library.length ) {
</ins><span class="cx">                                   disabled = true;
</span><del>-
</del><ins>+                                }
</ins><span class="cx">                           button.model.set( 'disabled', disabled );
</span><span class="cx">                  });
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.view.Toolbar.Select
-       // ----------------------------
</del><ins>+        /**
+        * wp.media.view.Toolbar.Select
+        *
+        * @constructor
+        * @augments wp.media.view.Toolbar
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.Toolbar.Select = media.view.Toolbar.extend({
</span><span class="cx">          initialize: function() {
</span><span class="cx">                  var options = this.options;
</span><span class="lines">@@ -2135,7 +2674,9 @@
</span><span class="cx">                                  requires: options.requires
</span><span class="cx">                          }
</span><span class="cx">                  });
</span><del>-
</del><ins>+                        /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Toolbar.prototype.initialize.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="lines">@@ -2143,42 +2684,63 @@
</span><span class="cx">                  var options = this.options,
</span><span class="cx">                          controller = this.controller;
</span><span class="cx"> 
</span><del>-                       if ( options.close )
</del><ins>+                        if ( options.close ) {
</ins><span class="cx">                           controller.close();
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( options.event )
</del><ins>+                        if ( options.event ) {
</ins><span class="cx">                           controller.state().trigger( options.event );
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( options.state )
</del><ins>+                        if ( options.state ) {
</ins><span class="cx">                           controller.setState( options.state );
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( options.reset )
</del><ins>+                        if ( options.reset ) {
</ins><span class="cx">                           controller.reset();
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-       // wp.media.view.Toolbar.Embed
-       // ---------------------------
</del><ins>+        /**
+        * wp.media.view.Toolbar.Embed
+        *
+        * @constructor
+        * @augments wp.media.view.Toolbar.Select
+        * @augments wp.media.view.Toolbar
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.Toolbar.Embed = media.view.Toolbar.Select.extend({
</span><span class="cx">          initialize: function() {
</span><span class="cx">                  _.defaults( this.options, {
</span><span class="cx">                          text: l10n.insertIntoPost,
</span><span class="cx">                          requires: false
</span><span class="cx">                  });
</span><del>-
</del><ins>+                        /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Toolbar.Select.prototype.initialize.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          refresh: function() {
</span><span class="cx">                  var url = this.controller.state().props.get('url');
</span><span class="cx">                  this.get('select').model.set( 'disabled', ! url || url === 'http://' );
</span><del>-
</del><ins>+                        /**
+                        * call 'refresh' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Toolbar.Select.prototype.refresh.apply( this, arguments );
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Button
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Button = media.View.extend({
</span><span class="cx">          tagName:    'a',
</span><span class="lines">@@ -2197,7 +2759,11 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><del>-                       // Create a model with the provided `defaults`.
</del><ins>+                        /**
+                        * Create a model with the provided `defaults`.
+                        *
+                        * @member {Backbone.Model}
+                        */
</ins><span class="cx">                   this.model = new Backbone.Model( this.defaults );
</span><span class="cx"> 
</span><span class="cx">                  // If any of the `options` have a key from `defaults`, apply its
</span><span class="lines">@@ -2213,16 +2779,20 @@
</span><span class="cx"> 
</span><span class="cx">                  this.model.on( 'change', this.render, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Button} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  var classes = [ 'button', this.className ],
</span><span class="cx">                          model = this.model.toJSON();
</span><span class="cx"> 
</span><del>-                       if ( model.style )
</del><ins>+                        if ( model.style ) {
</ins><span class="cx">                           classes.push( 'button-' + model.style );
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( model.size )
</del><ins>+                        if ( model.size ) {
</ins><span class="cx">                           classes.push( 'button-' + model.size );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  classes = _.uniq( classes.concat( this.options.classes ) );
</span><span class="cx">                  this.el.className = classes.join(' ');
</span><span class="lines">@@ -2232,37 +2802,54 @@
</span><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           click: function( event ) {
</span><del>-                       if ( '#' === this.attributes.href )
</del><ins>+                        if ( '#' === this.attributes.href ) {
</ins><span class="cx">                           event.preventDefault();
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( this.options.click && ! this.model.get('disabled') )
</del><ins>+                        if ( this.options.click && ! this.model.get('disabled') ) {
</ins><span class="cx">                           this.options.click.apply( this, arguments );
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.ButtonGroup
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.ButtonGroup = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="cx">          className: 'button-group button-large media-button-group',
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><ins>+                       /**
+                        * @member {wp.media.view.Button[]}
+                        */
</ins><span class="cx">                   this.buttons = _.map( this.options.buttons || [], function( button ) {
</span><del>-                               if ( button instanceof Backbone.View )
</del><ins>+                                if ( button instanceof Backbone.View ) {
</ins><span class="cx">                                   return button;
</span><del>-                               else
</del><ins>+                                } else {
</ins><span class="cx">                                   return new media.view.Button( button ).render();
</span><ins>+                               }
</ins><span class="cx">                   });
</span><span class="cx"> 
</span><span class="cx">                  delete this.options.buttons;
</span><span class="cx"> 
</span><del>-                       if ( this.options.classes )
</del><ins>+                        if ( this.options.classes ) {
</ins><span class="cx">                           this.$el.addClass( this.options.classes );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><ins>+               /**
+                * @returns {wp.media.view.ButtonGroup}
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  this.$el.html( $( _.pluck( this.buttons, 'el' ) ).detach() );
</span><span class="cx">                  return this;
</span><span class="lines">@@ -2271,8 +2858,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.PriorityList
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><del>-
</del><span class="cx">   media.view.PriorityList = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="cx"> 
</span><span class="lines">@@ -2282,10 +2873,16 @@
</span><span class="cx">                  this.set( _.extend( {}, this._views, this.options.views ), { silent: true });
</span><span class="cx">                  delete this.options.views;
</span><span class="cx"> 
</span><del>-                       if ( ! this.options.silent )
</del><ins>+                        if ( ! this.options.silent ) {
</ins><span class="cx">                           this.render();
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {string} id
+                * @param {wp.media.View|Object} view
+                * @param {Object} options
+                * @returns {wp.media.view.PriorityList} Returns itself to allow chaining
+                */
</ins><span class="cx">           set: function( id, view, options ) {
</span><span class="cx">                  var priority, views, index;
</span><span class="cx"> 
</span><span class="lines">@@ -2299,9 +2896,9 @@
</span><span class="cx">                          return this;
</span><span class="cx">                  }
</span><span class="cx"> 
</span><del>-                       if ( ! (view instanceof Backbone.View) )
</del><ins>+                        if ( ! (view instanceof Backbone.View) ) {
</ins><span class="cx">                           view = this.toView( view, id, options );
</span><del>-
</del><ins>+                        }
</ins><span class="cx">                   view.controller = view.controller || this.controller;
</span><span class="cx"> 
</span><span class="cx">                  this.unset( id );
</span><span class="lines">@@ -2323,21 +2920,31 @@
</span><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} id
+                * @returns {wp.media.View}
+                */
</ins><span class="cx">           get: function( id ) {
</span><span class="cx">                  return this._views[ id ];
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} id
+                * @returns {wp.media.view.PriorityList}
+                */
</ins><span class="cx">           unset: function( id ) {
</span><span class="cx">                  var view = this.get( id );
</span><span class="cx"> 
</span><del>-                       if ( view )
</del><ins>+                        if ( view ) {
</ins><span class="cx">                           view.remove();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  delete this._views[ id ];
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} options
+                * @returns {wp.media.View}
+                */
</ins><span class="cx">           toView: function( options ) {
</span><span class="cx">                  return new media.View( options );
</span><span class="cx">          }
</span><span class="lines">@@ -2345,6 +2952,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.MenuItem
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.MenuItem = media.View.extend({
</span><span class="cx">          tagName:   'a',
</span><span class="lines">@@ -2357,32 +2969,40 @@
</span><span class="cx">          events: {
</span><span class="cx">                  'click': '_click'
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           _click: function( event ) {
</span><span class="cx">                  var clickOverride = this.options.click;
</span><span class="cx"> 
</span><del>-                       if ( event )
</del><ins>+                        if ( event ) {
</ins><span class="cx">                           event.preventDefault();
</span><ins>+                       }
</ins><span class="cx"> 
</span><del>-                       if ( clickOverride )
</del><ins>+                        if ( clickOverride ) {
</ins><span class="cx">                           clickOverride.call( this );
</span><del>-                       else
</del><ins>+                        } else {
</ins><span class="cx">                           this.click();
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          click: function() {
</span><span class="cx">                  var state = this.options.state;
</span><del>-                       if ( state )
</del><ins>+                        if ( state ) {
</ins><span class="cx">                           this.controller.setState( state );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.MenuItem} returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  var options = this.options;
</span><span class="cx"> 
</span><del>-                       if ( options.text )
</del><ins>+                        if ( options.text ) {
</ins><span class="cx">                           this.$el.text( options.text );
</span><del>-                       else if ( options.html )
</del><ins>+                        } else if ( options.html ) {
</ins><span class="cx">                           this.$el.html( options.html );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  return this;
</span><span class="cx">          }
</span><span class="lines">@@ -2390,6 +3010,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Menu
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.PriorityList
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Menu = media.view.PriorityList.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="lines">@@ -2397,7 +3023,11 @@
</span><span class="cx">          property:  'state',
</span><span class="cx">          ItemView:  media.view.MenuItem,
</span><span class="cx">          region:    'menu',
</span><del>-
</del><ins>+                /**
+                * @param {Object} options
+                * @param {string} id
+                * @returns {wp.media.View}
+                */
</ins><span class="cx">           toView: function( options, id ) {
</span><span class="cx">                  options = options || {};
</span><span class="cx">                  options[ this.property ] = options[ this.property ] || id;
</span><span class="lines">@@ -2405,16 +3035,25 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          ready: function() {
</span><ins>+                       /**
+                        * call 'ready' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.PriorityList.prototype.ready.apply( this, arguments );
</span><span class="cx">                  this.visibility();
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          set: function() {
</span><ins>+                       /**
+                        * call 'set' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.PriorityList.prototype.set.apply( this, arguments );
</span><span class="cx">                  this.visibility();
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          unset: function() {
</span><ins>+                       /**
+                        * call 'unset' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.PriorityList.prototype.unset.apply( this, arguments );
</span><span class="cx">                  this.visibility();
</span><span class="cx">          },
</span><span class="lines">@@ -2425,15 +3064,19 @@
</span><span class="cx">                          views = this.views.get(),
</span><span class="cx">                          hide = ! views || views.length < 2;
</span><span class="cx"> 
</span><del>-                       if ( this === view )
</del><ins>+                        if ( this === view ) {
</ins><span class="cx">                           this.controller.$el.toggleClass( 'hide-' + region, hide );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {string} id
+                */
</ins><span class="cx">           select: function( id ) {
</span><span class="cx">                  var view = this.get( id );
</span><span class="cx"> 
</span><del>-                       if ( ! view )
</del><ins>+                        if ( ! view ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.deselect();
</span><span class="cx">                  view.$el.addClass('active');
</span><span class="lines">@@ -2446,17 +3089,31 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.RouterItem
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.MenuItem
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.RouterItem = media.view.MenuItem.extend({
</span><span class="cx">          click: function() {
</span><span class="cx">                  var contentMode = this.options.contentMode;
</span><del>-                       if ( contentMode )
</del><ins>+                        if ( contentMode ) {
</ins><span class="cx">                           this.controller.content.mode( contentMode );
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Router
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Menu
+        * @augments wp.media.view.PriorityList
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Router = media.view.Menu.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="lines">@@ -2467,19 +3124,28 @@
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><span class="cx">                  this.controller.on( 'content:render', this.update, this );
</span><ins>+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Menu.prototype.initialize.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          update: function() {
</span><span class="cx">                  var mode = this.controller.content.mode();
</span><del>-                       if ( mode )
</del><ins>+                        if ( mode ) {
</ins><span class="cx">                           this.select( mode );
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><del>-
</del><span class="cx">   /**
</span><span class="cx">   * wp.media.view.Sidebar
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.PriorityList
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Sidebar = media.view.PriorityList.extend({
</span><span class="cx">          className: 'media-sidebar'
</span><span class="lines">@@ -2487,6 +3153,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachment
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachment = media.View.extend({
</span><span class="cx">          tagName:   'li',
</span><span class="lines">@@ -2517,27 +3188,35 @@
</span><span class="cx">                  // Update the selection.
</span><span class="cx">                  this.model.on( 'add', this.select, this );
</span><span class="cx">                  this.model.on( 'remove', this.deselect, this );
</span><del>-                       if ( selection )
</del><ins>+                        if ( selection ) {
</ins><span class="cx">                           selection.on( 'reset', this.updateSelect, this );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Update the model's details view.
</span><span class="cx">                  this.model.on( 'selection:single selection:unsingle', this.details, this );
</span><span class="cx">                  this.details( this.model, this.controller.state().get('selection') );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Attachment} Returns itself to allow chaining
+                */
</ins><span class="cx">           dispose: function() {
</span><span class="cx">                  var selection = this.options.selection;
</span><span class="cx"> 
</span><span class="cx">                  // Make sure all settings are saved before removing the view.
</span><span class="cx">                  this.updateAll();
</span><span class="cx"> 
</span><del>-                       if ( selection )
</del><ins>+                        if ( selection ) {
</ins><span class="cx">                           selection.off( null, null, this );
</span><del>-
</del><ins>+                        }
+                       /**
+                        * call 'dispose' directly on the parent class
+                        */
</ins><span class="cx">                   media.View.prototype.dispose.apply( this, arguments );
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Attachment} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  var options = _.defaults( this.model.toJSON(), {
</span><span class="cx">                                  orientation:   'landscape',
</span><span class="lines">@@ -2592,23 +3271,29 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          progress: function() {
</span><del>-                       if ( this.$bar && this.$bar.length )
</del><ins>+                        if ( this.$bar && this.$bar.length ) {
</ins><span class="cx">                           this.$bar.width( this.model.get('percent') + '%' );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           toggleSelectionHandler: function( event ) {
</span><span class="cx">                  var method;
</span><span class="cx"> 
</span><del>-                       if ( event.shiftKey )
</del><ins>+                        if ( event.shiftKey ) {
</ins><span class="cx">                           method = 'between';
</span><del>-                       else if ( event.ctrlKey || event.metaKey )
</del><ins>+                        } else if ( event.ctrlKey || event.metaKey ) {
</ins><span class="cx">                           method = 'toggle';
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.toggleSelection({
</span><span class="cx">                          method: method
</span><span class="cx">                  });
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} options
+                */
</ins><span class="cx">           toggleSelection: function( options ) {
</span><span class="cx">                  var collection = this.collection,
</span><span class="cx">                          selection = this.options.selection,
</span><span class="lines">@@ -2616,8 +3301,9 @@
</span><span class="cx">                          method = options && options.method,
</span><span class="cx">                          single, models, singleIndex, modelIndex;
</span><span class="cx"> 
</span><del>-                       if ( ! selection )
</del><ins>+                        if ( ! selection ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  single = selection.single();
</span><span class="cx">                  method = _.isUndefined( method ) ? selection.multiple : method;
</span><span class="lines">@@ -2626,16 +3312,18 @@
</span><span class="cx">                  // exist between the current and the selected model.
</span><span class="cx">                  if ( 'between' === method && single && selection.multiple ) {
</span><span class="cx">                          // If the models are the same, short-circuit.
</span><del>-                               if ( single === model )
</del><ins>+                                if ( single === model ) {
</ins><span class="cx">                                   return;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          singleIndex = collection.indexOf( single );
</span><span class="cx">                          modelIndex  = collection.indexOf( this.model );
</span><span class="cx"> 
</span><del>-                               if ( singleIndex < modelIndex )
</del><ins>+                                if ( singleIndex < modelIndex ) {
</ins><span class="cx">                                   models = collection.models.slice( singleIndex, modelIndex + 1 );
</span><del>-                               else
</del><ins>+                                } else {
</ins><span class="cx">                                   models = collection.models.slice( modelIndex, singleIndex + 1 );
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          selection.add( models ).single( model );
</span><span class="cx">                          return;
</span><span class="lines">@@ -2647,8 +3335,9 @@
</span><span class="cx">                          return;
</span><span class="cx">                  }
</span><span class="cx"> 
</span><del>-                       if ( method !== 'add' )
</del><ins>+                        if ( method !== 'add' ) {
</ins><span class="cx">                           method = 'reset';
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( this.selected() ) {
</span><span class="cx">                          // If the model is the single model, remove it.
</span><span class="lines">@@ -2666,52 +3355,71 @@
</span><span class="cx">          updateSelect: function() {
</span><span class="cx">                  this[ this.selected() ? 'select' : 'deselect' ]();
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {unresolved|Boolean}
+                */
</ins><span class="cx">           selected: function() {
</span><span class="cx">                  var selection = this.options.selection;
</span><del>-                       if ( selection )
</del><ins>+                        if ( selection ) {
</ins><span class="cx">                           return !! selection.get( this.model.cid );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {Backbone.Model} model
+                * @param {Backbone.Collection} collection
+                */
</ins><span class="cx">           select: function( model, collection ) {
</span><span class="cx">                  var selection = this.options.selection;
</span><span class="cx"> 
</span><span class="cx">                  // Check if a selection exists and if it's the collection provided.
</span><span class="cx">                  // If they're not the same collection, bail; we're in another
</span><span class="cx">                  // selection's event loop.
</span><del>-                       if ( ! selection || ( collection && collection !== selection ) )
</del><ins>+                        if ( ! selection || ( collection && collection !== selection ) ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.$el.addClass('selected');
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Backbone.Model} model
+                * @param {Backbone.Collection} collection
+                */
</ins><span class="cx">           deselect: function( model, collection ) {
</span><span class="cx">                  var selection = this.options.selection;
</span><span class="cx"> 
</span><span class="cx">                  // Check if a selection exists and if it's the collection provided.
</span><span class="cx">                  // If they're not the same collection, bail; we're in another
</span><span class="cx">                  // selection's event loop.
</span><del>-                       if ( ! selection || ( collection && collection !== selection ) )
</del><ins>+                        if ( ! selection || ( collection && collection !== selection ) ) {
</ins><span class="cx">                           return;
</span><del>-
</del><ins>+                        }
</ins><span class="cx">                   this.$el.removeClass('selected');
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Backbone.Model} model
+                * @param {Backbone.Collection} collection
+                */
</ins><span class="cx">           details: function( model, collection ) {
</span><span class="cx">                  var selection = this.options.selection,
</span><span class="cx">                          details;
</span><span class="cx"> 
</span><del>-                       if ( selection !== collection )
</del><ins>+                        if ( selection !== collection ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  details = selection.single();
</span><span class="cx">                  this.$el.toggleClass( 'details', details === this.model );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           preventDefault: function( event ) {
</span><span class="cx">                  event.preventDefault();
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} size
+                * @returns {Object}
+                */
</ins><span class="cx">           imageSize: function( size ) {
</span><span class="cx">                  var sizes = this.model.get('sizes');
</span><span class="cx"> 
</span><span class="lines">@@ -2729,25 +3437,31 @@
</span><span class="cx">                          };
</span><span class="cx">                  }
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           updateSetting: function( event ) {
</span><span class="cx">                  var $setting = $( event.target ).closest('[data-setting]'),
</span><span class="cx">                          setting, value;
</span><span class="cx"> 
</span><del>-                       if ( ! $setting.length )
</del><ins>+                        if ( ! $setting.length ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  setting = $setting.data('setting');
</span><span class="cx">                  value   = event.target.value;
</span><span class="cx"> 
</span><del>-                       if ( this.model.get( setting ) !== value )
</del><ins>+                        if ( this.model.get( setting ) !== value ) {
</ins><span class="cx">                           this.save( setting, value );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><del>-               // Pass all the arguments to the model's save method.
-               //
-               // Records the aggregate status of all save requests and updates the
-               // view's classes accordingly.
</del><ins>+                /**
+                * Pass all the arguments to the model's save method.
+                *
+                * Records the aggregate status of all save requests and updates the
+                * view's classes accordingly.
+                */
</ins><span class="cx">           save: function() {
</span><span class="cx">                  var view = this,
</span><span class="cx">                          save = this._save = this._save || { status: 'ready' },
</span><span class="lines">@@ -2755,15 +3469,17 @@
</span><span class="cx">                          requests = save.requests ? $.when( request, save.requests ) : request;
</span><span class="cx"> 
</span><span class="cx">                  // If we're waiting to remove 'Saved.', stop.
</span><del>-                       if ( save.savedTimer )
</del><ins>+                        if ( save.savedTimer ) {
</ins><span class="cx">                           clearTimeout( save.savedTimer );
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.updateSave('waiting');
</span><span class="cx">                  save.requests = requests;
</span><span class="cx">                  requests.always( function() {
</span><span class="cx">                          // If we've performed another request since this one, bail.
</span><del>-                               if ( save.requests !== requests )
</del><ins>+                                if ( save.requests !== requests ) {
</ins><span class="cx">                                   return;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          view.updateSave( requests.state() === 'resolved' ? 'complete' : 'error' );
</span><span class="cx">                          save.savedTimer = setTimeout( function() {
</span><span class="lines">@@ -2771,9 +3487,11 @@
</span><span class="cx">                                  delete save.savedTimer;
</span><span class="cx">                          }, 2000 );
</span><span class="cx">                  });
</span><del>-
</del><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {string} status
+                * @returns {wp.media.view.Attachment} Returns itself to allow chaining
+                */
</ins><span class="cx">           updateSave: function( status ) {
</span><span class="cx">                  var save = this._save = this._save || { status: 'ready' };
</span><span class="cx"> 
</span><span class="lines">@@ -2795,32 +3513,40 @@
</span><span class="cx">                          var $input = $('input, textarea, select, [value]', el ),
</span><span class="cx">                                  setting, value;
</span><span class="cx"> 
</span><del>-                               if ( ! $input.length )
</del><ins>+                                if ( ! $input.length ) {
</ins><span class="cx">                                   return;
</span><ins>+                               }
</ins><span class="cx"> 
</span><span class="cx">                          setting = $(el).data('setting');
</span><span class="cx">                          value = $input.val();
</span><span class="cx"> 
</span><span class="cx">                          // Record the value if it changed.
</span><del>-                               if ( model.get( setting ) !== value )
</del><ins>+                                if ( model.get( setting ) !== value ) {
</ins><span class="cx">                                   return [ setting, value ];
</span><ins>+                               }
</ins><span class="cx">                   }).compact().object().value();
</span><span class="cx"> 
</span><del>-                       if ( ! _.isEmpty( changed ) )
</del><ins>+                        if ( ! _.isEmpty( changed ) ) {
</ins><span class="cx">                           model.save( changed );
</span><ins>+                       }
</ins><span class="cx">           },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           removeFromLibrary: function( event ) {
</span><span class="cx">                  // Stop propagation so the model isn't selected.
</span><span class="cx">                  event.stopPropagation();
</span><span class="cx"> 
</span><span class="cx">                  this.collection.remove( this.model );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           removeFromSelection: function( event ) {
</span><span class="cx">                  var selection = this.options.selection;
</span><del>-                       if ( ! selection )
</del><ins>+                        if ( ! selection ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Stop propagation so the model isn't selected.
</span><span class="cx">                  event.stopPropagation();
</span><span class="lines">@@ -2834,18 +3560,25 @@
</span><span class="cx">          caption: '_syncCaption',
</span><span class="cx">          title:   '_syncTitle'
</span><span class="cx">  }, function( method, setting ) {
</span><ins>+               /**
+                * @param {Backbone.Model} model
+                * @param {string} value
+                * @returns {wp.media.view.Attachment} Returns itself to allow chaining
+                */
</ins><span class="cx">           media.view.Attachment.prototype[ method ] = function( model, value ) {
</span><span class="cx">                  var $setting = this.$('[data-setting="' + setting + '"]');
</span><span class="cx"> 
</span><del>-                       if ( ! $setting.length )
</del><ins>+                        if ( ! $setting.length ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // If the updated value is in sync with the value in the DOM, there
</span><span class="cx">                  // is no need to re-render. If we're currently editing the value,
</span><span class="cx">                  // it will automatically be in sync, suppressing the re-render for
</span><span class="cx">                  // the view we're editing, while updating any others.
</span><del>-                       if ( value === $setting.find('input, textarea, select, [value]').val() )
</del><ins>+                        if ( value === $setting.find('input, textarea, select, [value]').val() ) {
</ins><span class="cx">                           return this;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  return this.render();
</span><span class="cx">          };
</span><span class="lines">@@ -2853,6 +3586,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachment.Library
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Attachment
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachment.Library = media.view.Attachment.extend({
</span><span class="cx">          buttons: {
</span><span class="lines">@@ -2862,6 +3601,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachment.EditLibrary
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Attachment
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachment.EditLibrary = media.view.Attachment.extend({
</span><span class="cx">          buttons: {
</span><span class="lines">@@ -2871,6 +3616,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachments
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachments = media.View.extend({
</span><span class="cx">          tagName:   'ul',
</span><span class="lines">@@ -2905,8 +3655,9 @@
</span><span class="cx">                          var view = this._viewsByCid[ attachment.cid ];
</span><span class="cx">                          delete this._viewsByCid[ attachment.cid ];
</span><span class="cx"> 
</span><del>-                               if ( view )
</del><ins>+                                if ( view ) {
</ins><span class="cx">                                   view.remove();
</span><ins>+                               }
</ins><span class="cx">                   }, this );
</span><span class="cx"> 
</span><span class="cx">                  this.collection.on( 'reset', this.render, this );
</span><span class="lines">@@ -2919,22 +3670,27 @@
</span><span class="cx">                  _.bindAll( this, 'css' );
</span><span class="cx">                  this.model.on( 'change:edge change:gutter', this.css, this );
</span><span class="cx">                  this._resizeCss = _.debounce( _.bind( this.css, this ), this.refreshSensitivity );
</span><del>-                       if ( this.options.resize )
</del><ins>+                        if ( this.options.resize ) {
</ins><span class="cx">                           $(window).on( 'resize.attachments', this._resizeCss );
</span><ins>+                       }
</ins><span class="cx">                   this.css();
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          dispose: function() {
</span><span class="cx">                  this.collection.props.off( null, null, this );
</span><span class="cx">                  $(window).off( 'resize.attachments', this._resizeCss );
</span><ins>+                       /**
+                        * call 'dispose' directly on the parent class
+                        */
</ins><span class="cx">                   media.View.prototype.dispose.apply( this, arguments );
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          css: function() {
</span><span class="cx">                  var $css = $( '#' + this.el.id + '-css' );
</span><span class="cx"> 
</span><del>-                       if ( $css.length )
</del><ins>+                        if ( $css.length ) {
</ins><span class="cx">                           $css.remove();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  media.view.Attachments.$head().append( this.cssTemplate({
</span><span class="cx">                          id:     this.el.id,
</span><span class="lines">@@ -2942,13 +3698,16 @@
</span><span class="cx">                          gutter: this.model.get('gutter')
</span><span class="cx">                  }) );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {Number}
+                */
</ins><span class="cx">           edge: function() {
</span><span class="cx">                  var edge = this.model.get('edge'),
</span><span class="cx">                          gutter, width, columns;
</span><span class="cx"> 
</span><del>-                       if ( ! this.$el.is(':visible') )
</del><ins>+                        if ( ! this.$el.is(':visible') ) {
</ins><span class="cx">                           return edge;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  gutter  = this.model.get('gutter') * 2;
</span><span class="cx">                  width   = this.$el.width() - gutter;
</span><span class="lines">@@ -2960,8 +3719,9 @@
</span><span class="cx">          initSortable: function() {
</span><span class="cx">                  var collection = this.collection;
</span><span class="cx"> 
</span><del>-                       if ( ! this.options.sortable || ! $.fn.sortable )
</del><ins>+                        if ( ! this.options.sortable || ! $.fn.sortable ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.$el.sortable( _.extend({
</span><span class="cx">                          // If the `collection` has a `comparator`, disable sorting.
</span><span class="lines">@@ -3032,6 +3792,10 @@
</span><span class="cx">                  this.$el.sortable( 'option', 'disabled', ! enabled );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {wp.media.model.Attachment} attachment
+                * @returns {wp.media.View}
+                */
</ins><span class="cx">           createAttachmentView: function( attachment ) {
</span><span class="cx">                  var view = new this.options.AttachmentView({
</span><span class="cx">                          controller: this.controller,
</span><span class="lines">@@ -3064,8 +3828,9 @@
</span><span class="cx"> 
</span><span class="cx">          scroll: function() {
</span><span class="cx">                  // @todo: is this still necessary?
</span><del>-                       if ( ! this.$el.is(':visible') )
</del><ins>+                        if ( ! this.$el.is(':visible') ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( this.collection.hasMore() && this.el.scrollHeight < this.el.scrollTop + ( this.el.clientHeight * this.options.refreshThreshold ) ) {
</span><span class="cx">                          this.collection.more().done( this.scroll );
</span><span class="lines">@@ -3082,6 +3847,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Search
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Search = media.View.extend({
</span><span class="cx">          tagName:   'input',
</span><span class="lines">@@ -3099,21 +3869,30 @@
</span><span class="cx">                  'search': 'search'
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @returns {wp.media.view.Search} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  this.el.value = this.model.escape('search');
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          search: function( event ) {
</span><del>-                       if ( event.target.value )
</del><ins>+                        if ( event.target.value ) {
</ins><span class="cx">                           this.model.set( 'search', event.target.value );
</span><del>-                       else
</del><ins>+                        } else {
</ins><span class="cx">                           this.model.unset('search');
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.AttachmentFilters
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.AttachmentFilters = media.View.extend({
</span><span class="cx">          tagName:   'select',
</span><span class="lines">@@ -3148,8 +3927,9 @@
</span><span class="cx">          change: function() {
</span><span class="cx">                  var filter = this.filters[ this.el.value ];
</span><span class="cx"> 
</span><del>-                       if ( filter )
</del><ins>+                        if ( filter ) {
</ins><span class="cx">                           this.model.set( filter.props );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          select: function() {
</span><span class="lines">@@ -3162,22 +3942,33 @@
</span><span class="cx">                                  return prop === ( _.isUndefined( props[ key ] ) ? null : props[ key ] );
</span><span class="cx">                          });
</span><span class="cx"> 
</span><del>-                               if ( equal )
</del><ins>+                                if ( equal ) {
</ins><span class="cx">                                   return value = id;
</span><ins>+                               }
</ins><span class="cx">                   });
</span><span class="cx"> 
</span><span class="cx">                  this.$el.val( value );
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><ins>+       /**
+        * wp.media.view.AttachmentFilters.Uploaded
+        *
+        * @constructor
+        * @augments wp.media.view.AttachmentFilters
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.AttachmentFilters.Uploaded = media.view.AttachmentFilters.extend({
</span><span class="cx">          createFilters: function() {
</span><span class="cx">                  var type = this.model.get('type'),
</span><span class="cx">                          types = media.view.settings.mimeTypes,
</span><span class="cx">                          text;
</span><span class="cx"> 
</span><del>-                       if ( types && type )
</del><ins>+                        if ( types && type ) {
</ins><span class="cx">                           text = types[ type ];
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.filters = {
</span><span class="cx">                          all: {
</span><span class="lines">@@ -3203,6 +3994,15 @@
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><ins>+       /**
+        * wp.media.view.AttachmentFilters.All
+        *
+        * @constructor
+        * @augments wp.media.view.AttachmentFilters
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
+        */
</ins><span class="cx">   media.view.AttachmentFilters.All = media.view.AttachmentFilters.extend({
</span><span class="cx">          createFilters: function() {
</span><span class="cx">                  var filters = {};
</span><span class="lines">@@ -3246,9 +4046,13 @@
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx"> 
</span><del>-
</del><span class="cx">   /**
</span><span class="cx">   * wp.media.view.AttachmentsBrowser
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.AttachmentsBrowser = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="lines">@@ -3269,7 +4073,9 @@
</span><span class="cx"> 
</span><span class="cx">                  this.collection.on( 'add remove reset', this.updateContent, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.AttachmentsBrowser} Returns itself to allow chaining
+                */
</ins><span class="cx">           dispose: function() {
</span><span class="cx">                  this.options.selection.off( null, null, this );
</span><span class="cx">                  media.View.prototype.dispose.apply( this, arguments );
</span><span class="lines">@@ -3279,6 +4085,9 @@
</span><span class="cx">          createToolbar: function() {
</span><span class="cx">                  var filters, FiltersConstructor;
</span><span class="cx"> 
</span><ins>+                       /**
+                        * @member {wp.media.view.Toolbar}
+                        */
</ins><span class="cx">                   this.toolbar = new media.view.Toolbar({
</span><span class="cx">                          controller: this.controller
</span><span class="cx">                  });
</span><span class="lines">@@ -3286,10 +4095,11 @@
</span><span class="cx">                  this.views.add( this.toolbar );
</span><span class="cx"> 
</span><span class="cx">                  filters = this.options.filters;
</span><del>-                       if ( 'uploaded' === filters )
</del><ins>+                        if ( 'uploaded' === filters ) {
</ins><span class="cx">                           FiltersConstructor = media.view.AttachmentFilters.Uploaded;
</span><del>-                       else if ( 'all' === filters )
</del><ins>+                        } else if ( 'all' === filters ) {
</ins><span class="cx">                           FiltersConstructor = media.view.AttachmentFilters.All;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( FiltersConstructor ) {
</span><span class="cx">                          this.toolbar.set( 'filters', new FiltersConstructor({
</span><span class="lines">@@ -3318,8 +4128,9 @@
</span><span class="cx">          updateContent: function() {
</span><span class="cx">                  var view = this;
</span><span class="cx"> 
</span><del>-                       if( ! this.attachments )
</del><ins>+                        if( ! this.attachments ) {
</ins><span class="cx">                           this.createAttachments();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  if ( ! this.collection.length ) {
</span><span class="cx">                          this.collection.more().done( function() {
</span><span class="lines">@@ -3386,8 +4197,9 @@
</span><span class="cx">                  selection.on( 'selection:single', this.createSingle, this );
</span><span class="cx">                  selection.on( 'selection:unsingle', this.disposeSingle, this );
</span><span class="cx"> 
</span><del>-                       if ( selection.single() )
</del><ins>+                        if ( selection.single() ) {
</ins><span class="cx">                           this.createSingle();
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          createSingle: function() {
</span><span class="lines">@@ -3427,6 +4239,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Selection
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Selection = media.View.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="lines">@@ -3444,6 +4261,9 @@
</span><span class="cx">                          clearable: true
</span><span class="cx">                  });
</span><span class="cx"> 
</span><ins>+                       /**
+                        * @member {wp.media.view.Attachments.Selection}
+                        */
</ins><span class="cx">                   this.attachments = new media.view.Attachments.Selection({
</span><span class="cx">                          controller: this.controller,
</span><span class="cx">                          collection: this.collection,
</span><span class="lines">@@ -3465,8 +4285,9 @@
</span><span class="cx"> 
</span><span class="cx">          refresh: function() {
</span><span class="cx">                  // If the selection hasn't been rendered, bail.
</span><del>-                       if ( ! this.$el.children().length )
</del><ins>+                        if ( ! this.$el.children().length ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  var collection = this.collection,
</span><span class="cx">                          editing = 'edit-selection' === this.controller.content.mode();
</span><span class="lines">@@ -3481,8 +4302,9 @@
</span><span class="cx"> 
</span><span class="cx">          edit: function( event ) {
</span><span class="cx">                  event.preventDefault();
</span><del>-                       if ( this.options.editable )
</del><ins>+                        if ( this.options.editable ) {
</ins><span class="cx">                           this.options.editable.call( this, this.collection );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          clear: function( event ) {
</span><span class="lines">@@ -3494,6 +4316,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachment.Selection
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Attachment
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachment.Selection = media.view.Attachment.extend({
</span><span class="cx">          className: 'attachment selection',
</span><span class="lines">@@ -3507,6 +4335,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachments.Selection
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Attachments
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachments.Selection = media.view.Attachments.extend({
</span><span class="cx">          events: {},
</span><span class="lines">@@ -3518,12 +4352,22 @@
</span><span class="cx">                          // The single `Attachment` view to be used in the `Attachments` view.
</span><span class="cx">                          AttachmentView: media.view.Attachment.Selection
</span><span class="cx">                  });
</span><ins>+                       /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   return media.view.Attachments.prototype.initialize.apply( this, arguments );
</span><span class="cx">          }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachments.EditSelection
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Attachment.Selection
+        * @augments wp.media.view.Attachment
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachment.EditSelection = media.view.Attachment.Selection.extend({
</span><span class="cx">          buttons: {
</span><span class="lines">@@ -3534,6 +4378,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Settings
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Settings = media.View.extend({
</span><span class="cx">          events: {
</span><span class="lines">@@ -3553,22 +4402,27 @@
</span><span class="cx">                          model: this.model.toJSON()
</span><span class="cx">                  }, this.options );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Setings} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  media.View.prototype.render.apply( this, arguments );
</span><span class="cx">                  // Select the correct values.
</span><span class="cx">                  _( this.model.attributes ).chain().keys().each( this.update, this );
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {string} key
+                */
</ins><span class="cx">           update: function( key ) {
</span><span class="cx">                  var value = this.model.get( key ),
</span><span class="cx">                          $setting = this.$('[data-setting="' + key + '"]'),
</span><span class="cx">                          $buttons, $value;
</span><span class="cx"> 
</span><span class="cx">                  // Bail if we didn't find a matching setting.
</span><del>-                       if ( ! $setting.length )
</del><ins>+                        if ( ! $setting.length ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Attempt to determine how the setting is rendered and update
</span><span class="cx">                  // the selected value.
</span><span class="lines">@@ -3585,7 +4439,6 @@
</span><span class="cx">                                  this.model.set( key, $setting.find(':selected').val() );
</span><span class="cx">                          }
</span><span class="cx"> 
</span><del>-
</del><span class="cx">                   // Handle button groups.
</span><span class="cx">                  } else if ( $setting.hasClass('button-group') ) {
</span><span class="cx">                          $buttons = $setting.find('button').removeClass('active');
</span><span class="lines">@@ -3593,15 +4446,17 @@
</span><span class="cx"> 
</span><span class="cx">                  // Handle text inputs and textareas.
</span><span class="cx">                  } else if ( $setting.is('input[type="text"], textarea') ) {
</span><del>-                               if ( ! $setting.is(':focus') )
</del><ins>+                                if ( ! $setting.is(':focus') ) {
</ins><span class="cx">                                   $setting.val( value );
</span><del>-
</del><ins>+                                }
</ins><span class="cx">                   // Handle checkboxes.
</span><span class="cx">                  } else if ( $setting.is('input[type="checkbox"]') ) {
</span><span class="cx">                          $setting.attr( 'checked', !! value );
</span><span class="cx">                  }
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           updateHandler: function( event ) {
</span><span class="cx">                  var $setting = $( event.target ).closest('[data-setting]'),
</span><span class="cx">                          value = event.target.value,
</span><span class="lines">@@ -3609,30 +4464,40 @@
</span><span class="cx"> 
</span><span class="cx">                  event.preventDefault();
</span><span class="cx"> 
</span><del>-                       if ( ! $setting.length )
</del><ins>+                        if ( ! $setting.length ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Use the correct value for checkboxes.
</span><del>-                       if ( $setting.is('input[type="checkbox"]') )
</del><ins>+                        if ( $setting.is('input[type="checkbox"]') ) {
</ins><span class="cx">                           value = $setting[0].checked;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  // Update the corresponding setting.
</span><span class="cx">                  this.model.set( $setting.data('setting'), value );
</span><span class="cx"> 
</span><span class="cx">                  // If the setting has a corresponding user setting,
</span><span class="cx">                  // update that as well.
</span><del>-                       if ( userSetting = $setting.data('userSetting') )
</del><ins>+                        if ( userSetting = $setting.data('userSetting') ) {
</ins><span class="cx">                           setUserSetting( userSetting, value );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          updateChanges: function( model ) {
</span><del>-                       if ( model.hasChanged() )
</del><ins>+                        if ( model.hasChanged() ) {
</ins><span class="cx">                           _( model.changed ).chain().keys().each( this.update, this );
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Settings.AttachmentDisplay
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Settings
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Settings.AttachmentDisplay = media.view.Settings.extend({
</span><span class="cx">          className: 'attachment-display-settings',
</span><span class="lines">@@ -3644,22 +4509,30 @@
</span><span class="cx">                  _.defaults( this.options, {
</span><span class="cx">                          userSettings: false
</span><span class="cx">                  });
</span><del>-
</del><ins>+                        /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Settings.prototype.initialize.apply( this, arguments );
</span><span class="cx">                  this.model.on( 'change:link', this.updateLinkTo, this );
</span><span class="cx"> 
</span><del>-                       if ( attachment )
</del><ins>+                        if ( attachment ) {
</ins><span class="cx">                           attachment.on( 'change:uploading', this.render, this );
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          dispose: function() {
</span><span class="cx">                  var attachment = this.options.attachment;
</span><del>-                       if ( attachment )
</del><ins>+                        if ( attachment ) {
</ins><span class="cx">                           attachment.off( null, null, this );
</span><del>-
</del><ins>+                        }
+                       /**
+                        * call 'dispose' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Settings.prototype.dispose.apply( this, arguments );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.AttachmentDisplay} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  var attachment = this.options.attachment;
</span><span class="cx">                  if ( attachment ) {
</span><span class="lines">@@ -3668,7 +4541,9 @@
</span><span class="cx">                                  type:  attachment.get('type')
</span><span class="cx">                          });
</span><span class="cx">                  }
</span><del>-
</del><ins>+                        /**
+                        * call 'render' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Settings.prototype.render.call( this );
</span><span class="cx">                  this.updateLinkTo();
</span><span class="cx">                  return this;
</span><span class="lines">@@ -3699,13 +4574,20 @@
</span><span class="cx">                  $input.show();
</span><span class="cx"> 
</span><span class="cx">                  // If the input is visible, focus and select its contents.
</span><del>-                       if ( $input.is(':visible') )
</del><ins>+                        if ( $input.is(':visible') ) {
</ins><span class="cx">                           $input.focus()[0].select();
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Settings.Gallery
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Settings
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Settings.Gallery = media.view.Settings.extend({
</span><span class="cx">          className: 'gallery-settings',
</span><span class="lines">@@ -3714,6 +4596,12 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Attachment.Details
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Attachment
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Attachment.Details = media.view.Attachment.extend({
</span><span class="cx">          tagName:   'div',
</span><span class="lines">@@ -3731,30 +4619,45 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><ins>+                       /**
+                        * @member {wp.media.view.FocusManager}
+                        */
</ins><span class="cx">                   this.focusManager = new media.view.FocusManager({
</span><span class="cx">                          el: this.el
</span><span class="cx">                  });
</span><del>-
</del><ins>+                        /**
+                        * call 'initialize' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Attachment.prototype.initialize.apply( this, arguments );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view..Attachment.Details} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><ins>+                       /**
+                        * call 'render' directly on the parent class
+                        */
</ins><span class="cx">                   media.view.Attachment.prototype.render.apply( this, arguments );
</span><span class="cx">                  this.focusManager.focus();
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           deleteAttachment: function( event ) {
</span><span class="cx">                  event.preventDefault();
</span><span class="cx"> 
</span><del>-                       if ( confirm( l10n.warnDelete ) )
</del><ins>+                        if ( confirm( l10n.warnDelete ) ) {
</ins><span class="cx">                           this.model.destroy();
</span><ins>+                       }
</ins><span class="cx">           },
</span><span class="cx"> 
</span><span class="cx">          editAttachment: function() {
</span><span class="cx">                  this.$el.addClass('needs-refresh');
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           refreshAttachment: function( event ) {
</span><span class="cx">                  this.$el.removeClass('needs-refresh');
</span><span class="cx">                  event.preventDefault();
</span><span class="lines">@@ -3764,6 +4667,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.AttachmentCompat
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.AttachmentCompat = media.View.extend({
</span><span class="cx">          tagName:   'form',
</span><span class="lines">@@ -3777,24 +4685,35 @@
</span><span class="cx">          },
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><ins>+                       /**
+                        * @member {wp.media.view.FocusManager}
+                        */
</ins><span class="cx">                   this.focusManager = new media.view.FocusManager({
</span><span class="cx">                          el: this.el
</span><span class="cx">                  });
</span><span class="cx"> 
</span><span class="cx">                  this.model.on( 'change:compat', this.render, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.AttachmentCompat} Returns itself to allow chaining
+                */
</ins><span class="cx">           dispose: function() {
</span><del>-                       if ( this.$(':focus').length )
</del><ins>+                        if ( this.$(':focus').length ) {
</ins><span class="cx">                           this.save();
</span><del>-
</del><ins>+                        }
+                       /**
+                        * call 'dispose' directly on the parent class
+                        */
</ins><span class="cx">                   return media.View.prototype.dispose.apply( this, arguments );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.AttachmentCompat} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  var compat = this.model.get('compat');
</span><del>-                       if ( ! compat || ! compat.item )
</del><ins>+                        if ( ! compat || ! compat.item ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.views.detach();
</span><span class="cx">                  this.$el.html( compat.item );
</span><span class="lines">@@ -3803,16 +4722,21 @@
</span><span class="cx">                  this.focusManager.focus();
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           preventDefault: function( event ) {
</span><span class="cx">                  event.preventDefault();
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @param {Object} event
+                */
</ins><span class="cx">           save: function( event ) {
</span><span class="cx">                  var data = {};
</span><span class="cx"> 
</span><del>-                       if ( event )
</del><ins>+                        if ( event ) {
</ins><span class="cx">                           event.preventDefault();
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  _.each( this.$el.serializeArray(), function( pair ) {
</span><span class="cx">                          data[ pair.name ] = pair.value;
</span><span class="lines">@@ -3824,10 +4748,17 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Iframe
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Iframe = media.View.extend({
</span><span class="cx">          className: 'media-iframe',
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.Iframe} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  this.views.detach();
</span><span class="cx">                  this.$el.html( '<iframe src="' + this.controller.state().get('src') + '" />' );
</span><span class="lines">@@ -3838,11 +4769,19 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.Embed
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.Embed = media.View.extend({
</span><span class="cx">          className: 'media-embed',
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><ins>+                       /**
+                        * @member {wp.media.view.EmbedUrl}
+                        */
</ins><span class="cx">                   this.url = new media.view.EmbedUrl({
</span><span class="cx">                          controller: this.controller,
</span><span class="cx">                          model:      this.model.props
</span><span class="lines">@@ -3854,9 +4793,13 @@
</span><span class="cx">                  this.model.on( 'change:loading', this.loading, this );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * @param {Object} view
+                */
</ins><span class="cx">           settings: function( view ) {
</span><del>-                       if ( this._settings )
</del><ins>+                        if ( this._settings ) {
</ins><span class="cx">                           this._settings.remove();
</span><ins>+                       }
</ins><span class="cx">                   this._settings = view;
</span><span class="cx">                  this.views.add( view );
</span><span class="cx">          },
</span><span class="lines">@@ -3865,12 +4808,13 @@
</span><span class="cx">                  var type = this.model.get('type'),
</span><span class="cx">                          constructor;
</span><span class="cx"> 
</span><del>-                       if ( 'image' === type )
</del><ins>+                        if ( 'image' === type ) {
</ins><span class="cx">                           constructor = media.view.EmbedImage;
</span><del>-                       else if ( 'link' === type )
</del><ins>+                        } else if ( 'link' === type ) {
</ins><span class="cx">                           constructor = media.view.EmbedLink;
</span><del>-                       else
</del><ins>+                        } else {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.settings( new constructor({
</span><span class="cx">                          controller: this.controller,
</span><span class="lines">@@ -3886,6 +4830,11 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.EmbedUrl
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.EmbedUrl = media.View.extend({
</span><span class="cx">          tagName:   'label',
</span><span class="lines">@@ -3906,14 +4855,20 @@
</span><span class="cx"> 
</span><span class="cx">                  this.model.on( 'change:url', this.render, this );
</span><span class="cx">          },
</span><del>-
</del><ins>+                /**
+                * @returns {wp.media.view.EmbedUrl} Returns itself to allow chaining
+                */
</ins><span class="cx">           render: function() {
</span><span class="cx">                  var $input = this.$input;
</span><span class="cx"> 
</span><del>-                       if ( $input.is(':focus') )
</del><ins>+                        if ( $input.is(':focus') ) {
</ins><span class="cx">                           return;
</span><ins>+                       }
</ins><span class="cx"> 
</span><span class="cx">                  this.input.value = this.model.get('url') || 'http://';
</span><ins>+                       /**
+                        * Call `render` directly on parent class with passed arguments
+                        */
</ins><span class="cx">                   media.View.prototype.render.apply( this, arguments );
</span><span class="cx">                  return this;
</span><span class="cx">          },
</span><span class="lines">@@ -3926,16 +4881,25 @@
</span><span class="cx">                  this.model.set( 'url', event.target.value );
</span><span class="cx">          },
</span><span class="cx"> 
</span><ins>+               /**
+                * If the input is visible, focus and select its contents.
+                */
</ins><span class="cx">           focus: function() {
</span><span class="cx">                  var $input = this.$input;
</span><del>-                       // If the input is visible, focus and select its contents.
-                       if ( $input.is(':visible') )
</del><ins>+                        if ( $input.is(':visible') ) {
</ins><span class="cx">                           $input.focus()[0].select();
</span><ins>+                       }
</ins><span class="cx">           }
</span><span class="cx">  });
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.EmbedLink
</span><ins>+        *
+        * @constructor
+        * @augments wp.media.view.Settings
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.EmbedLink = media.view.Settings.extend({
</span><span class="cx">          className: 'embed-link-settings',
</span><span class="lines">@@ -3944,12 +4908,22 @@
</span><span class="cx"> 
</span><span class="cx">  /**
</span><span class="cx">   * wp.media.view.EmbedImage
</span><ins>+        *
+        * @contructor
+        * @augments wp.media.view.Settings.AttachmentDisplay
+        * @augments wp.media.view.Settings
+        * @augments wp.media.View
+        * @augments wp.Backbone.View
+        * @augments Backbone.View
</ins><span class="cx">    */
</span><span class="cx">  media.view.EmbedImage =  media.view.Settings.AttachmentDisplay.extend({
</span><span class="cx">          className: 'embed-image-settings',
</span><span class="cx">          template:  media.template('embed-image-settings'),
</span><span class="cx"> 
</span><span class="cx">          initialize: function() {
</span><ins>+                       /**
+                        * Call `initialize` directly on parent class with passed arguments
+                        */
</ins><span class="cx">                   media.view.Settings.AttachmentDisplay.prototype.initialize.apply( this, arguments );
</span><span class="cx">                  this.model.on( 'change:url', this.updateImage, this );
</span><span class="cx">          },
</span></span></pre>
</div>
</div>

</body>
</html>