[Proto-Scripty] Re: Drag'N'Drop question

2008-10-06 Thread Sloan

I've tried using the clone and then replaceing the HMTL of the clone
with the HTML of the object (it's not an image). What I missed was the
droppables.add. Thanks!

The "placed" item will need to be draggable later, but at that point
it's entirely seperate from the original drag'n'drop.
What I'm building is a composition app. It'll allow a user to add
objects to a page from a toolbar. For example, the user could drag an
"input object" that has a label and an input field to the workspace.
Later, they can resize or move the input object, or edit it's
properties. They will also be able to add another by dragging and
dropping the input object from the toolbar into the workspace.
I also need the draggable to only be dropped in the workspace, and
only where the top/left are over the workspace.

Thanks for the help!

On Oct 6, 9:25 am, Diodeus <[EMAIL PROTECTED]> wrote:
> Here's how to make the drag/drop work. Putting a "clone" of the
> dragged item back in the start position depends on how you want your
> code to work afterwards. Does the item need to be dragged again?
>
> 
> .hovering {
>         background-image:url(Images/something.png);
>         background-repeat:no-repeat}
>
> 
>  id='sampleDrag'>Drag Me
> 
> 
> var cloneDIV
> new Draggable('sampleDrag',{onDrag:function(){}, onStart:function(){$
> ('sampleDrag').addClassName('hovering');Element.hide('inside')},
> onEnd:function(){$
> ('sampleDrag').removeClassName('hovering');Element.show('inside');}})
> Droppables.add('sampleDrop')
> 
>
> On Oct 6, 12:41 am, Sloan <[EMAIL PROTECTED]> wrote:
>
>
>
> > Hi all,
> > I'm new to prototype and script.aculo.us. I'm building an interface
> > that will allow a user to drag a "tool" onto a workarea and drop it.
> > So far, pretty easy.
> > But I need to image/object being dragged to be different from the one
> > the user clicked on at the start of the drag. The item the user will
> > click on to drag is a small graphic, but they need to be able to drag
> > a div containing the result of adding the item (text, input fields,
> > etc.)
> > Also, when dropped, the new item needs to be added to the droppable,
> > and the original graphic needs to be where it was before the
> > drag'n'drop.
>
> > I've tried using the helper, and replacing the _clone and the
> > draggable (the later sort of works) with different HTML. But when it's
> > dropped the dropped image stays in place, and the original image
> > disappears.
>
> > Any suggestions, code examples, etc. would be greatly appreciated!
>
> > Thanks!- Hide quoted text -
>
> - Show quoted text -
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---



[Proto-Scripty] Re: Drag'N'Drop question

2008-10-06 Thread Diodeus

Here's how to make the drag/drop work. Putting a "clone" of the
dragged item back in the start position depends on how you want your
code to work afterwards. Does the item need to be dragged again?



.hovering {
background-image:url(Images/something.png);
background-repeat:no-repeat
}

Drag Me


var cloneDIV
new Draggable('sampleDrag',{onDrag:function(){}, onStart:function(){$
('sampleDrag').addClassName('hovering');Element.hide('inside')},
onEnd:function(){$
('sampleDrag').removeClassName('hovering');Element.show('inside');}})
Droppables.add('sampleDrop')


On Oct 6, 12:41 am, Sloan <[EMAIL PROTECTED]> wrote:
> Hi all,
> I'm new to prototype and script.aculo.us. I'm building an interface
> that will allow a user to drag a "tool" onto a workarea and drop it.
> So far, pretty easy.
> But I need to image/object being dragged to be different from the one
> the user clicked on at the start of the drag. The item the user will
> click on to drag is a small graphic, but they need to be able to drag
> a div containing the result of adding the item (text, input fields,
> etc.)
> Also, when dropped, the new item needs to be added to the droppable,
> and the original graphic needs to be where it was before the
> drag'n'drop.
>
> I've tried using the helper, and replacing the _clone and the
> draggable (the later sort of works) with different HTML. But when it's
> dropped the dropped image stays in place, and the original image
> disappears.
>
> Any suggestions, code examples, etc. would be greatly appreciated!
>
> Thanks!
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---