js/wysiwyg/admin.ckeditor-configurator.js

   1 // https://civicrm.org/licensing
   2 (function($, _) {
   3   'use strict';
   4   /* jshint validthis: true */
   5
   6   var configRowTpl = _.template($('#config-row-tpl').html()),
   7     options;
   8
   9   // Weird conflict with drupal styles
  10   $('body').removeClass('toolbar');
  11
  12   function format(item) {
  13     var icon = '<span class="ui-icon ui-icon-gear"></span>';
  14     if (item.icon) {
  15       icon = '<img src="' + CRM.config.resourceBase + item.icon + '" />';
  16     }
  17     return icon + '&nbsp;' + item.text;
  18   }
  19
  20   function initOptions(data) {
  21     options = _.filter(data, function(n) {
  22       return $.inArray(n.id, CRM.vars.ckConfig.blacklist) < 0;
  23     });
  24     addOption();
  25     $.each(CRM.vars.ckConfig.settings, function(key, val) {
  26       if ($.inArray(key, CRM.vars.ckConfig.blacklist) < 0) {
  27         var $opt = $('.crm-config-option-row:last input.crm-config-option-name');
  28         $opt.val(key).change();
  29         $opt.siblings('span').find(':input').val(val);
  30       }
  31     });
  32   }
  33
  34   function changeOptionName() {
  35     var $el = $(this),
  36       name = $el.val();
  37     $el.next('span').remove();
  38     if (name) {
  39       if (($('input.crm-config-option-name').filter(function() {return !this.value;})).length < 1) {
  40         addOption();
  41       }
  42       var type = $el.select2('data').type;
  43       if (type === 'Boolean') {
  44         $el.after('<span>&nbsp; = &nbsp;<select class="crm-form-select" name="config_' + name + '"><option value="false">false</option><option value="true">true</option></select></span>');
  45       }
  46       else {
  47         $el.after('<span>&nbsp; = &nbsp;<input class="crm-form-text ' + (type==='Number' ? 'eight" type="number"' : 'huge" type="text"') + ' name="config_' + name + '"/></span>');
  48         $el.next('span').find('input.crm-form-text[type=text]').change(validateJson);
  49       }
  50     } else {
  51       $el.closest('div').remove();
  52     }
  53   }
  54
  55   function getOptionList() {
  56     var list = [];
  57     _.forEach(options, function(option) {
  58       var opt = _.cloneDeep(option);
  59       if ($('[name="config_' + opt.id + '"]').length) {
  60         opt.disabled = true;
  61       }
  62       list.push(opt);
  63     });
  64     return {results: list, text: 'id'};
  65   }
  66
  67   function validateJson() {
  68     var val = $(this).val();
  69     $(this).parent().removeClass('crm-error');
  70     if (val[0] === '[' || val[0] === '{') {
  71       try {
  72         JSON.parse(val);
  73       } catch (e) {
  74         $(this).parent().addClass('crm-error');
  75       }
  76     }
  77   }
  78
  79   function addOption() {
  80     $('#crm-custom-config-options').append($(configRowTpl({})));
  81     $('.crm-config-option-row:last input.crm-config-option-name', '#crm-custom-config-options').crmSelect2({
  82       data: getOptionList,
  83       formatSelection: function(field) {
  84         return '<strong>' + field.id + '</strong> (' + field.type + ')';
  85       },
  86       formatResult: function(field) {
  87         return '<strong>' + field.id + '</strong> (' + field.type + ')' +
  88           '<div class="api-field-desc">' + field.description + '</div>';
  89       }
  90     });
  91   }
  92
  93   $('#extraPlugins').crmSelect2({
  94     multiple: true,
  95     closeOnSelect: false,
  96     data: CRM.vars.ckConfig.plugins,
  97     escapeMarkup: _.identity,
  98     formatResult: format,
  99     formatSelection: format
 100   });
 101
 102   var toolbarModifier = new ToolbarConfigurator.ToolbarModifier( 'editor-basic' );
 103
 104   toolbarModifier.init(_.noop);
 105
 106   CKEDITOR.document.getById( 'toolbarModifierWrapper' ).append( toolbarModifier.mainContainer );
 107
 108   $(function() {
 109     var selectorOpen = false,
 110       changedWhileOpen = false;
 111
 112     $('#toolbarModifierForm')
 113       .on('submit', function(e) {
 114         $('.toolbar button:last', '#toolbarModifierWrapper')[0].click();
 115         $('.configContainer textarea', '#toolbarModifierWrapper').attr('name', 'config');
 116       })
 117       .on('change', '.config-param', function(e) {
 118         changedWhileOpen = true;
 119         if (!selectorOpen) {
 120           $('#toolbarModifierForm').submit().block();
 121         }
 122       })
 123       .on('change', 'input.crm-config-option-name', changeOptionName)
 124       // Debounce the change event so it only fires after the multiselect is closed
 125       .on('select2-open', 'input.config-param', function(e) {
 126         selectorOpen = true;
 127         changedWhileOpen = false;
 128       })
 129       .on('select2-close', 'input.config-param', function(e) {
 130         selectorOpen = false;
 131         if (changedWhileOpen) {
 132           $(this).change();
 133         }
 134       });
 135
 136     $.getJSON(CRM.config.resourceBase + 'js/wysiwyg/ck-options.json', null, initOptions);
 137   });
 138
 139 })(CRM.$, CRM._);