Legacy code and mode tools behaviour

[Branko Surjancev]

Hi all,

  I am working on legacy project code utilizing mootools ver 1.2. I am not proficient in using mootools and need some help.

 I have HTML structure like:

...   

<div class="a_container">

<div class="tree" style="top: -5570px; left: -10892px;">

<div class="row" style="top: 5452px">

<div class="leaf" style="left: 10647px; "><img src="...." rel="b28d3ee3-920f-4eae-a39d-c3a30eef4ecb"></div>

<div class="leaf" style="left: 10738px; "><img src="...." rel="9bc64e3e-08a4-4929-88eb-e97a8c3a4664"></div>

<div class="leaf" style="left: 10829px; "><img src="..." rel="10f2e863-93c5-40ba-9ce6-8afc69e79373"></div>

<div class="leaf" style="left: 10920px; "><img src="...." rel="c07062ef-d726-4d38-a4ac-340b4915a7d5"></div>

</div>

<div class="row" style="top: 5499px">

<div class="leaf" style="left: 10692px; "><img src="..."  rel="31608a69-d826-4bf3-9bc4-1f7f7a029ab2"></div>

<div class="leaf" style="left: 10783px; "><img src="...." rel="c40ab0cc-b934-41e3-bc3d-660cfbdc74c0"></div>

<div class="leaf" style="left: 10874px; "><img src="...." rel="38311d1c-dec5-49e0-8390-b7a5e2872e5e"></div>

<div class="leaf" style="left: 10965px; "><img src="..." rel="a5669bd1-90b0-4a45-b65a-4e4540677f09"></div>

</div>

<div class="row" style="top: 5546px">

..........

.........

.........

</div>

<div class="row" style="top: 5593px">

............

...........

</div>

<div class="row" style="top: 6157px">

....

....

</div>

</div>

</div> 

  ...

in JS:

this._treeElement = this.el.getElement('.tree');

if (!this.dragFx) {

            this.dragFx = new Drag(this._treeElement , { preventDefault: true, limit: { 'x': [this.treeLeftMaxLimit, this.treeBoundLeft], 'y': [this.treeBottomMaxLimit, this.treeBoundTop] } });

....

 this._treeElement.addEvent('onBeforeStart', Function.createDelegate(this, this.dragStart));

 this._treeElement.addEvent('onComplete', Function.createDelegate(this, this.dragEnd));

 this.dragFx.addEvent('onBeforeStart',Function.createDelegate(this, this.dragStart));

 this.dragFx.addEvent('onComplete',Function.createDelegate(this, this.dragEnd));

 this.dragFx.addEvent('onCancel', Function.createDelegate(this, this.dragEnd));

.....

Problem:

 When rendered draging is actually possible only if its clicked on the "leaf" divs, and then whole "tree" can be dragged, but if clicked in any space between "leaf" divs drag is not working.

Can you point me in the right direction how to fix this?

Thanks 

  

[Johnny Fuery]

Some of us are still here.

Mind putting this into a jsfiddle (or similar) for us, though? It would help see first-hand what you've got going on here.

Cheers,

Johnny Fuery

joh...@meruscase.com

--

---
You received this message because you are subscribed to the Google Groups "MooTools Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mootools-users+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Breno Ribeiro]

This.

While you do it, try using a background color on the tree and another for the rows or leafs.

--
[]'s,

Breno Ribeiro

Johnny Fuery

joh...@meruscase.com

To unsubscribe from this group and stop receiving emails from it, send an email to mootools-user...@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

---
You received this message because you are subscribed to the Google Groups "MooTools Users" group.

To unsubscribe from this group and stop receiving emails from it, send an email to mootools-user...@googlegroups.com.