From 35fb0cd0c554f83ee5ff98199d09d867a65d7a88 Mon Sep 17 00:00:00 2001 From: Ingo Schommer Date: Sun, 21 Oct 2007 23:05:46 +0000 Subject: [PATCH] #92 MoreLessField: Switch to ToggleField and remove FEATURE Refactored MoreLessField->ToggleField FEATURE Refactored TogglePanel->ToggleCompositeField FEATURE Degrading gracefully (javascript), using behaviour+classes+prototype, partially i18ned, improved markup git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/sapphire/trunk@43660 467b73ca-7a2a-4603-9d3b-597d59a354a9 --- core/model/SiteTree.php | 2 +- core/model/Translatable.php | 14 +++-- forms/MoreLessField.php | 60 ------------------ forms/ToggleCompositeField.php | 51 +++++++++++++++ forms/ToggleField.php | 99 ++++++++++++++++++++++++++++++ forms/TogglePanel.php | 41 ------------- javascript/ToggleCompositeField.js | 26 ++++++++ javascript/ToggleField.js | 29 +++++++++ javascript/TogglePanel.js | 17 ----- templates/ToggleCompositeField.ss | 12 ++++ templates/TogglePanel.ss | 10 --- 11 files changed, 228 insertions(+), 133 deletions(-) delete mode 100755 forms/MoreLessField.php create mode 100755 forms/ToggleCompositeField.php create mode 100755 forms/ToggleField.php delete mode 100755 forms/TogglePanel.php create mode 100755 javascript/ToggleCompositeField.js create mode 100644 javascript/ToggleField.js delete mode 100755 javascript/TogglePanel.js create mode 100755 templates/ToggleCompositeField.ss delete mode 100755 templates/TogglePanel.ss diff --git a/core/model/SiteTree.php b/core/model/SiteTree.php index 46708deae..4962ce314 100644 --- a/core/model/SiteTree.php +++ b/core/model/SiteTree.php @@ -1003,7 +1003,7 @@ class SiteTree extends DataObject { new TextField("MetaTitle", "Title"), new TextareaField("MetaDescription", "Description"), new TextareaField("MetaKeywords", "Keywords"), - new TogglePanel("Advanced Options...",array( + new ToggleCompositeField("Advanced Options...",array( new TextareaField("ExtraMeta","Custom Meta Tags"), new LiteralField("", "

Manually specify a Priority for this page: (valid values are from 0 to 1, a zero will remove this page from the index)

"), new NumericField("Priority","Page Priority")), diff --git a/core/model/Translatable.php b/core/model/Translatable.php index b43ffc37f..5dfaac38c 100755 --- a/core/model/Translatable.php +++ b/core/model/Translatable.php @@ -619,15 +619,20 @@ class Translatable extends DataObjectDecorator { $tasks = array( 'dup' => array(), ); - foreach ($fields as $field) { + foreach($fields as $field) { if ($field->isComposite()) { $innertasks = $this->duplicateOrReplaceFields($field->FieldSet()); $tasks['dup'] = array_merge($tasks['dup'],$innertasks['dup']); } - else if (($fieldname = $field->Name()) && array_key_exists($fieldname,$this->original_values)) { + else if(($fieldname = $field->Name()) && array_key_exists($fieldname,$this->original_values)) { // Get a copy of the original field to show the untranslated value - if (is_subclass_of($field->class,'TextareaField')) $nonEditableField = new MoreLessField($fieldname,$field->Title(),'','+','-'); - else $nonEditableField = $field->performDisabledTransformation(); + if(is_subclass_of($field->class,'TextareaField')) { + $nonEditableField = new ToggleField($fieldname,$field->Title(),'','+','-'); + $nonEditableField->labelMore = '+'; + $nonEditableField->labelLess = '-'; + } else { + $nonEditableField = $field->performDisabledTransformation(); + } $nonEditableField_holder = new CompositeField($nonEditableField); $nonEditableField_holder->setName($fieldname.'_holder'); @@ -736,3 +741,4 @@ class Translatable extends DataObjectDecorator { } } +?> \ No newline at end of file diff --git a/forms/MoreLessField.php b/forms/MoreLessField.php deleted file mode 100755 index c1ad8670e..000000000 --- a/forms/MoreLessField.php +++ /dev/null @@ -1,60 +0,0 @@ -moreText = $moreText; - $this->lessText = $lessText; - $this->charNum = $chars; - parent::__construct($name, $title, $value); - } - - function Field() { - $valforInput = $this->value ? Convert::raw2att($this->value) : ""; - $rawInput = Convert::html2raw($valforInput); - if ($this->charNum) $reducedVal = substr($rawInput,0,$this->charNum); - else $reducedVal = ereg_replace('([^\.]\.)[[:space:]].*','\\1',$rawInput); - if (strlen($reducedVal) < strlen($rawInput)) { - return <<$reducedVal - $this->moreText - - -
-HTML; - } else { - $this->dontEscape = true; - return parent::Field(); - } - } - - function setMoreText($moreText) { - $this->moreText = $moreText; - } - - function setLessText($lessText) { - $this->lessText = $lessText; - } - -} - -?> \ No newline at end of file diff --git a/forms/ToggleCompositeField.php b/forms/ToggleCompositeField.php new file mode 100755 index 000000000..3cdfe60bb --- /dev/null +++ b/forms/ToggleCompositeField.php @@ -0,0 +1,51 @@ +title = $title; + $this->name = ereg_replace('[^A-Za-z0-9]','',$this->title); + + $this->startClosed(true); + + parent::__construct($children); + } + + public function FieldHolder() { + Requirements::javascript("jsparty/prototype.js"); + Requirements::javascript("jsparty/behaviour.js"); + Requirements::javascript("jsparty/prototype_improvements.js"); + Requirements::javascript("sapphire/javascript/ToggleCompositeField.js"); + + return $this->renderWith("ToggleCompositeField"); + } + + /** + * Determines if the field should render open or closed by default. + * + * @param boolean + */ + public function startClosed($bool) { + ($bool) ? $this->addExtraClass('startClosed') : $this->removeExtraClass('startClosed'); + } + + /** + * @return String + */ + public function HeadingLevel() { + return $this->headingLevel; + } + + public function Type() { + return ' toggleCompositeField'; + } +} + +?> \ No newline at end of file diff --git a/forms/ToggleField.php b/forms/ToggleField.php new file mode 100755 index 000000000..7c05f73f8 --- /dev/null +++ b/forms/ToggleField.php @@ -0,0 +1,99 @@ +labelMore = _t('ToggleField.MORE', 'more'); + $this->labelLess = _t('ToggleField.LESS', 'less'); + + $this->startClosed(true); + + parent::__construct($name, $title, $value); + } + + function Field() { + $content = ''; + + Requirements::javascript("jsparty/prototype.js"); + Requirements::javascript("jsparty/behaviour.js"); + Requirements::javascript("jsparty/prototype_improvements.js"); + Requirements::javascript("sapphire/javascript/ToggleField.js"); + + if($this->startClosed) $this->addExtraClass('startClosed'); + + $valforInput = $this->value ? Convert::raw2att($this->value) : ""; + $rawInput = Convert::html2raw($valforInput); + + if($this->charNum) $reducedVal = substr($rawInput,0,$this->charNum); + else $reducedVal = DBField::create('Text',$rawInput)->{$this->truncateMethod}(); + + // only create togglefield if the truncated content is shorter + if(strlen($reducedVal) < strlen($rawInput)) { + $content = << + $reducedVal +  $this->labelMore + +
+ $this->value +  $this->labelLess +
+
+ +HTML; + } else { + $this->dontEscape = true; + $content = parent::Field(); + } + + return $content; + } + + /** + * Determines if the field should render open or closed by default. + * + * @param boolean + */ + public function startClosed($bool) { + ($bool) ? $this->addExtraClass('startClosed') : $this->removeExtraClass('startClosed'); + } + + function Type() { + return "toggleField"; + } +} + +?> \ No newline at end of file diff --git a/forms/TogglePanel.php b/forms/TogglePanel.php deleted file mode 100755 index b40246b48..000000000 --- a/forms/TogglePanel.php +++ /dev/null @@ -1,41 +0,0 @@ -title = $title; - $this->closed = $startClosed; - $this->name = ereg_replace('[^A-Za-z0-9]','',$this->title); - parent::__construct($children); - } - - public function FieldHolder() { - Requirements::javascript("jsparty/prototype.js"); - Requirements::javascript("jsparty/behaviour.js"); - Requirements::javascript("jsparty/prototype_improvements.js"); - Requirements::javascript("sapphire/javascript/TogglePanel.js"); - - return $this->renderWith("TogglePanel"); - } - - public function setClosed($closed) { - $this->closed = $closed; - } - public function getClosed() { - return $this->closed; - } - - public function ClosedClass() { - if($this->closed) return " closed"; - } - public function ClosedStyle() { - if($this->closed) return "style=\"display: none\""; - } - -} - -?> \ No newline at end of file diff --git a/javascript/ToggleCompositeField.js b/javascript/ToggleCompositeField.js new file mode 100755 index 000000000..a79edf6ed --- /dev/null +++ b/javascript/ToggleCompositeField.js @@ -0,0 +1,26 @@ +var ToggleCompositeField = Class.create(); +ToggleCompositeField.prototype = { + initialize: function() { + var rules = {}; + rules['#' + this.id + ' .trigger'] = { + onclick: function(e) { + this.toggle(); + Event.stop(e); return false; + }.bind(this) + }; + Behaviour.register(rules); + + // close content by default + if(Element.hasClassName(this, 'startClosed')) { + Element.toggle($$('#' + this.id + ' .contentMore')[0]); + } + Element.toggle($$('#' + this.id + ' .triggerClosed')[0]); + }, + + toggle: function() { + Element.toggle($$('#' + this.id + ' .contentMore')[0]); + Element.toggle($$('#' + this.id + ' .triggerClosed')[0]); + Element.toggle($$('#' + this.id + ' .triggerOpened')[0]); + } +} +ToggleCompositeField.applyTo('div.toggleCompositeField'); \ No newline at end of file diff --git a/javascript/ToggleField.js b/javascript/ToggleField.js new file mode 100644 index 000000000..de660b232 --- /dev/null +++ b/javascript/ToggleField.js @@ -0,0 +1,29 @@ +var ToggleField = Class.create(); +ToggleField.prototype = { + initialize: function() { + var rules = {}; + rules['#' + this.id + ' .triggerMore'] = { + onclick: function(e) { + this.toggle(); + Event.stop(e); return false; + }.bind(this) + }; + rules['#' + this.id + ' .triggerLess'] = { + onclick: function(e) { + this.toggle(); + Event.stop(e); return false; + }.bind(this) + }; + Behaviour.register(rules); + + if(Element.hasClassName(this, 'startClosed')) { + this.toggle(); + } + }, + + toggle: function() { + Element.toggle($$('#' + this.id + ' .contentLess')[0]); + Element.toggle($$('#' + this.id + ' .contentMore')[0]); + } +} +ToggleField.applyTo('div.toggleField'); \ No newline at end of file diff --git a/javascript/TogglePanel.js b/javascript/TogglePanel.js deleted file mode 100755 index 70080bda5..000000000 --- a/javascript/TogglePanel.js +++ /dev/null @@ -1,17 +0,0 @@ -Behaviour.register({ - 'h2.TogglePanelHeader' : { - onclick : function() { - var contentDiv = $('panel_' + this.id); - var toggleID = this.id.replace('panel_','') + '_toggle'; - Element.toggle(toggleID + '_closed'); - Element.toggle(toggleID + '_open'); - if(contentDiv.style.display == 'none') { - contentDiv.style.display = ''; - Element.removeClassName(this, 'closed'); - } else { - contentDiv.style.display = 'none'; - Element.addClassName(this, 'closed'); - } - } - } -}); \ No newline at end of file diff --git a/templates/ToggleCompositeField.ss b/templates/ToggleCompositeField.ss new file mode 100755 index 000000000..a76cc1cd6 --- /dev/null +++ b/templates/ToggleCompositeField.ss @@ -0,0 +1,12 @@ +
+ + + + $Title + +
+ <% control FieldSet %> + $FieldHolder + <% end_control %> +
+
\ No newline at end of file diff --git a/templates/TogglePanel.ss b/templates/TogglePanel.ss deleted file mode 100755 index f48cb2eee..000000000 --- a/templates/TogglePanel.ss +++ /dev/null @@ -1,10 +0,0 @@ -

- + - - $Title -

-
-<% control FieldSet %> -$FieldHolder -<% end_control %> -
\ No newline at end of file