GridFieldBulkEditingTools/javascript/GridFieldBulkImageUpload.js
colymba 079fb7fa36 UI behavior and visual enhancements
Switch Actions to FormActions buttons and add colored visual hints about
items status.
2012-08-10 00:30:50 +03:00

165 lines
5.0 KiB
JavaScript

(function($) {
$.entwine('ss', function($) {
// start SS overhides
$('div.ss-upload .ss-uploadfield-item-edit, div.ss-upload .ss-uploadfield-item-name').entwine({
onclick: function(e){
this.closest('.ss-uploadfield-item').find('.ss-uploadfield-item-editform').toggleEditForm();
}
});
$('div.ss-upload .fileOverview .ss-uploadfield-item-edit-all').entwine({
onmatch: function(){
if( !$(this).hasClass('opened') ){
$(this).addClass('opened');
}
},
onunmatch: function(){
},
onclick: function(e) {
if($(this).hasClass('opened')){
$('.ss-uploadfield-files .ss-uploadfield-item-editform').hide();
$(this).removeClass('opened');
}else{
$('.ss-uploadfield-files .ss-uploadfield-item-editform').show();
$(this).addClass('opened');
}
e.preventDefault();
}
});
$('div.ss-upload .ss-uploadfield-item-editform').entwine({
toggleEditForm: function() {
if( this.css('display') == 'none' ) {
this.show();
}else{
this.hide();
}
}
});
// end SS overhides
// start add-on behaviours
$.entwine('colymba', function($) {
$('.bulkImageUploadUpdateForm input.text, .bulkImageUploadUpdateForm input.checkbox, .bulkImageUploadUpdateForm select, .bulkImageUploadUpdateForm textarea').entwine({
onchange: function(){
var form, itemInfo, itemStatus;
form = this.closest('.bulkImageUploadUpdateForm');
itemStatus = (this).parents('li').find('.ss-uploadfield-item-status');
itemInfo = $(this).parents('li').find('.ss-uploadfield-item-info');
if ( !$(form).hasClass('hasUpdate') ) {
$(form).addClass('hasUpdate');
}
$(itemStatus).removeClass('updated').addClass('dirty').html('Changed');
if ( $(itemInfo).hasClass('updated') ) $(itemInfo).removeClass('updated');
if ( !$(itemInfo).hasClass('dirty') ) $(itemInfo).addClass('dirty');
$('#bulkImageUploadUpdateFinishBtn').addClass('dirty');
}
});
$('#bulkImageUploadUpdateBtn').entwine({
onmatch: function(){
$(this).data('completedForms', 0);
},
onunmatch: function(){
},
onclick: function(e){
var formsWithUpadtes = $('form.bulkImageUploadUpdateForm.hasUpdate');
$(this).data('formsToUpdate', $(formsWithUpadtes).length);
var url = $(this).data('url');
var cacheBuster = new Date().getTime();
if ( $(formsWithUpadtes).length > 0 ) $(this).addClass('loading');
$(formsWithUpadtes).each(function(){
var data = $(this).serialize();
$.ajax({
url: url + '?cacheBuster=' + cacheBuster,
data: data,
type: "POST",
context: $(this)
}).done(function() {
var btn = $('#bulkImageUploadUpdateBtn');
var totalForms = parseInt( $(btn).data('formsToUpdate') );
var counter = parseInt( $(btn).data('completedForms') );
counter = counter + 1;
$(btn).data('completedForms', counter);
$(this).removeClass('hasUpdate');
$(this).parents('li').find('.ss-uploadfield-item-status').removeClass('dirty').addClass('updated').html('Updated');
$(this).parents('li').find('.ss-uploadfield-item-info').removeClass('dirty').addClass('updated');
$(this).parents('li').find('.ss-uploadfield-item-editform').css('display', 'none');
$(this).removeClass('hasUpdate');
if ( counter == totalForms ) {
$('#bulkImageUploadUpdateFinishBtn').removeClass('dirty');
$('#bulkImageUploadUpdateBtn').data('completedForms', 0);
$('#bulkImageUploadUpdateBtn').removeClass('loading');
if ( $('#bulkImageUploadUpdateBtn').hasClass('doFinish') ) {
//@TODO find a way to pass this as CMS navigation through AJAX
window.location = $('#bulkImageUploadUpdateFinishBtn').data('return-url');
}
}
});
})
}
});
$('#bulkImageUploadUpdateFinishBtn').entwine({
onclick: function(e){
if ( $(this).hasClass('dirty') ) {
$('#bulkImageUploadUpdateBtn').addClass('doFinish');
$('#bulkImageUploadUpdateBtn').click();
}
}
});
$('#bulkImageUploadUpdateCancelBtn').entwine({
onclick: function(e){
var url = $(this).data('url');
var cacheBuster = new Date().getTime();
$('form.bulkImageUploadUpdateForm').each(function(){
var data = $(this).serialize();
$.ajax({
url: url + '?cacheBuster=' + cacheBuster,
data: data,
type: "POST",
context: $(this)
}).done(function() {
$(this).parents('li.ss-uploadfield-item').empty().remove();
if ( $('li.ss-uploadfield-item').length == 0 ) {
$('.ss-uploadfield-editandorganize').css('display', 'none');
$('#Form_bulkImageUploadForm').removeClass('loading');
}
});
});
}
});
//
});
});
}(jQuery));