747 lines
27 KiB
PHP
747 lines
27 KiB
PHP
|
<?php namespace ProcessWire;
|
||
|
|
|
||
|
|
if(!defined("PROCESSWIRE")) die();
|
||
|
|
|
||
|
|
class AdminThemeUikitConfigHelper extends Wire {
|
||
|
|
|
||
|
|
/**
|
||
|
|
* @var AdminThemeUikit
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
protected $adminTheme;
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Construct
|
||
|
|
*
|
||
|
|
* @param AdminThemeUikit $adminTheme
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
public function __construct(AdminThemeUikit $adminTheme) {
|
||
|
|
$this->adminTheme = $adminTheme;
|
||
|
|
$adminTheme->wire($this);
|
||
|
|
parent::__construct();
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Implementation for Uikit admin theme getConfigInputfields method for module config
|
||
|
|
*
|
||
|
|
* @param InputfieldWrapper $inputfields
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
public function configModule(InputfieldWrapper $inputfields) {
|
||
|
|
|
||
|
|
$adminTheme = $this->adminTheme;
|
||
|
|
$defaultFileNote = $this->_('When blank, the default file used.') . ' ';
|
||
|
|
$defaultFileDesc = $this->_('Enter path relative to homepage URL.');
|
||
|
|
$recommendedLabel = $this->_('(RECOMMENDED)');
|
||
|
|
$experimentalLabel = $this->_('(EXPERIMENTAL)');
|
||
|
|
$exampleLabel = $this->_('example');
|
||
|
|
|
||
|
|
/** @var modules $modules */
|
||
|
|
$modules = $this->wire('modules');
|
||
|
|
|
||
|
|
/** @var Session $session */
|
||
|
|
$session = $this->wire('session');
|
||
|
|
$layout = $adminTheme->layout;
|
||
|
|
$userTemplateURL = $this->wire('config')->urls->admin . 'setup/template/edit?id=3';
|
||
|
|
|
||
|
|
/** @var InputfieldFieldset $fieldset */
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->label = $this->_('Masthead + navigation');
|
||
|
|
$fieldset->icon = 'navicon';
|
||
|
|
$fieldset->set('themeOffset', true);
|
||
|
|
$fieldset->collapsed = Inputfield::collapsedYes;
|
||
|
|
$inputfields->add($fieldset);
|
||
|
|
|
||
|
|
/** @var InputfieldSelect $f */
|
||
|
|
$f = $modules->get('InputfieldSelect');
|
||
|
|
$f->attr('name', 'userAvatar');
|
||
|
|
$f->label = $this->_('User avatar');
|
||
|
|
$f->icon = 'user-circle';
|
||
|
|
$f->addOption('gravatar', $this->_('Gravatar (external service that determines avatar from email)'));
|
||
|
|
$f->description = $this->_('Select an image field, Gravatar, or icon to show for the user avatar in the masthead.');
|
||
|
|
$numImgFields = 0;
|
||
|
|
foreach($modules->wire('templates')->get('user')->fieldgroup as $field) {
|
||
|
|
if(!$field->type instanceof FieldtypeImage) continue;
|
||
|
|
$f->addOption("$field->id:$field->name", sprintf($this->_('Image field: %s'), $field->name));
|
||
|
|
$numImgFields++;
|
||
|
|
}
|
||
|
|
if(!$numImgFields) {
|
||
|
|
$f->notes = $this->_('There are no image fields present on the “user” template at present, so only icons and Gravatar are shown.') . ' ';
|
||
|
|
}
|
||
|
|
$f->notes .= sprintf($this->_('You may add image fields to your user template [here](%s).'), $userTemplateURL);
|
||
|
|
|
||
|
|
$icons = array(
|
||
|
|
'user-circle',
|
||
|
|
'user-circle-o',
|
||
|
|
'user',
|
||
|
|
'user-o',
|
||
|
|
'user-secret',
|
||
|
|
'vcard',
|
||
|
|
'vcard-o',
|
||
|
|
'child',
|
||
|
|
'female',
|
||
|
|
'male',
|
||
|
|
'paw',
|
||
|
|
);
|
||
|
|
foreach($icons as $icon) {
|
||
|
|
$f->addOption("icon.$icon", sprintf($this->_('Icon: %s'), $icon));
|
||
|
|
}
|
||
|
|
$f->attr('value', $adminTheme->get('userAvatar'));
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldText $f */
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', 'userLabel');
|
||
|
|
$f->label = $this->_('User navigation label format');
|
||
|
|
$f->icon = 'user-circle';
|
||
|
|
$f->description =
|
||
|
|
$this->_('This label appears next to the user avatar image/icon.') . ' ' .
|
||
|
|
$this->_('Specify field(s) and format to use for the user label, or blank for no user label.') . ' ' .
|
||
|
|
sprintf($this->_('Use any fields/properties from your [user](%s) template surrounded in {brackets}.'), $userTemplateURL) . ' ' .
|
||
|
|
$this->_('Use {Name} for capitalized name, which is the default setting, or use {name} for lowercase name.');
|
||
|
|
$f->notes = $this->_('Examples: “{name}”, “{Name}”, “{title}”, “{first_name} {last_name}”, “{company.title}”, etc.');
|
||
|
|
$f->attr('value', $adminTheme->userLabel);
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldText $f */
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', 'logoURL');
|
||
|
|
$f->attr('value', $adminTheme->get('logoURL'));
|
||
|
|
$f->label = $this->_('Logo image file');
|
||
|
|
$f->description = $defaultFileDesc;
|
||
|
|
$f->notes = $defaultFileNote .
|
||
|
|
$this->_('File should be PNG, GIF, JPG or SVG, on transparent background, and at least 100px in both dimensions.') . ' ' .
|
||
|
|
sprintf($this->_('If using SVG, you may optionally append “?uk-svg” to URL to make it add the [uk-svg](%s) attribute.'), 'https://getuikit.com/docs/svg');
|
||
|
|
$f->collapsed = Inputfield::collapsedBlank;
|
||
|
|
$f->icon = 'file-image-o';
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'logoAction');
|
||
|
|
$f->label = $this->_('Logo click action');
|
||
|
|
$f->icon = 'mouse-pointer';
|
||
|
|
$f->addOption(0, $this->_('Admin root page list'));
|
||
|
|
$f->addOption(1, $this->_('Open offcanvas navigation'));
|
||
|
|
$f->attr('value', (int) $adminTheme->logoAction);
|
||
|
|
$f->collapsed = Inputfield::collapsedBlank;
|
||
|
|
$f->optionColumns = 1;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->label = $this->_('Layout + interface');
|
||
|
|
$fieldset->icon = 'newspaper-o';
|
||
|
|
$fieldset->collapsed = Inputfield::collapsedYes;
|
||
|
|
$fieldset->set('themeOffset', true);
|
||
|
|
$inputfields->add($fieldset);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('id+name', 'layout');
|
||
|
|
$f->label = $this->_('Layout type');
|
||
|
|
$f->addOption('', $this->_('Traditional with masthead navigation') .
|
||
|
|
' [span.detail] ' . $recommendedLabel . ' [/span]');
|
||
|
|
$opt = $this->_('Page tree navigation in sidebar');
|
||
|
|
$f->addOption('sidenav-tree', $opt . ' ' . $this->_('(left)') .
|
||
|
|
'* [span.detail] ' . $experimentalLabel . ' [/span]');
|
||
|
|
$f->addOption('sidenav-tree-alt', $opt . ' ' . $this->_('(right)') .
|
||
|
|
'* [span.detail] ' . $experimentalLabel . ' [/span]');
|
||
|
|
// $f->addOption('sidenav', $this->_('Sidebar navigation (left) + page tree navigation (right)'));
|
||
|
|
$f->attr('value', $layout);
|
||
|
|
$f->notes = $this->_('*Sidebar layouts not compatible with SystemNotifications module and may have issues with other modules.');
|
||
|
|
$f->columnWidth = 50;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$lastLayout = $session->getFor($adminTheme, 'lastLayout');
|
||
|
|
if($lastLayout != $layout) {
|
||
|
|
$o = '[script]';
|
||
|
|
if(strpos($layout, 'sidenav') === 0) {
|
||
|
|
$o .=
|
||
|
|
"if(typeof parent.isPresent != 'undefined') {" .
|
||
|
|
" parent.location.href = './?layout=sidenav-init';" .
|
||
|
|
"} else {" .
|
||
|
|
" window.location.href = './?layout=sidenav-init';" .
|
||
|
|
"}";
|
||
|
|
} else {
|
||
|
|
$o .=
|
||
|
|
"if(typeof parent.isPresent != 'undefined') {" .
|
||
|
|
" parent.location.href = './edit?name=$adminTheme->className';" .
|
||
|
|
"}";
|
||
|
|
}
|
||
|
|
$o .= '[/script]';
|
||
|
|
$f->appendMarkup = str_replace(array('[', ']'), array('<', '>'), $o);
|
||
|
|
}
|
||
|
|
|
||
|
|
if(empty($_POST)) $session->setFor($adminTheme, 'lastLayout', $layout);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('id+name', 'ukGrid');
|
||
|
|
$f->label = $this->_('Inputfield column widths');
|
||
|
|
$f->notes = $this->_('Choose option B if you are having any trouble achieving intended Inputfield column widths.');
|
||
|
|
$f->addOption(1, 'A: ' . $this->_('Uikit uk-width classes (up-to 6 columns)'));
|
||
|
|
$f->addOption(0, 'B: ' . $this->_('Percentage-based widths (additional flexibility)'));
|
||
|
|
$f->attr('value', (int) $adminTheme->get('ukGrid'));
|
||
|
|
$f->columnWidth = 50;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldInteger $f */
|
||
|
|
$f = $modules->get('InputfieldInteger');
|
||
|
|
$f->attr('name', 'maxWidth');
|
||
|
|
$f->label = $this->_('Maximum layout width');
|
||
|
|
$f->description = $this->_('Specify the maximum width of the layout (in pixels) or 0 for no maximum.');
|
||
|
|
$f->notes = $this->_('Applies to traditional layout only.');
|
||
|
|
$f->attr('value', $adminTheme->maxWidth);
|
||
|
|
$f->columnWidth = 50;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$testURL = $modules->wire('config')->urls->admin . 'profile/?test_notices';
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'groupNotices');
|
||
|
|
$f->label = $this->_('Notifications style');
|
||
|
|
$f->notes = $this->_('Does not apply if the SystemNotifications module is installed.');
|
||
|
|
$f->addOption(1, $this->_('Group by type with expand/collapse control') . " ([$exampleLabel]($testURL=group-on))");
|
||
|
|
$f->addOption(0, $this->_('Always show all') . " ([$exampleLabel]($testURL=group-off))");
|
||
|
|
$f->attr('value', (int) $adminTheme->groupNotices);
|
||
|
|
$f->columnWidth = 50;
|
||
|
|
$fieldset->appendMarkup .= "<script>$('#wrap_Inputfield_groupNotices .InputfieldContent').find('a').addClass('pw-modal');</script>";
|
||
|
|
/** @var JqueryUI $jQueryUI */
|
||
|
|
$jQueryUI = $modules->get('JqueryUI');
|
||
|
|
$jQueryUI->use('modal');
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$f = $inputfields->getChildByName('useAsLogin');
|
||
|
|
if($f) $f->collapsed = Inputfield::collapsedNo;
|
||
|
|
|
||
|
|
/** @var InputfieldFieldset $fieldset2 */
|
||
|
|
$fieldset2 = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset2->label = $this->_('Advanced');
|
||
|
|
$fieldset2->collapsed = Inputfield::collapsedBlank;
|
||
|
|
$fieldset2->description =
|
||
|
|
$this->_('Most advanced settings are available from the `$config->AdminThemeUikit` settings array.') . ' ' .
|
||
|
|
$this->_('You can find it in /wire/config.php. Copy to your /site/config.php file to modify it.');
|
||
|
|
$fieldset->add($fieldset2);
|
||
|
|
|
||
|
|
/** @var InputfieldText $f */
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', 'cssURL');
|
||
|
|
$f->attr('value', $adminTheme->get('cssURL'));
|
||
|
|
$f->label = $this->_('Primary CSS file');
|
||
|
|
$f->description = $defaultFileDesc . ' ' .
|
||
|
|
$this->_('We do not recommend changing this unless you are an admin theme developer.') . ' ' .
|
||
|
|
$this->_('Warning: this will override custom `$config->AdminThemeUikit` settings, base style and custom styles.');
|
||
|
|
$f->notes = $defaultFileNote . " " .
|
||
|
|
"[uikit.pw.css](" . $modules->wire('config')->urls('AdminThemeUikit') . "uikit/dist/css/uikit.pw.css)";
|
||
|
|
$f->icon = 'file-code-o';
|
||
|
|
$f->collapsed = Inputfield::collapsedBlank;
|
||
|
|
$fieldset2->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldFieldset $fieldset */
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->label = $this->_('Forms + input');
|
||
|
|
$fieldset->description =
|
||
|
|
$this->_('These settings affect all form fields in the admin.') . ' ' .
|
||
|
|
$this->_('Any of these settings (and others) may also be specified individually for a given field.') . ' ' .
|
||
|
|
$this->_('If you specify a setting here, it will override individual field settings.') . ' ' .
|
||
|
|
$this->_('See: Setup > Fields > [any field] > Input (tab) > Admin Theme Settings.');
|
||
|
|
$fieldset->icon = 'edit';
|
||
|
|
$fieldset->collapsed = Inputfield::collapsedYes;
|
||
|
|
$fieldset->set('themeOffset', true);
|
||
|
|
$inputfields->add($fieldset);
|
||
|
|
|
||
|
|
/** @var InputfieldMarkup $e1 */
|
||
|
|
$e1 = $modules->get('InputfieldMarkup');
|
||
|
|
$e1->label = $this->_('Input size examples');
|
||
|
|
$e1->columnWidth = 25;
|
||
|
|
|
||
|
|
/** @var InputfieldMarkup $e2 */
|
||
|
|
$e2 = $modules->get('InputfieldMarkup');
|
||
|
|
$e2->label = $this->_('Select size examples');
|
||
|
|
$e2->columnWidth = 25;
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'inputSize');
|
||
|
|
$f->label = $this->_('Default input size');
|
||
|
|
$f->description = $this->_('This affects the appearance of many text, textarea and select fields.');
|
||
|
|
$f->notes = $this->_('Not all Inputfields support the “small” or “large” options.');
|
||
|
|
$f->icon = 'expand';
|
||
|
|
$f->columnWidth = 50;
|
||
|
|
$sizes = array(
|
||
|
|
's' => array($this->_('Small'), 'uk-form-small'),
|
||
|
|
'm' => array($this->_('Medium (default/recommended)'), ''),
|
||
|
|
'l' => array($this->_('Large'), 'uk-form-large'),
|
||
|
|
);
|
||
|
|
foreach($sizes as $value => $info) {
|
||
|
|
$f->addOption($value, $info[0]);
|
||
|
|
$label = explode(' ', $info[0]);
|
||
|
|
$label = reset($label);
|
||
|
|
$e1->value .= "<div class='uk-margin-small'><input disabled class='uk-input $info[1]' value='$label' /></div>";
|
||
|
|
$e2->value .= "<div class='uk-margin-small'><select disabled class='uk-select $info[1]'><option>$label</option></select></div>";
|
||
|
|
}
|
||
|
|
$f->attr('value', $adminTheme->get('inputSize'));
|
||
|
|
$fieldset->add($f);
|
||
|
|
$fieldset->add($e1);
|
||
|
|
$fieldset->add($e2);
|
||
|
|
|
||
|
|
$types = $modules->findByPrefix('Inputfield');
|
||
|
|
ksort($types);
|
||
|
|
$skipTypes = array('Button', 'Submit', 'Form', 'Hidden');
|
||
|
|
foreach($types as $key => $name) {
|
||
|
|
$name = str_replace('Inputfield', '', $name);
|
||
|
|
if(in_array($name, $skipTypes)) {
|
||
|
|
unset($types[$key]);
|
||
|
|
} else {
|
||
|
|
$types[$key] = $name;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/** @var InputfieldAsmSelect $f */
|
||
|
|
$f = $modules->get('InputfieldAsmSelect');
|
||
|
|
$f->attr('name', 'noBorderTypes');
|
||
|
|
$f->label = $this->_('Input types that should have no border');
|
||
|
|
$f->description = $this->_('This setting applies to any selected types when used at 100% width.');
|
||
|
|
$f->icon = 'low-vision';
|
||
|
|
$f->set('themeOffset', true);
|
||
|
|
$f->collapsed = Inputfield::collapsedBlank;
|
||
|
|
foreach($types as $className => $name) {
|
||
|
|
$f->addOption($className, $name);
|
||
|
|
}
|
||
|
|
$f->attr('value', $adminTheme->noBorderTypes);
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldAsmSelect $f */
|
||
|
|
$f = $modules->get('InputfieldAsmSelect');
|
||
|
|
$f->attr('name', 'offsetTypes');
|
||
|
|
$f->label = $this->_('Input types that should be offset with additional top/bottom margin.');
|
||
|
|
$f->description = $this->_('As an example, the fields in this fieldset are using this option.');
|
||
|
|
$f->set('themeOffset', true);
|
||
|
|
$f->icon = 'arrows-v';
|
||
|
|
$f->collapsed = Inputfield::collapsedBlank;
|
||
|
|
foreach($types as $className => $name) {
|
||
|
|
$f->addOption($className, $name);
|
||
|
|
}
|
||
|
|
$f->attr('value', $adminTheme->offsetTypes);
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'toggleBehavior');
|
||
|
|
$f->label = $this->_('Inputfield label toggle behavior');
|
||
|
|
$f->icon = 'eye-slash';
|
||
|
|
$f->description =
|
||
|
|
$this->_('Inputfield elements in ProcessWire can have an open or closed state.') . ' ' .
|
||
|
|
$this->_('This setting determines what happens when a user clicks any Inputfield label, which appears as a header above the input.') . ' ' .
|
||
|
|
$this->_('The “Standard” option makes a click of a label on an open Inputfield focus the input element, a standard HTML form behavior.') . ' ' .
|
||
|
|
$this->_('While a click of a closed Inputfield label will open and then focus the Inputfield (and close it when clicked again).') . ' ' .
|
||
|
|
$this->_('The “Consistent” option makes the Inputfield label always behave consistently as an open/close toggle, regardless of what state the Inputfield is in.');
|
||
|
|
$f->notes = $this->_('Regardless of what setting you choose, the toggle icon in the upper right of each Inputfield always toggles the open/closed state.');
|
||
|
|
$f->addOption(0, $this->_('Standard'));
|
||
|
|
$f->addOption(1, $this->_('Consistent'));
|
||
|
|
$f->optionColumns = 1;
|
||
|
|
$f->val($adminTheme->toggleBehavior);
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldCheckboxes $f */
|
||
|
|
/*
|
||
|
|
$f = $modules->get('InputfieldCheckbox');
|
||
|
|
$f->attr('name', 'useOffset');
|
||
|
|
$f->label = $this->_('Vertically offset ALL input types?');
|
||
|
|
$f->description =
|
||
|
|
$this->_('When checked, a vertical margin is added to every field.') . ' ' .
|
||
|
|
$this->_('This may provide additional clarity in some cases, but consumes more vertical space.');
|
||
|
|
$f->collapsed = Inputfield::collapsedBlank;
|
||
|
|
$f->icon = 'arrows-v';
|
||
|
|
if($adminTheme->useOffset) $f->attr('checked', 'checked');
|
||
|
|
$fieldset->add($f);
|
||
|
|
*/
|
||
|
|
|
||
|
|
/** @var InputfieldAsmSelect $f */
|
||
|
|
/*
|
||
|
|
$f = $modules->get('InputfieldAsmSelect');
|
||
|
|
$f->attr('name', 'cardTypes');
|
||
|
|
$f->label = $this->_('Input types that should use the “Card” style');
|
||
|
|
$f->description = $this->_('This field is an example of the card style.');
|
||
|
|
$f->notes = $this->_('Does not apply to types selected to have no border.');
|
||
|
|
$f->icon = 'list-alt';
|
||
|
|
$f->set('themeBorder', 'card');
|
||
|
|
$f->set('themeOffset', true);
|
||
|
|
foreach($types as $className => $name) {
|
||
|
|
$f->addOption($className, $name);
|
||
|
|
}
|
||
|
|
$f->attr('value', $adminTheme->cardTypes);
|
||
|
|
$fieldset->add($f);
|
||
|
|
*/
|
||
|
|
|
||
|
|
if($this->wire('input')->get('tests')) {
|
||
|
|
$this->configTests($inputfields);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Uikit configuration for Inputfield
|
||
|
|
*
|
||
|
|
* @param Inputfield $inputfield
|
||
|
|
* @param InputfieldWrapper $inputfields
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
public function configInputfield(Inputfield $inputfield, InputfieldWrapper $inputfields) {
|
||
|
|
|
||
|
|
/** @var Inputfield $inputfield */
|
||
|
|
if($inputfield instanceof InputfieldWrapper) return;
|
||
|
|
if(!$inputfield->hasFieldtype || !$inputfield->hasField) return;
|
||
|
|
|
||
|
|
$field = $inputfield->hasField;
|
||
|
|
|
||
|
|
/** @var Modules $modules */
|
||
|
|
$modules = $this->wire('modules');
|
||
|
|
|
||
|
|
$autoLabel = $this->_('Auto');
|
||
|
|
$noneLabel = $this->_('None');
|
||
|
|
|
||
|
|
/** @var InputfieldFieldset $fieldsetVisibility */
|
||
|
|
$fieldsetVisibility = $inputfields->getChildByName('visibility');
|
||
|
|
if(!$fieldsetVisibility) return;
|
||
|
|
|
||
|
|
// if our fieldset is already present, remove it and add again (so that last added stays)
|
||
|
|
$test = $inputfields->getChildByName('_adminTheme');
|
||
|
|
if($test) $test->getParent()->remove($test);
|
||
|
|
|
||
|
|
/** @var InputfieldFieldset $fieldset */
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->attr('id+name', '_adminTheme');
|
||
|
|
$fieldset->label = $this->_('Admin theme settings') . ' ' .
|
||
|
|
'(' . str_replace('AdminTheme', '', $this->adminTheme->className()) . ')';
|
||
|
|
$fieldset->collapsed = Inputfield::collapsedYes;
|
||
|
|
$fieldset->icon = 'flask';
|
||
|
|
$fieldset->description =
|
||
|
|
$this->_('These settings affect how this field appears when used with the Uikit admin theme.') . ' ' .
|
||
|
|
$this->_('When choosing the “Auto” option, the settings will be determined at runtime.') . ' ' .
|
||
|
|
$this->_('The “Margin” setting applies only to 100% width fields.') . ' ' .
|
||
|
|
$this->_('The “Auto” option is the recommended default for all settings.');
|
||
|
|
$fieldsetParent = $fieldsetVisibility->getParent();
|
||
|
|
$fieldsetParent->insertAfter($fieldset, $fieldsetVisibility);
|
||
|
|
|
||
|
|
$xSmallLabel = $this->_('Extra small');
|
||
|
|
$smallLabel = $this->_('Small');
|
||
|
|
$mediumLabel = $this->_('Medium');
|
||
|
|
$largeLabel = $this->_('Large');
|
||
|
|
|
||
|
|
$isSelect1 = $inputfield instanceof InputfieldSelect && !$inputfield instanceof InputfieldHasArrayValue;
|
||
|
|
$isText1 = $inputfield instanceof InputfieldText && !$inputfield instanceof InputfieldTextarea;
|
||
|
|
$isTextarea = $inputfield instanceof InputfieldTextarea && !$inputfield instanceof InputfieldCKEditor;
|
||
|
|
$useInputSize = $isText1 || $isTextarea || $isSelect1;
|
||
|
|
$useInputWidth = $isText1 || $isSelect1;
|
||
|
|
|
||
|
|
if($useInputSize && $useInputWidth) {
|
||
|
|
$columnWidth = 20;
|
||
|
|
} else if($useInputSize || $useInputWidth) {
|
||
|
|
$columnWidth = 25;
|
||
|
|
} else {
|
||
|
|
$columnWidth = 33;
|
||
|
|
}
|
||
|
|
|
||
|
|
if($useInputSize) {
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'themeInputSize');
|
||
|
|
$f->label = $this->_('Input size');
|
||
|
|
$f->icon = 'expand';
|
||
|
|
$f->addOption('', $autoLabel);
|
||
|
|
$f->addOption('s', $smallLabel);
|
||
|
|
$f->addOption('m', $mediumLabel);
|
||
|
|
$f->addOption('l', $largeLabel);
|
||
|
|
$value = $field ? $field->get('themeInputSize') : '';
|
||
|
|
$f->attr('value', $value);
|
||
|
|
$f->columnWidth = $columnWidth;
|
||
|
|
$fieldset->add($f);
|
||
|
|
}
|
||
|
|
if($useInputWidth) {
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'themeInputWidth');
|
||
|
|
$f->label = $this->_('Input width');
|
||
|
|
$f->icon = 'arrows-h';
|
||
|
|
$f->addOption('', $autoLabel);
|
||
|
|
$f->addOption('xs', $xSmallLabel);
|
||
|
|
$f->addOption('s', $smallLabel);
|
||
|
|
$f->addOption('m', $mediumLabel);
|
||
|
|
$f->addOption('l', $largeLabel);
|
||
|
|
$f->addOption('f', $this->_('Fill'));
|
||
|
|
$value = $field ? $field->get('themeInputWidth') : '';
|
||
|
|
$f->attr('value', $value);
|
||
|
|
$f->columnWidth = $columnWidth;
|
||
|
|
$fieldset->add($f);
|
||
|
|
}
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'themeOffset');
|
||
|
|
$f->label = $this->_('Margin');
|
||
|
|
$f->icon = 'arrows-v';
|
||
|
|
$f->addOption('', $autoLabel);
|
||
|
|
$f->addOption('s', $smallLabel);
|
||
|
|
$f->addOption('m', $mediumLabel);
|
||
|
|
$f->addOption('l', $largeLabel);
|
||
|
|
$f->addOption('none', $noneLabel);
|
||
|
|
$value = $field ? $field->get('themeOffset') : '';
|
||
|
|
if($value == 1) $value = 'm';
|
||
|
|
$f->attr('value', $value);
|
||
|
|
$f->columnWidth = $columnWidth;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'themeBorder');
|
||
|
|
$f->label = $this->_('Border');
|
||
|
|
$f->addOption('', $autoLabel);
|
||
|
|
$f->addOption('line', $this->_x('Outline', 'border'));
|
||
|
|
$f->addOption('card', $this->_x('Card', 'border'));
|
||
|
|
$f->addOption('hide', $this->_x('Transparent', 'border'));
|
||
|
|
$f->addOption('none', $noneLabel);
|
||
|
|
$f->columnWidth = $columnWidth;
|
||
|
|
$f->icon = 'low-vision';
|
||
|
|
$value = $field ? $field->get('themeBorder') : '';
|
||
|
|
$f->attr('value', $value);
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'themeColor');
|
||
|
|
$f->label = $this->_('Color');
|
||
|
|
$f->icon = 'eyedropper';
|
||
|
|
$f->addOption('', $autoLabel);
|
||
|
|
$f->addOption('primary', $this->_x('Primary', 'color'));
|
||
|
|
$f->addOption('secondary', $this->_x('Secondary', 'color'));
|
||
|
|
$f->addOption('highlight', $this->_x('Highlight', 'color'));
|
||
|
|
$f->addOption('warning', $this->_x('Warning', 'color'));
|
||
|
|
//$f->addOption('danger', $this->_x('Danger', 'color'));
|
||
|
|
$f->addOption('none', $noneLabel);
|
||
|
|
$value = $field ? $field->get('themeColor') : '';
|
||
|
|
$f->attr('value', $value);
|
||
|
|
$f->columnWidth = $columnWidth;
|
||
|
|
$f->showIf = 'themeBorder!=none';
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
if($inputfield instanceof InputfieldText && !$inputfield instanceof InputfieldCKEditor) {
|
||
|
|
/** @var InputfieldCheckbox $f */
|
||
|
|
$f = $modules->get('InputfieldCheckbox');
|
||
|
|
$f->attr('name', 'themeBlank');
|
||
|
|
$f->label = $this->_('Minimize the styling of form controls');
|
||
|
|
if($field->get('themeBlank')) $f->attr('checked', 'checked');
|
||
|
|
$fieldset->add($f);
|
||
|
|
}
|
||
|
|
|
||
|
|
if($inputfield instanceof InputfieldSelect) {
|
||
|
|
$exampleType = 'InputfieldSelect';
|
||
|
|
} else if($inputfield instanceof InputfieldTextarea) {
|
||
|
|
$exampleType = 'InputfieldTextarea';
|
||
|
|
} else if($inputfield instanceof InputfieldText) {
|
||
|
|
$exampleType = 'InputfieldText';
|
||
|
|
} else {
|
||
|
|
$exampleType = 'InputfieldMarkup';
|
||
|
|
}
|
||
|
|
$f = $modules->get($exampleType);
|
||
|
|
$f->attr('id+name', '_adminThemeExample');
|
||
|
|
$f->label = $this->_('Example');
|
||
|
|
$text = $this->_('This field simply demonstrates the settings you selected above.');
|
||
|
|
if($f instanceof InputfieldSelect) {
|
||
|
|
$f->addOption('', $text);
|
||
|
|
$f->addOption('Lorem');
|
||
|
|
$f->addOption('Ipsum');
|
||
|
|
$f->addOption('Dolor');
|
||
|
|
$f->addOption('Sit');
|
||
|
|
$f->addOption('Amet');
|
||
|
|
} else if($f instanceof InputfieldText) {
|
||
|
|
$f->value = $text;
|
||
|
|
} else {
|
||
|
|
$f->value = "<p>$text</p>";
|
||
|
|
$f->collapsed = Inputfield::collapsedYes;
|
||
|
|
}
|
||
|
|
$f->icon = 'snowflake-o';
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$f = $modules->get('InputfieldMarkup');
|
||
|
|
$f->attr('id+name', '_adminThemeExample2');
|
||
|
|
$f->label = $this->_('Another field');
|
||
|
|
$f->value = "<p>Lorem ipsum dolor</p>";
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$f = $inputfields->getChildByName('columnWidth');
|
||
|
|
if($f) $f->notes = sprintf(
|
||
|
|
$this->_('Open the “%s” field above for a live example of column width.'), $fieldset->label
|
||
|
|
). ' ' . $f->notes;
|
||
|
|
|
||
|
|
/** @var Config $config */
|
||
|
|
$config = $this->wire('config');
|
||
|
|
$config->scripts->add($config->urls($this->adminTheme) . 'config-field.js');
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Create tests for Inputfields widths and showIf
|
||
|
|
*
|
||
|
|
* @param InputfieldWrapper $inputfields
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
public function configTests(InputfieldWrapper $inputfields) {
|
||
|
|
|
||
|
|
$form = $inputfields->getForm();
|
||
|
|
if($form) {
|
||
|
|
$form->action .= '&tests=1';
|
||
|
|
$this->wire('session')->addHookBefore('redirect', function(HookEvent $event) {
|
||
|
|
$url = $event->arguments(0);
|
||
|
|
$url .= '&tests=1';
|
||
|
|
$event->arguments(0, $url);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
/** @var Modules $modules */
|
||
|
|
$modules = $this->wire('modules');
|
||
|
|
|
||
|
|
// TEST 1 ----------------------------------
|
||
|
|
/** @var InputfieldFieldset $fieldset */
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->label = 'Unusual widths tests';
|
||
|
|
$inputfields->add($fieldset);
|
||
|
|
|
||
|
|
$widths = array(
|
||
|
|
73, 27,
|
||
|
|
11, 89,
|
||
|
|
37, 63,
|
||
|
|
22, 22, 37, 19 // does not work with uk-width classes
|
||
|
|
);
|
||
|
|
|
||
|
|
foreach($widths as $n => $width) {
|
||
|
|
/** @var InputfieldText $f */
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', "_w$n");
|
||
|
|
$f->label = "Width $width%";
|
||
|
|
$f->columnWidth = $width;
|
||
|
|
$fieldset->add($f);
|
||
|
|
}
|
||
|
|
|
||
|
|
// TEST 2 ----------------------------------
|
||
|
|
|
||
|
|
/** @var InputfieldFieldset $fieldset */
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->label = 'Show-if and widths tests';
|
||
|
|
$inputfields->add($fieldset);
|
||
|
|
|
||
|
|
/** @var InputfieldRadios $f */
|
||
|
|
$f = $modules->get('InputfieldRadios');
|
||
|
|
$f->attr('name', 'test_radios');
|
||
|
|
$f->label = 'Row 1 Col 1/4 (test_radios)';
|
||
|
|
$f->description = 'Select option to reveal column(s)';
|
||
|
|
$f->addOption(1, 'Option 1');
|
||
|
|
$f->addOption(2, 'Option 2');
|
||
|
|
$f->addOption(3, 'Option 3');
|
||
|
|
$f->columnWidth = 25;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldCheckbox $f */
|
||
|
|
$f = $modules->get('InputfieldCheckbox');
|
||
|
|
$f->attr('name', 'test_checkbox');
|
||
|
|
$f->label = 'Row 1 Col 2/4 (test_checkbox)';
|
||
|
|
$f->description = 'Revealed by option 1. Check box to reveal column 3';
|
||
|
|
$f->columnWidth = 25;
|
||
|
|
$f->showIf = 'test_radios=1';
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
$columns = array(
|
||
|
|
// row 1
|
||
|
|
array(
|
||
|
|
'label' => 'Row 1 Col 3/4',
|
||
|
|
'width' => 25,
|
||
|
|
'showIf' => 'test_radios=1, test_checkbox=1'
|
||
|
|
),
|
||
|
|
array(
|
||
|
|
'label' => 'Row 1 Col 4/4',
|
||
|
|
'width' => 25,
|
||
|
|
'showIf' => 'test_radios=1|2'
|
||
|
|
),
|
||
|
|
// row 2
|
||
|
|
array(
|
||
|
|
'label' => 'Row 2 Col 1/4',
|
||
|
|
'width' => 25,
|
||
|
|
),
|
||
|
|
array(
|
||
|
|
'label' => 'Row 2 Col 2/4',
|
||
|
|
'width' => 25,
|
||
|
|
),
|
||
|
|
array(
|
||
|
|
'label' => 'Row 2 Col 3/4',
|
||
|
|
'width' => 25,
|
||
|
|
),
|
||
|
|
array(
|
||
|
|
'label' => 'Row 2 Col 4/4',
|
||
|
|
'width' => 25,
|
||
|
|
'showIf' => 'test_radios=3',
|
||
|
|
),
|
||
|
|
// row 3
|
||
|
|
array(
|
||
|
|
'label' => 'Row 3 Col 1/2',
|
||
|
|
'width' => 75,
|
||
|
|
'showIf' => 'test_radios=3'
|
||
|
|
),
|
||
|
|
array(
|
||
|
|
'label' => 'Row 3 Col 2/2',
|
||
|
|
'width' => 25
|
||
|
|
)
|
||
|
|
|
||
|
|
);
|
||
|
|
|
||
|
|
foreach($columns as $n => $col) {
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', "_test_text$n");
|
||
|
|
$f->label = $col['label'];
|
||
|
|
$f->columnWidth = $col['width'];
|
||
|
|
if(isset($col['showIf'])) {
|
||
|
|
$f->showIf = $col['showIf'];
|
||
|
|
$f->notes = $col['showIf'];
|
||
|
|
}
|
||
|
|
$f->notes .= " ($col[width]%)";
|
||
|
|
$fieldset->add($f);
|
||
|
|
}
|
||
|
|
|
||
|
|
// TEST 3 -----------------------------------------------
|
||
|
|
|
||
|
|
$fieldset = $modules->get('InputfieldFieldset');
|
||
|
|
$fieldset->label = '33% widths tests w/show-if';
|
||
|
|
$inputfields->add($fieldset);
|
||
|
|
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', '_t1');
|
||
|
|
$f->label = 'Col 1/3';
|
||
|
|
$f->description = 'Always visible';
|
||
|
|
$f->columnWidth = 33;
|
||
|
|
$f->notes = "($f->columnWidth%)";
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldSelect $f */
|
||
|
|
$f = $modules->get('InputfieldSelect');
|
||
|
|
$f->attr('name', 'test_select');
|
||
|
|
$f->description = 'Choose option 2';
|
||
|
|
$f->label = 'Col 2/3 (test_select)';
|
||
|
|
$f->addOption(1, 'Option 1');
|
||
|
|
$f->addOption(2, 'Option 2');
|
||
|
|
$f->addOption(3, 'Option 3');
|
||
|
|
$f->columnWidth = 33;
|
||
|
|
$f->notes = "($f->columnWidth%)";
|
||
|
|
$f->value = 2;
|
||
|
|
$fieldset->add($f);
|
||
|
|
|
||
|
|
/** @var InputfieldText $f */
|
||
|
|
$f = $modules->get('InputfieldText');
|
||
|
|
$f->attr('name', '_t2');
|
||
|
|
$f->label = 'Col 3/3';
|
||
|
|
$f->description = 'Revealed by option 2';
|
||
|
|
$f->columnWidth = 33;
|
||
|
|
$f->showIf = 'test_select=2';
|
||
|
|
$f->notes = $f->showIf . " ($f->columnWidth%)";
|
||
|
|
$fieldset->add($f);
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|