Unverified Commit 1598f3e5 authored by alexpott's avatar alexpott

Issue #2881212 by Eli-T, huzooka, lauriii: Formatting guidelines toggle script...

Issue #2881212 by Eli-T, huzooka, lauriii: Formatting guidelines toggle script relies on Classy selectors
parent ca0ac736
/**
* @file
* Admin styling for the Filter module.
*/
/**
* Filter information under field.
*/
.text-format-wrapper > .form-item {
margin-bottom: 0;
}
.filter-wrapper {
overflow: hidden;
margin: 0;
padding: 0.5em 0.666em;
border: 1px solid #ccc;
border-top: 0;
}
.filter-wrapper .form-item {
margin: 0;
}
.filter-wrapper .form-item label {
display: inline;
}
.filter-help {
float: right; /* LTR */
}
[dir="rtl"] .filter-help {
float: left;
}
.filter-guidelines .filter-guidelines-item {
margin-top: 1em;
}
.filter-help p {
margin: 0;
}
.filter-help a {
position: relative;
margin: 0 20px 0 0; /* LTR */
}
[dir="rtl"] .filter-help a {
margin: 0 0 0 20px;
}
.filter-help a:after {
position: absolute;
top: 0;
right: -20px; /* LTR */
display: block;
width: 16px;
height: 16px;
content: "";
background: transparent url(../../../misc/help.png);
}
[dir="rtl"] .filter-help a:after {
right: auto;
left: -20px;
}
.text-format-wrapper .description {
margin-top: 0.5em;
}
.tips {
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
font-size: 0.9em;
}
/**
* Improve filter tips position.
*/
.tips {
padding-left: 0; /* LTR */
}
[dir="rtl"] .tips {
padding-right: 0;
}
......@@ -18,20 +18,20 @@
const $this = $(event.target);
const value = $this.val();
$this
.closest('.filter-wrapper')
.find('.filter-guidelines-item')
.closest('.js-filter-wrapper')
.find('[data-drupal-format-id]')
.hide()
.filter(`.filter-guidelines-${value}`)
.filter(`[data-drupal-format-id="${value}"]`)
.show();
}
$(context)
.find('.filter-guidelines')
.find('.js-filter-guidelines')
.once('filter-guidelines')
.find(':header')
.hide()
.closest('.filter-wrapper')
.find('select.filter-list')
.closest('.js-filter-wrapper')
.find('select.js-filter-list')
.on('change.filterGuidelines', updateFilterGuidelines)
// Need to trigger the namespaced event to avoid triggering formUpdated
// when initializing the select.
......
......@@ -11,10 +11,10 @@
function updateFilterGuidelines(event) {
var $this = $(event.target);
var value = $this.val();
$this.closest('.filter-wrapper').find('.filter-guidelines-item').hide().filter('.filter-guidelines-' + value).show();
$this.closest('.js-filter-wrapper').find('[data-drupal-format-id]').hide().filter('[data-drupal-format-id="' + value + '"]').show();
}
$(context).find('.filter-guidelines').once('filter-guidelines').find(':header').hide().closest('.filter-wrapper').find('select.filter-list').on('change.filterGuidelines', updateFilterGuidelines).trigger('change.filterGuidelines');
$(context).find('.js-filter-guidelines').once('filter-guidelines').find(':header').hide().closest('.js-filter-wrapper').find('select.js-filter-list').on('change.filterGuidelines', updateFilterGuidelines).trigger('change.filterGuidelines');
}
};
})(jQuery, Drupal);
\ No newline at end of file
......@@ -2,9 +2,6 @@ drupal.filter.admin:
version: VERSION
js:
filter.admin.js: {}
css:
theme:
css/filter.admin.css: {}
dependencies:
- core/jquery
- core/drupal
......@@ -24,10 +21,6 @@ drupal.filter:
version: VERSION
js:
filter.js: {}
css:
theme:
# @todo Misnomer: Does not contain administrative styles.
css/filter.admin.css: {}
dependencies:
- core/jquery
- core/drupal
......
......@@ -377,6 +377,9 @@ function template_preprocess_filter_guidelines(&$variables) {
'#theme' => 'filter_tips',
'#tips' => _filter_tips($format->id(), FALSE),
];
// Add format id for filter.es6.js.
$variables['attributes']['data-drupal-format-id'] = $format->id();
}
/**
......
......@@ -124,7 +124,7 @@ public static function processFormat(&$element, FormStateInterface $form_state,
// Setup child container for the text format widget.
$element['format'] = [
'#type' => 'container',
'#attributes' => ['class' => ['filter-wrapper']],
'#attributes' => ['class' => ['js-filter-wrapper']],
];
// Get a list of formats that the current user has access to.
......@@ -148,7 +148,8 @@ public static function processFormat(&$element, FormStateInterface $form_state,
// If #allowed_formats is set, the list of formats must not be modified in
// any way. Otherwise, however, if all of the following conditions are true,
// remove the fallback format from the list of formats:
// 1. The 'always_show_fallback_choice' filter setting has not been activated.
// 1. The 'always_show_fallback_choice' filter setting has not been
// activated.
// 2. Multiple text formats are available.
// 3. The fallback format is not the default format.
// The 'always_show_fallback_choice' filter setting is a hidden setting that
......@@ -164,7 +165,7 @@ public static function processFormat(&$element, FormStateInterface $form_state,
// Prepare text format guidelines.
$element['format']['guidelines'] = [
'#type' => 'container',
'#attributes' => ['class' => ['filter-guidelines']],
'#attributes' => ['class' => ['js-filter-guidelines']],
'#weight' => 20,
];
$options = [];
......@@ -183,7 +184,7 @@ public static function processFormat(&$element, FormStateInterface $form_state,
'#default_value' => $element['#format'],
'#access' => count($formats) > 1,
'#weight' => 10,
'#attributes' => ['class' => ['filter-list']],
'#attributes' => ['class' => ['js-filter-list']],
'#parents' => array_merge($element['#parents'], ['format']),
];
......@@ -195,7 +196,6 @@ public static function processFormat(&$element, FormStateInterface $form_state,
'#url' => new Url('filter.tips_all'),
'#attributes' => ['target' => '_blank'],
],
'#attributes' => ['class' => ['filter-help']],
'#weight' => 0,
];
......
......@@ -7,6 +7,22 @@
use Drupal\Component\Utility\Html;
/**
* Implements hook_library_info_alter().
*/
function stable_library_info_alter(&$libraries, $extension) {
// Add removed css/filter.admin.css file back so that themes overriding
// this file continue getting same behavior until Drupal 9.
if ($extension === 'filter') {
if (isset($libraries['drupal.filter.admin'])) {
$libraries['drupal.filter.admin']['css']['theme']['css/filter.admin.css'] = [];
}
if (isset($libraries['drupal.filter'])) {
$libraries['drupal.filter']['css']['theme']['css/filter.admin.css'] = [];
}
}
}
/**
* Implements template_preprocess_links().
*/
......@@ -24,6 +40,33 @@ function stable_preprocess_links(&$variables) {
}
}
/**
* Implements hook_element_info_alter().
*/
function stable_element_info_alter(array &$info) {
if (array_key_exists('text_format', $info)) {
$info['text_format']['#process'][] = 'stable_process_text_format';
}
}
/**
* #process callback, for adding classes to filter components.
*
* @param array $element
* Render array for the text_format element.
*
* @return array
* Text_format element with the filter classes added.
*/
function stable_process_text_format(array $element) {
$element['format']['#attributes']['class'][] = 'filter-wrapper';
$element['format']['guidelines']['#attributes']['class'][] = 'filter-guidelines';
$element['format']['format']['#attributes']['class'][] = 'filter-list';
$element['format']['help']['#attributes']['class'][] = 'filter-help';
return $element;
}
/**
* Implements hook_preprocess_image_widget().
*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment