Как зло jQuery * внутри * код MooTools?

Question

Я живу и дышу jQuery, но мне также нравится находить отличный плагин, который идеально подходит для работы.

Мои Rails приложение кодируется в JQuery, но для загрузки файлов, я еще не нашел ничего лучшего, чем FancyUpload (лучше ИМХО, чем Uploadify или SWFUpload). Попробовав все три библиотеки, FancyUpload, безусловно, лучше всего интегрируется в мое приложение.

Однако FancyUpload основан на MooTools, и загрузка обеих библиотек (не говоря уже о работе с ними) начинает немного болеть. Во-первых, я загружаю MooTools только на страницы, которые используют функции загрузки; все остальные страницы используют исключительно jQuery. Во-вторых, мне пришлось manually namespace many of my jQuery functions, что немного раздражает.

Но, возможно, самой громоздкой особенностью этой установки является то, что я не знаю MooTools. Поскольку я смог сделать почти все остальное с помощью jQuery, я никогда не удосужился учиться. Теперь, когда я заставляю себя использовать эту библиотеку FancyUpload (которую я люблю и хочу продолжать использовать), я столкнулся с моей неуместностью в MooTools.

В частности, вот моя onFileSuccess функция FancyUpload:

onFileSuccess: function(file, response) { 
    var json = new Hash(JSON.decode(response, true) || {}); 

    if (json.get('status') == '1') { 

     // success 
     file.element.addClass('file-success'); 
     (function ($, elem, queue_item) { 
      $('#images').append($(elem).hide().fadeIn('slow')); 
      $(queue_item).fadeOut('slow', function() { $(this).remove(); }); 
     })(jQuery, json.get('data'), file.element); 

    } else { 

     // failure 
     file.element.addClass('file-failed'); 

    } 
} 

Как вы можете заметить, у меня есть функция JQuery прямо в середине функции MooTools.

Мой вопрос в том, что это действительно плохо? Моя функция работает так же, как я хочу, но я не знаю, могу ли я заснуть в сторону какой-то будущей катастрофы, сделав это.

Если это действительно плохая идея, может кто-нибудь дать мне указатель на то, что будет эквивалентным кодом MooTools?

Буду признателен за любую информацию или помощь.

Answer 1

Это, как правило, не проблема, но я бы рекомендовал не смешивать конкретный код фрейма в любой функциональности, если только используемая вами фреймворк не предоставляет требуемые функции. Таким образом, вы сохраняете переносимость, и у вас есть только одно требование вместо того, чтобы требовать 2 конкретных версии из двух разных библиотек.

ваш код должен быть что-то вроде этого:

onFileSuccess: function(file, response) { 
    var json = new Hash(JSON.decode(response, true) || {}); 

    if (json.get('status') == '1') { 
     // success 
     file.element.addClass('file-success'); 
     document.id('images').adopt(document.id(json.get('data')).fade('hide').fade('in')); 
     document.id(file.element).set('tween', { 
      onComplete: function() { this.element.dispose();} 
     }).fade('out'); 
    } else { 
     // failure 
     file.element.addClass('file-failed'); 
    } 
} 

редактировать: только что заметил, Димитар сделал несколько похожий ответ. мое решение работает совершенно одинаково, но правильно избегает использования функции $, которая особенно необходима при смешивании фреймворков.

Answer 2

Я думаю, что использование зарезервированного символа '$' для jq и mootools никогда не будет хорошим, учитывая, что его можно легко избежать, используя правильное размещение имен. Я предполагаю, что вы используете что-то разделяет пространства имен, как:

jQuery.noConflict(); 

Когда лучше способ просто присвоить его переменной:

var jQ = jQuery.noConflict(); 

Теперь вы можете позвонить JQ («селектор здесь») для jq и $ для mootools. Помогает мне сохранить мой код и сделать его более читаемым. Вы также можете просто изменить свой порядок включений, который также может устранить проблему с именами.