yaffs.net Git - yaffs-website/blob - vendor/chi-teck/drupal-code-generator/templates/d8/plugin/_ckeditor/dialog.twig

   1 /**
   2  * @file
   3  * Defines dialog for {{ plugin_label }} CKEditor plugin.
   4  */
   5 (function (Drupal) {
   6
   7   'use strict';
   8
   9   // Dialog definition.
  10   CKEDITOR.dialog.add('{{ command_name }}Dialog', function(editor) {
  11
  12     return {
  13
  14       // Basic properties of the dialog window: title, minimum size.
  15       title: Drupal.t('Abbreviation properties'),
  16       minWidth: 400,
  17       minHeight: 150,
  18
  19       // Dialog window content definition.
  20       contents: [
  21         {
  22           // Definition of the settings dialog tab.
  23           id: 'tab-settings',
  24           label: 'Settings',
  25
  26           // The tab content.
  27           elements: [
  28             {
  29               // Text input field for the abbreviation text.
  30               type: 'text',
  31               id: 'abbr',
  32               label: Drupal.t('Abbreviation'),
  33
  34               // Validation checking whether the field is not empty.
  35               validate: CKEDITOR.dialog.validate.notEmpty(Drupal.t('Abbreviation field cannot be empty.'))
  36             },
  37             {
  38               // Text input field for the abbreviation title (explanation).
  39               type: 'text',
  40               id: 'title',
  41               label: Drupal.t('Explanation'),
  42               validate: CKEDITOR.dialog.validate.notEmpty(Drupal.t('Explanation field cannot be empty.'))
  43             }
  44           ]
  45         }
  46       ],
  47
  48       // This method is invoked once a user clicks the OK button, confirming the
  49       // dialog.
  50       onOk: function() {
  51
  52         // The context of this function is the dialog object itself.
  53         // See http://docs.ckeditor.com/#!/api/CKEDITOR.dialog.
  54         var dialog = this;
  55
  56         // Create a new <abbr> element.
  57         var abbr = editor.document.createElement('abbr');
  58
  59         // Set element attribute and text by getting the defined field values.
  60         abbr.setAttribute('title', dialog.getValueOf('tab-settings', 'title'));
  61         abbr.setText( dialog.getValueOf('tab-settings', 'abbr'));
  62
  63         // Finally, insert the element into the editor at the caret position.
  64         editor.insertElement(abbr);
  65       }
  66     };
  67
  68   });
  69
  70 } (Drupal));