Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.07.2017, 20:28
Аватар для grifix
Новичок на форуме
Отправить личное сообщение для grifix Посмотреть профиль Найти все сообщения от grifix
 
Регистрация: 28.07.2017
Сообщений: 5

Библиотека Envo
Понимаю что во времена Angular, React и прочих фреймоврков может быть не очень актуально, но все же решил опубликовать свою простенькую библиотеку для огранизации плагинов старого доброго jQuery. Библиотка решает следующие задачи:
  • Организация кода плагина в виде псевдо-класса
  • Наследование плагинов
  • Передача параметров в плагин
  • Подключение плагинов к странице
  • Ajax-перзагрузка плагинов
  • Подписка на события
Если кому интересно, прошу сюда: https://bitbucket.org/grifix/envo
Примеры использования тут: https://bitbucket.org/grifix/envo/sr...les/?at=master
Ответить с цитированием
  #2 (permalink)  
Старый 28.07.2017, 20:39
Аватар для grifix
Новичок на форуме
Отправить личное сообщение для grifix Посмотреть профиль Найти все сообщения от grifix
 
Регистрация: 28.07.2017
Сообщений: 5

Видимо немного ошибся разделом, просьба перенести в "Ваши сайты и скрипты"
Ответить с цитированием
  #3 (permalink)  
Старый 28.07.2017, 20:48
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

grifix,
интересно ... но много букв пропущено ... для примера
здесь
Сообщение от grifix
Ajax-перЕзагрузка плагинов
там
ПредполОжим нам нужно изменить
Создадим простой плагин, который показываЕт сообщение
Такие классы позволяют не привязыВать
Указать парАметры при подключении
Задать парамЕтры после подключения
Ответить с цитированием
  #4 (permalink)  
Старый 29.07.2017, 10:06
Аватар для grifix
Новичок на форуме
Отправить личное сообщение для grifix Посмотреть профиль Найти все сообщения от grifix
 
Регистрация: 28.07.2017
Сообщений: 5

Спасибо, забыл включить проверку орфографии Ж). Поправлено.

Так выглядит код простого палагина:
(function ($) {
        var parent = envo.Plugin; // Плагин от которого наследуется данный плагин
        var prototype = envo.makePluginPrototype(
            'demo.PluginA', // Название псевдо-класса плагина (используется при наследовнии)
            'demo_pluginA', // Имя плагина (используется для подключиня плагина к DOM-элементам)
            parent,
            {
                message: 'Hello world!' //Конфигурация плагина по умолчанию
            }
        );
        
        // Функция которая подключается к плагину в момент наложения его на DOM елемент
        prototype.init = function () {
            var that = this;
            
            that.elButton = that.find('button');
            that.elButton.click(function () {
                that.showMessage();
            });
            
            parent.prototype.init.call(that);
        };
        
        // Метод псевдо-класса плагина
        prototype.showMessage = function () {
            var that = this;
            alert(that.cfg.message);
            return that.el();
        };
    })(jQuery);


А так код плагина который его наследует:
(function ($) {
        var parent = demo.PluginA;
        var prototype = envo.makePluginPrototype(
            'demo.PluginB',
            'demo_pluginB',
            parent
        );
        
        prototype.showMessage = function () {
            var that = this;
            parent.prototype.showMessage.call(that);
            confirm("Are you sure!");
            return that.el();
        };
    })(jQuery);
Ответить с цитированием
  #5 (permalink)  
Старый 29.07.2017, 13:05
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

grifix,
Плагины, плагины, плагины... Почитайте что такое плагины jQuery: basic plugin pattern jQuery.fn(), advanced plugin pattern jQuery.widget().

По примерам видно что и с основами jQuery есть проблемы:
(function($) {
    $(function() {
        envo.attachPlugins();
    });
})(jQuery);

jQuery(callback)
jQuery(function($) {
    envo.attachPlugins();
});
Ответить с цитированием
  #6 (permalink)  
Старый 29.07.2017, 15:33
Аватар для grifix
Новичок на форуме
Отправить личное сообщение для grifix Посмотреть профиль Найти все сообщения от grifix
 
Регистрация: 28.07.2017
Сообщений: 5

Цитата:
с основами jQuery есть проблемы:
Не вижу приципиальной разницы между:
(function($) {$(function){}})(jQuery);
и
jQuery(function($) {});

Хотя второй вариант все же лучше, так как короче .
Библотека старая, ей уже больше 5 лет, код начальной закгрузки кочует с первой версии, поэтому может быть не оптимальным


Цитата:
Почитайте что такое плагины jQuery: basic plugin pattern jQuery.fn()
Цитата:
A jQuery plugin is simply a new method that we use to extend jQuery's prototype object. By extending the prototype object you enable all jQuery objects to inherit any methods that you add.
Если вы загляните в исходный код envo то увидите что evnvo.makePluginPrototype именно это и делает: регистрирует jQuery.fn

Цитата:
jQuery.widget()
В API jQuery нету функции widget
Ответить с цитированием
  #7 (permalink)  
Старый 29.07.2017, 19:50
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

grifix,
Вы плохо читаете, jQuery.widget - стандартное средство создания расширяемых плагинов, существует с jQuery UI 1.8 (больше 7 лет), является независимым от jQuery UI и базовым для его плагинов. А чем "облегчает создание и работу с плагинами jQuery" ваша библиотека я так и не понял, для клик-алерт нет смысла использовать дополнительную библиотеку, а для реализации чего то более сложного как https://jqueryui.com/demos/ сомнительное облегчение)
Ответить с цитированием
  #8 (permalink)  
Старый 29.07.2017, 21:20
Аватар для grifix
Новичок на форуме
Отправить личное сообщение для grifix Посмотреть профиль Найти все сообщения от grifix
 
Регистрация: 28.07.2017
Сообщений: 5

Гм, похоже вы правы Rise и я придумал велосипед, который во многом дублирует jqueryUi.widget
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Библиотека для чертежей SVG Владислав Филиппов Библиотеки/Тулкиты/Фреймворки 1 06.06.2014 13:22
старая версия FF и библиотека AmCharts Sveta Firefox/Mozilla 2 28.10.2013 08:33
Библиотека jQuery UI w46823 AJAX и COMET 1 27.04.2012 15:36
Что такое библиотека, фреймворк, тулкит и платформа. B~Vladi Оффтопик 3 03.11.2010 13:36
Библиотека RightJS Riim Библиотеки/Тулкиты/Фреймворки 1 26.07.2010 10:03