Autocomplete plugin for TinyMCE 3

I’ve made a fork at https://github.com/minhhai2209/TinyMCE-Autocomplete-Plugin from https://github.com/abrimo/TinyMCE-Autocomplete-Plugin.

This fork improves the method to calculate the caret’s current position so that the suggestion list can work as expected on Internet Explorer, Firefox, and Chrome. Also the suggested options as well as their labels are retrieved via callback functions in order to increase the flexibility.

Untitled

Example code:

$(document).ready(function() {

  var autocomplete_options = [
    {
      homepage: 'http://google.com',
      fullname: 'Google Inc.',
      description: 'Google'
    },
    {
      homepage: 'http://google.com',
      fullname: ' GitHub Inc.',
      description: 'GitHub'
    },
    {
      homepage: 'http://yahoo.com',
      fullname: 'Yahoo Inc.',
      description: 'Yahoo'
    },
    {
      homepage: 'http://yelp.com',
      fullname: 'Yelp Inc.',
      description: 'Yelp'
    },
    {
      homepage: 'http://microsoft.com',
      fullname: 'Microsoft Inc.',
      description: 'Microsoft'
    }
  ];

  var matchingOptions = function(currentWord) {
    var matches = [];
    for (var i in autocomplete_options) {
      var option = autocomplete_options[i];
      if (currentWord.length == 0 || beginningOfWordMatches(currentWord, option.description)) {
        matches.push(option);
      }
    }
    return matches;
  };

  var beginningOfWordMatches = function(beginning, option) {
    var test = new RegExp("^" + beginning, "i");
    return (option.match(test));
  };

  var asString = function(value) {
    var a = $('<a/>', { href: value.homepage }).text(value.fullname);
    return $('<div/>').append(a).html();
  };

  $('.tinymce').tinymce({
    theme : 'advanced',
    plugins : 'autocomplete',

    theme_advanced_buttons1 : '',
    theme_advanced_toolbar_location : 'top',
    theme_advanced_toolbar_align : 'left',
    theme_advanced_statusbar_location : 'none',

    autocomplete_matching_options: matchingOptions,
    autocomplete_as_string: asString
  });
});
Advertisements