Skip to content

Instantly share code, notes, and snippets.

@wtw24
Last active January 17, 2020 07:35
Show Gist options
  • Save wtw24/a565094a8c7cdd3306cd6aedcd64234c to your computer and use it in GitHub Desktop.
Save wtw24/a565094a8c7cdd3306cd6aedcd64234c to your computer and use it in GitHub Desktop.
паттерн плагина на основе «моста» фабрики виджетов jQuery UI
// конструктор объекта "widgetName"
// обязательны следующие аргументы
// options: объект опций плагина
// element: DOM элемент плагина
var widgetName = function( options, element ){
this.name = "myWidgetName";
this.options = options;
this.element = element;
this._init();
}
// прототипируем "widgetName"
widgetName.prototype = {
// метод _create автоматически выполняется при первом
// вызове виджета
_create: function(){
// код создания плагина
},
// метод _init является обязательным методом фабрики
// Он вызывается после создания
// и каждый раз, при каждой повторной его инициализации
_init: function(){
// код инициализации плагина
},
// метод 'option' также обязательный
// в нем реализуется механизм работы с параметрами плагина
option: function( key, value ){
// ниже приведен пример изменения и получения параметров
// сигнатура: $('#foo').bar({ cool:false });
if( $.isPlainObject( key ) ){
this.options = $.extend( true, this.options, key );
// сигнатура: $('#foo').option('cool'); - геттер
} else if ( key && typeof value === "undefined" ){
return this.options[ key ];
// сигнатура: $('#foo').bar('option', 'baz', false);
} else {
this.options[ key ] = value;
}
// обязательным условием метода «option»
// является возвращение текущего экземпляра.
// при повторной инициализации плагина,
// вызывается «option», и передается в метод _init
return this;
},
// общие методы определяются без нижнего подчеркивания
publicFunction: function(){
console.log('public function');
},
// нижнее подчеркивание определяет приватные методы
_privateFunction: function(){
console.log('private function');
}
};
// пример использования:
// соединяем нашу модель к API jQuery в пространство "foo"
// $.widget.bridge("foo", widgetName);
// создаем экземпляр виджета
// var instance = $("#elem").foo({
// baz: true
// });
// экземпляр всегда доступен через кеш элемента
// instance.data("foo").element; // => #elem element
// мост позволяет вызывать общие методы...
// instance.foo("publicFunction"); // => "public method"
// но не даст вам вызвать приватные
// instance.foo("_privateFunction"); // => #elem element
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment