FIX Refactor SCSS, convert to more BEM-like names, add admin icon

* Remove "small" class from inline edit form for documents
* Swap relationeditor GridFieldConfig for record editor to ensure that document sets can be deleted from a page context rather than unlinked (natively)
* Fix to ensure that related documents can be autocompleted via partial matching on filename
* Add 2 space indentation rule to editorconfig for .js and .scss files
This commit is contained in:
Robbie Averill 2017-05-22 14:06:06 +12:00
parent e8d46a90a5
commit 9b42effeb5
16 changed files with 292 additions and 430 deletions

View File

@ -10,7 +10,7 @@ indent_style = space
insert_final_newline = true insert_final_newline = true
trim_trailing_whitespace = true trim_trailing_whitespace = true
[{*.yml,package.json}] [{*.yml,package.json,*.scss,*.js}]
indent_size = 2 indent_size = 2
# The indent size used in the package.json file cannot be changed: # The indent size used in the package.json file cannot be changed:

View File

@ -10,6 +10,8 @@ class DMSDocumentAdmin extends ModelAdmin
private static $menu_title = 'Documents'; private static $menu_title = 'Documents';
private static $menu_icon = 'dms/images/app_icons/drawer.png';
/** /**
* Remove the default "add" button and replace it with a customised version for DMS * Remove the default "add" button and replace it with a customised version for DMS
* *

View File

@ -37,7 +37,6 @@ class DMSUploadField_ItemHandler extends UploadField_ItemHandler
$validator $validator
); );
$form->loadDataFrom($file); $form->loadDataFrom($file);
$form->addExtraClass('small');
return $form; return $form;
} }

View File

@ -20,12 +20,10 @@ class DMSSiteTreeExtension extends DataExtension
'Document Sets', 'Document Sets',
false, false,
$this->owner->DocumentSets(), //->Sort('DocumentSort'), $this->owner->DocumentSets(), //->Sort('DocumentSort'),
new GridFieldConfig_RelationEditor new GridFieldConfig_RecordEditor
); );
$gridField->addExtraClass('documentsets'); $gridField->addExtraClass('documentsets');
$gridField->getConfig()->removeComponentsByType('GridFieldAddExistingAutocompleter');
$fields->addFieldToTab( $fields->addFieldToTab(
'Root.Document Sets (' . $this->owner->DocumentSets()->count() . ')', 'Root.Document Sets (' . $this->owner->DocumentSets()->count() . ')',
$gridField $gridField

View File

@ -514,9 +514,8 @@ class DMSDocument extends DataObject implements DMSDocumentInterface
{ {
if ($this->getField('Filename')) { if ($this->getField('Filename')) {
return $this->getField('Filename'); return $this->getField('Filename');
} else {
return ASSETS_DIR . '/';
} }
return ASSETS_DIR . '/';
} }
/** /**
@ -529,6 +528,8 @@ class DMSDocument extends DataObject implements DMSDocumentInterface
/** /**
* Returns the filename of a document without the prefix, e.g. 0~filename.jpg -> filename.jpg
*
* @return string * @return string
*/ */
public function getFilenameWithoutID() public function getFilenameWithoutID()
@ -898,7 +899,7 @@ class DMSDocument extends DataObject implements DMSDocumentInterface
); );
$actionsPanel->setName("ActionsPanel"); $actionsPanel->setName("ActionsPanel");
$actionsPanel->addExtraClass("DMSDocumentActionsPanel"); $actionsPanel->addExtraClass('dmsdocument-actionspanel');
$fields->push($actionsPanel); $fields->push($actionsPanel);
$this->extend('updateCMSFields', $fields); $this->extend('updateCMSFields', $fields);
@ -1130,7 +1131,7 @@ class DMSDocument extends DataObject implements DMSDocumentInterface
)->setName("FilePreview")->addExtraClass('cms-file-info') )->setName("FilePreview")->addExtraClass('cms-file-info')
); );
$fields->setName('FileP'); $fields->addExtraClass('dmsdocument-documentdetails');
$urlField->dontEscape = true; $urlField->dontEscape = true;
return $fields; return $fields;
@ -1211,7 +1212,8 @@ class DMSDocument extends DataObject implements DMSDocumentInterface
$addExisting->setSearchList($this->getRelatedDocumentsForAutocompleter()); $addExisting->setSearchList($this->getRelatedDocumentsForAutocompleter());
// Restrict search fields to specific fields only // Restrict search fields to specific fields only
$addExisting->setSearchFields(array('Title', 'Filename')); $addExisting->setSearchFields(array('Title:PartialMatch', 'Filename:PartialMatch'));
$addExisting->setResultsFormat('$Filename');
$this->extend('updateRelatedDocumentsGridField', $gridField); $this->extend('updateRelatedDocumentsGridField', $gridField);
@ -1304,12 +1306,12 @@ class DMSDocument extends DataObject implements DMSDocumentInterface
*/ */
public function getActionTaskHtml() public function getActionTaskHtml()
{ {
$html = '<div id="Actions" class="field actions">' $html = '<div class="field dmsdocment-actions">'
. '<label class="left">' . _t('DMSDocument.ACTIONS_LABEL', 'Actions') . '</label>' . '<label class="left">' . _t('DMSDocument.ACTIONS_LABEL', 'Actions') . '</label>'
. '<ul>'; . '<ul>';
foreach ($this->actionTasks as $panelKey => $title) { foreach ($this->actionTasks as $panelKey => $title) {
$html .= '<li class="ss-ui-button" data-panel="' . $panelKey . '">' $html .= '<li class="ss-ui-button dmsdocument-action" data-panel="' . $panelKey . '">'
. _t('DMSDocument.ACTION_' . strtoupper($panelKey), $title) . _t('DMSDocument.ACTION_' . strtoupper($panelKey), $title)
. '</li>'; . '</li>';
} }

View File

@ -32,6 +32,11 @@ class DMSDocumentSet extends DataObject
), ),
); );
private static $summary_fields = array(
'Title' => 'Title',
'Documents.Count' => 'No. Documents'
);
/** /**
* Retrieve a list of the documents in this set. An extension hook is provided before the result is returned. * Retrieve a list of the documents in this set. An extension hook is provided before the result is returned.
* *
@ -85,6 +90,7 @@ class DMSDocumentSet extends DataObject
// Document listing // Document listing
$gridFieldConfig = GridFieldConfig::create() $gridFieldConfig = GridFieldConfig::create()
->addComponents( ->addComponents(
new GridFieldButtonRow('before'),
new GridFieldToolbarHeader(), new GridFieldToolbarHeader(),
new GridFieldFilterHeader(), new GridFieldFilterHeader(),
new GridFieldSortableHeader(), new GridFieldSortableHeader(),
@ -139,7 +145,7 @@ class DMSDocumentSet extends DataObject
$gridField->addExtraClass('documents'); $gridField->addExtraClass('documents');
$gridFieldConfig->addComponent( $gridFieldConfig->addComponent(
$addNewButton = new DMSGridFieldAddNewButton, $addNewButton = new DMSGridFieldAddNewButton('buttons-before-left'),
'GridFieldExportButton' 'GridFieldExportButton'
); );
$addNewButton->setDocumentSetId($self->ID); $addNewButton->setDocumentSetId($self->ID);

356
dist/css/cmsbundle.css vendored
View File

@ -1,3 +1,137 @@
.dmsdocument-documentdetails .fieldgroup-field .cms-file-info-preview {
box-shadow: none; }
.dmsdocument-documentdetails .fieldgroup-field .cms-file-info-data {
width: 400px; }
.dmsdocument-documentdetails .fieldgroup-field .fieldholder-small {
margin-top: 5px; }
.dmsdocument-documentdetails .fieldgroup-field .fieldholder-small .fieldholder-small-label {
font-weight: bold;
float: left; }
.dmsdocument-documentdetails .fieldgroup-field .fieldholder-small .readonly {
font-style: italic; }
.dmsdocment-actions {
border: none;
box-shadow: none;
margin-bottom: 0;
padding: 0; }
.dmsdocment-actions label.left {
padding: 6px 0 0 0; }
.dmsdocment-actions .ss-ui-button {
border: none;
background: none;
border-radius: 0;
font-weight: normal; }
.dmsdocment-actions .ss-ui-button .ui-button-text {
padding-bottom: 1em; }
.dmsdocment-actions .ss-ui-button.dms-active, .dmsdocment-actions .ss-ui-button.dms-active:hover {
border-bottom: 4px solid #66727d; }
.dmsdocment-actions .ss-ui-button:hover, .dmsdocment-actions .ss-ui-button:active {
background: none;
border: none;
box-shadow: none; }
.dmsdocument-actionspanel {
margin-top: 0; }
.dmsdocument-actionspanel .fieldgroup {
border: 1px solid #d0d3d5;
display: none;
margin-left: 0;
padding: 5px 15px; }
.dmsdocument-actionspanel .fieldgroup .fieldholder-small label {
padding: 0; }
.dmsdocument-actionspanel .fieldgroup .embargo li,
.dmsdocument-actionspanel .fieldgroup .expiry li {
margin-left: 8px;
width: 100%; }
.dmsdocument-actionspanel .fieldgroup .embargo li label,
.dmsdocument-actionspanel .fieldgroup .expiry li label {
padding-left: 10px; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime {
float: left;
margin-top: 0;
margin-left: 34px;
overflow: hidden; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .field.date, .dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .field.time,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .field.date,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .field.time,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .field.date,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .field.time,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .field.date,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .field.time {
display: inline-block;
margin: 0;
padding: 0;
width: auto; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .field.date .middleColumn, .dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .field.time .middleColumn,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .field.date .middleColumn,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .field.time .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .field.date .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .field.time .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .field.date .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .field.time .middleColumn {
overflow: hidden; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .field.date .middleColumn,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .field.date .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .field.date .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .field.date .middleColumn {
background: url(../../images/calendar-month.png) 90px 7px no-repeat; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .field.time .middleColumn,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .field.time .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .field.time .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .field.time .middleColumn {
background: url(../../images/clock-frame.png) 90px 7px no-repeat; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .middleColumn,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .middleColumn,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .middleColumn {
border: none;
margin-left: 0;
width: auto; }
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .middleColumn input.date,
.dmsdocument-actionspanel .fieldgroup .embargo .embargoDatetime .middleColumn input.time,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .middleColumn input.date,
.dmsdocument-actionspanel .fieldgroup .embargo .expiryDatetime .middleColumn input.time,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .middleColumn input.date,
.dmsdocument-actionspanel .fieldgroup .expiry .embargoDatetime .middleColumn input.time,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .middleColumn input.date,
.dmsdocument-actionspanel .fieldgroup .expiry .expiryDatetime .middleColumn input.time {
margin-right: 40px;
width: 80px; }
.dmsdocument-actionspanel .fieldgroup .fieldgroup-field label {
margin: 0; }
.dmsdocument-actionspanel .ss-uploadfield-files .ss-uploadfield-item-preview {
background: url(../../images/app_icons/generic_32.png) -10px -6px no-repeat; }
.dmsdocument-actionspanel .ss-uploadfield-files .ss-uploadfield-item-name span.name {
width: 260px; }
.dmsdocument-actionspanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel {
text-indent: 0;
width: auto; }
.dmsdocument-actionspanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel .btn-icon-deleteLight {
background-position: 0 -128px;
display: inline-block; }
.dmsdocument-actionspanel .ss-uploadfield-files .ss-uploadfield-item-actions .ss-uploadfield-item-cancel .ui-button-text {
color: #66727d;
display: block;
float: right;
padding: 0 0 0 2em;
position: relative; }
.dmsdocument-actionspanel > .fieldgroup.middleColumn {
display: block;
overflow: hidden; }
.dmsdocument-actionspanel > .fieldgroup.middleColumn .fieldgroup-field {
width: 100%; }
.dmsdocument-actionspanel .permissions .fieldholder-small {
clear: both; }
#ui-datepicker-div {
border: 1px solid #d0d3d5; }
form.small .field input.text, form.small .field input.text,
form.small .field textarea, form.small .field textarea,
form.small .field select, form.small .field select,
@ -8,190 +142,11 @@ form.small .field .TreeDropdownField,
.field.small .TreeDropdownField { .field.small .TreeDropdownField {
width: 100%; } width: 100%; }
#FileP .fieldgroup-field { .dmsdocument-addexisting .ui-autocomplete {
width: 100%; } border: 1px solid #d0d3d5;
#FileP .fieldgroup-field .cms-file-info-preview {
box-shadow: none; }
#FileP .fieldgroup-field .cms-file-info-data {
width: 400px; }
#FileP .fieldgroup-field .fieldholder-small {
margin-top: 5px; }
#FileP .fieldgroup-field .fieldholder-small label {
width: auto;
margin-left: 0;
padding-top: 0;
margin-right: 10px;
font-weight: bold;
float: left; }
#FileP .fieldgroup-field .fieldholder-small .readonly {
font-style: italic;
color: #666; }
#Actions {
box-shadow: none;
border: none;
padding: 0; }
#Actions li {
margin-left: 2px; }
#Actions li:first-child {
margin-left: 0; }
#Actions li.delete-button-appended {
display: inline-block;
position: relative;
margin-left: 0; }
.DMSDocumentActionsPanel .fieldgroup {
display: none;
float: none;
width: auto;
background: #f8f8f8;
padding: 15px;
border: 1px solid #d0d3d5; }
.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; }
#Form_ItemEditForm fieldset table.ss-gridfield-table tr th.main.col-action_SetOrderID {
width: 60px;
min-width: 60px; }
#Form_ItemEditForm fieldset table.ss-gridfield-table tr td {
white-space: normal; }
#ui-datepicker-div {
border: 1px solid #DDD; }
.ui-autocomplete {
border: 1px solid #DDD;
box-shadow: 0 1px 2px 0px #AFAFAF;
max-height: 300px; max-height: 300px;
overflow: scroll; } overflow: scroll; }
.cms fieldset.documents table td,
.cms fieldset.relatedLinks table td {
white-space: normal; }
.cms fieldset.documents table td.col-buttons,
.cms fieldset.relatedLinks table td.col-buttons {
white-space: nowrap; }
.cms fieldset.documents table td.col-buttons .dms-delete-link-only .ui-icon,
.cms fieldset.relatedLinks table td.col-buttons .dms-delete-link-only .ui-icon {
background: url(../../images/chain-unchain.png) no-repeat; }
.cms fieldset.documents table tr.dms-document-hidden-row.odd,
.cms fieldset.relatedLinks table tr.dms-document-hidden-row.odd {
background-color: rgba(242, 220, 222, 0.6); }
.cms fieldset.documents table tr.dms-document-hidden-row.even,
.cms fieldset.relatedLinks table tr.dms-document-hidden-row.even {
background-color: rgba(243, 202, 204, 0.675); }
.cms fieldset.documents table tr.dms-document-hidden-row:hover,
.cms fieldset.relatedLinks table tr.dms-document-hidden-row:hover {
background-color: rgba(245, 172, 173, 0.8) !important; }
.DMSDocumentAddController .ui-tabs ul.ui-tabs-nav {
border-bottom: none;
float: right;
margin: 8px 0 -1px 0;
padding: 0 24px 0 0; }
.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; }
.ss-add .document-add-existing input.document-autocomplete { .ss-add .document-add-existing input.document-autocomplete {
position: absolute; position: absolute;
z-index: 9999; z-index: 9999;
@ -203,20 +158,16 @@ form.small .field .TreeDropdownField,
box-sizing: border-box; box-sizing: border-box;
-moz-box-sizing: border-box; } -moz-box-sizing: border-box; }
.ss-add .document-add-existing input.document-autocomplete[disabled] { .ss-add .document-add-existing input.document-autocomplete[disabled] {
color: #C0C0C2; color: #d0d3d5;
text-shadow: 0 -1px 0 #FFF; text-shadow: 0 -1px 0 #ffffff;
background: #EEE; background: #f8f8f8;
background-image: none; background-image: none;
box-shadow: inset 0 1px 8px 0 #C4C4C4; box-shadow: inset 0 1px 8px 0 #d0d3d5;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
border-bottom-right-radius: 0; } border-bottom-right-radius: 0; }
.ss-add .document-add-existing .TreeDropdownField { .ss-add .document-add-existing .treedropdown {
border: none; border: none; }
width: 100%;
max-width: 512px;
box-sizing: border-box;
cursor: pointer; }
.ss-add .document-add-existing .treedropdownfield-toggle-panel-link { .ss-add .document-add-existing .treedropdownfield-toggle-panel-link {
padding: 5px 9px 9px; padding: 5px 9px 9px;
@ -241,13 +192,11 @@ form.small .field .TreeDropdownField,
.ss-add .document-add-existing .document-list { .ss-add .document-add-existing .document-list {
width: 510px; width: 510px;
border: 1px solid #DDD; border: 1px solid #d0d3d5;
border-top: none; border-top: none;
background: #ffffff; background: #ffffff;
display: none; display: none;
box-shadow: 0 2px 4px 1px #DDD;
max-height: 300px; max-height: 300px;
border-radius: 6px;
background-clip: padding-box; background-clip: padding-box;
overflow: scroll; } overflow: scroll; }
.ss-add .document-add-existing .document-list p { .ss-add .document-add-existing .document-list p {
@ -259,10 +208,10 @@ form.small .field .TreeDropdownField,
.ss-add .document-add-existing .document-list ul li a { .ss-add .document-add-existing .document-list ul li a {
display: block; display: block;
padding: 4px 8px; padding: 4px 8px;
border: 1px solid #FFF; border: 1px solid #ffffff;
color: black; } color: black; }
.ss-add .document-add-existing .document-list ul li a:hover { .ss-add .document-add-existing .document-list ul li a:hover {
border: 1px solid #CCC; border: 1px solid #d0d3d5;
border-radius: 4px; border-radius: 4px;
background: rgba(203, 203, 203, 0.4); background: rgba(203, 203, 203, 0.4);
cursor: pointer; cursor: pointer;
@ -326,20 +275,7 @@ form.small .field .TreeDropdownField,
.cms .ss-add .treedropdownfield-panel ul li a.jstree-hovered, .cms .ss-add .treedropdownfield-panel ul li a.jstree-hovered,
.cms .selectiongroup .treedropdownfield-panel ul li a.jstree-hovered { .cms .selectiongroup .treedropdownfield-panel ul li a.jstree-hovered {
background: rgba(203, 203, 203, 0.4); background: rgba(203, 203, 203, 0.4);
border: 1px solid #CCC; } border: 1px solid #d0d3d5; }
@-moz-document url-prefix() .ss-add .document-add-existing input {
padding: 10px 7px; }
#Form_EditForm_Documents {
padding: 1em 0; }
#Form_EditForm_Documents input[name="filter[LastChanged]"] {
display: none; }
#Form_EditForm_RelatedLinks table {
padding: 1em 0; }
#Form_EditForm_RelatedLinks table thead h2 {
display: none; }
#Form_ItemEditForm h3:first-child { #Form_ItemEditForm h3:first-child {
display: inline-block; display: inline-block;

BIN
images/app_icons/drawer.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 273 B

View File

@ -51,16 +51,16 @@
this.trigger('change'); this.trigger('change');
} }
}); });
$('#Actions ul li').entwine({ $('.dmsdocment-actions ul li').entwine({
onclick: function (e) { onclick: function (e) {
//add active state to the current button //add active state to the current button
$('#Actions ul li').removeClass('dms-active'); $('.dmsdocment-actions ul li').removeClass('dms-active');
this.addClass('dms-active'); this.addClass('dms-active');
//$('li.dms-active').append('<span class="arrow"></span>'); //$('li.dms-active').append('<span class="arrow"></span>');
//hide all inner field sections //hide all inner field sections
var panel = $('.DMSDocumentActionsPanel:first'); var panel = $('.dmsdocument-actionspanel:first');
panel.find('> .fieldgroup > .fieldgroup-field').hide(); panel.find('> .fieldgroup > .fieldgroup-field').hide();
//show the correct group of controls //show the correct group of controls
@ -94,7 +94,7 @@
} }
}); });
$('.DMSDocumentActionsPanel').entwine({ $('.dmsdocument-actionspanel').entwine({
onadd: function () { onadd: function () {
//do an initial show of the entire panel //do an initial show of the entire panel
this.show(); this.show();
@ -103,17 +103,17 @@
this.find('.replace').closest('div.fieldgroup-field').addClass('ss-upload').addClass('ss-uploadfield'); this.find('.replace').closest('div.fieldgroup-field').addClass('ss-upload').addClass('ss-uploadfield');
// add class and hide // add class and hide
$('.DMSDocumentActionsPanel .embargo input.date').closest('.fieldholder-small').addClass('embargoDatetime').hide(); $('.dmsdocument-actionspanel .embargo input.date').closest('.fieldholder-small').addClass('embargoDatetime').hide();
$('.DMSDocumentActionsPanel .expiry input.date').closest('.fieldholder-small').addClass('expiryDatetime').hide(); $('.dmsdocument-actionspanel .expiry input.date').closest('.fieldholder-small').addClass('expiryDatetime').hide();
// We need to duplicate the above functions to work when Adding documents // We need to duplicate the above functions to work when Adding documents
// $('#Form_EditForm_EmbargoedUntilDate_date').closest('.fieldholder-small').addClass('embargoDatetime').hide(); // $('#Form_EditForm_EmbargoedUntilDate_date').closest('.fieldholder-small').addClass('embargoDatetime').hide();
// $('#Form_EditForm_ExpireAtDate_date').closest('.fieldholder-small').addClass('expiryDatetime').hide(); // $('#Form_EditForm_ExpireAtDate_date').closest('.fieldholder-small').addClass('expiryDatetime').hide();
//Add placeholder attribute to date and time fields //Add placeholder attribute to date and time fields
$('.DMSDocumentActionsPanel .embargo input.date').attr('placeholder', 'dd-mm-yyyy'); $('.dmsdocument-actionspanel .embargo input.date').attr('placeholder', 'dd-mm-yyyy');
$('.DMSDocumentActionsPanel .embargo input.time').attr('placeholder', 'hh:mm:ss'); $('.dmsdocument-actionspanel .embargo input.time').attr('placeholder', 'hh:mm:ss');
$('.DMSDocumentActionsPanel .expiry input.date').attr('placeholder', 'dd-mm-yyyy'); $('.dmsdocument-actionspanel .expiry input.date').attr('placeholder', 'dd-mm-yyyy');
$('.DMSDocumentActionsPanel .expiry input.time').attr('placeholder', 'hh:mm:ss'); $('.dmsdocument-actionspanel .expiry input.time').attr('placeholder', 'hh:mm:ss');
// We need to duplicate to work when adding documents // We need to duplicate to work when adding documents
// $('#Form_EditForm_EmbargoedUntilDate_date').attr('placeholder', 'dd-mm-yyyy'); // $('#Form_EditForm_EmbargoedUntilDate_date').attr('placeholder', 'dd-mm-yyyy');
// $('#Form_EditForm_EmbargoedUntilDate_time').attr('placeholder', 'hh:mm:ss'); // $('#Form_EditForm_EmbargoedUntilDate_time').attr('placeholder', 'hh:mm:ss');
@ -124,8 +124,8 @@
$('li[data-panel="embargo"]').click(); $('li[data-panel="embargo"]').click();
//set the initial state of the radio button and the associated dropdown hiding //set the initial state of the radio button and the associated dropdown hiding
$('.DMSDocumentActionsPanel .embargo input[type="radio"][checked]').change(); $('.dmsdocument-actionspanel .embargo input[type="radio"][checked]').change();
$('.DMSDocumentActionsPanel .expiry input[type="radio"][checked]').change(); $('.dmsdocument-actionspanel .expiry input[type="radio"][checked]').change();
//Again we need to duplicate the above function to work when adding documents //Again we need to duplicate the above function to work when adding documents
// $('#Form_EditForm_Embargo input[checked]').change(); // $('#Form_EditForm_Embargo input[checked]').change();
// $('#Form_EditForm_Expiry input[checked]').change(); // $('#Form_EditForm_Expiry input[checked]').change();

7
scss/_mixins.scss Normal file
View File

@ -0,0 +1,7 @@
//** Generate a state for an active list item link
//
// @param {string} $color - the colour to use for the border
// @param {string} $size - the size the border should be, e.g. "8px"
@mixin dmsdocument-actions-active($color, $size: "4px") {
border-bottom: #{$size} solid #{$color};
}

View File

@ -3,3 +3,8 @@
// Colours // Colours
$color-button-generic: #e6e6e6 !default; $color-button-generic: #e6e6e6 !default;
$color-zebra: #F0F4F7 !default; $color-zebra: #F0F4F7 !default;
$color-grey-lighter: #f8f8f8 !default;
$color-grey-light: #d0d3d5 !default;
$color-grey-dark: #66727d !default;
$color-white: #ffffff !default;

View File

@ -1,18 +1,6 @@
form.small .field input.text, //** The DMS document details/information on an edit page
form.small .field textarea, .dmsdocument-documentdetails {
form.small .field select,
form.small .field .TreeDropdownField,
.field.small input.text,
.field.small textarea,
.field.small select,
.field.small .TreeDropdownField {
width: 100%;
}
#FileP {
.fieldgroup-field { .fieldgroup-field {
width: 100%;
.cms-file-info-preview { .cms-file-info-preview {
box-shadow: none; box-shadow: none;
} }
@ -20,73 +8,78 @@ form.small .field .TreeDropdownField,
.cms-file-info-data { .cms-file-info-data {
width: 400px; width: 400px;
} }
.fieldholder-small { .fieldholder-small {
margin-top: 5px; margin-top: 5px;
label {
width: auto; .fieldholder-small-label {
margin-left: 0;
padding-top: 0;
margin-right: 10px;
font-weight: bold; font-weight: bold;
float: left; float: left;
} }
.readonly{
.readonly {
font-style: italic; font-style: italic;
color: #666;
} }
} }
} }
} }
#Actions { //** The actions panel buttons when editing a DMS document
box-shadow:none; .dmsdocment-actions {
border:none; border: none;
padding:0; box-shadow: none;
li { margin-bottom: 0;
margin-left: 2px; padding: 0;
&:first-child {
margin-left: 0; label.left {
padding: 6px 0 0 0;
} }
&.delete-button-appended {
display: inline-block; .ss-ui-button {
position: relative; border: none;
margin-left: 0; background: none;
border-radius: 0;
font-weight: normal;
.ui-button-text {
padding-bottom: 1em;
}
&.dms-active,
&.dms-active:hover {
@include dmsdocument-actions-active($color-grey-dark);
}
&:hover,
&:active {
background: none;
border: none;
box-shadow: none;
} }
// &.dms-active{
// @include active-actions-btn;
// }
} }
} }
.DMSDocumentActionsPanel { //** The actions panel, containing mini forms for each DMS document action
.dmsdocument-actionspanel {
margin-top: 0;
.fieldgroup { .fieldgroup {
border: 1px solid $color-grey-light;
display: none; display: none;
float: none; margin-left: 0;
width: auto; padding: 5px 15px;
background: #f8f8f8;
padding: 15px;
border: 1px solid #d0d3d5;
.fieldholder-small { .fieldholder-small {
label { label {
float: none;
width: auto;
margin: 0;
padding: 0; padding: 0;
&.ss-ui-button {
float: left;
margin: 0 10px 0 0;
}
} }
} }
.embargo, .embargo,
.expiry { .expiry {
li { li {
float: none;
width: 100%;
margin-left: 8px; margin-left: 8px;
width: 100%;
label { label {
padding-left: 10px; padding-left: 10px;
@ -95,6 +88,7 @@ form.small .field .TreeDropdownField,
.embargoDatetime, .embargoDatetime,
.expiryDatetime { .expiryDatetime {
float: left;
margin-top: 0; margin-top: 0;
margin-left: 34px; margin-left: 34px;
overflow: hidden; overflow: hidden;
@ -103,45 +97,45 @@ form.small .field .TreeDropdownField,
&.date, &.date,
&.time { &.time {
display: inline-block; display: inline-block;
width: auto;
margin: 0; margin: 0;
padding: 0; padding: 0;
width: auto;
.middleColumn {
overflow: hidden;
}
} }
&.date { &.date {
.middleColumn{ .middleColumn {
background: url('../images/calendar-month.png') 90px 7px no-repeat; background: url('../images/calendar-month.png') 90px 7px no-repeat;
overflow: hidden;
} }
} }
&.time { &.time {
.middleColumn { .middleColumn {
background: url('../images/clock-frame.png') 90px 7px no-repeat; background: url('../images/clock-frame.png') 90px 7px no-repeat;
overflow: hidden;
} }
} }
} }
.middleColumn { .middleColumn {
border: none;
margin-left: 0; margin-left: 0;
width: auto; width: auto;
border: none;
input { input.date,
width: 80px; input.time {
margin-right: 40px; margin-right: 40px;
} width: 80px;
} }
} }
} }
} }
#Embargo { .fieldgroup-field label {
border: none; margin: 0;
box-shadow: none; }
-moz-box-shadow: none;
-webkit-box-shadow: none;
} }
.ss-uploadfield-files { .ss-uploadfield-files {
@ -157,8 +151,8 @@ form.small .field .TreeDropdownField,
.ss-uploadfield-item-actions { .ss-uploadfield-item-actions {
.ss-uploadfield-item-cancel { .ss-uploadfield-item-cancel {
width: auto;
text-indent: 0; text-indent: 0;
width: auto;
.btn-icon-deleteLight { .btn-icon-deleteLight {
background-position: 0 -128px; background-position: 0 -128px;
@ -166,50 +160,44 @@ form.small .field .TreeDropdownField,
} }
.ui-button-text { .ui-button-text {
color: $color-grey-dark;
display: block; display: block;
position: relative;
float: right; float: right;
color: #555; padding: 0 0 0 2em;
padding:0; position: relative;
padding-left: 2em;
} }
} }
} }
} }
& > .fieldgroup.middleColumn { & > .fieldgroup.middleColumn {
overflow: hidden;
display: block; display: block;
overflow: hidden;
.fieldgroup-field { .fieldgroup-field {
width: 100%; width: 100%;
} }
} }
}
#Form_ItemEditForm { .permissions {
fieldset { .fieldholder-small {
table.ss-gridfield-table { clear: both;
width: 494px;
tr {
th.main {
min-width: 175px;
&.col-action_SetOrderID {
width: 60px;
min-width: 60px;
}
}
td {
white-space: normal;
}
}
} }
} }
} }
#ui-datepicker-div { #ui-datepicker-div {
border: 1px solid #DDD; border: 1px solid $color-grey-light;
}
//** Overrides for the inline edit screen
form.small .field input.text,
form.small .field textarea,
form.small .field select,
form.small .field .TreeDropdownField,
.field.small input.text,
.field.small textarea,
.field.small select,
.field.small .TreeDropdownField {
width: 100%;
} }

View File

@ -1,3 +1,4 @@
@import "_variables"; @import "_variables";
@import "DMSDocumentCMSFields"; @import "_mixins";
@import "DMSMainCMS"; @import "cmsfields";
@import "upload";

View File

@ -1,58 +1,8 @@
.ui-autocomplete{ .dmsdocument-addexisting {
border: 1px solid #DDD; .ui-autocomplete {
box-shadow: 0 1px 2px 0px #AFAFAF; border: 1px solid $color-grey-light;
max-height: 300px; max-height: 300px;
overflow: scroll; overflow: scroll;
}
.cms fieldset.documents,
.cms fieldset.relatedLinks {
table {
td {
white-space: normal;
}
td.col-buttons {
white-space: nowrap;
.dms-delete-link-only {
.ui-icon {
background: url(../images/chain-unchain.png) no-repeat;
}
}
}
tr.dms-document-hidden-row {
&.odd {
background-color: mix($color-zebra, rgba(255, 4, 0, 0.2));
}
&.even {
background-color: mix($color-zebra, rgba(255, 4, 0, 0.35));
}
&:hover {
background-color: mix($color-zebra, rgba(255, 4, 0, 0.6)) !important;
}
}
}
}
.DMSDocumentAddController .ui-tabs {
ul.ui-tabs-nav {
border-bottom: none;
float: right;
margin: 8px 0 -1px 0;
padding: 0 24px 0 0;
li {
padding-bottom: 1px;
border: 1px solid #C0C0C2;
a {
padding: 8px 20px 8px;
}
}
} }
} }
@ -70,22 +20,18 @@
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
&[disabled] { &[disabled] {
color: #C0C0C2; color: $color-grey-light;
text-shadow: 0 -1px 0 #FFF; text-shadow: 0 -1px 0 $color-white;
background: #EEE; background: $color-grey-lighter;
background-image:none; background-image:none;
box-shadow: inset 0 1px 8px 0 #C4C4C4; box-shadow: inset 0 1px 8px 0 $color-grey-light;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
} }
.TreeDropdownField { .treedropdown {
border: none; border: none;
width: 100%;
max-width: 512px;
box-sizing: border-box;
cursor:pointer;
} }
.treedropdownfield-toggle-panel-link { .treedropdownfield-toggle-panel-link {
@ -116,13 +62,11 @@
.document-list { .document-list {
width: 510px; width: 510px;
border: 1px solid #DDD; border: 1px solid $color-grey-light;
border-top: none; border-top: none;
background: #ffffff; background: $color-white;
display: none; display: none;
box-shadow: 0 2px 4px 1px #DDD;
max-height: 300px; max-height: 300px;
border-radius: 6px;
background-clip: padding-box; background-clip: padding-box;
overflow: scroll; overflow: scroll;
@ -139,11 +83,11 @@
a { a {
display: block; display: block;
padding: 4px 8px; padding: 4px 8px;
border: 1px solid #FFF; border: 1px solid $color-white;
color: black; color: black;
&:hover { &:hover {
border: 1px solid #CCC; border: 1px solid $color-grey-light;
border-radius: 4px; border-radius: 4px;
background: rgba(203, 203, 203, 0.4); background: rgba(203, 203, 203, 0.4);
cursor: pointer; cursor: pointer;
@ -222,7 +166,7 @@
padding: 4px 0; padding: 4px 0;
li { li {
border: 1px solid #ffffff; border: 1px solid $color-white;
a { a {
display: block; display: block;
@ -230,7 +174,7 @@
&.jstree-hovered { &.jstree-hovered {
background: rgba(203, 203, 203, 0.4); background: rgba(203, 203, 203, 0.4);
border: 1px solid #CCC; border: 1px solid $color-grey-light;
} }
} }
} }
@ -239,32 +183,6 @@
} }
} }
// Hack for Firefox to fix padding on adding document input.
// FF renders the size different and pushes it out by 2px compared to webkit
@-moz-document url-prefix() .ss-add .document-add-existing input {
padding: 10px 7px;
}
#Form_EditForm_Documents {
padding: 1em 0;
input[name="filter[LastChanged]"] {
display: none;
}
}
#Form_EditForm_RelatedLinks {
table {
padding: 1em 0;
thead {
h2 {
display: none;
}
}
}
}
#Form_ItemEditForm { #Form_ItemEditForm {
h3:first-child { h3:first-child {
display: inline-block; display: inline-block;

View File

@ -1,4 +1,4 @@
<div id="document" class="ss-add field treedropdown searchable"> <div class="ss-add field treedropdown searchable dmsdocument-addexisting">
<div class="document-add-existing <% if $useFieldContext %>field<% else %>link-editor-context<% end_if %>"> <div class="document-add-existing <% if $useFieldContext %>field<% else %>link-editor-context<% end_if %>">
<% if $useFieldContext %><h3><% else %><div><% end_if %> <% if $useFieldContext %><h3><% else %><div><% end_if %>
<span class="step-label"> <span class="step-label">

View File

@ -84,7 +84,7 @@ class DMSDocumentTest extends SapphireTest
$this->assertNotContains('test-file-file-doesnt-exist-1', $jsonResult); $this->assertNotContains('test-file-file-doesnt-exist-1', $jsonResult);
$this->assertContains('test-file-file-doesnt-exist-2', $jsonResult); $this->assertContains('test-file-file-doesnt-exist-2', $jsonResult);
$this->assertEquals(array('Title', 'Filename'), $autocompleter->getSearchFields()); $this->assertEquals(array('Title:PartialMatch', 'Filename:PartialMatch'), $autocompleter->getSearchFields());
} }
/** /**
@ -118,7 +118,7 @@ class DMSDocumentTest extends SapphireTest
$result = $document->getActionTaskHtml(); $result = $document->getActionTaskHtml();
$this->assertContains('<label class="left">Actions</label>', $result); $this->assertContains('<label class="left">Actions</label>', $result);
$this->assertContains('<li class="ss-ui-button" data-panel="', $result); $this->assertContains('<li class="ss-ui-button dmsdocument-action" data-panel="', $result);
$this->assertContains('permission', $result); $this->assertContains('permission', $result);
$this->assertContains('Example', $result); $this->assertContains('Example', $result);
} }