Hi Sebastian, thanks for the suggestion... Since I am currently not migrating to the namespace branch, this wouldn't be much of an addition to current qooxdoo development, I fear. It also relies on dojo - I have no experience with QxTransport and currently no time to try it out... Maybe somebody working on the namespace branch can pick up pieces and reuse it...
Christian Sebastian Werner schrieb: > Hi Christian, > > what's about to clean this up a bit, remove application code and try to > integrate parts of the features directly to the qooxdoo library? > > Sebastian > > > Christian Boulanger schrieb: > >> Hi everybody, >> >> I was trying to get the QxTree drag and drop behavior from the Demos to >> do positioned inserts and ended up using a different approach ( setting >> the borderTop of the DOM element rather than a seperate tree marker >> line). Attached is the result includind the CakePHP controller method). >> Maybe someone finds this useful. >> Live demo as usual at http://m15s08.vlinux.de/bibliograph-0.10/trunk/ >> >> As now, you have to add all of the drag events to each tree node. >> Ideally, only the root should have the events and figure out which node >> is being dragged, dropped on and hovered over. But it works this way, >> that's all I care for now. >> >> Cheers, >> >> Christian >> >> >> ------------------------------------------------------------------------ >> >> /** >> * positioned drag & drop within a QxTree >> * >> * @author Christian Boulanger >> * @license LGPL >> * >> **/ >> >> //// code for tree >> >> /** >> * move folder >> **/ >> tree.moveFolder = function ( vAction, vSource, vTarget, vAddBefore ) >> { >> var vSourceId = vSource.getUserData("id"); >> var vTarget = vTarget ? vTarget : this._currentTarget; >> var vParent = vAddBefore ? vAddBefore.getParent().getParent() : >> vTarget; >> var vParentId = vParent.getUserData("id"); >> var vPosition = vAddBefore ? >> vAddBefore.getParent().indexOf(vAddBefore) : 9999; >> vSource.getTree().getManager().deselectAll(); >> >> zophe.io.bind({ >> url: "folders/move/" + vSourceId + "/" + vParentId + "/" + vPosition, >> handler: function(type, response){ >> if ( response.search(/OK/) == -1 ) { >> alert(response); >> } else { >> // update tree >> if ( vAddBefore ) { >> vParent.addBefore( vSource, vAddBefore ); >> } else { >> vParent.addAtEnd( vSource ); >> vParent.open(); >> } >> tree.unmarkAddBefore(); >> QxWidget.flushGlobalQueues(); >> } >> } >> }); >> } >> >> /** >> * show target line where to insert the drop data >> **/ >> tree.markAddBefore = function ( vTarget ) >> { >> vTarget.getElement().style.borderTop="1px dotted black"; >> this.setUserData( "addBefore", vTarget ); >> } >> >> /** >> * show target line where to insert the drop data >> **/ >> tree.unmarkAddBefore = function() >> { >> var vTarget = this.getUserData("addBefore"); >> if ( vTarget) { >> vTarget.getElement().style.borderTop=""; >> this.setUserData("addBefore",null); >> } >> } >> >> /** >> * drag move handler >> * >> **/ >> tree.handleDragMove = function(e) >> { >> tree.unmarkAddBefore(); >> >> var vSource = e.getData("QxTreeElement"); >> >> if ( ! vSource ) return; >> >> var vTarget = e.getTarget(), >> vTarget = vTarget.getParent() || vTarget.getContainerObject() || >> vTarget, >> vChildren = vTarget.getVisibleChildren(), >> vEventTop = e.getPageY(), >> vChild = null; >> >> for ( var i=0; i lt vChildren.length; i++ ) { >> var vTop = QxDom.getComputedPageBoxTop(vChildren[i].getElement()); >> if ((vTop - vEventTop).betweenRange(-4, 4) ) { >> var vChild = vChildren[i]; >> break; >> }; >> }; >> >> if ( vChild ) { >> tree.markAddBefore(vChild); >> } >> }; >> >> /** >> * handler for drag start >> **/ >> tree.handleDragStart = function(e) >> { >> e.addData("QxTreeElement", e.getCurrentTarget()); >> e.addAction("move"); >> e.startDrag(); >> }; >> >> /** >> * handler for drop: move folders or references >> **/ >> tree.handleDragDrop = function(e) >> { >> e.stopPropagation(); >> >> var vSource = e.getData("QxTreeElement"), >> vTarget = e.getCurrentTarget(); >> >> if ( vSource ){ >> >> // move folder >> var vAddBefore = tree.getUserData ( "addBefore" ); >> tree.moveFolder ( "move", vSource, vTarget, vAddBefore ); >> >> } >> >> /** >> * ?? >> **/ >> tree.supportsDrop = function(vDragCache) { >> return !vDragCache.sourceWidget.contains(this); >> }; >> >> /** >> * drag over handler: underline node label >> **/ >> tree.handleDragOver = function(e) >> { >> var l = e.getTarget().getLabelObject(); >> l.setStyleProperty("textDecoration", "underline"); >> }; >> >> /** >> * drag out handler: remove underlining >> **/ >> tree.handleDragOut = function(e) >> { >> var l = e.getTarget().getLabelObject(); >> l.removeStyleProperty("textDecoration"); >> }; >> >> /** >> * drag end handler >> **/ >> tree.handleDragEnd = function(e) >> { >> vLastIndex = null; >> tree.unmarkAddBefore(); >> }; >> >> >> // initialization >> >> with ( tree ) { >> addEventListener("dragdrop", handleDragDrop); >> addEventListener("dragover", handleDragOver); >> addEventListener("dragout", handleDragOut); >> addEventListener("dragmove", handleDragMove); >> setDropDataTypes(["QxTreeElement","QxListViewEntries"]); >> setUserData("id",0); >> reload(); >> } >> >> /// code for each tree node >> >> var qx_1 = new QxTreeFolder("eins"); >> qx_1.setDropDataTypes(["QxTreeElement"]); >> qx_1.supportsDrop = tree.supportsDrop; >> qx_1.setUserData("id",49); >> qx_1.addEventListener('mousedown',tree.handleMouseDown); >> qx_1.addEventListener('dragstart',tree.handleDragStart); >> qx_1.addEventListener('dragdrop',tree.handleDragDrop); >> qx_1.addEventListener('dragover',tree.handleDragOver); >> qx_1.addEventListener('dragout',tree.handleDragOut); >> qx_1.addEventListener('dragend',tree.handleDragEnd); >> qx_1.addEventListener('dragmove',tree.handleDragMove); >> >> /// CakePHP server side handler >> <?php >> >> ** >> * Controller for folders >> **/ >> >> class FoldersController extends AppController >> { >> var $name = "Folders"; >> var $uses = array ("Folder","Reference"); >> var $views = null; >> >> /** >> * moves a folder under a new parent >> **/ >> function move ( $folderId, $parentId, $position=0 ) >> { >> // save new parent and position >> $data = $this->Folder->findById( $folderId, >> array("parent_id","position") ); >> $data['Folder']['parent_id'] = $parentId; >> $data['Folder']['position'] = $position*2; >> $this->Folder->save($data); >> >> // reorder siblings >> $data = $this->Folder->findAll( array('parent_id' => $folderId >> ), array("position"),"position"); >> $position = 1; >> for ($i=0; $i < count($data); $i++) { >> $data[$i]['Folder']['position'] = $position; >> $position+=2; >> } >> $this->Folder->save($data); >> >> $this->_output = "OK"; >> return true; >> } >> >> ?> >> > > > > _______________________________________________ > Qooxdoo-devel mailing list > [email protected] > https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel > _______________________________________________ Qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
