/** * {@inheritdoc} */ public function buildForm(array $form, FormStateInterface $form_state, FilterFormat $filter_format = NULL) { // Add AJAX support. $form['#prefix'] = '<div id="video-embed-dialog-form">'; $form['#suffix'] = '</div>'; // Ensure relevant dialog libraries are attached. $form['#attached']['library'][] = 'editor/drupal.editor.dialog'; // Simple URL field and submit button for video URL. $form['video_url'] = ['#type' => 'textfield', '#title' => $this->t('Video URL'), '#required' => TRUE, '#default_value' => $this->getUserInput($form_state, 'video_url')]; // If no settings are found, use the defaults configured in the filter // formats interface. $settings = $this->getUserInput($form_state, 'settings'); if (empty($settings) && ($editor = Editor::load($filter_format->id()))) { $editor_settings = $editor->getSettings(); $plugin_settings = NestedArray::getValue($editor_settings, ['plugins', 'video_embed', 'defaults', 'children']); $settings = $plugin_settings ? $plugin_settings : []; } // Create a settings form from the existing video formatter. $form['settings'] = Video::mockInstance($settings)->settingsForm([], new FormState()); $form['settings']['#type'] = 'fieldset'; $form['settings']['#title'] = $this->t('Settings'); $form['actions'] = ['#type' => 'actions']; $form['actions']['save_modal'] = ['#type' => 'submit', '#value' => $this->t('Save'), '#submit' => [], '#ajax' => ['callback' => '::ajaxSubmit', 'event' => 'click', 'wrapper' => 'video-embed-dialog-form']]; return $form; }
/** * {@inheritdoc} * * @param \Drupal\filter\Entity\FilterFormat $filter_format * The filter format for which this dialog corresponds. */ public function buildForm(array $form, FormStateInterface $form_state, FilterFormat $filter_format = NULL) { // This form is special, in that the default values do not come from the // server side, but from the client side, from a text editor. We must cache // this data in form state, because when the form is rebuilt, we will be // receiving values from the form, instead of the values from the text // editor. If we don't cache it, this data will be lost. if (isset($form_state->getUserInput()['editor_object'])) { // By convention, the data that the text editor sends to any dialog is in // the 'editor_object' key. And the image dialog for text editors expects // that data to be the attributes for an <img> element. $image_element = $form_state->getUserInput()['editor_object']; $form_state->set('image_element', $image_element); $form_state->setCached(TRUE); } else { // Retrieve the image element's attributes from form state. $image_element = $form_state->get('image_element') ?: []; } $form['#tree'] = TRUE; $form['#attached']['library'][] = 'editor/drupal.editor.dialog'; $form['#prefix'] = '<div id="editor-image-dialog-form">'; $form['#suffix'] = '</div>'; $editor = editor_load($filter_format->id()); // Construct strings to use in the upload validators. $image_upload = $editor->getImageUploadSettings(); if (!empty($image_upload['dimensions'])) { $max_dimensions = $image_upload['dimensions']['max_width'] . '×' . $image_upload['dimensions']['max_height']; } else { $max_dimensions = 0; } $max_filesize = min(Bytes::toInt($image_upload['max_size']), file_upload_max_size()); $existing_file = isset($image_element['data-entity-uuid']) ? \Drupal::entityManager()->loadEntityByUuid('file', $image_element['data-entity-uuid']) : NULL; $fid = $existing_file ? $existing_file->id() : NULL; $form['fid'] = array('#title' => $this->t('Image'), '#type' => 'managed_file', '#upload_location' => $image_upload['scheme'] . '://' . $image_upload['directory'], '#default_value' => $fid ? array($fid) : NULL, '#upload_validators' => array('file_validate_extensions' => array('gif png jpg jpeg'), 'file_validate_size' => array($max_filesize), 'file_validate_image_resolution' => array($max_dimensions)), '#required' => TRUE); $form['attributes']['src'] = array('#title' => $this->t('URL'), '#type' => 'textfield', '#default_value' => isset($image_element['src']) ? $image_element['src'] : '', '#maxlength' => 2048, '#required' => TRUE); // If the editor has image uploads enabled, show a managed_file form item, // otherwise show a (file URL) text form item. if ($image_upload['status']) { $form['attributes']['src']['#access'] = FALSE; $form['attributes']['src']['#required'] = FALSE; } else { $form['fid']['#access'] = FALSE; $form['fid']['#required'] = FALSE; } // The alt attribute is *required*, but we allow users to opt-in to empty // alt attributes for the very rare edge cases where that is valid by // specifying two double quotes as the alternative text in the dialog. // However, that *is* stored as an empty alt attribute, so if we're editing // an existing image (which means the src attribute is set) and its alt // attribute is empty, then we show that as two double quotes in the dialog. // @see https://www.drupal.org/node/2307647 $alt = isset($image_element['alt']) ? $image_element['alt'] : ''; if ($alt === '' && !empty($image_element['src'])) { $alt = '""'; } $form['attributes']['alt'] = array('#title' => $this->t('Alternative text'), '#placeholder' => $this->t('Short description for the visually impaired'), '#type' => 'textfield', '#required' => TRUE, '#required_error' => $this->t('Alternative text is required.<br />(Only in rare cases should this be left empty. To create empty alternative text, enter <code>""</code> — two double quotes without any content).'), '#default_value' => $alt, '#maxlength' => 2048); // When Drupal core's filter_align is being used, the text editor may // offer the ability to change the alignment. if (isset($image_element['data-align']) && $filter_format->filters('filter_align')->status) { $form['align'] = array('#title' => $this->t('Align'), '#type' => 'radios', '#options' => array('none' => $this->t('None'), 'left' => $this->t('Left'), 'center' => $this->t('Center'), 'right' => $this->t('Right')), '#default_value' => $image_element['data-align'] === '' ? 'none' : $image_element['data-align'], '#wrapper_attributes' => array('class' => array('container-inline')), '#attributes' => array('class' => array('container-inline')), '#parents' => array('attributes', 'data-align')); } // When Drupal core's filter_caption is being used, the text editor may // offer the ability to in-place edit the image's caption: show a toggle. if (isset($image_element['hasCaption']) && $filter_format->filters('filter_caption')->status) { $form['caption'] = array('#title' => $this->t('Caption'), '#type' => 'checkbox', '#default_value' => $image_element['hasCaption'] === 'true', '#parents' => array('attributes', 'hasCaption')); } $form['actions'] = array('#type' => 'actions'); $form['actions']['save_modal'] = array('#type' => 'submit', '#value' => $this->t('Save'), '#submit' => array(), '#ajax' => array('callback' => '::submitForm', 'event' => 'click')); return $form; }
/** * {@inheritdoc} * * @param \Drupal\filter\Entity\FilterFormat $filter_format * The filter format for which this dialog corresponds. */ public function buildForm(array $form, FormStateInterface $form_state, FilterFormat $filter_format = NULL) { // This form is special, in that the default values do not come from the // server side, but from the client side, from a text editor. We must cache // this data in form state, because when the form is rebuilt, we will be // receiving values from the form, instead of the values from the text // editor. If we don't cache it, this data will be lost. if (isset($form_state->getUserInput()['editor_object'])) { // By convention, the data that the text editor sends to any dialog is in // the 'editor_object' key. And the image dialog for text editors expects // that data to be the attributes for an <img> element. $file_element = $form_state->getUserInput()['editor_object']; $form_state->set('file_element', $file_element); $form_state->setCached(TRUE); } else { // Retrieve the image element's attributes from form state. $file_element = $form_state->get('file_element') ?: []; } $form['#tree'] = TRUE; $form['#attached']['library'][] = 'editor/drupal.editor.dialog'; $form['#prefix'] = '<div id="editor-file-dialog-form">'; $form['#suffix'] = '</div>'; // Load dialog settings. $editor = editor_load($filter_format->id()); $file_upload = $editor->getThirdPartySettings('editor_file'); $max_filesize = min(Bytes::toInt($file_upload['max_size']), file_upload_max_size()); $existing_file = isset($file_element['data-entity-uuid']) ? \Drupal::entityManager()->loadEntityByUuid('file', $file_element['data-entity-uuid']) : NULL; $fid = $existing_file ? $existing_file->id() : NULL; $form['fid'] = array( '#title' => $this->t('File'), '#type' => 'managed_file', '#upload_location' => $file_upload['scheme'] . '://' . $file_upload['directory'], '#default_value' => $fid ? array($fid) : NULL, '#upload_validators' => array( 'file_validate_extensions' => !empty($file_upload['extensions']) ? $file_upload['extensions'] : array('txt'), 'file_validate_size' => array($max_filesize), ), '#required' => TRUE, ); $form['attributes']['href'] = array( '#title' => $this->t('URL'), '#type' => 'textfield', '#default_value' => isset($file_element['href']) ? $file_element['href'] : '', '#maxlength' => 2048, '#required' => TRUE, ); if ($file_upload['status']) { $form['attributes']['href']['#access'] = FALSE; $form['attributes']['href']['#required'] = FALSE; } else { $form['fid']['#access'] = FALSE; $form['fid']['#required'] = FALSE; } $form['actions'] = array( '#type' => 'actions', ); $form['actions']['save_modal'] = array( '#type' => 'submit', '#value' => $this->t('Save'), // No regular submit-handler. This form only works via JavaScript. '#submit' => array(), '#ajax' => array( 'callback' => '::submitForm', 'event' => 'click', ), ); return $form; }
/** * {@inheritdoc} * * @param \Drupal\filter\Entity\FilterFormat $filter_format * The filter format for which this dialog corresponds. */ public function buildForm(array $form, FormStateInterface $form_state, FilterFormat $filter_format = NULL) { // The default values are set directly from \Drupal::request()->request, // provided by the editor plugin opening the dialog. $user_input = $form_state->getUserInput(); $input = isset($user_input['editor_object']) ? $user_input['editor_object'] : []; /** @var \Drupal\editor\EditorInterface $editor */ $editor = $this->editorStorage->load($filter_format->id()); $linkit_profile_id = $editor->getSettings()['plugins']['linkit']['linkit_profile']; $this->linkitProfile = $this->linkitProfileStorage->load($linkit_profile_id); $form['#tree'] = TRUE; $form['#attached']['library'][] = 'editor/drupal.editor.dialog'; $form['#prefix'] = '<div id="linkit-editor-dialog-form">'; $form['#suffix'] = '</div>'; // Everything under the "attributes" key is merged directly into the // generated link tag's attributes. $form['attributes']['href'] = [ '#title' => $this->t('Link'), '#type' => 'linkit', '#default_value' => isset($input['href']) ? $input['href'] : '', '#description' => $this->t('Start typing to find content or paste a URL.'), '#autocomplete_route_name' => 'linkit.autocomplete', '#autocomplete_route_parameters' => [ 'linkit_profile_id' => $linkit_profile_id ], '#weight' => 0, ]; $this->addAttributes($form, $form_state, $this->linkitProfile->getAttributes()); $form['actions'] = [ '#type' => 'actions', ]; $form['actions']['save_modal'] = [ '#type' => 'submit', '#value' => $this->t('Save'), '#submit' => [], '#ajax' => [ 'callback' => '::submitForm', 'event' => 'click', ], ]; return $form; }
/** * {@inheritdoc} * * @param \Drupal\filter\Entity\FilterFormat $filter_format * The filter format for which this dialog corresponds. */ public function buildForm(array $form, FormStateInterface $form_state, FilterFormat $filter_format = NULL) { // This form is special, in that the default values do not come from the // server side, but from the client side, from a text editor. We must cache // this data in form state, because when the form is rebuilt, we will be // receiving values from the form, instead of the values from the text // editor. If we don't cache it, this data will be lost. $user_input = $form_state->getUserInput(); if (isset($user_input['editor_object'])) { // By convention, the data that the text editor sends to any dialog is in // the 'editor_object' key. And the image dialog for text editors expects // that data to be the attributes for an <img> element. $image_element = $user_input['editor_object']; $form_state->set('image_element', $image_element); $form_state->setCached(TRUE); } elseif ($form_state->getTemporaryValue('wizard')) { $image_element = $form_state->getTemporaryValue('wizard')['image_element']; } else { // Retrieve the image element's attributes from form state. $image_element = $form_state->get('image_element') ?: []; } // Add libraries and wrap the form in ajax wrappers. $form['#tree'] = TRUE; $form['#attached']['library'][] = 'editor/drupal.editor.dialog'; $form['#prefix'] = '<div id="' . self::AJAX_WRAPPER_ID . '">'; $form['#suffix'] = '</div>'; /** @var \Drupal\editor\Entity\Editor $editor */ $editor = $this->entityTypeManager->getStorage('editor')->load($filter_format->id()); // Construct strings to use in the upload validators. $embridge_image_settings = $editor->getSettings()['plugins']['embridgeimage']['embridge_image_upload']; $max_filesize = min(Bytes::toInt($embridge_image_settings['max_size']), file_upload_max_size()); /** @var \Drupal\embridge\EmbridgeAssetEntityInterface $existing_asset */ $existing_asset = isset($image_element['data-entity-uuid']) ? $this->entityRepository->loadEntityByUuid('embridge_asset_entity', $image_element['data-entity-uuid']) : NULL; $asset_id = $existing_asset ? $existing_asset->id() : NULL; /** @var \Drupal\embridge\EmbridgeCatalogInterface $catalog */ $catalog = $this->entityTypeManager->getStorage('embridge_catalog')->load($embridge_image_settings['catalog_id']); // Create a preview image. $preview = FALSE; if (!empty($user_input['_triggering_element_name'])) { $triggering_element = $user_input['_triggering_element_name']; } // If we are editing an existing asset, use that thumbnail. if (empty($form_state->getValues()) && $existing_asset) { $preview = $this->assetHelper->getAssetConversionUrl($existing_asset, $catalog->getApplicationId(), 'thumb'); } elseif (isset($triggering_element) && $triggering_element != 'asset_remove_button' && ($uploaded_id = $form_state->getValue(['asset', 0]))) { /** @var \Drupal\embridge\EmbridgeAssetEntityInterface $uploaded_asset */ $uploaded_asset = $this->entityTypeManager->getStorage('embridge_asset_entity')->load($uploaded_id); if ($uploaded_asset) { $preview = $this->assetHelper->getAssetConversionUrl($uploaded_asset, $catalog->getApplicationId(), 'thumb'); } } // Use a stock image for preview. if (!$preview) { $preview = drupal_get_path('module', 'embridge_ckeditor') . '/images/preview-image.png'; } // TODO: Make this configurable. $allowed_extensions = 'gif png jpg jpeg'; $url_options = ['filter_format' => $filter_format->id(), 'extensions' => $allowed_extensions, 'catalog_id' => $embridge_image_settings['catalog_id']]; $link_url = Url::fromRoute('embridge_ckeditor.image.wizard', $url_options); $link_url->setOptions(['attributes' => ['class' => ['use-ajax', 'button'], 'data-accepts' => 'application/vnd.drupal-modal', 'data-dialog-type' => 'modal', 'data-dialog-options' => Json::encode(['width' => 1000])]]); $class = get_class($this); $form['asset'] = ['preview' => ['#theme' => 'image', '#uri' => $preview, '#weight' => -100], '#title' => $this->t('Image'), '#type' => 'embridge_asset', '#catalog_id' => $embridge_image_settings['catalog_id'], '#library_id' => $embridge_image_settings['library_id'], '#upload_location' => 'public://' . $embridge_image_settings['directory'], '#default_value' => $asset_id ? [$asset_id] : NULL, '#upload_validators' => ['validateFileExtensions' => [$allowed_extensions], 'validateFileSize' => [$max_filesize]], '#pre_render' => [[$class, 'preRenderAssetElement']], '#allow_search' => FALSE, '#required' => TRUE, 'search_link' => Link::fromTextAndUrl('Search asset library', $link_url)->toRenderable()]; $form['asset']['search_link']['#weight'] = 100; $form['attributes'] = ['#type' => 'container', '#tree' => TRUE, '#attributes' => ['class' => ['image-attributes']]]; $form['attributes']['src'] = ['#type' => 'value']; $alt = isset($image_element['alt']) ? $image_element['alt'] : ''; $form['attributes']['alt'] = ['#title' => $this->t('Alternative text'), '#description' => $this->t('The alt text describes the image for non-sighted users. <br/>The alt text can remain empty only if the image conveys no meaning (is decorative only).'), '#type' => 'textfield', '#default_value' => $alt, '#maxlength' => 2048]; $conversion = isset($image_element['data-conversion']) ? $image_element['data-conversion'] : ''; $conversions_array = $catalog->getConversionsArray(); $form['attributes']['data-conversion'] = ['#title' => $this->t('Image size'), '#description' => $this->t('Choose the image size conversion to display.'), '#type' => 'select', '#default_value' => $conversion, '#options' => array_combine($conversions_array, $conversions_array)]; // When Drupal core's filter_align is being used, the text editor may // offer the ability to change the alignment. if ($filter_format->filters('filter_align')->status) { $data_align = !empty($image_element['data-align']) ? $image_element['data-align'] : ''; $form['attributes']['data-align'] = ['#title' => $this->t('Align'), '#description' => $this->t('How the image will align within the content.'), '#type' => 'select', '#options' => ['none' => $this->t('None'), 'left' => $this->t('Left'), 'center' => $this->t('Center'), 'right' => $this->t('Right')], '#default_value' => $data_align]; } $form['actions'] = ['#type' => 'actions']; $form['actions']['save_modal'] = ['#type' => 'submit', '#value' => $this->t('Save'), '#submit' => [], '#ajax' => ['callback' => [$this, 'ajaxSave'], 'event' => 'click'], '#attributes' => ['class' => ['button--primary']]]; return $form; }