Подключение визредактора к проекту

Форум /

Необходимо подключить редактор tinyMCE на проект. И вот тут я не могу сообразить, как это сделать. Ранее подключал и jQuery-плагины и небольшие скрипты вроде clamp.js. Там было достаточно просто:

беру код функции (например, clamp.js),
оборачиваю его в блок,
делаю provide функции для использования блоками
в блоках прописываю зависимость и использую уже внутри Пример:

modules.define('js-clampJS', ['jquery'], function(provide, $) {
    /*!
     * Clamp.js 0.5.1 Copyright 2011-2013, Joseph Schmitt http://joe.sh ...
     */

    (function(){
      function clamp(element, options){...}
      window.$clamp = clamp;
    })();

    provide($clamp);
});

modules.define('company-ads-clamp', ['i-bem__dom', 'BEMHTML', 'jquery', 'js-clampJS'], function(provide, BEMDOM, BEMHTML, $, $clamp) {
    provide(BEMDOM.decl(this.name,
   { ... }));
});

Код этого редактора построен по своей модульной структуре. Не знаю, как провайдить его для использования другими блоками. Вот небольшая часть его кода:

(function(exports, undefined) {
    "use strict";
    var modules = {};
    function require(ids, callback) {}
    function define(id, dependencies, definition) {}
    function resolve(id) {}
    function expose(ids) {}
     ... 
    expose([...]);
})(this)

Подскажите, как действовать, если сталкивались с чем-то похожим.

8 years ago

belozer

@karalkou

попробуй так:

modules.define('tinyMCE', (provide) => {
  // Путь к библиотеке, чтобы не захломлять модуль кодом,
  /* borschik:include:../../libs/tinyMCE.min.js */
  // но можно и скопировать всю библиотеку сюда

  // После инклуда кода мы должны получить объект tinymce, его мы и провайдим
  provide(tinymce);

  // или так
  var tiny = tinymce;
  provide(tiny);
});


// Где-то в другом модуле
modules.define('my-block', ['tinyMCE'], function(provide, tinyMCE) {
  ...
  {
    onSetMod: {
      js: {
        inited: function() {
          // Если установлен плагин jquery.tinymce
          this.domElem.tinymce()

          // или делаешь так
          tinyMCE.init({selector: 'my-selector'})
        }
      }
    }
  }
  ...
})

8 years ago

belozer

@karalkou функции вида

(function() {})()

вызывается сразу после объявления.

в данном случае

(function(exports) {...})(this)

передаётся объект this (текущий контекст), который в модуле доступен по переменной exports.

поэтому tinymce будет доступен в текущей области видимости.

Чтобы оставлять комментарии, необходимо авторизоваться.