(Resolvido) Drag and Drop para organizar album de foto

[Cardon]

Boa tarde galera...

Depois de muito tempo, eu volto a postar aqui, porém dessa vez venho perguntar e não responder hehehe

Minha dúvida é um tanto que uma dúvida de preguiçoso, mas não tão desinteressante.

Bom...

Estou desenvolvendo um sistema para gerenciar produtos que irão passar em um banner em flash com efeito carrocel

Então tenho que cadastrar entre outras coisas as fotos dos produtos, essa parte fica por conta do php e já esta funcionando bem certinho.

Quero colocar um script para facilitar o manuseio do meu sistema, ou seja, melhor interface para o usuário. Com isso comecei a usar a biblioteca scriptaculous, com suas inumeras vantagens e facilidades.

Para quem não conhece, aqui vai o link clique aqui:

Com essa biblioteca podemos criar facilmente efeitos como o de arrastar DIV's em nossa página, recolher e expandir painéis, efeitos para botões, entre outras coisas que geralmente se faz em flash, se é possibilitado de fazer com esses scripts.

Suas sintax são bem fáceis e bem simples.

Agora sim minha dúvida.

Minha dúvida não é quanto ao funcionamento de uma das funções mas sim se alguém conhece o nome do efeito que quero fazer, ou sabe de alguma maneira para criá-lo mais facilmente e automatizadamente, ou ainda se já tem algo para poder me dar uma luz.

Quero fazer um efeito de arraste (drag and drop) para organizar a sequência das fotos dentro do grupo que foi cadastrado, seria bem semelhante ao que o orkut usa para organizar as fotos no album.

vou postar como estou fazendo para ter os arrastes e obter informações das divs que sofreram a ação e as que recebem a ação:

<script>
// variavel para verificar se funcao onStart funciona
var positionControl = new String("asd")

//efeito que permite o arraste sintax: new Draggable(id, {opções}) - no caso estou usando para com que a div retorne para a posição inicial se nada a alterar
new Draggable('idDiv_00', { revert: true,

// efeito para mudar o valor da variavel, para veirificar o funcionamento
// esse efeito callBack sera ativado quando a Div começar a ser arrastada
            onStart: function() {
                positionControl = "sim";
                }
            
              
              });

// efeito para a mesma div receber a ação de arraste de uma outra div sintax igual a anterior
  Droppables.add('idDiv_00', { 
    
//efeito callBack para quando a div que esta sendo arrastada ser solta em cima dessa div
    onDrop: function() {alert(positionControl);}

//efeito callBack para quando a div que esta sendo arrastada passar por cima dessa div
    onHover: function() {alert(positionControl);}
  });


</script>

Creio que coloquei bem explicito como esta funcionando e como quero que aconteça esse meu efeito.

Se alguém poder me ajudar Ficarei muito grato.

E se não expliquei direito por favor postem o que não entenderam que tento ser mais claro e objetivo possível.

Agradeço desde já

e espero compreenção de minhas limitações heheheh

falow

[Cardon]

Bom galera já resolvi meu problema

Quando eu pesquisei sobre o Draggables e droppable do scriptaculous, eu esqueci de ver a outra opção que tinha na mesma página

Que inclusive é especialmente feita para o que eu quero lol

Se chama Sortable

Aqui o link para quem quer saber mais clique aqui

Esse efeito faz com que os elementos troquem de ordem na contrução do layout. Porém pode ser definido um conteiner, pode ser uma <div> ou um <ul>.

Sem mais demandas aqui vai como resolvi meu problema.

<script>
  Sortable.create('idDiv_content', {
    tag: 'div', overlap: 'horizontal', constraint: false
  });
</script>

Com isso o Sortable.create vai pegar as <div> pai que existem dentro do conteiner e colocar o efeito de arraste e ordenamento dentro do mesmo

É isso ai...

Bom galera, graças a deus resolvi isso logo, heheheheh

Obrigado mesmo assim

UM ADM já PODE COLOCAR O TÓPICO COMO RESOLVIDO