diff --git a/code/GridFieldBulkImageUpload_Request.php b/code/GridFieldBulkImageUpload_Request.php
index 9711337..986aca0 100644
--- a/code/GridFieldBulkImageUpload_Request.php
+++ b/code/GridFieldBulkImageUpload_Request.php
@@ -159,28 +159,38 @@ class GridFieldBulkImageUpload_Request extends RequestHandler {
$actions = new FieldList();
- $html = "
- Link('update')."\" href=\"#\">
- Save All
- ";
- $actions->push(new LiteralField('savebutton', $html));
-
+ $actions->push(
+ FormAction::create('SaveAll', 'Save All')
+ ->setAttribute('id', 'bulkImageUploadUpdateBtn')
+ ->addExtraClass('ss-ui-action-constructive cms-panel-link')
+ ->setAttribute('data-icon', 'accept')
+ ->setAttribute('data-url', $this->Link('update'))
+ ->setUseButtonTag(true)
+ );
if($crumbs && $crumbs->count()>=2)
{
- $html = "
- Link('update')."\" href=\"".$one_level_up->Link."\">
- Save All & Finish
- ";
- $actions->push(new LiteralField('finishbutton', $html));
+ $actions->push(
+ FormAction::create('SaveAndFinish', 'Save All & Finish')
+ ->setAttribute('id', 'bulkImageUploadUpdateFinishBtn')
+ ->addExtraClass('ss-ui-action-constructive cms-panel-link')
+ ->setAttribute('data-icon', 'accept')
+ ->setAttribute('data-url', $this->Link('update'))
+ ->setAttribute('data-return-url', $one_level_up->Link)
+ ->setUseButtonTag(true)
+ );
}
- $html = "
- Link('cancel')."\" href=\"#\">
- Cancel & Delete All
- ";
- $actions->push(new LiteralField('cancelbutton', $html));
-
+ $actions->push(
+ FormAction::create('Cancel', 'Cancel & Delete All')
+ ->setAttribute('id', 'bulkImageUploadUpdateCancelBtn')
+ ->addExtraClass('ss-ui-action-destructive cms-panel-link')
+ ->setAttribute('data-icon', 'decline')
+ ->setAttribute('data-url', $this->Link('cancel'))
+ ->setUseButtonTag(true)
+ );
+
+
$uploadField = UploadField::create('BulkImageUploadField', '');
$uploadField->setConfig('previewMaxWidth', 40);
$uploadField->setConfig('previewMaxHeight', 30);
@@ -207,7 +217,8 @@ class GridFieldBulkImageUpload_Request extends RequestHandler {
);
$form->setTemplate('LeftAndMain_EditForm');
- $form->addExtraClass('center cms-edit-form cms-content');
+ //$form->addExtraClass('center cms-edit-form cms-content');
+ $form->addExtraClass('center cms-content');
$form->setAttribute('data-pjax-fragment', 'CurrentForm Content');
if($crumbs && $crumbs->count()>=2){
diff --git a/css/GridFieldBulkImageUpload.css b/css/GridFieldBulkImageUpload.css
index fd146b1..00883d9 100644
--- a/css/GridFieldBulkImageUpload.css
+++ b/css/GridFieldBulkImageUpload.css
@@ -29,3 +29,23 @@ li.ss-uploadfield-item.template-download .imgPreview
background-image: linear-gradient(top, #a4ca3a 0%, #59781D 100%);
}
+#BulkImageUploadField .ss-uploadfield-item-info.dirty
+{
+ background-color: #f2ba11;
+
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f2ba11), color-stop(100%, #df6e00));
+ background-image: -webkit-linear-gradient(top, #f2ba11 0%, #df6e00 100%);
+ background-image: -moz-linear-gradient(top, #f2ba11 0%, #df6e00 100%);
+ background-image: -o-linear-gradient(top, #f2ba11 0%, #df6e00 100%);
+ background-image: -ms-linear-gradient(top, #f2ba11 0%, #df6e00 100%);
+ background-image: linear-gradient(top, #f2ba11 0%, #df6e00 100%);
+}
+
+#BulkImageUploadField .ss-uploadfield-item-status.updated
+{
+ color: #3b8716;
+}
+#BulkImageUploadField .ss-uploadfield-item-status.dirty
+{
+ color: #f25000;
+}
\ No newline at end of file
diff --git a/javascript/GridFieldBulkImageUpload.js b/javascript/GridFieldBulkImageUpload.js
index df2e346..032e05f 100644
--- a/javascript/GridFieldBulkImageUpload.js
+++ b/javascript/GridFieldBulkImageUpload.js
@@ -27,6 +27,7 @@
$('.ss-uploadfield-files .ss-uploadfield-item-editform').show();
$(this).addClass('opened');
}
+ e.preventDefault();
}
});
@@ -44,14 +45,24 @@
// start add-on behaviours
$.entwine('colymba', function($) {
-
+
$('.bulkImageUploadUpdateForm input.text, .bulkImageUploadUpdateForm input.checkbox, .bulkImageUploadUpdateForm select, .bulkImageUploadUpdateForm textarea').entwine({
onchange: function(){
- var form = this.closest('.bulkImageUploadUpdateForm');
+ 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');
}
- $('a#bulkImageUploadUpdateFinishBtn').addClass('dirty');
+
+ $(itemStatus).removeClass('updated').addClass('dirty').html('Changed');
+ if ( $(itemInfo).hasClass('updated') ) $(itemInfo).removeClass('updated');
+ if ( !$(itemInfo).hasClass('dirty') ) $(itemInfo).addClass('dirty');
+
+ $('#bulkImageUploadUpdateFinishBtn').addClass('dirty');
}
});
@@ -68,6 +79,8 @@
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({
@@ -77,31 +90,32 @@
context: $(this)
}).done(function() {
- var btn = $('a#bulkImageUploadUpdateBtn');
+ 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').html('Updated');
- $(this).parents('li').find('.ss-uploadfield-item-info').addClass('updated');
+ $(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');
+ $(this).removeClass('hasUpdate');
if ( counter == totalForms ) {
$('#bulkImageUploadUpdateFinishBtn').removeClass('dirty');
- if ( $(this).hasClass('doFinish') ) {
- $('#bulkImageUploadUpdateFinishBtn').clcik();
- }
+ $('#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');
+ }
}
});
})
- //@todo Fix IE, seems to go right through the prevent default and
- e.preventDefault();
}
});
@@ -110,7 +124,6 @@
if ( $(this).hasClass('dirty') ) {
$('#bulkImageUploadUpdateBtn').addClass('doFinish');
$('#bulkImageUploadUpdateBtn').click();
- e.stopImmediatePropagation();
}
}
});
@@ -139,10 +152,8 @@
}
});
- });
-
- e.stopImmediatePropagation();
- e.preventDefault();
+ });
+
}
});