diff --git a/css/GridField.css b/css/GridField.css index f8644546e..bfbd670fb 100644 --- a/css/GridField.css +++ b/css/GridField.css @@ -1,17 +1,32 @@ -/** Core styles for the basic GridField form field without any specific style. @package sapphire @subpackage scss */ -.ss-gridfield { border: none; } -.ss-gridfield table { width: 100%; border-collapse: collapse; border-spacing: 0; background: #fff; border: 1px solid #c1c1c1; } -.ss-gridfield thead { color: #5a5a5a; background: #dadada; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f3f3f3), color-stop(100%, #dadada)); background-image: -webkit-linear-gradient(#f3f3f3, #dadada); background-image: -moz-linear-gradient(#f3f3f3, #dadada); background-image: -o-linear-gradient(#f3f3f3, #dadada); background-image: -ms-linear-gradient(#f3f3f3, #dadada); background-image: linear-gradient(#f3f3f3, #dadada); } -.ss-gridfield thead th { font-weight: bold; padding: 8px 24px 8px 8px; position: relative; border: 1px solid #c1c1c1; border-width: 0 1px 1px 0; } -.ss-gridfield thead th.ss-gridfield-sortable.hover { color: #747474; cursor: pointer; background: #f3f3f3; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e7e7e7)); background-image: -webkit-linear-gradient(#ffffff, #e7e7e7); background-image: -moz-linear-gradient(#ffffff, #e7e7e7); background-image: -o-linear-gradient(#ffffff, #e7e7e7); background-image: -ms-linear-gradient(#ffffff, #e7e7e7); background-image: linear-gradient(#ffffff, #e7e7e7); } -.ss-gridfield thead th.ss-gridfield-sorted { background: #e7e7e7; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dadada), color-stop(100%, #f3f3f3)); background-image: -webkit-linear-gradient(#dadada, #f3f3f3); background-image: -moz-linear-gradient(#dadada, #f3f3f3); background-image: -o-linear-gradient(#dadada, #f3f3f3); background-image: -ms-linear-gradient(#dadada, #f3f3f3); background-image: linear-gradient(#dadada, #f3f3f3); } -.ss-gridfield thead th.ss-gridfield-sorted.hover { background: #f3f3f3; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e7e7e7), color-stop(100%, #f9f9f9)); background-image: -webkit-linear-gradient(#e7e7e7, #f9f9f9); background-image: -moz-linear-gradient(#e7e7e7, #f9f9f9); background-image: -o-linear-gradient(#e7e7e7, #f9f9f9); background-image: -ms-linear-gradient(#e7e7e7, #f9f9f9); background-image: linear-gradient(#e7e7e7, #f9f9f9); } -.ss-gridfield thead th .ui-icon { position: absolute; top: 5px; right: 0; } -.ss-gridfield thead th.ss-gridfield-desc .ui-icon { background-position: 0 -48px; } -.ss-gridfield thead th.ss-gridfield-asc .ui-icon { background-position: -64px -48px; } -.ss-gridfield td { padding: 8px; border-right: 1px solid #f3f3f3; } -.ss-gridfield td.ss-gridfield-last { border-right: none; } -.ss-gridfield tr.ss-gridfield-even { border: 1px solid #c6e5f6; border-width: 1px 0; background: #f2f9fd; } -.ss-gridfield tr.ss-gridfield-even.ss-gridfield-last { border-bottom: none; } -.ss-gridfield tr.ss-gridfield-even td { border-right: 1px solid #dceffa; } -.ss-gridfield tr.ss-gridfield-even td.ss-gridfield-last { border-right: none; } +/** Core styles for the basic GridField form field without any specific style. @package sapphire @subpackage scss @todo Add radial gradient to default delete button state @todo Create SASS mixin-function to simply swap the from/to, to to/from colours in grsdient mixins? */ +.cms table.ss-gridfield { width: 100%; padding: 0; margin: 20px 0 0 0; border-collapse: separate; display: table; border-bottom: 0 none; } +.cms table.ss-gridfield thead { color: #1d2224; background: transparent; } +.cms table.ss-gridfield tbody { background: #FFF; } +.cms table.ss-gridfield tbody td { /* Rounded buttons */ } +.cms table.ss-gridfield tbody td button { border: #CC0033 solid 1px; background: #CC0033; color: #FFF; -moz-border-radius: 15px; -webkit-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; -khtml-border-radius: 15px; border-radius: 15px; margin: 0 0 0 2px; padding: 0; width: auto; min-width: 30px; height: 30px; text-shadow: none; } +.cms table.ss-gridfield tbody td button:hover { color: #222; } +.cms table.ss-gridfield tfoot { color: #1d2224; } +.cms table.ss-gridfield tfoot tr td { background: #95a5ab; padding: .7em; } +.cms table.ss-gridfield tr.sortable-header th { background: #7f9198; } +.cms table.ss-gridfield tr:hover { background: #FFFAD6 !important; } +.cms table.ss-gridfield tr:first-child { background: transparent; } +.cms table.ss-gridfield tr.ss-gridfield-even { background: #f2f9fd; } +.cms table.ss-gridfield tr.ss-gridfield-even.ss-gridfield-last { border-bottom: none; } +.cms table.ss-gridfield tr th { font-weight: bold; font-size: 12px; color: #FFF; padding: 0; border-right: 1px solid #85959C; height: 20px; /* Makes it appear as though the text sits over the boundary of the two
- * $presenter = new GridFieldPresenter();
- * $presenter->setTemplate('MyNiftyGridTemplate');
- * $gridField = new GridField('ExampleGrid', 'Example grid', new DataList('Page'),null, $presenter);
- *
- *
- * There is also a possibility to add extensions to the GridPresenter. An
- * example is the DataGridPagination that decorates the GridField with
- * pagination. Look in the GridFieldPresenter::Items() and the filterList extend
- * and GridFieldPresenter::Footers()
- *
- *
- * GridFieldPresenter::add_extension('GridFieldPaginator_Extension');
- * $presenter = new GridFieldPresenter();
- * // This is actually calling GridFieldPaginator_Extension::paginationLimit()
- * $presenter->paginationLimit(3);
- * $gridField = new GridField('ExampleGrid', 'Example grid', new DataList('Page'),null, $presenter);
- *
- *
- * @see GridField
- * @see GridFieldPaginator
- * @package sapphire
- */
-class GridFieldPresenter extends ViewableData {
-
- /**
- * Template override
- *
- * @var string $template
- */
- protected $template = 'GridFieldPresenter';
-
- /**
- * Class name for each item/row
- *
- * @var string $itemClass
- */
- protected $itemClass = 'GridFieldPresenter_Item';
-
- /**
- * @var GridField
- */
- protected $GridField = null;
-
- /**
- * @var array
- */
- public $fieldCasting = array();
-
- /**
- * @var array
- */
- public $fieldFormatting = array();
-
- /**
- * List of columns and direction that the {@link GridFieldPresenter} is
- * sorted in.
- *
- * @var array
- */
- protected $sorting = array();
-
- /**
- * @param string $template
- */
- public function setTemplate($template){
- $this->template = $template;
- }
-
- /**
- * The name of the Field
- *
- * @return string
- */
- public function getName() {
- return $this->getGridField()->getName();
- }
-
- /**
- * @param GridField $GridField
- */
- public function setGridField(GridField $grid){
- $this->GridField = $grid;
- }
-
- /**
- * @return GridField
- */
- public function getGridField(){
- return $this->GridField;
- }
-
- /**
- *
- * @param type $extension
- */
- public static function add_extension($extension) {
- parent::add_extension(__CLASS__, $extension);
- }
-
- /**
- * Sort the grid by columns
- *
- * @param string $column
- * @param string $direction
- */
- public function sort($column, $direction = 'asc') {
- $this->sorting[$column] = $direction;
-
- return $this;
- }
-
- /**
- * Return an {@link ArrayList} of {@link GridField_Item} objects, suitable for display in the template.
- *
- * @return ArrayList
- */
- public function Items() {
- $items = new ArrayList();
-
- if($this->sorting) {
- $this->setSortingOnList($this->sorting);
- }
- //empty for now
- $list = $this->getGridField()->getList();
-
- $parameters = new stdClass();
- $parameters->Controller = Controller::curr();
- $parameters->Request = Controller::curr()->getRequest();
-
- $this->extend('filterList', $list, $parameters);
-
- if($list) {
- $numberOfRows = $list->count();
- $counter = 0;
- foreach($list as $item) {
- $itemPresenter = new $this->itemClass($item, $this);
- $itemPresenter->iteratorProperties($counter++, $numberOfRows);
- $items->push($itemPresenter);
- }
- }
- return $items;
- }
-
- /**
- * Get the headers or column names for this grid
- *
- * The returning array will have the format of
- *
- *
- * array(
- * 'FirstName' => 'First name',
- * 'Description' => 'A nice description'
- * )
- *
- *
- * @return ArrayList
- * @throws Exception
- */
- public function Headers() {
- if(!$this->getList()) {
- throw new LogicException(sprintf(
- '%s needs an data source to be able to render the form', get_class($this->getGridField())
- ));
- }
- return $this->summaryFieldsToList($this->FieldList());
- }
-
- /**
- *
- * @return ArrayList
- */
- public function Footers() {
- $arrayList = new ArrayList();
- $footers = $this->extend('Footer');
- foreach($footers as $footer) {
- $arrayList->push($footer);
- }
- return $arrayList;
- }
-
- /**
- * @return SS_List
- */
- public function getList() {
- return $this->getGridField()->getList();
- }
-
- /**
- * @return string - name of model
- */
- protected function getModelClass() {
- return $this->getGridField()->getModelClass();
- }
-
- /**
- * Add the combined sorting on the datasource
- *
- * If the sorting isn't set in the datasource, only the latest sort
- * will be executed.
- *
- * @param array $sortColumns
- */
- protected function setSortingOnList(array $sortColumns) {
- $resultColumns = array();
-
- foreach($sortColumns as $column => $sortOrder) {
- $resultColumns[] = sprintf("%s %s", $column ,$sortOrder);
- }
-
- $sort = implode(', ', $resultColumns);
- $this->getList()->sort($sort);
- }
-
- /**
- * @return array
- */
- public function FieldList() {
- return singleton($this->getModelClass())->summaryFields();
- }
-
- /**
- * Translate the summaryFields from a model into a format that is understood
- * by the Form renderer
- *
- * @param array $summaryFields
- *
- * @return ArrayList
- */
- protected function summaryFieldsToList($summaryFields) {
- $headers = new ArrayList();
-
- if(is_array($summaryFields)) {
- $counter = 0;
-
- foreach ($summaryFields as $name => $title) {
- $data = array(
- 'Name' => $name,
- 'Title' => $title,
- 'IsSortable' => true,
- 'IsSorted' => false,
- 'SortedDirection' => 'asc'
- );
-
- if(array_key_exists($name, $this->sorting)) {
- $data['IsSorted'] = true;
- $data['SortedDirection'] = $this->sorting[$name];
- }
-
- $result = new ArrayData($data);
- $result->iteratorProperties($counter++, count($summaryFields));
-
- $headers->push($result);
- }
- }
-
- return $headers;
- }
-
- /**
- * @param array $casting
- */
- function setFieldCasting($casting) {
- $this->fieldCasting = $casting;
- }
-
- /**
- *
- * @param type $formatting
- */
- function setFieldFormatting($formatting) {
- $this->fieldFormatting = $formatting;
- }
-
- /**
- * @return string - html
- */
- function render(){
- return $this->renderWith(array($this->template));
- }
-}
-
-/**
- * A single record in a GridField.
- *
- * @package sapphire
- * @see GridField
- */
-class GridFieldPresenter_Item extends ViewableData {
-
- /**
- * @var Object The underlying record, usually an element of
- * {@link GridField->datasource()}.
- */
- protected $item;
-
- /**
- * @var GridFieldPresenter
- */
- protected $parent;
-
- /**
- * @param Object $item
- * @param GridFieldPresenter $parent
- */
- public function __construct($item, $parent) {
- $this->failover = $this->item = $item;
- $this->parent = $parent;
-
- parent::__construct();
- }
-
- /**
- * @return int
- */
- public function ID() {
- return $this->item->ID;
- }
-
- /**
- * @return type
- */
- public function Parent() {
- return $this->parent;
- }
-
-
- /**
- * @param bool $xmlSafe
- *
- * @return ArrayList
- */
- public function Fields($xmlSafe = true) {
- $list = $this->parent->FieldList();
- $counter = 0;
-
- foreach($list as $fieldName => $fieldTitle) {
- $value = "";
-
- // TODO Delegates that to DataList
- // This supports simple FieldName syntax
- if(strpos($fieldName,'.') === false) {
- $value = ($this->item->XML_val($fieldName) && $xmlSafe) ? $this->item->XML_val($fieldName) : $this->item->RAW_val($fieldName);
-
- // This support the syntax fieldName = Relation.RelatedField
- } else {
- $fieldNameParts = explode('.', $fieldName) ;
- $tmpItem = $this->item;
-
- for($j=0;$j