From 74e264dd342c9ca1f34195dc04c4bcce3026c805 Mon Sep 17 00:00:00 2001
From: ahmad-alyasaki <a.alyasaki@sprintive.com>
Date: Wed, 9 Oct 2024 16:20:02 +0300
Subject: [PATCH 01/11] Issue #3479645: Customize field editing text
---
config/schema/editing_helper.schema.yml | 7 ++++
editing_helper.module | 49 ++++++++++++++++++++++++-
2 files changed, 54 insertions(+), 2 deletions(-)
create mode 100755 config/schema/editing_helper.schema.yml
diff --git a/config/schema/editing_helper.schema.yml b/config/schema/editing_helper.schema.yml
new file mode 100755
index 0000000..b3a9ff8
--- /dev/null
+++ b/config/schema/editing_helper.schema.yml
@@ -0,0 +1,7 @@
+field.field.*.*.*.third_party.editing_helper:
+ type: mapping
+ label: "Field settings for tablefield_required"
+ mapping:
+ editing_helper_description:
+ type: string
+ label: "Editing Helper Description"
diff --git a/editing_helper.module b/editing_helper.module
index 2ff31a5..f7c42e9 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -6,7 +6,9 @@
*/
use Drupal\block_content\BlockContentInterface;
+use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Routing\RouteMatchInterface;
+use Drupal\field\Entity\FieldConfig;
/**
* Implements hook_help().
@@ -20,6 +22,46 @@ function editing_helper_help($route_name, RouteMatchInterface $route_match) {
}
}
+/**
+ * Implements hook_form_FORM_ID_alter().
+ */
+function editing_helper_form_field_config_edit_form_alter(array &$form, FormStateInterface $form_state) {
+ /** @var \Drupal\field\Entity\FieldConfig $field_config */
+ $field_config = $form_state->getFormObject()->getEntity();
+
+ $editing_helper_description = $field_config->getThirdPartySettings('editing_helper');
+
+ $form['editing_helper_description'] = [
+ '#type' => 'textarea',
+ '#title' => t('Editing Helper Description.'),
+ '#default_value' => $editing_helper_description["editing_helper_description"] ?? '',
+ '#description' => t('Instructions to present to the user below this field on the editing form.
+ Allowed HTML tags'),
+ ];
+
+ $form['#entity_builders'][] = 'editing_helper_form_builder';
+}
+
+/**
+ * Update the field configuration once form is saved.
+ *
+ * @param \Drupal\field\Entity\FieldConfig $config
+ * The field configuration entity.
+ * @param array $form
+ * The complete form array.
+ * @param \Drupal\Core\Form\FormStateInterface $form_state
+ * The current state of the form.
+ */
+function editing_helper_form_builder(FieldConfig $config, array &$form, FormStateInterface $form_state) {
+
+ $editing_helper_description = $form_state->getValue('editing_helper_description');
+ if ($editing_helper_description) {
+ $config->setThirdPartySetting('editing_helper', 'editing_helper_description', $editing_helper_description);
+ return;
+ }
+ $config->unsetThirdPartySetting('editing_helper', 'editing_helper_description');
+}
+
/**
* Implements hook_preprocess_block().
*/
@@ -34,7 +76,7 @@ function editing_helper_preprocess_block(array &$variables) {
// Check if the block is a field or views block.
if ($plugin_id) {
- [$block_type, $block_info] = explode(':', $plugin_id) + [NULL, NULL];
+ [$block_type, $block_info, $block_bundle, $block_field] = explode(':', $plugin_id) + [NULL, NULL];
switch ($block_type) {
case 'block_content':
@@ -47,8 +89,11 @@ function editing_helper_preprocess_block(array &$variables) {
break;
case 'field_block':
+ $field_config = FieldConfig::loadByName($block_info, $block_bundle, $block_field);
+ $editing_helper_description = $field_config->getThirdPartySettings('editing_helper');
+
$variables["attributes"]["class"][] = "editing-helper-block editing-helper-field";
- $help_text = $config->get('view_field_text');
+ $help_text = !empty($editing_helper_description) ? $editing_helper_description["editing_helper_description"] : $config->get('view_field_text');
break;
case 'views_block':
--
GitLab
From b4ae0e51cdda7c742e1aa8f8f1b6f6d45db911bf Mon Sep 17 00:00:00 2001
From: ahmad-alyasaki <a.alyasaki@sprintive.com>
Date: Wed, 9 Oct 2024 16:46:31 +0300
Subject: [PATCH 02/11] Issue #3479653: Add default config description for
views
---
editing_helper.module | 12 +++++++++++-
src/Form/HelpDescriptionConfigForm.php | 13 +++++++++++++
2 files changed, 24 insertions(+), 1 deletion(-)
diff --git a/editing_helper.module b/editing_helper.module
index f7c42e9..3e510d9 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -105,6 +105,16 @@ function editing_helper_preprocess_block(array &$variables) {
// Get the current display.
$display = $view->getDisplay($view_display);
+ switch ($view->get('base_field')) {
+ case 'nid':
+ $help_default_text = $config->get('view_node_text');
+ break;
+
+ case 'tid':
+ $help_default_text = $config->get('view_taxonomy_text');
+ break;
+ }
+
$extenders = $display["display_options"]["display_extenders"]["editing_helper_display_extender"];
if (!isset($extenders)) {
return;
@@ -112,7 +122,7 @@ function editing_helper_preprocess_block(array &$variables) {
// Retrieve the settings of our plugins using our custom plugin method.
$description_values = $extenders["view_description_helper"]["description"];
- $help_text = $description_values;
+ $help_text = !empty($description_values) ? $description_values : $help_default_text;
}
break;
}
diff --git a/src/Form/HelpDescriptionConfigForm.php b/src/Form/HelpDescriptionConfigForm.php
index 2583fb0..0ae8c1c 100644
--- a/src/Form/HelpDescriptionConfigForm.php
+++ b/src/Form/HelpDescriptionConfigForm.php
@@ -64,6 +64,17 @@ class HelpDescriptionConfigForm extends ConfigFormBase {
'#title' => $this->t('View Field Text'),
'#default_value' => $config->get('view_field_text'),
];
+ $form['help_config']['view_node_text'] = [
+ '#type' => 'textarea',
+ '#title' => $this->t('View Node Text'),
+ '#default_value' => $config->get('view_node_text'),
+ ];
+ $form['help_config']['view_taxonomy_text'] = [
+ '#type' => 'textarea',
+ '#title' => $this->t('View Taxonomy Term Text'),
+ '#default_value' => $config->get('view_taxonomy_text'),
+ ];
+
return parent::buildForm($form, $form_state);
}
@@ -82,6 +93,8 @@ class HelpDescriptionConfigForm extends ConfigFormBase {
->set('block_inline_text', $form_state->getValue('block_inline_text'))
->set('block_reusable_text', $form_state->getValue('block_reusable_text'))
->set('view_field_text', $form_state->getValue('view_field_text'))
+ ->set('view_node_text', $form_state->getValue('view_node_text'))
+ ->set('view_taxonomy_text', $form_state->getValue('view_taxonomy_text'))
->save();
$this->messenger()->addStatus($this->t("Seeds Layout configuration has been saved successfully"));
}
--
GitLab
From d31cab50fe1ee7f63109402c3b6b1ba975307033 Mon Sep 17 00:00:00 2001
From: ahmad-alyasaki <a.alyasaki@sprintive.com>
Date: Wed, 9 Oct 2024 17:02:14 +0300
Subject: [PATCH 03/11] Issue #3479663: Ability to add custom text instead of
the static one
---
editing_helper.module | 3 ++-
src/Form/HelpDescriptionConfigForm.php | 7 +++++++
2 files changed, 9 insertions(+), 1 deletion(-)
diff --git a/editing_helper.module b/editing_helper.module
index 3e510d9..0c9f229 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -130,6 +130,7 @@ function editing_helper_preprocess_block(array &$variables) {
// Add the help wrapper with the computed help text.
if (!empty($help_text) && $current_user->hasPermission('access to editing helper')) {
+ $block_title = (string) $config->get('block_title');
$variables['title_prefix']['help_wrapper'] = [
'#type' => 'container',
'#attributes' => ['class' => ['help-wrapper']],
@@ -137,7 +138,7 @@ function editing_helper_preprocess_block(array &$variables) {
'toggle_help_button' => [
'#type' => 'html_tag',
'#tag' => 'button',
- '#value' => t('Want Help!'),
+ '#value' => $block_title ? $block_title : t('Want Help!'),
'#attributes' => [
'class' => ['toggle-help'],
'type' => 'button',
diff --git a/src/Form/HelpDescriptionConfigForm.php b/src/Form/HelpDescriptionConfigForm.php
index 0ae8c1c..de00ae2 100644
--- a/src/Form/HelpDescriptionConfigForm.php
+++ b/src/Form/HelpDescriptionConfigForm.php
@@ -49,6 +49,12 @@ class HelpDescriptionConfigForm extends ConfigFormBase {
'#tree' => FALSE,
];
+ $form['help_config']['block_title'] = [
+ '#type' => 'textfield',
+ '#title' => $this->t('Block Title'),
+ '#default_value' => $config->get('block_title'),
+ ];
+
$form['help_config']['block_inline_text'] = [
'#type' => 'textarea',
'#title' => $this->t('Block Inline Text'),
@@ -90,6 +96,7 @@ class HelpDescriptionConfigForm extends ConfigFormBase {
*/
public function submitForm(array &$form, FormStateInterface $form_state) {
$this->config('editing_helper.help_config')
+ ->set('block_title', $form_state->getValue('block_title'))
->set('block_inline_text', $form_state->getValue('block_inline_text'))
->set('block_reusable_text', $form_state->getValue('block_reusable_text'))
->set('view_field_text', $form_state->getValue('view_field_text'))
--
GitLab
From 9bd92a5590bc5f7a0048f13a556d30acb6ba8808 Mon Sep 17 00:00:00 2001
From: ahmad-alyasaki <a.alyasaki@sprintive.com>
Date: Thu, 10 Oct 2024 10:43:54 +0300
Subject: [PATCH 04/11] Issue #3479817: Uncaught PHP Exception Error: "Call to
a member function getThirdPartySettings() on null"
---
editing_helper.module | 8 +++++---
1 file changed, 5 insertions(+), 3 deletions(-)
diff --git a/editing_helper.module b/editing_helper.module
index 0c9f229..5d9a126 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -90,10 +90,12 @@ function editing_helper_preprocess_block(array &$variables) {
case 'field_block':
$field_config = FieldConfig::loadByName($block_info, $block_bundle, $block_field);
- $editing_helper_description = $field_config->getThirdPartySettings('editing_helper');
+ if (!is_null($field_config)) {
+ $editing_helper_description = $field_config->getThirdPartySettings('editing_helper');
- $variables["attributes"]["class"][] = "editing-helper-block editing-helper-field";
- $help_text = !empty($editing_helper_description) ? $editing_helper_description["editing_helper_description"] : $config->get('view_field_text');
+ $variables["attributes"]["class"][] = "editing-helper-block editing-helper-field";
+ $help_text = !empty($editing_helper_description) ? $editing_helper_description["editing_helper_description"] : $config->get('view_field_text');
+ }
break;
case 'views_block':
--
GitLab
From 4b875970728cfdcf430989fcd22895b4b585107f Mon Sep 17 00:00:00 2001
From: Mohammad AbulQader <mohd@sprintive.con>
Date: Tue, 29 Oct 2024 21:36:12 +0300
Subject: [PATCH 05/11] Issue #3484458 by hamzadwaya: Delete Console.error from
js
---
assets/js/editing-helper.js | 2 --
1 file changed, 2 deletions(-)
diff --git a/assets/js/editing-helper.js b/assets/js/editing-helper.js
index fe3ecf0..79231cf 100644
--- a/assets/js/editing-helper.js
+++ b/assets/js/editing-helper.js
@@ -41,8 +41,6 @@
// Mark the element as having the event listener attached
parentElement.setAttribute("data-listener-attached", "true");
}
- } else {
- console.error("Help content not found within the parent element!");
}
});
},
--
GitLab
From debb846f9c7b7a8b2c083d8d1e66ecc941e2ed26 Mon Sep 17 00:00:00 2001
From: hamza dwaya <60245-hamzadwaya@users.noreply.drupalcode.org>
Date: Wed, 30 Oct 2024 12:41:57 +0000
Subject: [PATCH 06/11] Update file editing_helper.module
---
editing_helper.module | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/editing_helper.module b/editing_helper.module
index 5d9a126..85cc2af 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -76,8 +76,8 @@ function editing_helper_preprocess_block(array &$variables) {
// Check if the block is a field or views block.
if ($plugin_id) {
- [$block_type, $block_info, $block_bundle, $block_field] = explode(':', $plugin_id) + [NULL, NULL];
-
+ $parts = explode(':', $plugin_id) + [NULL, NULL, NULL, NULL];
+ [$block_type, $block_info, $block_bundle, $block_field] = $parts;
switch ($block_type) {
case 'block_content':
$variables["attributes"]["class"][] = "editing-helper-block editing-helper-block-content";
--
GitLab
From e83609e72db5fdf69defef59b27c254a90d48a81 Mon Sep 17 00:00:00 2001
From: hamza dwaya <60245-hamzadwaya@users.noreply.drupalcode.org>
Date: Wed, 30 Oct 2024 14:36:51 +0000
Subject: [PATCH 07/11] Issue #3484610: Fix Warning Message Warning: Undefined
array key 3 in editing_helper_preprocess_block
---
editing_helper.module | 3 +--
1 file changed, 1 insertion(+), 2 deletions(-)
diff --git a/editing_helper.module b/editing_helper.module
index 85cc2af..862b6a2 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -76,8 +76,7 @@ function editing_helper_preprocess_block(array &$variables) {
// Check if the block is a field or views block.
if ($plugin_id) {
- $parts = explode(':', $plugin_id) + [NULL, NULL, NULL, NULL];
- [$block_type, $block_info, $block_bundle, $block_field] = $parts;
+ [$block_type, $block_info, $block_bundle, $block_field] = explode(':', $plugin_id) + [NULL, NULL, NULL, NULL];
switch ($block_type) {
case 'block_content':
$variables["attributes"]["class"][] = "editing-helper-block editing-helper-block-content";
--
GitLab
From bb7690f1501b9ba96f010cd646801086e03d44ee Mon Sep 17 00:00:00 2001
From: hamza dwaya <60245-hamzadwaya@users.noreply.drupalcode.org>
Date: Wed, 30 Oct 2024 14:39:20 +0000
Subject: [PATCH 08/11] issue #3484619: Fix Warning Message Warning: Undefined
array key "editing_helper_display_extender" in
editing_helper_preprocess_block()
---
editing_helper.module | 5 ++---
1 file changed, 2 insertions(+), 3 deletions(-)
diff --git a/editing_helper.module b/editing_helper.module
index 5d9a126..d513f52 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -117,13 +117,12 @@ function editing_helper_preprocess_block(array &$variables) {
break;
}
- $extenders = $display["display_options"]["display_extenders"]["editing_helper_display_extender"];
- if (!isset($extenders)) {
+ if (!isset($display["display_options"]["display_extenders"]["editing_helper_display_extender"])) {
return;
}
// Retrieve the settings of our plugins using our custom plugin method.
- $description_values = $extenders["view_description_helper"]["description"];
+ $description_values = $display["display_options"]["display_extenders"]["editing_helper_display_extender"]["view_description_helper"]["description"];
$help_text = !empty($description_values) ? $description_values : $help_default_text;
}
break;
--
GitLab
From 37a3eb1d68db7034d0972053d3330bc396bd0f1c Mon Sep 17 00:00:00 2001
From: HamzaDwaya <hamza@sprintive.com>
Date: Wed, 30 Oct 2024 17:55:42 +0300
Subject: [PATCH 09/11] Issue #3484610: Fix Warning Message Warning: Undefined
array key 3 in editing_helper_preprocess_block
---
editing_helper.module | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/editing_helper.module b/editing_helper.module
index 862b6a2..ec7c784 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -116,13 +116,13 @@ function editing_helper_preprocess_block(array &$variables) {
break;
}
- $extenders = $display["display_options"]["display_extenders"]["editing_helper_display_extender"];
- if (!isset($extenders)) {
+
+ if (!isset($display["display_options"]["display_extenders"]["editing_helper_display_extender"])) {
return;
}
// Retrieve the settings of our plugins using our custom plugin method.
- $description_values = $extenders["view_description_helper"]["description"];
+ $description_values = $display["display_options"]["display_extenders"]["editing_helper_display_extender"]["view_description_helper"]["description"];
$help_text = !empty($description_values) ? $description_values : $help_default_text;
}
break;
--
GitLab
From eb6fd962a413e41de79a4495445a5bdfb2f2ccfc Mon Sep 17 00:00:00 2001
From: hamza dwaya <60245-hamzadwaya@users.noreply.drupalcode.org>
Date: Wed, 11 Dec 2024 09:27:19 +0000
Subject: [PATCH 10/11] Issue #3493145: Function expects FieldConfig object,
but a string is passed...
---
editing_helper.module | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/editing_helper.module b/editing_helper.module
index 0448cec..78aa6f2 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -52,7 +52,7 @@ function editing_helper_form_field_config_edit_form_alter(array &$form, FormStat
* @param \Drupal\Core\Form\FormStateInterface $form_state
* The current state of the form.
*/
-function editing_helper_form_builder(FieldConfig $config, array &$form, FormStateInterface $form_state) {
+function editing_helper_form_builder($entity_type, FieldConfig $config, array &$form, FormStateInterface $form_state) {
$editing_helper_description = $form_state->getValue('editing_helper_description');
if ($editing_helper_description) {
--
GitLab
From ae6e49c46c1a83b7e8546d4056efdec02395a4fe Mon Sep 17 00:00:00 2001
From: Omar Alemailat <omar@sprintive.com>
Date: Thu, 9 Jan 2025 15:05:05 +0300
Subject: [PATCH 11/11] Issue #3490949: Change style for Want help icon
---
assets/css/editing-helper.css | 70 +++++++++++++++++++++++++++-
assets/icons/close-btn.svg | 5 ++
assets/icons/question-icon.svg | 5 ++
assets/js/editing-helper.js | 23 ++-------
assets/style/editing-helper.pcss.css | 62 +++++++++++++++++-------
editing_helper.info.yml | 5 ++
editing_helper.module | 27 +++++++----
templates/help-content.html.twig | 8 ++++
8 files changed, 159 insertions(+), 46 deletions(-)
create mode 100644 assets/icons/close-btn.svg
create mode 100644 assets/icons/question-icon.svg
create mode 100644 templates/help-content.html.twig
diff --git a/assets/css/editing-helper.css b/assets/css/editing-helper.css
index 98029d5..72d0c8d 100644
--- a/assets/css/editing-helper.css
+++ b/assets/css/editing-helper.css
@@ -1,2 +1,68 @@
-.editing-helper-block .help-wrapper{margin-bottom:8px}.editing-helper-block .toggle-help{background-color:#df000f;border:none;border-radius:5px;box-shadow:0 4px 6px rgba(#df000f,.4);color:#fff;cursor:pointer;font-size:14px;margin-bottom:15px;padding:6px 12px;pointer-events:all!important;transition:background-color .3s ease}.editing-helper-block .toggle-help:hover{background-color:#a0040e}.editing-helper-block .help-content{background-color:#e9ecef;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);max-height:0;overflow:hidden;padding:0 15px;transition:max-height .3s ease-in-out;visibility:hidden}.editing-helper-block .help-content p{color:#333;font-size:14px;margin:0}
-/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3N0eWxlL2VkaXRpbmctaGVscGVyLnBjc3MuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNFLG9DQUNFLGlCQUNGLENBQ0EsbUNBQ0Usd0JBQXlCLENBR3pCLFdBQVksQ0FDWixpQkFBa0IsQ0FJbEIscUNBQXdDLENBUHhDLFVBQVcsQ0FLWCxjQUFlLENBRGYsY0FBZSxDQUtmLGtCQUFtQixDQVJuQixnQkFBaUIsQ0FPakIsNEJBQThCLENBRjlCLG9DQUlGLENBRUEseUNBQ0Usd0JBQ0YsQ0FFQSxvQ0FDRSx3QkFBeUIsQ0FDekIsaUJBQWtCLENBQ2xCLG1DQUF3QyxDQUV4QyxZQUFhLENBRGIsZUFBZ0IsQ0FFaEIsY0FBZSxDQUVmLHFDQUF1QyxDQUR2QyxpQkFFRixDQUVBLHNDQUdFLFVBQVcsQ0FEWCxjQUFlLENBRGYsUUFHRiIsImZpbGUiOiJlZGl0aW5nLWhlbHBlci5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuZWRpdGluZy1oZWxwZXItYmxvY2sge1xuICAuaGVscC13cmFwcGVyIHtcbiAgICBtYXJnaW4tYm90dG9tOiA4cHg7XG4gIH1cbiAgLnRvZ2dsZS1oZWxwIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZGYwMDBmO1xuICAgIGNvbG9yOiAjZmZmO1xuICAgIHBhZGRpbmc6IDZweCAxMnB4O1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XG4gICAgZm9udC1zaXplOiAxNHB4O1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB0cmFuc2l0aW9uOiBiYWNrZ3JvdW5kLWNvbG9yIDAuM3MgZWFzZTtcbiAgICBib3gtc2hhZG93OiAwIDRweCA2cHggcmdiYSgjZGYwMDBmLCAwLjQpO1xuICAgIHBvaW50ZXItZXZlbnRzOiBhbGwgIWltcG9ydGFudDtcbiAgICBtYXJnaW4tYm90dG9tOiAxNXB4O1xuICB9XG5cbiAgLnRvZ2dsZS1oZWxwOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjYTAwNDBlO1xuICB9XG5cbiAgLmhlbHAtY29udGVudCB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2U5ZWNlZjtcbiAgICBib3JkZXItcmFkaXVzOiA2cHg7XG4gICAgYm94LXNoYWRvdzogMCA0cHggOHB4IHJnYmEoMCwgMCwgMCwgMC4xKTtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIG1heC1oZWlnaHQ6IDA7XG4gICAgcGFkZGluZzogMCAxNXB4O1xuICAgIHZpc2liaWxpdHk6IGhpZGRlbjtcbiAgICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuM3MgZWFzZS1pbi1vdXQ7XG4gIH1cblxuICAuaGVscC1jb250ZW50IHAge1xuICAgIG1hcmdpbjogMDtcbiAgICBmb250LXNpemU6IDE0cHg7XG4gICAgY29sb3I6ICMzMzM7XG4gIH1cbn1cbiJdfQ== */
\ No newline at end of file
+
+ .editing-helper-block .help-wrapper {
+ position: relative;
+ margin-bottom: 8px;
+ width: -moz-fit-content;
+ width: fit-content;
+ font-size: 14px;
+ }
+.editing-helper-block .toggle-help {
+ background-color: #df000f;
+ border: none;
+ cursor: pointer;
+ margin-bottom: 15px;
+ border-radius: 50%;
+ background-image: url(../../assets/icons/question-icon.svg);
+ width: 32px;
+ height: 32px;
+ background-repeat: no-repeat;
+ background-position: center;
+ }
+.editing-helper-block .toggle-help:hover {
+ background-color: #a0040e;
+ }
+.editing-helper-block .help-content {
+ position: absolute;
+ top: 0;
+ left: calc(100% + 15px);
+ width: 320px;
+ z-index: 5;
+ background-color: white;
+ border-radius: 8px;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+ overflow: hidden;
+ padding: 24px;
+ display: none;
+ color: #002856;
+ }
+.editing-helper-block .help-content h2 {
+ font-size: 18px;
+ color: #002856;
+ }
+.editing-helper-block .help-content span {
+ color: rgba(0,40,86,0.50196);
+ }
+.editing-helper-block .help-content.active {
+ display: block;
+ }
+.editing-helper-block .help-content p {
+ margin: 0;
+ }
+.editing-helper-block .top-content {
+ display: flex;
+ justify-content: space-between;
+ }
+.editing-helper-block .helper-close-btn {
+ background-image: url(../../assets/icons/close-btn.svg);
+ width: 14px;
+ height: 14px;
+ background-repeat: no-repeat;
+ background-position: center;
+ cursor: pointer;
+ }
+[dir="rtl"] .editing-helper-block .help-content {
+ right: calc(100% + 15px);
+ left: auto;
+}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3N0eWxlL2VkaXRpbmctaGVscGVyLnBjc3MuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7RUFDRTtJQUNFLGtCQUFrQjtJQUNsQixrQkFBa0I7SUFDbEIsdUJBQWtCO0lBQWxCLGtCQUFrQjtJQUNsQixlQUFlO0VBQ2pCO0FBQ0E7SUFDRSx5QkFBeUI7SUFDekIsWUFBWTtJQUNaLGVBQWU7SUFDZixtQkFBbUI7SUFDbkIsa0JBQWtCO0lBQ2xCLDJEQUEyRDtJQUMzRCxXQUFXO0lBQ1gsWUFBWTtJQUNaLDRCQUE0QjtJQUM1QiwyQkFBMkI7RUFDN0I7QUFDQTtJQUNFLHlCQUF5QjtFQUMzQjtBQUVBO0lBQ0Usa0JBQWtCO0lBQ2xCLE1BQU07SUFDTix1QkFBdUI7SUFDdkIsWUFBWTtJQUNaLFVBQVU7SUFDVix1QkFBdUI7SUFDdkIsa0JBQWtCO0lBQ2xCLHdDQUF3QztJQUN4QyxnQkFBZ0I7SUFDaEIsYUFBYTtJQUNiLGFBQWE7SUFDYixjQUFjO0VBQ2hCO0FBRUE7SUFDRSxlQUFlO0lBQ2YsY0FBYztFQUNoQjtBQUNBO0lBQ0UsNEJBQWdCO0VBQ2xCO0FBQ0E7SUFDRSxjQUFjO0VBQ2hCO0FBRUE7SUFDRSxTQUFTO0VBQ1g7QUFDQTtJQUNFLGFBQWE7SUFDYiw4QkFBOEI7RUFDaEM7QUFDQTtJQUNFLHVEQUF1RDtJQUN2RCxXQUFXO0lBQ1gsWUFBWTtJQUNaLDRCQUE0QjtJQUM1QiwyQkFBMkI7SUFDM0IsZUFBZTtFQUNqQjtBQUVGO0VBQ0Usd0JBQXdCO0VBQ3hCLFVBQVc7QUFDYiIsImZpbGUiOiJlZGl0aW5nLWhlbHBlci5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuZWRpdGluZy1oZWxwZXItYmxvY2sge1xuICAuaGVscC13cmFwcGVyIHtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgbWFyZ2luLWJvdHRvbTogOHB4O1xuICAgIHdpZHRoOiBmaXQtY29udGVudDtcbiAgICBmb250LXNpemU6IDE0cHg7XG4gIH1cbiAgLnRvZ2dsZS1oZWxwIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZGYwMDBmO1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgbWFyZ2luLWJvdHRvbTogMTVweDtcbiAgICBib3JkZXItcmFkaXVzOiA1MCU7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogdXJsKC4uLy4uL2Fzc2V0cy9pY29ucy9xdWVzdGlvbi1pY29uLnN2Zyk7XG4gICAgd2lkdGg6IDMycHg7XG4gICAgaGVpZ2h0OiAzMnB4O1xuICAgIGJhY2tncm91bmQtcmVwZWF0OiBuby1yZXBlYXQ7XG4gICAgYmFja2dyb3VuZC1wb3NpdGlvbjogY2VudGVyO1xuICB9XG4gIC50b2dnbGUtaGVscDpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2EwMDQwZTtcbiAgfVxuXG4gIC5oZWxwLWNvbnRlbnQge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDA7XG4gICAgbGVmdDogY2FsYygxMDAlICsgMTVweCk7XG4gICAgd2lkdGg6IDMyMHB4O1xuICAgIHotaW5kZXg6IDU7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gICAgYm9yZGVyLXJhZGl1czogOHB4O1xuICAgIGJveC1zaGFkb3c6IDAgNHB4IDhweCByZ2JhKDAsIDAsIDAsIDAuMSk7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICBwYWRkaW5nOiAyNHB4O1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgY29sb3I6ICMwMDI4NTY7XG4gIH1cblxuICAuaGVscC1jb250ZW50IGgyIHtcbiAgICBmb250LXNpemU6IDE4cHg7XG4gICAgY29sb3I6ICMwMDI4NTY7XG4gIH1cbiAgLmhlbHAtY29udGVudCBzcGFuIHtcbiAgICBjb2xvcjogIzAwMjg1NjgwO1xuICB9XG4gIC5oZWxwLWNvbnRlbnQuYWN0aXZlIHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgfVxuXG4gIC5oZWxwLWNvbnRlbnQgcCB7XG4gICAgbWFyZ2luOiAwO1xuICB9XG4gIC50b3AtY29udGVudCB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gIH1cbiAgLmhlbHBlci1jbG9zZS1idG4ge1xuICAgIGJhY2tncm91bmQtaW1hZ2U6IHVybCguLi8uLi9hc3NldHMvaWNvbnMvY2xvc2UtYnRuLnN2Zyk7XG4gICAgd2lkdGg6IDE0cHg7XG4gICAgaGVpZ2h0OiAxNHB4O1xuICAgIGJhY2tncm91bmQtcmVwZWF0OiBuby1yZXBlYXQ7XG4gICAgYmFja2dyb3VuZC1wb3NpdGlvbjogY2VudGVyO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgfVxufVxuW2Rpcj1cInJ0bFwiXSAuZWRpdGluZy1oZWxwZXItYmxvY2sgLmhlbHAtY29udGVudCB7XG4gIHJpZ2h0OiBjYWxjKDEwMCUgKyAxNXB4KTtcbiAgbGVmdDogdW5zZXQ7XG59XG4iXX0= */
\ No newline at end of file
diff --git a/assets/icons/close-btn.svg b/assets/icons/close-btn.svg
new file mode 100644
index 0000000..238cee0
--- /dev/null
+++ b/assets/icons/close-btn.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M0.227806 0.227806C0.531547 -0.0759353 1.02401 -0.0759353 1.32775 0.227806L7 5.90006L12.6723 0.227806C12.976 -0.0759349 13.4685 -0.0759349 13.7722 0.227806C14.0759 0.531547 14.0759 1.02401 13.7722 1.32775L8.09994 7L13.7722 12.6723C14.0759 12.976 14.0759 13.4685 13.7722 13.7722C13.4685 14.0759 12.976 14.0759 12.6723 13.7722L7 8.09994L1.32775 13.7722C1.02401 14.0759 0.531547 14.0759 0.227806 13.7722C-0.0759353 13.4685 -0.0759353 12.976 0.227806 12.6723L5.90006 7L0.227806 1.32775C-0.0759349 1.02401 -0.0759349 0.531547 0.227806 0.227806Z"
+ fill="#000" />
+</svg>
\ No newline at end of file
diff --git a/assets/icons/question-icon.svg b/assets/icons/question-icon.svg
new file mode 100644
index 0000000..c5a3815
--- /dev/null
+++ b/assets/icons/question-icon.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="22" viewBox="0 0 14 22" fill="none">
+ <path
+ d="M13.08 5.79104C13.08 6.74322 12.8726 7.62538 12.4716 8.40952C12.0844 9.16566 11.4483 9.96381 10.6048 10.776C9.5815 11.7701 9.2358 12.2882 9.13901 12.5543C9.04221 12.8203 8.90393 13.3944 8.87628 14.5427C8.87628 14.8227 8.6412 15.0467 8.36464 15.0467H5.66818C5.37779 15.0467 5.15655 14.8087 5.15655 14.5286C5.15655 13.9125 5.19803 13.3104 5.29483 12.7083C5.37779 12.2042 5.48842 11.7841 5.65435 11.4481C5.91709 10.874 6.35958 10.2859 7.0095 9.64175C7.12012 9.52973 7.23074 9.43171 7.3552 9.31969C8.07425 8.66157 8.6412 8.04546 9.01455 7.48535C9.36025 6.98126 9.52619 6.44916 9.52619 5.88906C9.52619 5.20293 9.30494 4.65683 8.87628 4.20875C8.44761 3.76067 7.82535 3.55063 7.02332 3.55063H6.98184C6.19365 3.55063 5.59904 3.76067 5.19803 4.19475C4.74171 4.68484 4.40983 5.18893 4.20241 5.70703C4.09179 5.97308 3.8014 6.0991 3.53867 6.00108C3.53867 6.00108 3.53867 6.00108 3.52484 6.00108L1.2294 4.9929C0.980494 4.88087 0.856042 4.60082 0.952838 4.33477C1.16026 3.76067 1.45065 3.21457 1.81017 2.72448C2.18353 2.22039 2.62602 1.7583 3.12383 1.36623C4.1471 0.540076 5.44693 0.119999 6.95419 0.119999H6.99567C8.90393 0.119999 10.4112 0.680102 11.4759 1.78631C12.5269 2.89251 13.08 4.23676 13.08 5.79104ZM6.95419 17.0351C5.6267 17.0351 4.56194 18.1273 4.56194 19.4576C4.56194 20.7878 5.64053 21.88 6.95419 21.88C8.26784 21.88 9.34643 20.7878 9.34643 19.4576C9.34643 18.1273 8.26784 17.0351 6.95419 17.0351Z"
+ fill="white" />
+</svg>
\ No newline at end of file
diff --git a/assets/js/editing-helper.js b/assets/js/editing-helper.js
index 79231cf..2ff1b51 100644
--- a/assets/js/editing-helper.js
+++ b/assets/js/editing-helper.js
@@ -6,10 +6,9 @@
Drupal.behaviors.help_description = {
attach: function (context, settings) {
const parentElements = document.querySelectorAll(".editing-helper-block"); // Select all help sections
-
parentElements.forEach((parentElement) => {
const helpContent = parentElement.querySelector(".help-content"); // Get the specific help content for each section
-
+ let closeBtn = parentElement.querySelector(".helper-close-btn");
if (helpContent) {
// Check if the event listener is already attached
if (!parentElement.getAttribute("data-listener-attached")) {
@@ -20,27 +19,15 @@
// Check if the clicked element is the toggle button
if (clickedElement.classList.contains("toggle-help")) {
// Prevent any parent events from being triggered
- event.stopPropagation();
-
- // Toggle the help content
- if (
- helpContent.style.visibility === "hidden" ||
- helpContent.style.visibility === ""
- ) {
- helpContent.style.visibility = "visible";
- helpContent.style.maxHeight = helpContent.scrollHeight + "px"; // Expand smoothly
- } else {
- helpContent.style.maxHeight = 0; // Collapse smoothly
- setTimeout(function () {
- helpContent.style.visibility = "hidden";
- }, 300); // Adjust this timeout to match your transition duration
- }
+ helpContent.classList.toggle("active");
}
});
-
// Mark the element as having the event listener attached
parentElement.setAttribute("data-listener-attached", "true");
}
+ closeBtn.addEventListener("click", function (event) {
+ helpContent.classList.remove("active");
+ });
}
});
},
diff --git a/assets/style/editing-helper.pcss.css b/assets/style/editing-helper.pcss.css
index 36bf73c..262ae63 100644
--- a/assets/style/editing-helper.pcss.css
+++ b/assets/style/editing-helper.pcss.css
@@ -1,39 +1,69 @@
.editing-helper-block {
.help-wrapper {
+ position: relative;
margin-bottom: 8px;
+ width: fit-content;
+ font-size: 14px;
}
.toggle-help {
background-color: #df000f;
- color: #fff;
- padding: 6px 12px;
border: none;
- border-radius: 5px;
- font-size: 14px;
cursor: pointer;
- transition: background-color 0.3s ease;
- box-shadow: 0 4px 6px rgba(#df000f, 0.4);
- pointer-events: all !important;
margin-bottom: 15px;
+ border-radius: 50%;
+ background-image: url(../../assets/icons/question-icon.svg);
+ width: 32px;
+ height: 32px;
+ background-repeat: no-repeat;
+ background-position: center;
}
-
.toggle-help:hover {
background-color: #a0040e;
}
.help-content {
- background-color: #e9ecef;
- border-radius: 6px;
+ position: absolute;
+ top: 0;
+ left: calc(100% + 15px);
+ width: 320px;
+ z-index: 5;
+ background-color: white;
+ border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
overflow: hidden;
- max-height: 0;
- padding: 0 15px;
- visibility: hidden;
- transition: max-height 0.3s ease-in-out;
+ padding: 24px;
+ display: none;
+ color: #002856;
+ }
+
+ .help-content h2 {
+ font-size: 18px;
+ color: #002856;
+ }
+ .help-content span {
+ color: #00285680;
+ }
+ .help-content.active {
+ display: block;
}
.help-content p {
margin: 0;
- font-size: 14px;
- color: #333;
}
+ .top-content {
+ display: flex;
+ justify-content: space-between;
+ }
+ .helper-close-btn {
+ background-image: url(../../assets/icons/close-btn.svg);
+ width: 14px;
+ height: 14px;
+ background-repeat: no-repeat;
+ background-position: center;
+ cursor: pointer;
+ }
+}
+[dir="rtl"] .editing-helper-block .help-content {
+ right: calc(100% + 15px);
+ left: unset;
}
diff --git a/editing_helper.info.yml b/editing_helper.info.yml
index bf9a6e3..a5dd3ad 100644
--- a/editing_helper.info.yml
+++ b/editing_helper.info.yml
@@ -3,3 +3,8 @@ type: module
description: Provides description helper for editor to provide optimized user experience.
core_version_requirement: ^9 || ^10 || ^11
configure: editing_helper.config
+
+# Information added by Drupal.org packaging script on 2024-12-11
+version: '1.0.3'
+project: 'editing_helper'
+datestamp: 1733909405
diff --git a/editing_helper.module b/editing_helper.module
index 78aa6f2..50ff289 100644
--- a/editing_helper.module
+++ b/editing_helper.module
@@ -130,7 +130,6 @@ function editing_helper_preprocess_block(array &$variables) {
// Add the help wrapper with the computed help text.
if (!empty($help_text) && $current_user->hasPermission('access to editing helper')) {
- $block_title = (string) $config->get('block_title');
$variables['title_prefix']['help_wrapper'] = [
'#type' => 'container',
'#attributes' => ['class' => ['help-wrapper']],
@@ -138,21 +137,14 @@ function editing_helper_preprocess_block(array &$variables) {
'toggle_help_button' => [
'#type' => 'html_tag',
'#tag' => 'button',
- '#value' => $block_title ? $block_title : t('Want Help!'),
'#attributes' => [
'class' => ['toggle-help'],
'type' => 'button',
],
],
'help_content' => [
- '#type' => 'container',
- '#attributes' => [
- 'class' => ['help-content'],
- 'style' => 'visibility:hidden;',
- ],
- 'content' => [
- '#markup' => '<p>' . $help_text . '</p>',
- ],
+ '#theme' => 'help_content',
+ '#help_text' => $help_text,
],
'#attached' => [
'library' => [
@@ -161,5 +153,20 @@ function editing_helper_preprocess_block(array &$variables) {
],
'#weight' => 100,
];
+
}
}
+
+/**
+ * Implements hook_theme().
+ */
+function editing_helper_theme() {
+ return [
+ 'help_content' => [
+ 'variables' => [
+ 'help_text' => NULL,
+ ],
+ 'template' => 'help-content',
+ ],
+ ];
+}
diff --git a/templates/help-content.html.twig b/templates/help-content.html.twig
new file mode 100644
index 0000000..59ac7d2
--- /dev/null
+++ b/templates/help-content.html.twig
@@ -0,0 +1,8 @@
+<div class="help-content">
+ <div class="top-content">
+ <div class="toggle-help"></div>
+ <div class="helper-close-btn"></div>
+ </div>
+ <h2 class="text">{{'Want Help!'|t}}</h2>
+ <p>{{help_text|raw}}</p>
+</div>
--
GitLab