Bom dia pessoal!
Adicionei um novo exemplo de uso do multiUpload, o Álbum de Fotos.
A idéa básica é: Você tem um form que será enviado via Ajax para o script que
salva o álbum e retorna o id inserido. Após isto, uma nova instância do multiUpload
é criada para possibilitar a seleção das imagens e enviá-las para o script de upload
junto com o id do álbum cadastrado.
|
|
download: multiUpload-0.4-20120107.zip (106.08KB) added: 07/01/2012 clicks: 8742 description: Versão 0.4 do projeto multiUpload - Atualizado: 07/01/2012 Adicionada opção de limitar o número de arquivos a serem enviados |
Estou utilizando o Github para hospedar o projeto, então quem quiser pode conferir aqui: http://github.com/fredi/multiUpload/tree/master
Abraço!

Fred… ficou muito bacana o script… era exatamente isso que eu queria fazer…
Agora… eu queria ter mais controle sobre o script e… ao invés de a instancia do multiUploader iniciar automaticamente depois de cadastrar o album… eu queria colocar um checkbox na página, por elemplo, e se ele for marcado, daí ele exibe a instância.
Assim eu tenho a opção de cadastrar somente um texto (noticia no meu caso), ou enviar os dois… (uma noticia com uma galeria de imagens interna).
26/08/2009 @ 11:48 am
Dae Gabriel,
da pra fazer isso que tu quer tranquilamente. É só tu adicionar um check box:
Galeria: <input type="checkbox" id="chkGaleria" />Ai tu vai lá no código javascript onde cria a instância do multiUpload e troca o if:
por:
Abraço!
26/08/2009 @ 1:33 pm
Grande Fredi….
… perfeito era isso mesmo q eu precisava, toh acertando os detalhes depois posto aqui o final
abçss
Valew mssm
27/08/2009 @ 9:48 am
Bacana Fred… eu tentei fazer sozinho… e fiz assim
if($(“#galeriaCheck”).is(‘:checked’)){
// Envia o formulário via Ajax
$.ajax({
funcionou… mas só no seu modelo original…
quando tentei adaptar para o meu script… ele cadastrou no banco os dados do primeiro form… mas não chegou a exibir a instâncio do multiUpload…. já passou direto para a página savealbum.php exibindo:
{“id”:5}
que seria o id de meu album (id_frota).
27/08/2009 @ 10:40 am
Dae!
Tu deu o “return false;depois do “$.ajax({…});”? É que se tu não der ele vai enviar o formulário pelo navegador mesmo. Qualquer coisa me manda teu código que eu dou uma olhada pra ti.
27/08/2009 @ 10:46 am
e quando eu tento enviar sem nenhum dado… ao invés dele me retornar o alerta informando para preencher os campos… ele exibe isso na tela
{“id_frota”:0,”msg”:”Erro: T”}
27/08/2009 @ 10:49 am
Iaew Fred… realmente… tava faltando o “return false;” mas o erro maior que tava dando era pelo conflito com o mootools… mas já resolvi isso…
Sendo que ele ainda tá com problemas…
Coloquei o arquivo no ar…
http://okatsura.com/arquivos/modeloSite.rar
Dá uma olhadinha aí se puder cara… Se eu não conseguir terminar isso hoje vou ter que partir pra gambiarra… pq cabou meru prazo…
27/08/2009 @ 12:01 pm
Calma ae que eu to olhando teu código agora.
27/08/2009 @ 4:46 pm
Dae Gabriel!
Consegui arrumar teu código. Só precisei mexer em dois arquivos e poucas linhas:
cadFrota.php
No “if (json.id > 0)” vc tinha deixado dois parenteses no final, ai já dava erro. Também o script de upload estava errado (“uploadFrota.php” em vez de “uploadConteudo.php”).
No recebeCadConteudo.php só adicionei uma função pra converter os caractéres iso-8859-1 para UTF-8, senão não funciona direito com a função “json_encode”.
Também incluí o diff dos arquivos pra ti ver melhor o que foi alterado.
Tá na mão: http://fredimachado.com.br/downloads/sistema_conteudo.rar
Abraço!
27/08/2009 @ 5:27 pm
Realmente Fred… foi pura falta de atenção minha… {acho que a pressão pra terminar isso me cegou um pouco}
Agora funcionou direitinho aqui…
Vou tentar aplica-lo no sistema de verdade agora…
Muito obrigado pela ajuda aew…
27/08/2009 @ 9:42 pm
Fred… só mais uma dúvida…
Nesse script ele usa algum tipo de registro de cache para os ids das imagens que são enviadas???
Eu limpei meu banco depois de muitos testes… e ele continuou a cadastrar os dados com o id maior que o ultimo que estava cadastrado…. (tipo id_conteudo = 291), quando este mesmo id… na tabela dos conteudos (álbuns) está no 1;
É só isso que está bugando aqui…. o resto tah ok!!
28/08/2009 @ 2:11 pm
Dae Gabriel!
Cara, não poderia ficar em cache não. Da uma conferida no auto_increment da tua tabela. Tu usa phpMyAdmin? Se sim, abre a tabela lá e clica na guia “Operações” que tem ali o campo auto_increment.
Abraço!
28/08/2009 @ 5:32 pm
Eu ja consegui resolver aqui Fred… mas n’ao tinha nada a ver como phpMyAdmin naum.
Tinha sido umas alteracoes que eu fiz nos nomes das variaveis… dai acabou bugando o codigo… xD
Valeu pela forca
30/08/2009 @ 3:06 pm
salve!
Fredi, tentei implementar seu script em uma aplicação aqui na empresa onde trabalho e não consegui…
o script funciona corretamente da forma original, levando os dados via POST e tudo mais…
o problema é que preciso fazer uma manipulação mais complexa das imagens que envio para o servidor. Para isso, alterei o script de upload utilizando uma classe que já é utilizada aqui há algum tempo (http://www.revistaphp.com.br/artigo.php?id=177) essa classe php faz o upload da imagem, redimensiona, coloca marca d’agua e tudo.
Quando implementei essa classe na aplicação de forma simples ela fucionou, mas quando adiciono as funções de redimensionamento, conversão de imagens ou fixação da marca d’água, ele pára d funcionar…
queria saber se existe a possibilidade do script gerar algum conflito com a aplicação de algum modo…
desde já agradeço a atenção
01/09/2009 @ 5:34 pm
Dae Leandro!
O que acontece quando você adiciona as funções? Ele mostra a porcentagem do primeiro arquivo mas no fim não termina o processo e não continua enviando os outros?
Você tem que ter certeza de que o script de upload vai retornar alguma coisa (com echo ou print), senão o multiUpload não vai disparar o próximo arquivo.
Se quiser você pode me enviar seu código que eu dou uma olhada sem problemas.
Abraço!
01/09/2009 @ 9:24 pm
eu conservei a última linha ( echo “1″) pra que ele possa enviar o próximo…
o script mostra que todos os downloads foram concluídos, como se tivesse enviado todos…
mas quando vejo no diretório onde deveriam estar as fotos, não há nada lá…
isso só acontece quando as funções que comentei acima estão habilitadas
se eu usar a mesma classe php pra somente enviar os arquivos, eles vão sem problemas, mas preciso redimensionar as fotos e colocar a marca d’água de qualquer forma…
esse é o trecho do código que comentei:
file_auto_rename = true;
$up->file_new_name_body = “evento”;
$up->file_name_body_add = “_”.$galeria;
$up->image_resize = true;
$up->image_x = 446;
$up->image_ratio_y = true;
$up->image_convert = ‘jpg’;
$up->file_safe_name = true;
$up->image_watermark = ‘marca.png’;
$up->image_watermark_position = ‘B’;
$up->process(“uploads/”);
if($up->processed)
{
$nome = $up->file_dst_name;
}
$up->clean();
echo “1″;
?>
01/09/2009 @ 10:04 pm
Dae Leandro!
Você está iniciando o upload assim?
É importante o “Filedata”, pois é com esse nome que o Flash envia o arquivo.
Com certeza é algum probleminha no script de upload, pois a sistemática do multiUpload parece estar funcionando corretamente pelo que você comentou. Uma coisa que pode te ajudar a debugar o erro é utilizar o evento “onComplete” e dar um alert na propriedade “data” do retorno. Segue um exemplo:
Isto vai te mostrar exatamente o que o script de upload está apresentando, que no teu caso deve ser uma mensagem de erro.
Abraço!
02/09/2009 @ 8:46 am
Hey Fred… tem algum problema em separar os arquivos dos diretórios que eles vêm por padrão.. (no arquivo q vc disponibilizou)???
pq… tipo… eu estou tentando fazer um projeto com o CakePHP agora… e não sei como fazer para chamar direito os arquivos se eu colocá-los em diretorios diferentes dos que tem padronizados lah…. então pensei em colocar cada arquivo em sua respequitiva pasta.. (estilos na pasta CSS, javascript na JS, e assim por diante… só que fica faltando o .AS =/ )…
Tu saca como fazer com o Cake?
09/09/2009 @ 9:40 pm
Hey Fred… eu estou tentando fazer aquele lance que nós discutimos um tempo atrás… de fazer a listagem das imagens que foram enviadas… só que não estou conseguindo…
Eu estou gravando numa sessão o valor do ID da imagem que foi enviada para o banco…
e fiz um outro script só para mostrar os Valores que foram cadastrados na Sessão… mas parece que ele não está conseguindo gravar dados nessa sessão…. =/
Tem como se fazer isso….. ou é necessário fazer alguma adaptação no teu script??
14/09/2009 @ 6:18 pm
Dae Gabriel!
Só há uma maneira de não perder a sessão:
Você deve enviar o session_id() para o script de upload em uma variável e lá no script você seta a sessão. Digamos que você enviou o id como variável “sid”, então lá no script de upload você faz o seguinte:
Abraço!
14/09/2009 @ 11:09 pm
Estou adaptando o seu script gostaria de pedir permissão, porém tive um probleminha na questao do tamanho dos arquivos, eu consigo enviar no máximo arquivos até 1,8MB tento de 2,0MB por exemplo e nao da nada, mexi na variavel $maximo porém nao obtive sucesso, tem alguma solução? estou usando o seu 2 script
abraços
24/09/2009 @ 8:36 am
Acredito que possa ter algo haver com o wideimage que eu acrescentei no codigo estou procurando mais se tiver alguma ideia e puder ajudar agradeço
24/09/2009 @ 8:41 am
Opa, fala Fredi.
Gostei muito de toda a programação, ta show de bola… mas to com um errinho aqui, eu configurei o BD, criei as tabelas, passei todas as pastas pro ar, mas quando clico em “Iniciar Upload” não vai, ele chega a iniciar, mas para em 100% do primeiro, não continua e não envia o arquivo… eu agora estou revisando o motivo de tal problema, mas se vc souber e puder me ajudar eu agradeço
Valeu
30/11/2009 @ 6:17 pm
Ola Fredi,
Tem como mudar alguns captions lá no seu script de upload?
Se você me disse onde muda eu mesmo posso mudar, é que não achei.
Eu falo tipo o botão que está em inglês “browse file” e o menu todo em inglês ” File / Size / Remove / Progress”
O Album 2 que exibe as miniaturas não funcionou aqui, ele faz o upload da primeira foto e trava. Seria legal também ter a opção de excluir alguma foto.. mas isso eu vo tentar fazer aqui..
11/12/2009 @ 12:51 pm
pois eh.. estou com o mesmo problema do Felipe e de muitos. Quando a imagem é muito grande dá erro. Carrega a primeira e para de carregar. Sendo que a primeira não é realizado o upload!
05/04/2010 @ 10:09 am
Tem algo muito errado com o envio dos arquivos. Fiz um site pra um amigo, onde ele tentou enviar 80 imagens, todas JPG e todas abaixo do tamanho máximo permitido.
Coloquei o flashupload pra debugar e mostraram vários 1 e alguns alertas de imagem maior mas o resto foi embora…
Bom, a página atualizou e não tinha mais que 30 imagens lá, então aconteceu algo errado..
Agora modifiquei corretamente, só mostra as mensagens adequadas, mas mesmo quando envio para o site não carregam todas as imagens, o navegador trava logo em seguida… afz
As imagens nem carregam, mas só no site. No localhost tudo ocorre normalmente…
Meu código:
var uploader = new multiUpload(‘uploader’, ‘uploader_files’, {
swf: ‘/flash_multiupload/swf/multiUpload.swf’,
script: ‘/upload.php’,
expressInstall: ‘/flash_multiupload/swf/expressInstall.swf’,
multi: true,
fileDescription: ‘Imagens: Jpg e/ou Jpeg’,
fileExtensions: ‘*.jpg;*.jpeg;’,
onComplete: function(e, data) // retorna um objeto com informações
{
if(e.data==’1′) {
alert(“Todos os arquivos foram enviados!”);
location.href=”;
} else {
alert(e.data); // ou: console.log(e.data); caso use firebug
}
},
onAllComplete: function()
{
// alert(“Todos os arquivos foram enviados!”);
//location.href=”;
}
});
function sendIt() {
var categ = document.getElementById(“categ”).value;
if (categ.length)
{
uploader.setData({ categ: categ });
uploader.startUpload();
}
else
{
alert(“Selecione uma galeria”);
}
}
upload.php
// Recupera os dados dos campos
$categ = @$_POST['categ'];
$image = @$_FILES['Filedata'];
$data = date(“d/m/Y”); // pegando data do servidor
// Se a foto tiver sido selecionada
if ( !empty($image["name"]) ) {
$largura = 1500; // Largura maxima em pixels
$altura = 1000; // Altura maxima em pixels
$tamanho = 200000; // Tamanho maximo do arquivo em bytes (2 MB)
$dimensoes = getimagesize($image["tmp_name"]);
// Verifica se o arquivo eh uma imagem
/*
* if( !eregi(“^image\/(pjpeg|jpeg|jpeg)$”, $image["type"]) ) {
* echo “Formatos válidos: Jpg e Jpeg!”;
* }
*/
if( $dimensoes[0] > $largura ) {
echo “A largura da imagem não deve ultrapassar “.$largura.” pixels!”;
}
elseif( $dimensoes[1] > $altura ) {
echo “A altura da imagem não deve ultrapassar “.$altura.” pixels!”;
}
// Verifica se o tamanho da imagem é maior que o tamanho permitido
elseif( $image["size"] > $tamanho ) {
echo “A imagem deve ter no máximo “.$tamanho.” bytes!”;
}
else {
preg_match(“/\.(jpg|jpeg){1}$/i”, $image["name"], $ext);
/*
* $format_img [ explode(".", $image['name']);
* $image = strtr($format_img[0], “áàãâéêíóôõúüçÁÀÃÂÉÊÍÓÔÕÚÜÇ “, “aaaaeeiooouucAAAAEEIOOOUUC “);
*/
$nome_imagem = md5(uniqid(time())).”.”.$ext[1]; // Gera um nome unico para a imagem
$dir = $_SERVER['DOCUMENT_ROOT'].”/fotos/images/”; // Caminho de onde ficara a imagem
if( move_uploaded_file($image["tmp_name"], $dir.$nome_imagem) ) {
/* funcao para redimensionamento de imagem */
$imagem = $dir.$nome_imagem; // pega o caminho da imagem enviada
$x = 150;
$y = 100; // declara os tamanhos
if( !file_exists($imagem) ) {
echo “Imagem: ‘$imagem’ não encontrada!”; die();
}
elseif ( file_exists($imagem) ) { // verifica se o arquivo existe
$lerimagem = imagecreatefromjpeg($imagem); // vamos ler a imagem
$img_largura = imagesx($lerimagem); // pegar a largura da imagem
$img_altura = imagesy($lerimagem); // pegar a altura da imagem
/*
* $nome_miniatura = explode(‘.’,$imagem); // dar um nome padrão para a miniatura
* $nome_miniatura = $nome_imagem[0].”_thumb.jpg”;
*/
// Agora sim a gente pode criar a imagem
$nova = imagecreatetruecolor($x,$y); // definir o tamanho da nova imagem
// agora é só copiar a imagem original para dentro da nova imagem
imagecopyresampled($nova,$lerimagem,0,0,0,0,$x+1,$y+1,$img_largura,$img_altura);
//imagejpeg($nova, $dir.”thumbs/”.$nome_miniatura); // nao pegava o nome completo da imagem
imagejpeg($nova, $dir.”thumbs/”.$nome_imagem);
// Pronto, fim. Libera a memória usada
imagedestroy($lerimagem);
imagedestroy($nova);
// Insere os dados no banco
$sql = mysql_query(“INSERT INTO ts_gallery
(title, categ_gallery, description, thumb, image, date)
VALUES (‘$title_categ’, ‘$categ’, ‘$title_categ’, ‘$nome_imagem’, ‘$nome_imagem’, ‘$data’)”);
if ( $sql ) {
echo “1″; // concluido
}
}
19/04/2010 @ 9:39 pm
Olá Fredi, em primeiro lugar queria parabenizá-lo pelo belíssimo trabalho desenvolvido pela biblioteca.
Tenho uma questão que tá me matando aqui!
Tenho um sistema de eventos que eu mesmo criei, e estou utilizando o multiupload para enviar as fotos.
A questão é a seguinte. Já utilizei a WideImage para manipular as imagens, mas quando utilizo a opção dela de criar a foto redimensionada com uma watermark, a foto fica super pesada. Em um teste, sem a marca d’agua a foto ficou com 40kb com a marca d’agua, chegou a pesar mais de 200kb a mesma foto.
Eu pesquisei bastante e consegui uma forma de adicionar uma marca d’agua, e a imagem ficar “leve”, e tô quebrando a cabeça para colocar este cósigo no upload.php. Tem como me ajudar? o código tá a seguir:
[code]
//Recebe o nome do arquivo original
$nome_arquivo = $_FILES['Filedata'];
//Nomes dos Arquivos
$logo_file = "marca2.png"; //marca principal
$logo_file2 = "marca1.png"; //marca secundária
$image_file = "$nome_arquivo"; //imagem original
$targetfile = "processadas/wm_$nome_arquivo"; //imagem final na pasta processadas
// Imagem
$photo = imagecreatefromjpeg($image_file);
$fotoW = imagesx($photo);
$fotoH = imagesy($photo);
//logomarca1
$logoImage = imagecreatefrompng($logo_file);
$logoW = imagesx($logoImage);
$logoH = imagesy($logoImage);
//logomarca2
$logoImage2 = imagecreatefrompng($logo_file2);
$logo2W = imagesx($logoImage2);
$logo2H = imagesy($logoImage2);
//Cria uma imagem intermediária
$photoFrame = imagecreatetruecolor($fotoW,$fotoH);
$dest_x = $fotoW - $logoW;
$dest_y = (($fotoH - $logoH) - 10);
//Carimba a marca d'agua 1 - LOGO - na imagem
imagecopyresampled($photoFrame, $photo, 0, 0, 0, 0, $fotoW, $fotoH, $fotoW, $fotoH);
imagecopy($photoFrame, $logoImage, $dest_x, $dest_y, 0, 0, $logoW, $logoH);
//Carimba a arca d'agua 2 - site - na imagem já carimbada com a logo
imagecopy($photoFrame, $logoImage2, 5, 5, 0, 0, $logo2W, $logo2H);
imagejpeg($photoFrame, $targetfile);
[/code]
Como disse queria que esse script rodasse dentro do upload.php para processar as fotos. Tem como me ajudar?
21/06/2010 @ 11:32 am
Parabens pelo seu trabalho , excelentes exemplos para uso
eu to criando um componente que vou usa para upload de foto no cake
obrigado pelo seu material
serviu de base para o meu projeto em cake
cordialmente
kakaroto developer
17/09/2010 @ 2:29 pm
fredi..
muito massa a galeria ja usei muito ela, mais eu precisava colocar imagem e um titulo, tem como me ajudar ??
22/02/2011 @ 7:28 pm
fredi queria te parabenizar pelo trabalho, show mesmo essa força que tu da pra galera, grande Abraço
09/03/2011 @ 3:29 am
Saudações,
no PHP5 funcionou direitinho, só que tenho um cliente que tem um servidor, onde hospedam de graça pra ele em PHP4, e o pessoal do servidor não quer mudar. O que posso fazer para funcionar em pHP4?
Abraços
Fernando.
07/04/2011 @ 3:38 pm
Oi Fredi, muito bom o escript. Como todos tenho uma duvida que realmente não consegui fazer.
Estou tentando exibir as imagens por galeria atraves de um link.
Depois de clicar ele vai para outra página exibindo a galeria clicada. Pode explicar como faz isso.
Obrigado cara.
04/07/2011 @ 12:23 pm
Olá Fredi !!
Parabéns pelos scripts do Álbum de Fotos !! Muito bom mesmo !!! Queria ver se poderia me ajudar a implementar mais um campo depois que faz o upload das fotos como faço para acrescentar mais um campo para indicar qual foto que quero que seja a capa do álbum ou galeria de fotos no meu caso. Gostaria de ver também como eu faria para conseguir fazer a inclusao de mais fotos ou a exclusao de algumas delas depois que o álbum ou a galeria já foi cadastrada no banco e as fotos enviadas para o servidor, como faço para consultar, abrir a galeria e fazer a alteração da mesma.
Desde já agradeço a atenção.
Att.
Camila.
04/05/2012 @ 1:18 am