diff options
Diffstat (limited to 'wp-includes/js/wp-backbone.js')
| -rw-r--r-- | wp-includes/js/wp-backbone.js | 566 |
1 files changed, 566 insertions, 0 deletions
diff --git a/wp-includes/js/wp-backbone.js b/wp-includes/js/wp-backbone.js new file mode 100644 index 0000000..74297e8 --- /dev/null +++ b/wp-includes/js/wp-backbone.js @@ -0,0 +1,566 @@ +/** + * @output wp-includes/js/wp-backbone.js + */ + +/** @namespace wp */ +window.wp = window.wp || {}; + +(function ($) { + /** + * Create the WordPress Backbone namespace. + * + * @namespace wp.Backbone + */ + wp.Backbone = {}; + + /** + * A backbone subview manager. + * + * @since 3.5.0 + * @since 3.6.0 Moved wp.media.Views to wp.Backbone.Subviews. + * + * @memberOf wp.Backbone + * + * @class + * + * @param {wp.Backbone.View} view The main view. + * @param {Array|Object} views The subviews for the main view. + */ + wp.Backbone.Subviews = function( view, views ) { + this.view = view; + this._views = _.isArray( views ) ? { '': views } : views || {}; + }; + + wp.Backbone.Subviews.extend = Backbone.Model.extend; + + _.extend( wp.Backbone.Subviews.prototype, { + /** + * Fetches all of the subviews. + * + * @since 3.5.0 + * + * @return {Array} All the subviews. + */ + all: function() { + return _.flatten( _.values( this._views ) ); + }, + + /** + * Fetches all subviews that match a given `selector`. + * + * If no `selector` is provided, it will grab all subviews attached + * to the view's root. + * + * @since 3.5.0 + * + * @param {string} selector A jQuery selector. + * + * @return {Array} All the subviews that match the selector. + */ + get: function( selector ) { + selector = selector || ''; + return this._views[ selector ]; + }, + + /** + * Fetches the first subview that matches a given `selector`. + * + * If no `selector` is provided, it will grab the first subview attached to the + * view's root. + * + * Useful when a selector only has one subview at a time. + * + * @since 3.5.0 + * + * @param {string} selector A jQuery selector. + * + * @return {Backbone.View} The view. + */ + first: function( selector ) { + var views = this.get( selector ); + return views && views.length ? views[0] : null; + }, + + /** + * Registers subview(s). + * + * Registers any number of `views` to a `selector`. + * + * When no `selector` is provided, the root selector (the empty string) + * is used. `views` accepts a `Backbone.View` instance or an array of + * `Backbone.View` instances. + * + * --- + * + * Accepts an `options` object, which has a significant effect on the + * resulting behavior. + * + * `options.silent` - *boolean, `false`* + * If `options.silent` is true, no DOM modifications will be made. + * + * `options.add` - *boolean, `false`* + * Use `Views.add()` as a shortcut for setting `options.add` to true. + * + * By default, the provided `views` will replace any existing views + * associated with the selector. If `options.add` is true, the provided + * `views` will be added to the existing views. + * + * `options.at` - *integer, `undefined`* + * When adding, to insert `views` at a specific index, use `options.at`. + * By default, `views` are added to the end of the array. + * + * @since 3.5.0 + * + * @param {string} selector A jQuery selector. + * @param {Array|Object} views The subviews for the main view. + * @param {Object} options Options for call. If `options.silent` is true, + * no DOM modifications will be made. Use + * `Views.add()` as a shortcut for setting + * `options.add` to true. If `options.add` is + * true, the provided `views` will be added to + * the existing views. When adding, to insert + * `views` at a specific index, use `options.at`. + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + set: function( selector, views, options ) { + var existing, next; + + if ( ! _.isString( selector ) ) { + options = views; + views = selector; + selector = ''; + } + + options = options || {}; + views = _.isArray( views ) ? views : [ views ]; + existing = this.get( selector ); + next = views; + + if ( existing ) { + if ( options.add ) { + if ( _.isUndefined( options.at ) ) { + next = existing.concat( views ); + } else { + next = existing; + next.splice.apply( next, [ options.at, 0 ].concat( views ) ); + } + } else { + _.each( next, function( view ) { + view.__detach = true; + }); + + _.each( existing, function( view ) { + if ( view.__detach ) + view.$el.detach(); + else + view.remove(); + }); + + _.each( next, function( view ) { + delete view.__detach; + }); + } + } + + this._views[ selector ] = next; + + _.each( views, function( subview ) { + var constructor = subview.Views || wp.Backbone.Subviews, + subviews = subview.views = subview.views || new constructor( subview ); + subviews.parent = this.view; + subviews.selector = selector; + }, this ); + + if ( ! options.silent ) + this._attach( selector, views, _.extend({ ready: this._isReady() }, options ) ); + + return this; + }, + + /** + * Add subview(s) to existing subviews. + * + * An alias to `Views.set()`, which defaults `options.add` to true. + * + * Adds any number of `views` to a `selector`. + * + * When no `selector` is provided, the root selector (the empty string) + * is used. `views` accepts a `Backbone.View` instance or an array of + * `Backbone.View` instances. + * + * Uses `Views.set()` when setting `options.add` to `false`. + * + * Accepts an `options` object. By default, provided `views` will be + * inserted at the end of the array of existing views. To insert + * `views` at a specific index, use `options.at`. If `options.silent` + * is true, no DOM modifications will be made. + * + * For more information on the `options` object, see `Views.set()`. + * + * @since 3.5.0 + * + * @param {string} selector A jQuery selector. + * @param {Array|Object} views The subviews for the main view. + * @param {Object} options Options for call. To insert `views` at a + * specific index, use `options.at`. If + * `options.silent` is true, no DOM modifications + * will be made. + * + * @return {wp.Backbone.Subviews} The current subviews instance. + */ + add: function( selector, views, options ) { + if ( ! _.isString( selector ) ) { + options = views; + views = selector; + selector = ''; + } + + return this.set( selector, views, _.extend({ add: true }, options ) ); + }, + + /** + * Removes an added subview. + * + * Stops tracking `views` registered to a `selector`. If no `views` are + * set, then all of the `selector`'s subviews will be unregistered and + * removed. + * + * Accepts an `options` object. If `options.silent` is set, `remove` + * will *not* be triggered on the unregistered views. + * + * @since 3.5.0 + * + * @param {string} selector A jQuery selector. + * @param {Array|Object} views The subviews for the main view. + * @param {Object} options Options for call. If `options.silent` is set, + * `remove` will *not* be triggered on the + * unregistered views. + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + unset: function( selector, views, options ) { + var existing; + + if ( ! _.isString( selector ) ) { + options = views; + views = selector; + selector = ''; + } + + views = views || []; + + if ( existing = this.get( selector ) ) { + views = _.isArray( views ) ? views : [ views ]; + this._views[ selector ] = views.length ? _.difference( existing, views ) : []; + } + + if ( ! options || ! options.silent ) + _.invoke( views, 'remove' ); + + return this; + }, + + /** + * Detaches all subviews. + * + * Helps to preserve all subview events when re-rendering the master + * view. Used in conjunction with `Views.render()`. + * + * @since 3.5.0 + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + detach: function() { + $( _.pluck( this.all(), 'el' ) ).detach(); + return this; + }, + + /** + * Renders all subviews. + * + * Used in conjunction with `Views.detach()`. + * + * @since 3.5.0 + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + render: function() { + var options = { + ready: this._isReady() + }; + + _.each( this._views, function( views, selector ) { + this._attach( selector, views, options ); + }, this ); + + this.rendered = true; + return this; + }, + + /** + * Removes all subviews. + * + * Triggers the `remove()` method on all subviews. Detaches the master + * view from its parent. Resets the internals of the views manager. + * + * Accepts an `options` object. If `options.silent` is set, `unset` + * will *not* be triggered on the master view's parent. + * + * @since 3.6.0 + * + * @param {Object} options Options for call. + * @param {boolean} options.silent If true, `unset` wil *not* be triggered on + * the master views' parent. + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + remove: function( options ) { + if ( ! options || ! options.silent ) { + if ( this.parent && this.parent.views ) + this.parent.views.unset( this.selector, this.view, { silent: true }); + delete this.parent; + delete this.selector; + } + + _.invoke( this.all(), 'remove' ); + this._views = []; + return this; + }, + + /** + * Replaces a selector's subviews + * + * By default, sets the `$target` selector's html to the subview `els`. + * + * Can be overridden in subclasses. + * + * @since 3.5.0 + * + * @param {string} $target Selector where to put the elements. + * @param {*} els HTML or elements to put into the selector's HTML. + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + replace: function( $target, els ) { + $target.html( els ); + return this; + }, + + /** + * Insert subviews into a selector. + * + * By default, appends the subview `els` to the end of the `$target` + * selector. If `options.at` is set, inserts the subview `els` at the + * provided index. + * + * Can be overridden in subclasses. + * + * @since 3.5.0 + * + * @param {string} $target Selector where to put the elements. + * @param {*} els HTML or elements to put at the end of the + * $target. + * @param {?Object} options Options for call. + * @param {?number} options.at At which index to put the elements. + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + insert: function( $target, els, options ) { + var at = options && options.at, + $children; + + if ( _.isNumber( at ) && ($children = $target.children()).length > at ) + $children.eq( at ).before( els ); + else + $target.append( els ); + + return this; + }, + + /** + * Triggers the ready event. + * + * Only use this method if you know what you're doing. For performance reasons, + * this method does not check if the view is actually attached to the DOM. It's + * taking your word for it. + * + * Fires the ready event on the current view and all attached subviews. + * + * @since 3.5.0 + */ + ready: function() { + this.view.trigger('ready'); + + // Find all attached subviews, and call ready on them. + _.chain( this.all() ).map( function( view ) { + return view.views; + }).flatten().where({ attached: true }).invoke('ready'); + }, + /** + * Attaches a series of views to a selector. Internal. + * + * Checks to see if a matching selector exists, renders the views, + * performs the proper DOM operation, and then checks if the view is + * attached to the document. + * + * @since 3.5.0 + * + * @private + * + * @param {string} selector A jQuery selector. + * @param {Array|Object} views The subviews for the main view. + * @param {Object} options Options for call. + * @param {boolean} options.add If true the provided views will be added. + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + _attach: function( selector, views, options ) { + var $selector = selector ? this.view.$( selector ) : this.view.$el, + managers; + + // Check if we found a location to attach the views. + if ( ! $selector.length ) + return this; + + managers = _.chain( views ).pluck('views').flatten().value(); + + // Render the views if necessary. + _.each( managers, function( manager ) { + if ( manager.rendered ) + return; + + manager.view.render(); + manager.rendered = true; + }, this ); + + // Insert or replace the views. + this[ options.add ? 'insert' : 'replace' ]( $selector, _.pluck( views, 'el' ), options ); + + /* + * Set attached and trigger ready if the current view is already + * attached to the DOM. + */ + _.each( managers, function( manager ) { + manager.attached = true; + + if ( options.ready ) + manager.ready(); + }, this ); + + return this; + }, + + /** + * Determines whether or not the current view is in the DOM. + * + * @since 3.5.0 + * + * @private + * + * @return {boolean} Whether or not the current view is in the DOM. + */ + _isReady: function() { + var node = this.view.el; + while ( node ) { + if ( node === document.body ) + return true; + node = node.parentNode; + } + + return false; + } + }); + + wp.Backbone.View = Backbone.View.extend({ + + // The constructor for the `Views` manager. + Subviews: wp.Backbone.Subviews, + + /** + * The base view class. + * + * This extends the backbone view to have a build-in way to use subviews. This + * makes it easier to have nested views. + * + * @since 3.5.0 + * @since 3.6.0 Moved wp.media.View to wp.Backbone.View + * + * @constructs + * @augments Backbone.View + * + * @memberOf wp.Backbone + * + * + * @param {Object} options The options for this view. + */ + constructor: function( options ) { + this.views = new this.Subviews( this, this.views ); + this.on( 'ready', this.ready, this ); + + this.options = options || {}; + + Backbone.View.apply( this, arguments ); + }, + + /** + * Removes this view and all subviews. + * + * @since 3.5.0 + * + * @return {wp.Backbone.Subviews} The current Subviews instance. + */ + remove: function() { + var result = Backbone.View.prototype.remove.apply( this, arguments ); + + // Recursively remove child views. + if ( this.views ) + this.views.remove(); + + return result; + }, + + /** + * Renders this view and all subviews. + * + * @since 3.5.0 + * + * @return {wp.Backbone.View} The current instance of the view. + */ + render: function() { + var options; + + if ( this.prepare ) + options = this.prepare(); + + this.views.detach(); + + if ( this.template ) { + options = options || {}; + this.trigger( 'prepare', options ); + this.$el.html( this.template( options ) ); + } + + this.views.render(); + return this; + }, + + /** + * Returns the options for this view. + * + * @since 3.5.0 + * + * @return {Object} The options for this view. + */ + prepare: function() { + return this.options; + }, + + /** + * Method that is called when the ready event is triggered. + * + * @since 3.5.0 + */ + ready: function() {} + }); +}(jQuery)); |