Páginas: [1]
  Imprimir  
Autor Tema: Plugin EVCUpload para JQuery (Imagenes como inputs de tipo file)  (Leído 697 veces)
0 Usuarios y 1 Visitante están viendo este tema.
WHK
吴阿卡
Administrador
Usuario constante
*****

Karma: +8/-3
Mensajes: 272


Coder

yan_unico_102
Ver Perfil WWW Email
« : Enero 10, 2010, 05:22:56 »


EVCUpload
¿Que es EVCUpload? EVCUpload es un plugin para JQuery creado por nabetse que permite a una imagen comportarse como un input de tipo file. Lo único que debes hacer es incluir esta librería y seleccionar el objeto de la imagen y automáticamente se transformará en input. El portal con su descarga y demostración en linea está acá: http://evcupload.drawcoders.net/ Si alguien tiene alguna pregunta, aporte, consulta, reclamo, aviso, etc puede hacerlo en este lugar o enviar un correo a esteban(punto)xfce(arroba)gmail(punto)com
« Última modificación: Enero 10, 2010, 05:35:20 por WHK » En línea

fede_cp
Recién llegado
*

Karma: +0/-0
Mensajes: 13


Ver Perfil Email
« Respuesta #1 : Febrero 20, 2010, 11:28:06 »


si, yo tengo una duda, la aplicacion la verdad que me sorprendio, pero a nivel de seguridad, al subir una imagen esta aplicacion es seguro contra ataques por ejemplo, que te suban una c99 junto con la imagen? saludos
En línea
WHK
吴阿卡
Administrador
Usuario constante
*****

Karma: +8/-3
Mensajes: 272


Coder

yan_unico_102
Ver Perfil WWW Email
« Respuesta #2 : Febrero 20, 2010, 01:53:12 »


El php que recepciona la imagen debes hacerlo tu ya que no se puede crear un sistema de seguridad fiable en javascript debido a que este se ejecuta en el cliente y cualquiera podría manipular los datos para subirte una shell. El plugin es solamente el archivo .js, el php debes hacerlo tu y acomodarlo según el framework o script que utilices.
En línea

fede_cp
Recién llegado
*

Karma: +0/-0
Mensajes: 13


Ver Perfil Email
« Respuesta #3 : Febrero 20, 2010, 02:41:33 »


A gracias era lo que no entendia, esta bueno! saludos y me uni a la comunidad  Rock saludos
En línea
Enfermin
Usuario regular
**

Karma: +3/-1
Mensajes: 54



Ver Perfil
« Respuesta #4 : Agosto 10, 2010, 05:36:36 »


Hulas, siempre vi este plugin por aqui pero pense que solo cambiaba la apariencia de las imagenes nada mas  XD pero bueno ahora lo empiezo a usar y con un ejemplo funciona.. pero ahora intento hacerlo funcional para subir multiples imagenes con un bucle pero no funciona, intente dejar el bucle y hacerlo a mano pero tampoco funciona, les pongo nombres distintos tanto del id y form pero no veo resultados  :O.O: noto que solo funciona para subir una sola imagen  ;(, sere yo o es el plugin?? creo que habra que agregarle otro parametro al plugin
« Última modificación: Agosto 10, 2010, 05:58:17 por Enfermin » En línea

Enfermin
Usuario regular
**

Karma: +3/-1
Mensajes: 54



Ver Perfil
« Respuesta #5 : Agosto 10, 2010, 06:57:25 »


EURECKA!! logre hacerlo funcionar, solo le agregue un nombre de id dinamico al iframe que genera asincronicamente, en realidad no hice casi nada pero asi me quedo el codigo final
Código:
(function($) {
$.fn.EVCUpload = function(opciones){
  var imagen, input, subiendo = false;
  var opciones = $.extend(true,{
      nombre: 'InputSA',
      formulario : 'subirF',
      action : '#',
      antesde : function(){},
      alterminar : function(datos){},
      remover : false
  },opciones);
  imagen = $(this);
  imagen.mouseenter(function(){
  input  = '<form method="POST" '
           +'enctype="multipart/form-data" '
           +'action="'+opciones.action+'" '
           +'id="'+opciones.formulario+'" '
           +'name="'+opciones.formulario+'">'
           +'<input type="file" '
           +'name="'+opciones.nombre
           +'" title="'+imagen.attr('title')+'" /></form>';
    var $iframe = $('<iframe id="'+opciones.nombre+'" ' /* NUEVO */
    //var $iframe = $('<iframe id="Xs42a_TMP" ' /* ANTIGUO */
                   +'scrolling="no" '
                   +'style="display:none"/>');
    //if($('#Xs42a_TMP').length == 0) /* ANTIGUO */
    if($(opciones.nombre).length == 0) /* NUEVO */
    $iframe.appendTo("body");
    var datos = $iframe[0].contentWindow.document;
    datos.open();
    datos.write(input);
    datos.close();
    $iframe.css({
      display: 'block',
      position : "absolute",
      opacity: 0,
      top:  imagen.offset().top +'px',
      left: imagen.offset().left +'px',
      height:imagen.height(),
      width: imagen.width(),
      border: 'transparent 0px solid',
      overflow: 'hidden'
    });
    $iframe.contents().mousemove(function(e){
      $(this).find("input").css({
        position : "absolute",
        top:  (e.pageY - 5) +'px',
        left: (e.pageX - 175 ) +'px'
      });
    });
    $iframe.contents().find("input").change(function(){
      subiendo = true;
      opciones.antesde.call(this);
      $iframe.contents().find("form").submit();
      $iframe.load(function(){
        opciones.alterminar.call(this,$iframe.contents().text());
        subiendo = false;
        $iframe.remove();
      });
    });
    $iframe.mouseleave(function(){
      if(!subiendo && remover)
      $iframe.remove();
    });
  });
 
};
})(jQuery);
 
 
 
La linea que al lado tiene un comentario que dice nuevo es la linea que modifique Ahora si saludos  :banana:
« Última modificación: Agosto 10, 2010, 09:30:45 por Enfermin » En línea

Páginas: [1]
  Imprimir  
 
Ir a: