Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    3
    Vote Rating
    0
    NoPr0n is on a distinguished road

      0  

    Default Drag and Drop problem

    Drag and Drop problem


    Hello everybody.

    I've got a problem with the drag and drop possibility in ExtJs 3.4.
    I try to make an HTML table which each <td> is a dropTarget and in which it is possible to place dragzone <div>.
    For now, this works, but my <div> are volontary bigger than one <td> (css: float) and my <div> is only draggable in the first <td>.
    Unfortunately, <td> are really small and I want my <div> be draggable along their entire length.
    Any idea?

    PS: Sorry for the bad english :/

  2. #2
    Sencha User
    Join Date
    Jul 2012
    Posts
    3
    Vote Rating
    0
    NoPr0n is on a distinguished road

      0  

    Default


    Please, I really need help :/

  3. #3
    Sencha User
    Join Date
    Jan 2011
    Posts
    544
    Vote Rating
    51
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    Maybe providing your code as an example might help?

  4. #4
    Sencha User
    Join Date
    Jul 2012
    Posts
    3
    Vote Rating
    0
    NoPr0n is on a distinguished road

      0  

    Default


    Yes yes, of course !

    Code:
    <script>    var stepID=0;
        var availableLine=1;
        var allLine=[];
        
        
        document.write('<div id="newElement" style="background-color:BLUE;height:20px;width:90px;"></div>');
        document.write('<table style="border-collapse:collapse;padding:opx;">');
        
        
        for(var i=0;i<10;i++){
            var lineTarget=[];
            //DEFINE NEW LINE
            document.write('<tr id="line-'+i+'" style="">');
            //FOR FIRST LINE
            if(i==0){
                    //DEFINE COLUMNS TITLE
                    for(var m=0;m<12;m++){
                        document.write('<th id="title-'+m+'" colspan="4" style="border-style:solid;border-width:1px;border-color:DARK;background-color:LIGHTBLUE;height:30px;width:120px;">');
                        if(m==0)document.write('<h2>JANVIER</h2>');
                        if(m==1)document.write('<h2>FEVRIER</h2>');
                        if(m==2)document.write('<h2>MARS</h2>');
                        if(m==3)document.write('<h2>AVRIL</h2>');
                        if(m==4)document.write('<h2>MAI</h2>');
                        if(m==5)document.write('<h2>JUIN</h2>');
                        if(m==6)document.write('<h2>JUILLET</h2>');
                        if(m==7)document.write('<h2>AOUT</h2>');
                        if(m==8)document.write('<h2>SEPTEMBRE</h2>');
                        if(m==9)document.write('<h2>OCTOBRE</h2>');
                        if(m==10)document.write('<h2>NOVEMBRE</h2>');
                        if(m==11)document.write('<h2>DECEMBRE</h2>');
                        document.write('</th">');
    
    
                    }
            }else{
                //DEFINE ALL DROPZONE
                for(var y=0;y<48;y++){
                    document.write('<td style="border-style:solid;border-width:1px;border-color:LIGHTGRAY;height:30px;">');
                    document.write('<div id="drop-'+i+'-'+y+'"  style="position:relative;height:30px;">');
                    document.write('</div>');
                    document.write('</td>');    
                    //IF THE LINE ALLOW DROP
                    if(i==availableLine){
                        var dropZone = new Ext.dd.DropTarget('drop-'+i+'-'+y,{ddGroup:'availableLine'});
                    }else{
                        var dropZone = new Ext.dd.DropTarget('drop-'+i+'-'+y,{ddGroup:'affectedLine'});
                    }
                    
                    //WHEN AN ELEMENT IS DROPPEND ON THIS ZONE
                    dropZone.notifyDrop=function(dd, e, data){
                        //IF IT'S A NEW ELEMENT
                        if(data.ddel.id=="newElement"){
                            //ADD A NEW STEP TO THE DROPZONE
                            this.el.dom.innerHTML='<div id="step-'+stepID+'" style="position:absolute;background-color:LIGHTBLUE;height:20px;width:90px;float:left;top:5px; z-index: 100;"><div id="left-'+stepID+'"  style="float:left;display:inline-block;background-color:BLUE;height:20px;width:10px;"></div><div id="right-'+stepID+'"  style="float:right;display:inline-block;background-color:BLUE;height:20px;width:10px;"></div></div>';
                            //SET THE NEW STEP DRAGGABLE
                            var item =new Ext.dd.DragZone('step-'+stepID, {ddGroup:'affectedLine-'+stepID,dropZoneOrg:this});
                            Ext.dd.Registry.register('step-'+stepID);
                            new Ext.dd.DragZone('right-'+stepID, {ddGroup:'affectedLine-'+stepID,dragParent:item});
                            Ext.dd.Registry.register('right-'+stepID);
                            new Ext.dd.DragZone('left-'+stepID, {ddGroup:'affectedLine-'+stepID,dragParent:item});
                            Ext.dd.Registry.register('left-'+stepID);
                            
                            //SET THE NEXT LINE AVAILABLE
                            availableLine++;
                            
                            //SET THE CURRENT LINE ONLY DROPPABLE FOR THIS STEP
                            for(drop in allLine[this.el.dom.parentNode.parentNode.id]){    
                                if(drop!='remove'){
                                    allLine[this.el.dom.parentNode.parentNode.id][drop].removeFromGroup('availableLine');
                                    allLine[this.el.dom.parentNode.parentNode.id][drop].addToGroup('affectedLine-'+stepID);
                                }
                            }
                            //SET THE NEXT LINE AVAILABLE
                            for(drop in allLine['line-'+availableLine]){
                                if(drop!='remove'){
                                    allLine['line-'+availableLine][drop].addToGroup('availableLine');
                                }
                            }
                            
                            //SET THE NEW ID OF THE NEXT STEP
                            stepID++;
                            
                        //IF IT'S AN ELEMENT ALREADY DROPPEND ON THIS LINE
                        }else if(data.ddel.id.substr(0,4)=='step'){
                            dd.el.appendTo(this.el);
                        }else if(data.ddel.id.substr(0,5)=='right'){ 
                            //TO DO
                            console.log(dd.dragParent.dropZoneOrg.id);
                            console.log(allLine[this.el.dom.parentNode.parentNode.id].indexOf(dd.dragParent.dropZoneOrg.id));
    
    
                        }else if(data.ddel.id.substr(0,4)=='left'){
                            //TO DO
                            console.log("left");
                        }
                        return true;
                    }
                    //MEMORIZE THE DROPZONE IN THE LINE
                    lineTarget['drop-'+i+'-'+y]=dropZone;
                }
            }
            document.write('</tr>');
            //MEMORIZE THE LINE ON ALLLINE
            allLine['line-'+i]=lineTarget;
        }
        document.write('</table>');
        new Ext.dd.DragZone("newElement", {ddGroup:'availableLine'});
        Ext.dd.Registry.register("newElement");
    </script>
    Sorry if it's a little messy.
    This code is not the final code, it's only to make some tests.

Thread Participants: 1

Tags for this Thread