You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Maxim Solodovnik <so...@gmail.com> on 2016/06/03 08:03:38 UTC
Re: Draggable multiple containment
Thanks a lot!
I'll be on vacation next couple of week, will try to test on return :)
On Wed, Jun 1, 2016 at 3:05 AM, Sebastien <se...@gmail.com> wrote:
> Hi Maxim,
>
> It should be achievable, using revert and accept/scope
> By reading your post, I suddently have a doubt, revert is not supposed to
> cancel the drop action. The element just go back to its original place but
> onDrop should still be fired. I have to double check tomorrow because
> implementing revert as a function seems to cancel drop event... weird (or i
> didn't paid attention)
> On May 31, 2016 19:34, "Maxim Solodovnik" <so...@gmail.com> wrote:
>
> > Hello Sebastien
> >
> > thanks for the reply :)
> > I'll try to describe my use case
> >
> > I do have file free panel, file/folder items on this panel can be *moved*
> > to other folders (there are unmovable root folders and trash)
> > everything works as expected
> >
> > now I need to add "display" panel
> >
> > I would like "file" item can be dropped to this panel BUT visually it
> > should *revert* to original place, but need to be processed by drop
> target.
> > So I cannot set revert option on draggable (files need to be able to be
> > moved)
> > I need to process file in onDrop method, then "visually revert it to the
> > original position"
> > is it too much? :)))
> >
> > On Tue, May 31, 2016 at 6:06 PM, Sebastien <se...@gmail.com> wrote:
> >
> > > Hi Maxim,
> > >
> > > Sorry for the late answer!
> > >
> > > "Droppable#onDrop, where you can reject the Draggable item/component"
> was
> > > actually misleading.
> > > IIRC it was supposed to mean "if the element is not reverted, then it
> is
> > > accepted ; and if the element is reverted then it is rejected by
> design"
> > >
> > > The most important question to me is: do you know in advance what
> element
> > > can be accepted or not ? (meaning can you recognized them with a
> special
> > > css class for instance or any data-* attribute?)
> > >
> > > 1/ In case of yes, please consider these droppable option (it can
> replace
> > > my previous draggable code snippet)
> > > http://api.jqueryui.com/droppable/#option-accept
> > > http://api.jqueryui.com/droppable/#option-scope
> > >
> > > 2/ in case of no... then consider case 1/ ;)
> > >
> > > In you need additional help on this, please describe a simple/concrete
> > > usecase so I can test further :)
> > >
> > > Best regards,
> > > Sebastien.
> > >
> > >
> > > On Thu, May 26, 2016 at 7:27 PM, Maxim Solodovnik <
> solomax666@gmail.com>
> > > wrote:
> > >
> > > > Hello Sebastien,
> > > > finally I found free time to continue this work :)
> > > >
> > > > Actually my question was regarding "Droppable#onDrop, where you can
> > > reject
> > > > the Draggable item/component", how this can be achieved?
> > > >
> > >
> >
> >
> >
> > --
> > WBR
> > Maxim aka solomax
> >
>
--
WBR
Maxim aka solomax
Re: Draggable multiple containment
Posted by Maxim Solodovnik <so...@gmail.com>.
Hello Sebastien,
I finally was able to get back to this task :))))
Thanks a lot for the pointer! it turns out I have already implemented
"revert" function, but completely forgot about it :(
now everything works as expected
Thanks!
On Fri, Jun 3, 2016 at 6:06 PM, Sebastien <se...@gmail.com> wrote:
> Hi Maxim,
>
> After a quick test, 'revert' and 'accept' are enough (and convenient if you
> have a css class for 'file'). But using 'scope' instead of 'accept' also
> works, it's up to you...
> I also confirm you that revert does not prevent #onDrop to be fired (even
> used as a function)...
>
> For instance:
>
> - the droppable
>
> private Droppable<String> newDroppable(String id, String color, final
> String scope)
> {
> return new Droppable<String>(id, Model.of(color)) {
>
> @Override
> public void onConfigure(JQueryBehavior behavior)
> {
> super.onConfigure(behavior);
>
> // behavior.setOption("scope", Options.asString(scope));
> behavior.setOption("accept", Options.asString("." +
> scope)); // css class
> }
> }
>
> - the draggable
>
> private static Draggable<String> newDraggable(String id, String label,
> final String scope)
> {
> return new Draggable<String>(id, Model.of(label)) {
>
> @Override
> public void onConfigure(JQueryBehavior behavior)
> {
> super.onConfigure(behavior);
>
> // behavior.setOption("scope", Options.asString(scope));
> behavior.setOption("revert", true); // or:
> // behavior.setOption("revert", "function(e) {
> // console.log('e', e); // e stands for the droppable
> // console.log('this', this); // this stands for the
> draggable
> // if (this.hasClass('file')) { return true; } }"); // true
> means "do revert"
> }
> };
> }
>
> - html
>
> < div wicket:id="draggable1" class="file">
> my file
> < /div>
> < div wicket:id="draggable2" class="folder">
> my folder
> < /div>
>
>
> Hope this helps,
> Sebastien
>
>
> On Fri, Jun 3, 2016 at 10:03 AM, Maxim Solodovnik <so...@gmail.com>
> wrote:
>
> > Thanks a lot!
> > I'll be on vacation next couple of week, will try to test on return :)
> >
>
--
WBR
Maxim aka solomax
Re: Draggable multiple containment
Posted by Sebastien <se...@gmail.com>.
Hi Maxim,
After a quick test, 'revert' and 'accept' are enough (and convenient if you
have a css class for 'file'). But using 'scope' instead of 'accept' also
works, it's up to you...
I also confirm you that revert does not prevent #onDrop to be fired (even
used as a function)...
For instance:
- the droppable
private Droppable<String> newDroppable(String id, String color, final
String scope)
{
return new Droppable<String>(id, Model.of(color)) {
@Override
public void onConfigure(JQueryBehavior behavior)
{
super.onConfigure(behavior);
// behavior.setOption("scope", Options.asString(scope));
behavior.setOption("accept", Options.asString("." +
scope)); // css class
}
}
- the draggable
private static Draggable<String> newDraggable(String id, String label,
final String scope)
{
return new Draggable<String>(id, Model.of(label)) {
@Override
public void onConfigure(JQueryBehavior behavior)
{
super.onConfigure(behavior);
// behavior.setOption("scope", Options.asString(scope));
behavior.setOption("revert", true); // or:
// behavior.setOption("revert", "function(e) {
// console.log('e', e); // e stands for the droppable
// console.log('this', this); // this stands for the
draggable
// if (this.hasClass('file')) { return true; } }"); // true
means "do revert"
}
};
}
- html
< div wicket:id="draggable1" class="file">
my file
< /div>
< div wicket:id="draggable2" class="folder">
my folder
< /div>
Hope this helps,
Sebastien
On Fri, Jun 3, 2016 at 10:03 AM, Maxim Solodovnik <so...@gmail.com>
wrote:
> Thanks a lot!
> I'll be on vacation next couple of week, will try to test on return :)
>