diff --git a/code/model/DMSDocument.php b/code/model/DMSDocument.php index 0fd9cf4..f4a3989 100644 --- a/code/model/DMSDocument.php +++ b/code/model/DMSDocument.php @@ -1043,7 +1043,7 @@ class DMSDocument extends DataObject implements DMSDocumentInterface ); $actionsPanel->setName("ActionsPanel"); - $actionsPanel->addExtraClass("ActionsPanel"); + $actionsPanel->addExtraClass("DMSDocumentActionsPanel"); $fields->push($actionsPanel); diff --git a/css/DMSDocumentCMSFields.css b/css/DMSDocumentCMSFields.css index 2234255..e3ced11 100644 --- a/css/DMSDocumentCMSFields.css +++ b/css/DMSDocumentCMSFields.css @@ -24,7 +24,7 @@ form.small .field input.text, form.small .field textarea, form.small .field sele #Actions li.dms-active { border-bottom: 1px solid #C0C0C2; background: -moz-linear-gradient(#c0c0c0, #e6e6e6); background: -webkit-linear-gradient(#c0c0c0, #e6e6e6); background: linear-gradient(#c0c0c0, #e6e6e6); background-color: silver; filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#C0C0C2', endColorstr='#E6E6E6'); /* IE6 & IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#C0C0C2', endColorstr='#E6E6E6')"; /* IE8 */ box-shadow: 0 1px 1px 0 #A0A0A0 inset; } #Actions li.dms-active:after { content: ''; display: block; position: absolute; top: 33px; left: 50%; margin-left: -6px; width: 12px; height: 12px; background: #F8F8F8; border-right: 1px solid #B3B3B3; border-top: 1px solid #B3B3B3; -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); pointer-events: none; z-index: 10; } -.ActionsPanel { /*.middleColumn{ +.DMSDocumentActionsPanel { /*.middleColumn{ margin-left:184px; width: 510px; form.small &{ @@ -34,25 +34,25 @@ form.small .field input.text, form.small .field textarea, form.small .field sele */ /*label.fieldholder-small-label{ display: none; }*/ } -.ActionsPanel .fieldgroup { display: none; float: none; width: auto; background: #f8f8f8; padding: 15px; border: 1px solid #d0d3d5; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } -.ActionsPanel .fieldgroup .fieldholder-small label { float: none; width: auto; margin: 0; padding: 0; } -.ActionsPanel .fieldgroup .fieldholder-small label.ss-ui-button { float: left; margin: 0 10px 0 0; } -.ActionsPanel .fieldgroup .embargo li, .ActionsPanel .fieldgroup .expiry li { float: none; width: 100%; margin-left: 8px; } -.ActionsPanel .fieldgroup .embargo li label, .ActionsPanel .fieldgroup .expiry li label { padding-left: 10px; } -.ActionsPanel .fieldgroup .embargo .embargoDatetime, .ActionsPanel .fieldgroup .embargo .expiryDatetime, .ActionsPanel .fieldgroup .expiry .embargoDatetime, .ActionsPanel .fieldgroup .expiry .expiryDatetime { margin-top: 0; margin-left: 34px; } -.ActionsPanel .fieldgroup .embargo .embargoDatetime .field.date, .ActionsPanel .fieldgroup .embargo .embargoDatetime .field.time, .ActionsPanel .fieldgroup .embargo .expiryDatetime .field.date, .ActionsPanel .fieldgroup .embargo .expiryDatetime .field.time, .ActionsPanel .fieldgroup .expiry .embargoDatetime .field.date, .ActionsPanel .fieldgroup .expiry .embargoDatetime .field.time, .ActionsPanel .fieldgroup .expiry .expiryDatetime .field.date, .ActionsPanel .fieldgroup .expiry .expiryDatetime .field.time { display: inline-block; width: auto; } -.ActionsPanel .fieldgroup .embargo .embargoDatetime .field.date .middleColumn, .ActionsPanel .fieldgroup .embargo .expiryDatetime .field.date .middleColumn, .ActionsPanel .fieldgroup .expiry .embargoDatetime .field.date .middleColumn, .ActionsPanel .fieldgroup .expiry .expiryDatetime .field.date .middleColumn { background: url("../images/calendar-month.png") 90px 7px no-repeat; } -.ActionsPanel .fieldgroup .embargo .embargoDatetime .field.time .middleColumn, .ActionsPanel .fieldgroup .embargo .expiryDatetime .field.time .middleColumn, .ActionsPanel .fieldgroup .expiry .embargoDatetime .field.time .middleColumn, .ActionsPanel .fieldgroup .expiry .expiryDatetime .field.time .middleColumn { background: url("../images/clock-frame.png") 90px 7px no-repeat; } -.ActionsPanel .fieldgroup .embargo .embargoDatetime .middleColumn, .ActionsPanel .fieldgroup .embargo .expiryDatetime .middleColumn, .ActionsPanel .fieldgroup .expiry .embargoDatetime .middleColumn, .ActionsPanel .fieldgroup .expiry .expiryDatetime .middleColumn { margin-left: 0; width: auto; border: none; } -.ActionsPanel .fieldgroup .embargo .embargoDatetime .middleColumn input, .ActionsPanel .fieldgroup .embargo .expiryDatetime .middleColumn input, .ActionsPanel .fieldgroup .expiry .embargoDatetime .middleColumn input, .ActionsPanel .fieldgroup .expiry .expiryDatetime .middleColumn input { width: 80px; margin-right: 40px; } -.ActionsPanel #Embargo { border: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } -.ActionsPanel .ss-uploadfield-files .ss-uploadfield-item-preview { background: url("../images/app_icons/generic_32.png") -10px -6px no-repeat; } -.ActionsPanel .ss-uploadfield-files .ss-uploadfield-item-name span.name { width: 260px; } -.ActionsPanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel { width: auto; text-indent: 0; } -.ActionsPanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel .btn-icon-deleteLight { background-position: 0 -128px; display: inline-block; } -.ActionsPanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel .ui-button-text { display: block; position: relative; float: right; color: #555; padding: 0; padding-left: 2em; } -.ActionsPanel > .fieldgroup.middleColumn { overflow: hidden; display: block; } -.ActionsPanel > .fieldgroup.middleColumn .fieldgroup-field { width: 100%; } +.DMSDocumentActionsPanel .fieldgroup { display: none; float: none; width: auto; background: #f8f8f8; padding: 15px; border: 1px solid #d0d3d5; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } +.DMSDocumentActionsPanel .fieldgroup .fieldholder-small label { float: none; width: auto; margin: 0; padding: 0; } +.DMSDocumentActionsPanel .fieldgroup .fieldholder-small label.ss-ui-button { float: left; margin: 0 10px 0 0; } +.DMSDocumentActionsPanel .fieldgroup .embargo li, .DMSDocumentActionsPanel .fieldgroup .expiry li { float: none; width: 100%; margin-left: 8px; } +.DMSDocumentActionsPanel .fieldgroup .embargo li label, .DMSDocumentActionsPanel .fieldgroup .expiry li label { padding-left: 10px; } +.DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime { margin-top: 0; margin-left: 34px; overflow: hidden; } +.DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime .field.date, .DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime .field.time, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime .field.date, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime .field.time, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime .field.date, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime .field.time, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime .field.date, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime .field.time { display: inline-block; width: auto; margin: 0; padding: 0; } +.DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime .field.date .middleColumn, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime .field.date .middleColumn, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime .field.date .middleColumn, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime .field.date .middleColumn { background: url("../images/calendar-month.png") 90px 7px no-repeat; overflow: hidden; } +.DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime .field.time .middleColumn, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime .field.time .middleColumn, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime .field.time .middleColumn, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime .field.time .middleColumn { background: url("../images/clock-frame.png") 90px 7px no-repeat; overflow: hidden; } +.DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime .middleColumn, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime .middleColumn, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime .middleColumn, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime .middleColumn { margin-left: 0; width: auto; border: none; } +.DMSDocumentActionsPanel .fieldgroup .embargo .embargoDatetime .middleColumn input, .DMSDocumentActionsPanel .fieldgroup .embargo .expiryDatetime .middleColumn input, .DMSDocumentActionsPanel .fieldgroup .expiry .embargoDatetime .middleColumn input, .DMSDocumentActionsPanel .fieldgroup .expiry .expiryDatetime .middleColumn input { width: 80px; margin-right: 40px; } +.DMSDocumentActionsPanel #Embargo { border: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } +.DMSDocumentActionsPanel .ss-uploadfield-files .ss-uploadfield-item-preview { background: url("../images/app_icons/generic_32.png") -10px -6px no-repeat; } +.DMSDocumentActionsPanel .ss-uploadfield-files .ss-uploadfield-item-name span.name { width: 260px; } +.DMSDocumentActionsPanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel { width: auto; text-indent: 0; } +.DMSDocumentActionsPanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel .btn-icon-deleteLight { background-position: 0 -128px; display: inline-block; } +.DMSDocumentActionsPanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel .ui-button-text { display: block; position: relative; float: right; color: #555; padding: 0; padding-left: 2em; } +.DMSDocumentActionsPanel > .fieldgroup.middleColumn { overflow: hidden; display: block; } +.DMSDocumentActionsPanel > .fieldgroup.middleColumn .fieldgroup-field { width: 100%; } #Form_ItemEditForm fieldset table.ss-gridfield-table { width: 494px; } #Form_ItemEditForm fieldset table.ss-gridfield-table tr th.main { min-width: 175px; } diff --git a/javascript/DMSDocumentCMSFields.js b/javascript/DMSDocumentCMSFields.js index 61116ae..5149915 100644 --- a/javascript/DMSDocumentCMSFields.js +++ b/javascript/DMSDocumentCMSFields.js @@ -36,16 +36,14 @@ $('#Actions ul li').entwine({ onclick: function(e) { - console.log('LI CLICKED'); - //add active state to the current button $('#Actions ul li').removeClass('dms-active'); this.addClass('dms-active'); //$('li.dms-active').append(''); //hide all inner field sections - var panel = $('.ActionsPanel:first'); - panel.find('div.fieldgroup-field').hide(); + var panel = $('.DMSDocumentActionsPanel:first'); + panel.find('> .fieldgroup > .fieldgroup-field').hide(); //show the correct group of controls //panel.find('.'+this.data('panel')).closest('div.fieldgroup').show(); @@ -56,6 +54,7 @@ $('#Form_ItemEditForm_Embargo input, #Form_EditForm_Embargo input').entwine({ onchange: function() { + console.log('called'); //selected the date options if (this.attr('value') === 'Date') { $('.embargoDatetime').children().show(); @@ -78,7 +77,7 @@ } }); - $('.ActionsPanel').entwine({ + $('.DMSDocumentActionsPanel').entwine({ onadd: function() { //do an initial show of the entire panel this.show(); @@ -86,35 +85,33 @@ //add some extra classes to the replace field containers to make it work with drag and drop uploading this.find('.replace').closest('div.fieldgroup-field').addClass('ss-upload').addClass('ss-uploadfield'); - //Add placeholder attribute to date and time fields - $('#Form_ItemEditForm_EmbargoedUntilDate-date').attr('placeholder', 'dd-mm-yyyy'); - $('#Form_ItemEditForm_EmbargoedUntilDate-time').attr('placeholder', 'hh:mm:ss'); - $('#Form_ItemEditForm_ExpireAtDate-date').attr('placeholder', 'dd-mm-yyyy'); - $('#Form_ItemEditForm_ExpireAtDate-time').attr('placeholder', 'hh:mm:ss'); - // We need to duplicate to work when adding documents - $('#Form_EditForm_EmbargoedUntilDate-date').attr('placeholder', 'dd-mm-yyyy'); - $('#Form_EditForm_EmbargoedUntilDate-time').attr('placeholder', 'hh:mm:ss'); - $('#Form_EditForm_ExpireAtDate-date').attr('placeholder', 'dd-mm-yyyy'); - $('#Form_EditForm_ExpireAtDate-time').attr('placeholder', 'hh:mm:ss'); - - - $('#Form_ItemEditForm_EmbargoedUntilDate-date').closest('.fieldholder-small').addClass('embargoDatetime').hide(); - $('#Form_ItemEditForm_ExpireAtDate-date').closest('.fieldholder-small').addClass('expiryDatetime').hide(); - + // add class and hide + $('.DMSDocumentActionsPanel .embargo input.date').closest('.fieldholder-small').addClass('embargoDatetime').hide(); + $('.DMSDocumentActionsPanel .expiry input.date').closest('.fieldholder-small').addClass('expiryDatetime').hide(); // We need to duplicate the above functions to work when Adding documents - $('#Form_EditForm_EmbargoedUntilDate-date').closest('.fieldholder-small').addClass('embargoDatetime').hide(); - $('#Form_EditForm_ExpireAtDate-date').closest('.fieldholder-small').addClass('expiryDatetime').hide(); +// $('#Form_EditForm_EmbargoedUntilDate_date').closest('.fieldholder-small').addClass('embargoDatetime').hide(); +// $('#Form_EditForm_ExpireAtDate_date').closest('.fieldholder-small').addClass('expiryDatetime').hide(); - //show the replace panel when the page loads + //Add placeholder attribute to date and time fields + $('.DMSDocumentActionsPanel .embargo input.date').attr('placeholder', 'dd-mm-yyyy'); + $('.DMSDocumentActionsPanel .embargo input.time').attr('placeholder', 'hh:mm:ss'); + $('.DMSDocumentActionsPanel .expiry input.date').attr('placeholder', 'dd-mm-yyyy'); + $('.DMSDocumentActionsPanel .expiry input.time').attr('placeholder', 'hh:mm:ss'); + // We need to duplicate to work when adding documents +// $('#Form_EditForm_EmbargoedUntilDate_date').attr('placeholder', 'dd-mm-yyyy'); +// $('#Form_EditForm_EmbargoedUntilDate_time').attr('placeholder', 'hh:mm:ss'); +// $('#Form_EditForm_ExpireAtDate_date').attr('placeholder', 'dd-mm-yyyy'); +// $('#Form_EditForm_ExpireAtDate_time').attr('placeholder', 'hh:mm:ss'); + + //show the embargo panel when the page loads $('li[data-panel="embargo"]').click(); //set the initial state of the radio button and the associated dropdown hiding - $('#Form_ItemEditForm_Embargo input[checked]').change(); - $('#Form_ItemEditForm_Expiry input[checked]').change(); - + $('.DMSDocumentActionsPanel .embargo input[type="radio"][checked]').change(); + $('.DMSDocumentActionsPanel .expiry input[type="radio"][checked]').change(); //Again we need to duplicate the above function to work when adding documents - $('#Form_EditForm_Embargo input[checked]').change(); - $('#Form_EditForm_Expiry input[checked]').change(); +// $('#Form_EditForm_Embargo input[checked]').change(); +// $('#Form_EditForm_Expiry input[checked]').change(); } }); diff --git a/scss/DMSDocumentCMSFields.scss b/scss/DMSDocumentCMSFields.scss index fb84083..33d30c1 100644 --- a/scss/DMSDocumentCMSFields.scss +++ b/scss/DMSDocumentCMSFields.scss @@ -64,7 +64,7 @@ form.small .field .TreeDropdownField, } } -.ActionsPanel{ +.DMSDocumentActionsPanel{ /*.middleColumn{ margin-left:184px; @@ -113,19 +113,24 @@ form.small .field .TreeDropdownField, .embargoDatetime, .expiryDatetime{ margin-top: 0; margin-left: 34px; + overflow: hidden; .field{ &.date, &.time{ display: inline-block; width: auto; + margin: 0; + padding: 0; } &.date{ .middleColumn{ background: url('../images/calendar-month.png') 90px 7px no-repeat; + overflow: hidden; } } &.time{ .middleColumn{ background: url('../images/clock-frame.png') 90px 7px no-repeat; + overflow: hidden; } } }