tonyair/silverstripe-dms
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-dms synced 2024-10-22 14:05:56 +02:00
Code Issues Projects Releases Wiki Activity

ENHANCEMENT: Move Actions into a FieldGroup and style these. TODO - Toggle each individual action detail when clicking the respective button. Currently when clicking a button this hides the whole panel

Browse Source
This commit is contained in:
Ryan O'Hara 2012-08-08 12:17:20 +12:00
parent aaac430e62
commit a629f4b66e
6 changed files with 59 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
code/DMSDocument.php
View File

@ -481,9 +481,16 @@ class DMSDocument extends DataObject implements DMSDocumentInterface {
);
$fields->add(new LiteralField('BottomTaskSelection',"<div id=\"Actions\" class=\"field actions\"><label class=\"left\">Actions</label><ul><li class=\"ss-ui-button\">Replace</li><li class=\"ss-ui-button\">Embargo</li></ul></div>"));
$fields->add($uploadField);
$fields->add($pagesGrid);
//$fields->add($uploadField);
// This adds all the actions details into a group.
// Embargo, History, etc to go in here
// These are toggled on and off via the Actions Buttons above
$fields->add($group = new FieldGroup(
$uploadField,
$pagesGrid
));
$group->setName("ActionsPanel")->addExtraClass('dmsupload ss-upload ss-uploadfield');
return $fields;
}

11
css/DMSDocumentCMSFields.css
View File

@ -9,18 +9,23 @@ form.small .field input.text, form.small .field textarea, form.small .field sele
#DocumentTypeID ul { padding: 0; }
#DocumentTypeID ul input[type="radio"] { display: none; }
#DocumentTypeID ul li { display: inline-block; padding: 0; width: 94px; margin-right: -1px; border-radius: 0; }
#DocumentTypeID ul li { display: inline-block; padding: 0; width: 90px; margin-right: -1px; border-radius: 0; }
#DocumentTypeID ul li.val1 { width: 130px; }
#DocumentTypeID ul li.val1 label { max-width: 105px; }
#DocumentTypeID ul li:first-child { border-radius: 6px 0 0 6px; border-left: 1px solid #C0C0C2; }
#DocumentTypeID ul li:last-child { border-radius: 0 6px 6px 0; }
#DocumentTypeID ul li.selected { border-bottom: 1px solid #C0C0C2; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #c0c0c0), color-stop(100%, #e6e6e6)); background: -webkit-linear-gradient(#c0c0c0, #e6e6e6); background: -moz-linear-gradient(#c0c0c0, #e6e6e6); background: -o-linear-gradient(#c0c0c0, #e6e6e6); background: -ms-linear-gradient(#c0c0c0, #e6e6e6); background: linear-gradient(#c0c0c0, #e6e6e6); box-shadow: 0 1px 1px 0 #A0A0A0 inset; }
#DocumentTypeID ul li.selected :after { box-shadow: 0 1px 1px 0 #DDD; }
#DocumentTypeID ul li label { padding: .4em 1em; display: block; line-height: 1.4; white-space: normal; }
#DocumentTypeID ul li label { padding: .4em 1em; display: inline-block; line-height: 1.4; white-space: normal; max-width: 60px; }
#Actions li { margin-left: 2px; }
#Actions li:first-child { margin-left: 0; }
#ReplaceFile { display: none; }
#ActionsPanel .middleColumn { margin-left: 184px; }
#ActionsPanel label.fieldholder-small-label { display: none; }
#ActionsPanel .fieldgroup-field { float: none; width: auto; }
#ActionsPanel .fieldgroup-field .fieldholder-small label { float: none; width: auto; margin: 0; padding: 0; }
#ActionsPanel .fieldgroup-field .fieldholder-small label.ss-ui-button { float: left; margin: 0 10px 0 0; }
#Form_ItemEditForm fieldset table.ss-gridfield-table { width: auto; }
#Form_ItemEditForm fieldset table.ss-gridfield-table tr th.main { min-width: 200px; }

1
css/DMSMainCMS.css
View File

@ -9,4 +9,5 @@
.DMSDocumentAddController .ui-tabs ul.ui-tabs-nav li { padding-bottom: 1px; border: 1px solid #C0C0C2; }
.DMSDocumentAddController .ui-tabs ul.ui-tabs-nav li a { padding: 8px 20px 8px; }
#Form_EditForm_Documents { padding: 1em 0; }
#Form_EditForm_Documents input[name="filter[LastChanged]"] { display: none; }

9
javascript/DMSDocumentCMSFields.js
View File

@ -12,13 +12,15 @@
$('#DocumentTypeID input[type=radio]').entwine({
onadd: function() {
// Checks to see what radio button is selected
if (this.is(':checked')) {
this.change();
}
},
onchange: function(e) {
// Remove selected class from radio buttons
$('#DocumentTypeID').find('li').removeClass('selected');
//If radio button is checked then add the selected class
if (this.is(':checked')) {
this.parent('li').addClass('selected');
}
@ -27,8 +29,9 @@
$('#Actions ul li').entwine({
onclick: function(e) {
e.preventDefault();
this.parents('fieldset').find('#ReplaceFile').show();
//TODO - Fix so when clicking on an action it toggles the correct details inside the ActionsPanel
// Currently this just hides the whole ActionsPanel when you click an action button
this.parents('fieldset').find('#ActionsPanel').hide();
}
});

34
scss/DMSDocumentCMSFields.scss
View File

@ -48,11 +48,14 @@ form.small .field .TreeDropdownField,
li{
display:inline-block;
padding:0;
width:94px;
width:90px;
margin-right: -1px;
border-radius:0;
&.val1{
width:130px;
label{
max-width:105px;
}
}
&:first-child{
border-radius: 6px 0 0 6px;
@ -76,9 +79,10 @@ form.small .field .TreeDropdownField,
}
label{
padding: .4em 1em;
display: block;
display: inline-block;
line-height: 1.4;
white-space:normal;
max-width:60px;
}
}
}
@ -91,8 +95,30 @@ form.small .field .TreeDropdownField,
}
}
}
#ReplaceFile{
display:none;
#ActionsPanel{
.middleColumn{
margin-left:184px;
}
label.fieldholder-small-label{
display: none;
}
.fieldgroup-field{
float:none;
width:auto;
.fieldholder-small{
label{
float:none;
width:auto;
margin:0;
padding:0;
&.ss-ui-button{
float: left;
margin: 0 10px 0 0;
}
}
}
}
}
#Form_ItemEditForm{

5
scss/DMSMainCMS.scss
View File

@ -41,6 +41,9 @@
}
#Form_EditForm_Documents input[name="filter[LastChanged]"] {
#Form_EditForm_Documents {
padding: 1em 0;
input[name="filter[LastChanged]"] {
display: none;
}
}