tweaks to templates/styles feature

sheadawson · Jun 24, 2016 · 4e699ff · 4e699ff
1 parent 6ba8061
commit 4e699ff
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 86 deletions.
diff --git a/README.md b/README.md
@@ -50,51 +50,25 @@ In your template, you can render the links anchor tag with
 $ExampleLink
 ```
 
-### Custom links/tags
+### Customising link templates
 
-Roll your own tag, making sure that the url is set first to avoid broken links
+Link tags are rendered with the Link.ss template. You can override this template by copying it into your theme or project folder and modifying as required.
 
-```html
-<% if $ExampleLink.LinkURL %>
-	<% with ExampleLink %>
-		<a href='{$LinkURL}'{$TargetAttr}{$ClassAttr}>{$Title}</a>
-	<% end_with %>
-<% end_if %>
-```
-
-### Reusable custom link styles/tags
-
-Create a .ss file with the name Link_example.ss (replace "example" with your style name).
-
-Link_iconbutton.ss
+You can also specify a custom template to render any Link with by calling the renderWith function and passing in the name of your custom template
 
 ```html
-<a href='{$LinkURL}'{$TargetAttr}{$ClassAttr}>
-    <i class="fa fa-github" aria-hidden="true"></i>{$Title}
-</a>
+$ExampleLink.renderWith(Link_button)
 ```
 
-In your template, you can set the style to use by adding setStyle()
+Finally, you can optionally offer CMS users the ability to select from a list of templates, allowing them to choose how their Link should be rendered. To enable this feature, create your custom template files and register them in your site config.yml file as below.
 
-```html
-$ExampleLink.setStyle('iconbutton')
-```
-
-### Selectable link styles
-
-You can create styles for an administrator to select in a dropdown field.
-To add these styles in to the dropdown, define them in your site config.yaml file.
-
-```yaml
+```YAML
 Link:
-  styles:
-    button: Button
-    iconbutton: Description of button
+  templates:
+    button: Description of button template # looks for Link_button.ss template
+    iconbutton: Description of iconbutton template # looks for  Link_iconbutton.ss template
 ```
 
-The example above will be rendered in Link_button.ss and Link_iconbutton.ss if available.
-If the template isn't available it will fall back by adding the style as a class to Link.ss
-
 ## EmbeddedObject/Field
 
 Use the EmbeddedObject/Field to easily add oEmbed content to a DataObject or Page.

diff --git a/code/dataobjects/Link.php b/code/dataobjects/Link.php
@@ -9,11 +9,6 @@
  **/
 class Link extends DataObject
 {
-    /**
-     * @var string custom style for templates e.g Link_Button
-     */
-    protected $style;
-
     /**
      * @var string custom CSS classes for template
      */
@@ -30,7 +25,7 @@ class Link extends DataObject
         'Phone' => 'Varchar(255)',
         'Anchor' => 'Varchar(255)',
         'OpenInNewWindow' => 'Boolean',
-        'SelectedStyle' => 'Varchar(255)'
+        'Template' => 'Varchar(255)'
     );
 
     /**
@@ -51,12 +46,12 @@ class Link extends DataObject
     );
 
     /**
-     * A map of styles that are available for templating
-     * Custom styles can be added to this
+     * A map of templates that are available for rendering
+     * Link objects with
      *
      * @var array
      */
-    private static $styles = array();
+    private static $templates = array();
 
     /**
      * A map of object types that can be linked to
@@ -90,23 +85,23 @@ public function getCMSFields()
                 // seem to need to remove both of these for different SS versions...
                 'FileID',
                 'File',
-                'SelectedStyle',
+                'Template',
                 'Anchor'
             )
         );
 
-        $styles = $this->config()->get('styles');
-        if ($styles) {
-            $i18nStyles = array();
-            foreach ($styles as $key => $label) {
-                $i18nStyles[$key] = _t('Linkable.STYLE'.strtoupper($key), $label);
+        $templates = $this->config()->get('templates');
+        if ($templates) {
+            $i18nTemplates = array();
+            foreach ($templates as $key => $label) {
+                $i18nTemplates[$key] = _t('Linkable.STYLE'.strtoupper($key), $label);
             }
             $fields->addFieldToTab(
                 'Root.Main',
                 DropdownField::create(
-                    'Style',
-                    _t('Linkable.LINKSTYLE', 'Style'),
-                    $i18nStyles
+                    'Template',
+                    _t('Linkable.STYLE', 'Style'),
+                    $i18nTemplates
                 )->setEmptyString('Default')
             );
         }
@@ -226,18 +221,6 @@ public function onAfterWrite()
         }
     }
 
-    /**
-     * Add style to be used in CSS class and use template if its available
-     *
-     * @param string $style CSS class.
-     * @return Link
-     **/
-    public function setStyle($style)
-    {
-        $this->style = $style;
-        return $this;
-    }
-
     /**
      * Add CSS classes.
      *
@@ -260,12 +243,12 @@ public function forTemplate()
         if ($this->LinkURL) {
             $link = $this->renderWith(
                 array(
-                    'Link_'.$this->Style, // Render link with this template if its found. eg Link_Button.ss
+                    'Link_' . $this->Template, // Render link with this template if its found. eg Link_button.ss
                     'Link'
                 )
             );
 
-            // Redundent. Reccommended to use templating above.
+            // Legacy. Reccommended to use templating above.
             $this->extend('updateLinkTemplate', $this, $link);
 
             return $link;
@@ -304,20 +287,6 @@ public function getLinkURL()
         }
     }
 
-    /**
-     * Gets the style
-     *
-     * @return string
-     **/
-    public function getStyle()
-    {
-        $style = $this->SelectedStyle ? : null;
-        if ($this->style) {
-            $style = Convert::raw2att($this->style);
-        }
-        return $style;
-    }
-
     /**
      * Gets the classes for this link.
      *
@@ -326,9 +295,6 @@ public function getStyle()
     public function getClasses()
     {
         $classes = explode(' ', $this->cssClass);
-        if ($this->Style) {
-            $classes[] = $this->Style;
-        }
         $this->extend('updateClasses', $classes);
         $classes = implode(' ', $classes);
         return $classes;
@@ -382,7 +348,7 @@ protected function validate()
             case 'URL':
             case 'Email':
             case 'Phone':
-                if ($this->{$type} =='') {
+                if ($this->{$type} == '') {
                     $valid = false;
                     $message = _t('Linkable.VALIDATIONERROR_EMPTY'.strtoupper($type), "You must enter a $type for a link type of \"$type\"");
                 }

diff --git a/templates/Link.ss b/templates/Link.ss
@@ -1 +1,3 @@
-<a href='{$LinkURL}'{$TargetAttr}{$ClassAttr}>{$Title}</a>
+<% if $LinkURL %>
+    <a href="$LinkURL"{$TargetAttr}$ClassAttr>$Title</a>
+<% end_if %>