Adding TextArea to admin interface elements
authorChuck Scott <cscott@gaslightmedia.com>
Fri, 21 Jun 2019 15:46:06 +0000 (11:46 -0400)
committerChuck Scott <cscott@gaslightmedia.com>
Fri, 21 Jun 2019 15:46:06 +0000 (11:46 -0400)
views/adminServerStatsConfig.html
views/ui/f6/text.html
views/ui/f6/textarea.html

index 8d37a90..5f90b66 100755 (executable)
                     'field'         => 'cookie_message',
                     'label'         => 'Cookies Notice Text',
                     'required'      => true,
-                    'height'        => 100
+                    'height'        => 50,
+                    'rows'          => 5,
+                    'maxwidth'      => '900px'
                 ]}
                 {include file="ui/f6/textarea.html"}
 
index 87c5474..bd8aee2 100644 (file)
@@ -13,7 +13,7 @@
         'label'         => string   Label text for this field,
         'placeholder'   => string   Placeholder string,
         'required'      => boolean  True if required,
-        'maxwidth'      => integer  Size of input field in characters,
+        'maxwidth'      => string   Size of input field using standard style notation ('900px', '15rem', ...),
         'maxlength'     => integer  Maximum number of characters that may be entered,
         'helptext'      => string   Help text for this input,
         'errtext'       => string   Error text that appears when the field doesn't validate
@@ -44,7 +44,7 @@
                         {if $fieldData.required}required{/if}
                         {if isset($fieldData.helptext)}aria-describedby="{$fieldData.field}_HelpText"{/if}
                         {if isset($fieldData.required)}required{/if} placeholder="{$fieldData.placeholder}"
-                        {if isset($fieldData.maxwidth)}style="max-width: {$fieldData.maxwidth}rem"{/if}
+                        {if isset($fieldData.maxwidth)}style="max-width: {$fieldData.maxwidth}"{/if}
                         {if isset($fieldData.maxlength)}max-length="{$fieldData.maxwidth}"{/if}
                     />
                     {if isset($fieldData.helptext)}<p class="help-text" id="{$fieldData.field}_HelpText">{$fieldData.helptext}</p>{/if}
index 6b77350..4598d5c 100644 (file)
@@ -13,7 +13,8 @@
         'label'         => string   Label text for this field,
         'placeholder'   => string   Placeholder string,
         'required'      => boolean  True if required,
-        'maxwidth'      => integer  Size of input field in characters,
+        'maxwidth'      => string   Size of input field using standard style notation ('900px', '15rem', ...),
+
         'maxlength'     => integer  Maximum number of characters that may be entered,
         'helptext'      => string   Help text for this input,
         'errtext'       => string   Error text that appears when the field doesn't validate
     {else} {* Using simple field *}
             <div class="small-12 columns">
                 <label class="{if $fieldData.required} glm-required{/if}">{$fieldData.label}:
-                        {wp_editor(
-                            ${$fieldData.field},
-                            $fieldData.field,
-                            json_decode('{
+                    <div
+                        {if isset($fieldData.maxwidth)}style="width: {$fieldData.maxwidth} !important;"{/if}
+                    >
+                            {$editorOptions = '
+                                {
                                 "media_buttons":    false,
-                                "quicktags":        false,
-                                "textarea_name":    "cookie_message",
-                                "editor_height":    50
-                            }', true)
-                        )}
-                    {if isset($fieldData.helptext)}<p class="help-text" id="{$fieldData.field}_HelpText">{$fieldData.helptext}</p>{/if}
-                    {if isset($fieldData.errortext)}<span class="form-error">{$fieldData.errortext}</span>{/if}
+                                "quicktags":        false'
+                            }
+                            {if isset($fieldData.height)}{$editorOptions = $editorOptions|cat:',
+                                "editor_height":    '|cat:$fieldData.height}{/if}
+                            {if isset($fieldData.rows)}{$editorOptions = $editorOptions|cat:',
+                                "textarea_rows":    '|cat:$fieldData.rows}{/if}
+                            {$editorOptions = $editorOptions|cat:'
+                                }'}
+                            {wp_editor(
+                                ${$fieldData.field},
+                                $fieldData.field,
+                                json_decode($editorOptions, true)
+                            )}
+
+                        {if isset($fieldData.helptext)}<p class="help-text" id="{$fieldData.field}_HelpText">{$fieldData.helptext}</p>{/if}
+                        {if isset($fieldData.errortext)}<span class="form-error">{$fieldData.errortext}</span>{/if}
+                    </div>
                 </label>
             </div>
     {/if}