<!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>