woocommerce/assets/js/admin/wc-shipping-zones.js

272 lines
8.9 KiB
JavaScript
Raw Normal View History

2016-09-24 02:22:57 +00:00
/* global shippingZonesLocalizeScript, ajaxurl */
( function( $, data, wp, ajaxurl ) {
$( function() {
2015-12-16 15:37:40 +00:00
var $table = $( '.wc-shipping-zones' ),
$tbody = $( '.wc-shipping-zone-rows' ),
$save_button = $( '.wc-shipping-zone-save' ),
$row_template = wp.template( 'wc-shipping-zone-row' ),
$blank_template = wp.template( 'wc-shipping-zone-row-blank' ),
2015-12-10 17:24:26 +00:00
// Backbone model
ShippingZone = Backbone.Model.extend({
changes: {},
logChanges: function( changedRows ) {
var changes = this.changes || {};
_.each( changedRows, function( row, id ) {
changes[ id ] = _.extend( changes[ id ] || { zone_id : id }, row );
} );
this.changes = changes;
this.trigger( 'change:zones' );
},
discardChanges: function( id ) {
var changes = this.changes || {},
set_position = null,
zones = _.indexBy( this.get( 'zones' ), 'zone_id' );
// Find current set position if it has moved since last save
if ( changes[ id ] && changes[ id ].zone_order !== undefined ) {
set_position = changes[ id ].zone_order;
}
// Delete all changes
delete changes[ id ];
// If the position was set, and this zone does exist in DB, set the position again so the changes are not lost.
if ( set_position !== null && zones[ id ] && zones[ id ].zone_order !== set_position ) {
changes[ id ] = _.extend( changes[ id ] || {}, { zone_id : id, zone_order : set_position } );
}
this.changes = changes;
// No changes? Disable save button.
if ( 0 === _.size( this.changes ) ) {
shippingZoneView.clearUnloadConfirmation();
}
},
save: function() {
if ( _.size( this.changes ) ) {
2016-03-24 19:06:51 +00:00
$.post( ajaxurl + ( ajaxurl.indexOf( '?' ) > 0 ? '&' : '?' ) + 'action=woocommerce_shipping_zones_save_changes', {
wc_shipping_zones_nonce : data.wc_shipping_zones_nonce,
changes : this.changes
}, this.onSaveResponse, 'json' );
} else {
shippingZone.trigger( 'saved:zones' );
}
},
onSaveResponse: function( response, textStatus ) {
if ( 'success' === textStatus ) {
if ( response.success ) {
shippingZone.set( 'zones', response.data.zones );
shippingZone.trigger( 'change:zones' );
shippingZone.changes = {};
shippingZone.trigger( 'saved:zones' );
} else {
2015-12-10 17:24:26 +00:00
window.alert( data.strings.save_failed );
}
}
}
} ),
2015-12-10 17:24:26 +00:00
// Backbone view
ShippingZoneView = Backbone.View.extend({
2015-12-10 15:09:37 +00:00
rowTemplate: $row_template,
initialize: function() {
this.listenTo( this.model, 'change:zones', this.setUnloadConfirmation );
this.listenTo( this.model, 'saved:zones', this.clearUnloadConfirmation );
2015-12-10 13:09:39 +00:00
this.listenTo( this.model, 'saved:zones', this.render );
$tbody.on( 'change', { view: this }, this.updateModelOnChange );
$tbody.on( 'sortupdate', { view: this }, this.updateModelOnSort );
$( window ).on( 'beforeunload', { view: this }, this.unloadConfirmation );
2016-01-04 14:34:10 +00:00
$( document.body ).on( 'click', '.wc-shipping-zone-add', { view: this }, this.onAddNewRow );
},
2015-12-16 15:16:52 +00:00
block: function() {
$( this.el ).block({
message: null,
overlayCSS: {
background: '#fff',
opacity: 0.6
}
});
},
unblock: function() {
$( this.el ).unblock();
},
render: function() {
2016-04-19 17:26:57 +00:00
var zones = _.indexBy( this.model.get( 'zones' ), 'zone_id' ),
view = this;
2016-04-19 17:26:57 +00:00
view.$el.empty();
view.unblock();
2015-12-15 19:10:41 +00:00
2015-12-16 15:37:40 +00:00
if ( _.size( zones ) ) {
2015-12-10 12:31:03 +00:00
// Sort zones
zones = _( zones )
.chain()
.sortBy( function ( zone ) { return parseInt( zone.zone_id, 10 ); } )
.sortBy( function ( zone ) { return parseInt( zone.zone_order, 10 ); } )
.value();
2015-12-10 12:31:03 +00:00
// Populate $tbody with the current zones
$.each( zones, function( id, rowData ) {
2016-04-19 17:26:57 +00:00
view.renderRow( rowData );
} );
} else {
view.$el.append( $blank_template );
}
2015-12-10 15:09:37 +00:00
view.initRows();
2016-04-19 17:26:57 +00:00
},
renderRow: function( rowData ) {
var view = this;
view.$el.append( view.rowTemplate( rowData ) );
view.initRow( rowData );
},
initRow: function( rowData ) {
var view = this;
2016-04-19 17:26:57 +00:00
var $tr = view.$el.find( 'tr[data-id="' + rowData.zone_id + '"]');
// List shipping methods
view.renderShippingMethods( rowData.zone_id, rowData.shipping_methods );
$tr.find( '.wc-shipping-zone-delete' ).on( 'click', { view: this }, this.onDeleteRow );
},
initRows: function() {
2016-04-19 17:26:57 +00:00
// Stripe
if ( 0 === ( $( 'tbody.wc-shipping-zone-rows tr' ).length % 2 ) ) {
2016-04-19 17:26:57 +00:00
$table.find( 'tbody.wc-shipping-zone-rows' ).next( 'tbody' ).find( 'tr' ).addClass( 'odd' );
2015-12-16 15:37:40 +00:00
} else {
2016-04-19 17:26:57 +00:00
$table.find( 'tbody.wc-shipping-zone-rows' ).next( 'tbody' ).find( 'tr' ).removeClass( 'odd' );
2015-12-10 17:24:26 +00:00
}
2016-04-19 17:26:57 +00:00
// Tooltips
$( '#tiptip_holder' ).removeAttr( 'style' );
$( '#tiptip_arrow' ).removeAttr( 'style' );
$( '.tips' ).tipTip({ 'attribute': 'data-tip', 'fadeIn': 50, 'fadeOut': 50, 'delay': 50 });
},
2016-01-13 15:04:10 +00:00
renderShippingMethods: function( zone_id, shipping_methods ) {
var $tr = $( '.wc-shipping-zones tr[data-id="' + zone_id + '"]');
var $method_list = $tr.find('.wc-shipping-zone-methods ul');
2016-03-24 17:26:40 +00:00
$method_list.find( '.wc-shipping-zone-method' ).remove();
2016-01-13 15:04:10 +00:00
if ( _.size( shipping_methods ) ) {
shipping_methods = _.sortBy( shipping_methods, function( method ) {
return parseInt( method.method_order, 10 );
} );
2016-08-02 10:24:31 +00:00
_.each( shipping_methods, function( shipping_method ) {
2016-01-13 15:04:10 +00:00
var class_name = 'method_disabled';
if ( 'yes' === shipping_method.enabled ) {
class_name = 'method_enabled';
}
$method_list.append(
'<li class="wc-shipping-zone-method ' + class_name + '">' + shipping_method.title + '</li>'
);
2016-01-13 15:04:10 +00:00
} );
} else {
$method_list.append( '<li class="wc-shipping-zone-method">' + data.strings.no_shipping_methods_offered + '</li>' );
2016-01-13 15:04:10 +00:00
}
},
onDeleteRow: function( event ) {
var view = event.data.view,
model = view.model,
zones = _.indexBy( model.get( 'zones' ), 'zone_id' ),
changes = {},
row = $( this ).closest('tr'),
2016-10-10 16:50:29 +00:00
zone_id = row.data('id');
event.preventDefault();
2016-10-10 16:50:29 +00:00
if ( window.confirm( data.strings.delete_confirmation_msg ) ) {
if ( zones[ zone_id ] ) {
delete zones[ zone_id ];
changes[ zone_id ] = _.extend( changes[ zone_id ] || {}, { deleted : 'deleted' } );
model.set( 'zones', zones );
model.logChanges( changes );
event.data.view.block();
event.data.view.model.save();
}
}
},
setUnloadConfirmation: function() {
this.needsUnloadConfirm = true;
$save_button.prop( 'disabled', false );
},
clearUnloadConfirmation: function() {
this.needsUnloadConfirm = false;
$save_button.prop( 'disabled', true );
},
unloadConfirmation: function( event ) {
if ( event.data.view.needsUnloadConfirm ) {
event.returnValue = data.strings.unload_confirmation_msg;
window.event.returnValue = data.strings.unload_confirmation_msg;
return data.strings.unload_confirmation_msg;
}
},
updateModelOnChange: function( event ) {
var model = event.data.view.model,
$target = $( event.target ),
zone_id = $target.closest( 'tr' ).data( 'id' ),
attribute = $target.data( 'attribute' ),
2015-12-10 12:31:03 +00:00
value = $target.val(),
zones = _.indexBy( model.get( 'zones' ), 'zone_id' ),
changes = {};
if ( ! zones[ zone_id ] || zones[ zone_id ][ attribute ] !== value ) {
changes[ zone_id ] = {};
changes[ zone_id ][ attribute ] = value;
}
model.logChanges( changes );
},
2015-12-10 17:47:14 +00:00
updateModelOnSort: function( event ) {
var view = event.data.view,
model = view.model,
zones = _.indexBy( model.get( 'zones' ), 'zone_id' ),
rows = $( 'tbody.wc-shipping-zone-rows tr' ),
changes = {};
// Update sorted row position
_.each( rows, function( row ) {
var zone_id = $( row ).data( 'id' ),
old_position = null,
new_position = parseInt( $( row ).index(), 10 );
if ( zones[ zone_id ] ) {
old_position = parseInt( zones[ zone_id ].zone_order, 10 );
}
2015-12-10 13:09:39 +00:00
if ( old_position !== new_position ) {
changes[ zone_id ] = _.extend( changes[ zone_id ] || {}, { zone_order : new_position } );
}
} );
2015-12-10 13:09:39 +00:00
if ( _.size( changes ) ) {
model.logChanges( changes );
2016-10-10 16:50:29 +00:00
event.data.view.block();
event.data.view.model.save();
}
}
} ),
shippingZone = new ShippingZone({
zones: data.zones
} ),
shippingZoneView = new ShippingZoneView({
model: shippingZone,
el: $tbody
} );
shippingZoneView.render();
2015-12-10 15:09:37 +00:00
2015-12-10 17:24:26 +00:00
$tbody.sortable({
items: 'tr',
cursor: 'move',
axis: 'y',
handle: 'td.wc-shipping-zone-sort',
scrollSensitivity: 40
});
});
})( jQuery, shippingZonesLocalizeScript, wp, ajaxurl );