Ricoを利用してアイテムをドラッグで移動できるようにしてみた。
設定はとても簡単に終わったのだが、動きが上手くいかない。
ドロップすると、元の位置に戻ってしまうのだ。なぜだぁ!
Rico.jsの該当行を見てみると以下のような記述が・・・
if ( this._placeDraggableInDropZone(e) )
this._completeDropOperation(e);
else {
this._terminateEvent(e);
new Effect.Position( this.dragElement,
this.origPos.x,
this.origPos.y,
200,
20,
{ complete : this._doCancelDragProcessing.bind(this) } );
}
どうも、ドロップ先が無い場合は、元の位置(this.origPos.x , this.origPos.y)に戻しているようだ。
どんな処理をしているのか、よく理解していないのだが、
とりあえず、以下のように変更した。
this.origPos.x, → e.screenX - this.startx,
this.origPos.y, → e.screenY - this.starty,
あと、
new Effect.Position( this.dragElement,
でもエラーが出ていたので、
new Rico.Effect.Position( this.dragElement,
と変更した。
他にも、スクロールした時にドラッグ位置がズレてしまう状況が・・・
どうも、スクロール量の補正が上手くいっていない様子。
ということで、2860行目付近の処理を修正。
if ( accountForDocScroll ) {
x -= this.docScrollLeft();
y -= this.docScrollTop();
}
という処理を、
if ( !accountForDocScroll ) {
x += this.docScrollLeft();
y += this.docScrollTop();
}
に変更したら、正常にドラッグすることができた。
一応、IE と、FireFoxでの動作は正常だった。
とりあえずは動作するようになったが、このままでは、ドロップ先を指定した処理が上手く動作しないと思われる。
まぁ、後で見直すか。