diff --git a/CHANGELOG.md b/CHANGELOG.md index f5613cf4..17bfabe4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,8 @@ before starting to add changes. Use example [placed in the end of the page](#exa ## [Unreleased] +- [PR-315](https://github.com/OS2Forms/os2forms/pull/315) + Added “Display on“ options to Map element - [PR-317](https://github.com/OS2Forms/os2forms/pull/317) Updated code analysis script. - [PR-306](https://github.com/OS2Forms/os2forms/pull/306) diff --git a/modules/os2forms_webform_maps/README.md b/modules/os2forms_webform_maps/README.md index c36b901e..d93aa5d4 100644 --- a/modules/os2forms_webform_maps/README.md +++ b/modules/os2forms_webform_maps/README.md @@ -14,3 +14,58 @@ the map. The data can be exported to PDF. ## Installation The module can be installed using the standard Drupal installation procedure. + +## Fetching GeoJSON using the API + +Assume that we have a webform with ID `my_webform` and the webform has a Map element with ID `my_map`. We can then fetch +the data for a submission with UUID `c34d01c5-7bd9-4b15-8b01-5787959453c0` on the webform with a HTTP `GET` request (cf. +[OS2Forms REST API](https://github.com/OS2Forms/os2forms_rest_api/blob/main/README.md)): + +``` shell name=api-fetch-submission-data +curl --silent --location --header 'api-key: my-api-key' http://127.0.0.1:8000/webform_rest/my_webform/submission/c34d01c5-7bd9-4b15-8b01-5787959453c0 +# {"entity":{"serial":[{"value":1}],"sid":[{"value":2}],"uuid":[{"value":"c34d01c5-7bd9-4b15-8b01-5787959453c0"}],…``` +``` + +The result, however, contains a lot of data and we need a little more work the extract just the GeoJSON data. + +Using [`jq`](https://jqlang.org/) (or similar tools), we can drill down into the full submission data to extract just +the GeoJSON data from the Map element (JSON decoding twice along the way): + +``` shell name=api-extract-map-element-data +curl --silent --location --header 'api-key: my-api-key' http://127.0.0.1:8000/webform_rest/my_webform/submission/c34d01c5-7bd9-4b15-8b01-5787959453c0 | jq '.data.my_map | fromjson | .geojson | fromjson' +``` + +The final result will be something like + +``` json +{ + "type": "FeatureCollection", + "features": [ + { + "type": "Feature", + "properties": {}, + "geometry": { + "type": "LineString", + "coordinates": [ + [ + 10.193674, + 56.158929 + ], + [ + 10.241758, + 56.155296 + ], + [ + 10.242788, + 56.130048 + ], + [ + 10.189209, + 56.129283 + ] + ] + } + } + ] +} +``` diff --git a/modules/os2forms_webform_maps/os2forms_webform_maps.module b/modules/os2forms_webform_maps/os2forms_webform_maps.module index af545a5d..17d33aab 100644 --- a/modules/os2forms_webform_maps/os2forms_webform_maps.module +++ b/modules/os2forms_webform_maps/os2forms_webform_maps.module @@ -5,22 +5,6 @@ * Module file for os2forms_webform_maps. */ -/** - * Implements hook_theme(). - */ -function os2forms_webform_maps_theme() { - return [ - 'webform_element_base_html__webform_map_field' => [ - 'variables' => [ - 'element' => [], - 'value' => NULL, - 'webform_submission' => NULL, - 'options' => [], - ], - ], - ]; -} - /** * Implements hook_locale_translation_projects_alter(). */ @@ -29,31 +13,3 @@ function os2forms_webform_maps_locale_translation_projects_alter(&$projects) { $path = $module_handler->getModule('os2forms_webform_maps')->getPath(); $projects['os2forms_webform_maps']['info']['interface translation server pattern'] = $path . '/translations/%language.po'; } - -/** - * Implements hook_preprocess_webform_element_base_html__webform_map_field(). - */ -function os2forms_webform_maps_preprocess_webform_element_base_html__webform_map_field(array &$variables) { - // Decode the plain text value once. - $decoded_value = json_decode($variables['value']['#plain_text']); - - // Use the decoded geojson property. - $variables['value']['#plain_text'] = $decoded_value->geojson; - - // Load the webform element base HTML template. - \Drupal::moduleHandler()->loadInclude('webform', 'inc', 'includes/webform.theme.template'); - template_preprocess_webform_element_base_html($variables); - - // Generate a unique ID for the map image. - $map_image_id = 'map-image-' . $variables['element']['#webform_key']; - - $variables['map_image'] = [ - '#type' => 'html_tag', - '#tag' => 'img', - '#attributes' => [ - 'class' => ['handler-help-message'], - 'id' => [$map_image_id], - 'src' => $decoded_value->image ?? '', - ], - ]; -} diff --git a/modules/os2forms_webform_maps/src/Plugin/WebformElement/WebformLeafletMapField.php b/modules/os2forms_webform_maps/src/Plugin/WebformElement/WebformLeafletMapField.php index 3b6aa405..00327dcf 100644 --- a/modules/os2forms_webform_maps/src/Plugin/WebformElement/WebformLeafletMapField.php +++ b/modules/os2forms_webform_maps/src/Plugin/WebformElement/WebformLeafletMapField.php @@ -5,6 +5,7 @@ use Drupal\Core\Form\FormStateInterface; use Drupal\leaflet\LeafletSettingsElementsTrait; use Drupal\webform\Plugin\WebformElementBase; +use Drupal\webform\WebformSubmissionInterface; /** * Provides a 'webform_map_field' element. @@ -70,6 +71,9 @@ public function defineDefaultProperties(): array { 'circle_color' => '#3388FF', 'rectangle_color' => '#3388FF', + // Display settings. + 'display_image_on' => ['email', 'html', 'pdf'], + 'display_geojson_on' => ['text', 'html'], ] + parent::defineDefaultProperties(); } @@ -344,7 +348,120 @@ public function form(array $form, FormStateInterface $form_state) { ], ]; + $form['display_settings'] = [ + '#type' => 'fieldset', + '#title' => $this->t('Display settings'), + ]; + $form['display_settings']['display_settings_container'] = [ + 'display_image_on' => [ + '#type' => 'checkboxes', + '#title' => $this->t('Display image on'), + '#options' => [ + 'email' => $this->t('Email'), + 'html' => $this->t('HTML'), + 'pdf' => $this->t('PDF'), + ], + ], + + 'display_geojson_on' => [ + '#type' => 'checkboxes', + '#title' => $this->t('Display GeoJSON on'), + '#options' => [ + 'email' => $this->t('Email'), + 'html' => $this->t('HTML'), + 'pdf' => $this->t('PDF'), + 'text' => $this->t('Text'), + ], + ], + ]; + return $form; } + /** + * {@inheritdoc} + */ + protected function formatHtmlItem(array $element, WebformSubmissionInterface $webform_submission, array $options = []): array { + $value = $this->getMapValue($element, $webform_submission, $options); + + $imageId = 'map-image-' . $this->getKey($element); + + $build = []; + + $viewMode = $options['view_mode'] ?? 'results'; + if ('table' === $viewMode) { + $viewMode = 'html'; + } + elseif ($options['email'] ?? FALSE) { + $viewMode = 'email'; + } + elseif ($options['pdf'] ?? FALSE) { + $viewMode = 'pdf'; + } + + // @todo Is this (i.e. $element['#display_image_on']) really the way to get element configuration? + $showImageOn = array_filter((array) ($element['#display_image_on'] ?? NULL)); + $includeImage = isset($showImageOn[$viewMode]); + + $showGeoJsonOn = array_filter((array) ($element['#display_geojson_on'] ?? NULL)); + $includeGeoJson = isset($showGeoJsonOn[$viewMode]); + + if ($includeImage) { + $build['image'] = [ + '#type' => 'html_tag', + '#tag' => 'img', + '#attributes' => [ + 'class' => ['handler-help-message'], + 'id' => $imageId, + 'src' => $value['image'], + ], + '#prefix' => '
', + '#suffix' => '
', + ]; + } + + if ($includeGeoJson) { + $build['geojson'] = [ + '#markup' => $value['geojson'], + '#prefix' => '
', + '#suffix' => '
', + ]; + } + + return $build; + } + + /** + * {@inheritdoc} + */ + protected function formatTextItem(array $element, WebformSubmissionInterface $webform_submission, array $options = []) { + $value = $this->getMapValue($element, $webform_submission, $options); + + return $value['geojson']; + } + + /** + * Get structured map value. + * + * @return array{ + * image: string, + * geojson: string + * } + */ + private function getMapValue(array $element, WebformSubmissionInterface $webform_submission, array $options = []): array { + $value = $this->getValue($element, $webform_submission, $options); + + try { + $data = json_decode($value, associative: TRUE, flags: JSON_THROW_ON_ERROR); + } + catch (\JsonException) { + $data = []; + } + + return $data + [ + 'image' => '', + 'geojson' => 'null', + ]; + } + } diff --git a/modules/os2forms_webform_maps/templates/webform-element-base-html--webform-map-field.html.twig b/modules/os2forms_webform_maps/templates/webform-element-base-html--webform-map-field.html.twig deleted file mode 100644 index cd3a19bd..00000000 --- a/modules/os2forms_webform_maps/templates/webform-element-base-html--webform-map-field.html.twig +++ /dev/null @@ -1,18 +0,0 @@ -{# -/** - * @file - * Default theme implementation for a webform base element as html. - * - * Available variables: - * - element: The element. - * - title: The label for the element. - * - value: The content for the element. - * - item: The form item used to display the element. - * - options Associative array of options for element. - * - multiline: Flag to determine if value spans multiple lines. - * - email: Flag to determine if element is for an email. - */ -#} - {{ map_image }} - {{ item }} -