¿Qué tan malo es jQuery * inside * código de MooTools?

Question

Vivo y respiro jQuery, pero también me encanta encontrar un excelente complemento que haga el trabajo que quiero perfectamente.

Mis aplicación Rails se codifica en jQuery, pero para la carga de archivos, todavía tengo que encontrar algo mejor que FancyUpload (mejor en mi humilde opinión que Uploadify o SWFUpload). Habiendo probado las tres bibliotecas, FancyUpload es de lejos el mejor para integrar en mi aplicación.

Sin embargo, FancyUpload se basa en MooTools, y cargar ambas bibliotecas (y mucho menos trabajar con ellas) está empezando a ser un dolor de cabeza. Primero, solo cargo MooTools en las páginas que usan la funcionalidad de carga; todas las otras páginas usan jQuery exclusivamente. En segundo lugar, he tenido que manually namespace many of my jQuery functions, que es un poco molesto.

Pero quizás la característica más engorrosa de esta configuración es que no conozco MooTools. Como he podido hacer casi todo lo demás con jQuery, nunca me molesté en aprender. Ahora que me obligo a usar esta biblioteca de FancyUpload (que me encanta y quiero seguir usando), me enfrento a mi ineptitud en MooTools.

Específicamente, aquí está mi función onFileSuccess para 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'); 

    } 
} 

Como se dará cuenta, tengo una función jQuery justo en medio de una función de MooTools.

Mi pregunta es esta: ¿es esto realmente algo malo que hacer? Mi función funciona como yo quiero, pero no sé si estoy haciendo una bola de nieve hacia un futuro desastre al hacer esto.

Si esto realmente es una mala idea, ¿alguien puede darme un puntero sobre cuál sería el código equivalente de MooTools?

Agradecería cualquier idea o ayuda.

Answer 1

Esto generalmente no es un problema, pero recomendaría no mezclar el código específico del marco en ninguna funcionalidad a menos que el marco que está utilizando no proporcione las características que necesita. De esta forma, mantendrá la portabilidad y solo tendrá un requisito único en lugar de requerir 2 versiones específicas de 2 bibliotecas diferentes.

el código debe ser algo como esto:

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'); 
    } 
} 

edición: acabo de notar Dimitar dio una respuesta algo similar. mi solución funciona bastante bien, pero evita correctamente el uso de la función $, que es especialmente necesaria al mezclar frameworks.

Answer 2

Creo que usar el carácter '$' reservado para jq y mootools nunca es algo bueno, teniendo en cuenta que se puede evitar fácilmente mediante el uso adecuado del espacio de nombres. Estoy asumiendo que estás namespacing usando algo como:

jQuery.noConflict(); 

Cuando una manera más agradable es sólo para asignarlo a una variable:

var jQ = jQuery.noConflict(); 

Ahora puede llamar jQ ('selector de aquí') para jq y $ para mootools. Me ayuda a mantener mi código recto y lo hace más legible también. También puede cambiar su orden de inclusiones, que también podría solucionar el problema del espacio de nombres.