From 9bc46687b1df63f825356955ba1fde289313bbf8 Mon Sep 17 00:00:00 2001 From: colymba Date: Sun, 23 Jun 2013 18:17:42 +0300 Subject: [PATCH] housekeeping, comments and formatting --- code/GridFieldBulkImageUpload_Request.php | 4 +- javascript/GridFieldBulkImageUpload.js | 249 ++++++++++++++-------- 2 files changed, 167 insertions(+), 86 deletions(-) diff --git a/code/GridFieldBulkImageUpload_Request.php b/code/GridFieldBulkImageUpload_Request.php index a93276a..ed78ec2 100644 --- a/code/GridFieldBulkImageUpload_Request.php +++ b/code/GridFieldBulkImageUpload_Request.php @@ -259,9 +259,7 @@ class GridFieldBulkImageUpload_Request extends RequestHandler { //sequential upload $uploadField->setConfig('sequentialUploads', $this->component->getConfig('sequentialUploads')); - /* * - * Create form - */ + //Create form $form = new Form( $this, 'uploadForm', diff --git a/javascript/GridFieldBulkImageUpload.js b/javascript/GridFieldBulkImageUpload.js index 96cde2c..f3ca135 100644 --- a/javascript/GridFieldBulkImageUpload.js +++ b/javascript/GridFieldBulkImageUpload.js @@ -1,54 +1,80 @@ -(function($) { - +(function($) { $.entwine('ss', function($) { - // start SS overhides - + // ============================================================================================ + // start SS namespace overrides + // ============================================================================================ + + /* + * open/close edit form + */ $('div.ss-upload .ss-uploadfield-item-edit, div.ss-upload .ss-uploadfield-item-name').entwine({ - onclick: function(e){ + onclick: function(e) + { this.closest('.ss-uploadfield-item').find('.ss-uploadfield-item-editform').toggleEditForm(); } }); + /* + * edit all button + * @TODO fix + */ $('div.ss-upload .fileOverview .ss-uploadfield-item-edit-all').entwine({ - onmatch: function(){ + onmatch: function() + { if( !$(this).hasClass('opened') ){ $(this).addClass('opened'); } }, - onunmatch: function(){ - - }, - onclick: function(e) { - if($(this).hasClass('opened')){ + onunmatch: function(){}, + onclick: function(e) + { + if( $(this).hasClass('opened') ) + { $('.ss-uploadfield-files .ss-uploadfield-item-editform').hide(); $(this).removeClass('opened'); - }else{ + } + else{ $('.ss-uploadfield-files .ss-uploadfield-item-editform').show(); $(this).addClass('opened'); } + e.preventDefault(); } }); + /* + * show/hide edit form + * overrides default behaviour + */ $('div.ss-upload .ss-uploadfield-item-editform').entwine({ - toggleEditForm: function() { + toggleEditForm: function() + { if( this.css('display') == 'none' ) { this.show(); - }else{ + } + else{ this.hide(); } } }); + /* + * prevent submitting of individual edit forms + */ $('#Form_uploadForm, div.ss-upload .ss-uploadfield-item-editform form').entwine({ - onsubmit: function(e) { + onsubmit: function(e) + { return false; } }); + /* + * initialise disabled state + */ $('#bulkImageUploadUpdateBtn,#bulkImageUploadUpdateCancelBtn').entwine({ - onmatch: function(){ + onmatch: function() + { $(this).addClass('ui-state-disabled ssui-button-disabled'); $(this).attr('aria-disabled', 'true'); $(this).attr('disabled', 'true'); @@ -56,12 +82,16 @@ onunmatch: function(){} }); + /* + * finish/return button + */ $('#bulkImageUploadFinishBtn').entwine({ onmatch: function(){}, onunmatch: function(){}, - onclick: function(e){ - var formsWithUpadtes = $('form.bulkImageUploadUpdateForm.hasUpdate').length, - confirmed = true; + onclick: function(e) + { + var formsWithUpadtes = $('form.bulkImageUploadUpdateForm.hasUpdate').length, + confirmed = true; if ( formsWithUpadtes > 0 ) { @@ -78,23 +108,34 @@ } }); - // end SS overhides - // start add-on behaviours + // ============================================================================================ + // end SS namespace overrides + // ============================================================================================ + // ============================================================================================ + // start add-on behaviours + // ============================================================================================ + $.entwine('colymba', function($) { - $('.bulkImageUploadUpdateForm').entwine({ - onmatch: function(){ - }, - onunmatch: function(){ - }, - haschanged: function(){ - var itemInfo, itemStatus; + /* + * handles individual edit forms changes + * updates buttons and visual styles + */ + $('.bulkImageUploadUpdateForm').entwine({ + onmatch: function(){}, + onunmatch: function(){}, + haschanged: function() + { + var itemInfo, + itemStatus + ; - itemStatus = $(this).parents('li').find('.ss-uploadfield-item-status'); - itemInfo = $(this).parents('li').find('.ss-uploadfield-item-info'); + itemStatus = $(this).parents('li').find('.ss-uploadfield-item-status'); + itemInfo = $(this).parents('li').find('.ss-uploadfield-item-info'); - if ( !$(this).hasClass('hasUpdate') ) { + if ( !$(this).hasClass('hasUpdate') ) + { $(this).addClass('hasUpdate'); } @@ -108,56 +149,81 @@ } }); + /* + * catches edit form changes + */ $('.bulkImageUploadUpdateForm input.text, .bulkImageUploadUpdateForm input.checkbox, .bulkImageUploadUpdateForm select, .bulkImageUploadUpdateForm textarea').entwine({ - onchange: function(){ + onchange: function() + { this.closest('.bulkImageUploadUpdateForm').haschanged(); } }); - //textarea node is being removed from the DOM when the HTMLEditorFieldChanges, not the best but works + /* + * catches edit form changes + * HTMLEditorField hack + */ + //textarea node is being removed from the DOM when the HTMLEditorFieldChanges, not the best but works $('.field.htmleditor textarea').entwine({ - onmatch: function(){ - }, - onunmatch: function(){ + onmatch: function(){}, + onunmatch: function() + { //note sure why querying straight from the texarea doesn't work... maybe because it is already removed from DOM? $('input[type="hidden"][name="'+$(this).attr('name')+'"]').parents('.bulkImageUploadUpdateForm').haschanged(); } }); + /* + * save changes button behaviour + * loop through edited forms and submit data + */ $('#bulkImageUploadUpdateBtn:not(.ui-state-disabled)').entwine({ - onmatch: function(){ + onmatch: function() + { $(this).data('completedForms', 0); }, - onunmatch: function(){ - }, - onclick: function(e){ - - var formsWithUpadtes, url, data, cacheBuster; + onunmatch: function(){}, + onclick: function(e) + { + var formsWithUpadtes, + url, + data, + cacheBuster + ; formsWithUpadtes = $('form.bulkImageUploadUpdateForm.hasUpdate'); $(this).data('formsToUpdate', $(formsWithUpadtes).length); url = $(this).data('url'); - if ( $(formsWithUpadtes).length > 0 ) $(this).addClass('loading'); + if ( $(formsWithUpadtes).length > 0 ) + { + $(this).addClass('loading'); + } - //@TODO execute 'doFinish' even when no form have been changed - $(formsWithUpadtes).each(function(){ + $(formsWithUpadtes).each(function() + { cacheBuster = new Date().getTime() + '_' + $(this).attr('name'); - if ( url.indexOf('?') !== -1 ) cacheBuster = '&cacheBuster=' + cacheBuster; - else cacheBuster = '?cacheBuster=' + cacheBuster; + if ( url.indexOf('?') !== -1 ) + { + cacheBuster = '&cacheBuster=' + cacheBuster; + } + else{ + cacheBuster = '?cacheBuster=' + cacheBuster; + } data = $(this).serialize(); $.ajax({ - url: url + cacheBuster, - data: data, - type: "POST", - context: $(this) - }).done(function() { - - var btn = $('#bulkImageUploadUpdateBtn'); - var totalForms = parseInt( $(btn).data('formsToUpdate') ); - var counter = parseInt( $(btn).data('completedForms') ); + url: url + cacheBuster, + data: data, + type: "POST", + context: $(this) + }).done(function() { + var btn = $('#bulkImageUploadUpdateBtn'), + totalForms = parseInt( $(btn).data('formsToUpdate') ), + counter = parseInt( $(btn).data('completedForms') ) + ; + counter = counter + 1; $(btn).data('completedForms', counter); @@ -168,51 +234,67 @@ $(this).removeClass('hasUpdate'); - if ( counter == totalForms ) { + if ( counter == totalForms ) + { $('#bulkImageUploadUpdateBtn').data('completedForms', 0); $('#bulkImageUploadUpdateBtn').removeClass('loading'); $('#bulkImageUploadUpdateBtn').addClass('ui-state-disabled'); - } - + } }); + }); - return false; - + return false; } }); - $('.ss-uploadfield-item-editform').entwine({ - onmatch: function(e){ + /* + * edit forms ovverides + */ + $('.ss-uploadfield-item-editform').entwine({ + onmatch: function(e) + { $('#bulkImageUploadUpdateCancelBtn').removeClass('ui-state-disabled ssui-button-disabled'); $('#bulkImageUploadUpdateCancelBtn').attr('aria-disabled', 'false'); $('#bulkImageUploadUpdateCancelBtn').removeAttr('disabled'); }, - onunmatch: function(){ - } + onunmatch: function(){} }); + /* + * cancel button behaviour + * loop through edit forms and submit for deletion + */ $('#bulkImageUploadUpdateCancelBtn:not(.ui-state-disabled)').entwine({ - onclick: function(e){ + onclick: function(e) + { + var url = $(this).data('url'), + cacheBuster = new Date().getTime() + ; + + if ( url.indexOf('?') !== -1 ) + { + cacheBuster = '&cacheBuster=' + cacheBuster; + } + else{ + cacheBuster = '?cacheBuster=' + cacheBuster; + } - var url = $(this).data('url'); - var cacheBuster = new Date().getTime(); - if ( url.indexOf('?') !== -1 ) cacheBuster = '&cacheBuster=' + cacheBuster; - else cacheBuster = '?cacheBuster=' + cacheBuster; - - $('form.bulkImageUploadUpdateForm').each(function(){ + $('form.bulkImageUploadUpdateForm').each(function() + { var data = $(this).serialize(); $.ajax({ - url: url + cacheBuster, - data: data, - type: "POST", - context: $(this) + url: url + cacheBuster, + data: data, + type: "POST", + context: $(this) }).done(function() { $(this).parents('li.ss-uploadfield-item').empty().remove(); - if ( $('li.ss-uploadfield-item').length == 0 ) { + if ( $('li.ss-uploadfield-item').length == 0 ) + { $('.ss-uploadfield-editandorganize').css('display', 'none'); $('#Form_bulkImageUploadForm').removeClass('loading'); $('#bulkImageUploadUpdateCancelBtn').addClass('ui-state-disabled'); @@ -221,13 +303,14 @@ }); }); - return false; - + return false; } }); - // - - }); - }); + }); + // ============================================================================================ + // end add-on behaviours + // ============================================================================================ + + }); }(jQuery)); \ No newline at end of file