woocommerce/assets/js/admin/order-backbone-modal.js

139 lines
3.1 KiB
JavaScript
Raw Normal View History

2014-07-15 22:56:07 +00:00
/*global jQuery, Backbone, _ */
( function ( $, Backbone, _ ) {
'use strict';
/**
* WooCommerce Backbone Modal plugin
*
* @param {object} options
*/
$.fn.WCBackboneModal = function( options ) {
return this.each( function () {
( new $.WCBackboneModal( $( this ), options ) );
});
};
/**
* Initialize the Backbone Modal
*
* @param {object} element [description]
* @param {object} options [description]
*/
$.WCBackboneModal = function( element, options ) {
// Set settings
var settings = $.extend( {}, $.WCBackboneModal.defaultOptions, options );
2014-07-21 02:58:34 +00:00
if ( settings.template ) {
new $.WCBackboneModal.View({
target: settings.template
});
}
2014-07-15 22:56:07 +00:00
};
/**
* Set default options
*
* @type {object}
*/
$.WCBackboneModal.defaultOptions = {
template: '',
};
/**
* Create the Backbone Modal
*
* @return {null}
*/
$.WCBackboneModal.View = Backbone.View.extend({
2014-07-15 22:56:07 +00:00
tagName: 'div',
id: 'wc-backbone-modal-dialog',
_target: undefined,
events: {
'click .modal-close': 'closeButton',
'click #btn-ok': 'addButton',
'keydown': 'keyboardActions'
2014-07-15 22:56:07 +00:00
},
initialize: function ( data ) {
this._target = data.target;
_.bindAll( this, 'render' );
this.render();
},
render: function () {
this.$el.attr( 'tabindex' , '0' ).append( $( this._target ).html() );
$( 'body' ).css({
'overflow': 'hidden'
}).append( this.$el );
2014-07-23 09:49:39 +00:00
var $content = $( '.wc-backbone-modal-content' ).find( 'article' );
2015-01-12 17:11:01 +00:00
var content_h = ( 0 === $content.height() ) ? 90 : $content.height();
2014-07-23 09:49:39 +00:00
var max_h = $( window ).height() - 200;
if ( max_h > 400 ) {
max_h = 400;
}
if ( content_h > max_h ) {
$content.css({
'overflow': 'auto',
height: max_h + 'px'
});
} else {
$content.css({
2014-07-23 10:51:09 +00:00
'overflow': 'visible',
2014-07-23 09:49:39 +00:00
height: content_h
});
}
$( '.wc-backbone-modal-content' ).css({
'margin-top': '-' + ( $( '.wc-backbone-modal-content' ).height() / 2 ) + 'px'
});
$( 'body' ).trigger( 'wc_backbone_modal_loaded', this._target );
2014-07-15 22:56:07 +00:00
},
closeButton: function ( e ) {
e.preventDefault();
this.undelegateEvents();
$( document ).off( 'focusin' );
$( 'body' ).css({
'overflow': 'auto'
});
this.remove();
$( 'body' ).trigger( 'wc_backbone_modal_removed', this._target );
2014-07-15 22:56:07 +00:00
},
addButton: function ( e ) {
2015-01-12 17:11:01 +00:00
$( 'body' ).trigger( 'wc_backbone_modal_response', [ this._target, this.getFormData() ] );
2014-07-15 22:56:07 +00:00
this.closeButton( e );
},
getFormData: function () {
var data = {};
$.each( $( 'form', this.$el ).serializeArray(), function( index, item ) {
if ( data.hasOwnProperty( item.name ) ) {
data[ item.name ] = $.makeArray( data[ item.name ] );
data[ item.name ].push( item.value );
}
else {
data[ item.name ] = item.value;
}
});
return data;
},
keyboardActions: function( e ) {
var button = e.keyCode || e.which;
// Enter key
if ( 13 === button && ! ( e.target.tagName && e.target.tagName.toLowerCase() === 'input' ) ) {
this.addButton( e );
}
// ESC key
if ( 27 === button ) {
this.closeButton( e );
}
2014-07-15 22:56:07 +00:00
}
});
2014-07-15 22:56:07 +00:00
}( jQuery, Backbone, _ ));