Periodical ajax call causes dragging element to disappear.

thread: 8 messages  |  last: a year ago  |  started: wednesday, august 8, 2007, 1:25 pm pdt


#1  |  Travis Barney (Salt Lake City, UT) United States of America
Wednesday, August 8, 2007, 1:25 PM PDT

I'm trying to get a working prototype of a drag/drop interface, which needs to update panels every second.  The problem I am having is that when the setTimeout function runs the pxyActions_Click method, the presently dragging DOM element disappears. :(  Any ideas to implement a “startDrag” event that suspends ajax calls?

protected function pxyActions_Create() {
    $this->pxyActions = new QControlProxy($this, 'pxyActions');
    $this->pxyActions->AddAction(new QClickEvent(), new QAjaxAction('pxyActions_Click'));
    $this->pxyActions_Click();
}
        
public function pxyActions_Click() {
    $this->RereshCallList();
    QApplication::ExecuteJavaScript("window.setTimeout(\"qc.pA('PageForm', 'pxyActions', 'QClickEvent', '', 'icoWait');\", 1000);");
}

public function RefreshCallList() {
    foreach ($this->arrCalls as $intCallId => $arrCall) {
        // ... Attempt to load existing child to update, if not create.
        $objLabel = $this->Form->GetControl('lblCall' . $intCallId);

        if (false == is_object($objLabel)) {
            $objLabel = new QLabel($this, 'lblCall' . $intCallId);
            $objLabel->Position = QPosition::Relative;        
            $objLabel->AddControlToMove($objLabel);
            $objLabel->AddAction(new QMoveEvent(), new QAjaxControlAction($this, 'Label_Drop'));
                    
            foreach ($this->Form->pnlListUsers->GetChildControls() as $lblUser) {
                $objLabel->AddDropZone($lblUser);
            }
                    
            $this->AddChildControl($objLabel);
        }
                
        $objLabel->Text = $arrCall['number'];
    }
            
    $this->MarkAsModified();
}
.bc
#2  |  Mike Ho (Sunnyvale, CA) United States of America Qcodo Administrator
Thursday, August 9, 2007, 8:43 AM PDT

Hmm... best bet might be to think about it “the other way” around.

Create a javascript method which checks to see if you're in middle of a drag (in theory you can do by checking to see if qcodo.currentMouseHandleControl is set... see qcodo.js for more info).

If you're NOT in middle of a drag, then call the “qc.pA” call.  If you ARE in middle of a drag, call window.setTimeout -- but instead of setting timeout to qc.PA, set timeout to this new javascript function you have created.

And then finally, within pxyActions_Click(), update your setTimeout to call your new javascript function instead of qc.PA.

This should work... but only in theory. =)

#3  |  Travis Barney (Salt Lake City, UT) United States of America
Thursday, August 9, 2007, 9:41 AM PDT

Mike, you are a great help.  I wish that we could arrange some time for you to come up to Salt Lake and meet our development team and advise us on our progress with the revamp  to your old CSMS system, as well as it's sister projects all now running on QCodo. :)

It has taken me some time to adjust my brain to true OO, but I now fully realize the awesome power of a singular point code-base (instead of juggling JS/PHP/Smarty/Etc.) and totally predictable naming conventions.  The only problem is that the business side expects things too fast!

- Travis

This JS worked out just perfect. Thanks!

Page = {
    CallBack: function() {
        if (qcodo.currentMouseHandleControl == null) {
            qc.pA('PageForm', 'pxyActions', 'QClickEvent', 'Refresh', 'icoWait');
        } else {
            setTimeout('Page.CallBack()', 1000);
        }
    }
}
.bc
#4  |  kentpachi (France, EU) France
Thursday, January 14, 2010, 2:02 AM PST

very good concept with proxy, i used it to implements ajax periodical calls.
It could be an extensions of QControlProxy in next release what do you think ?


Thanks!

#5  |  Mike Ho (Sunnyvale, CA) United States of America Qcodo Administrator
Friday, January 15, 2010, 8:36 AM PST

Yes, it probably should be -- but I think we can make it a bit cleaner by adding timed calls (or polling) to QForm itself, which would in essence provide “push”-like capability to qcodo.

Definitely a good idea -- feel free to add a ticket in the issue tracker for this.

#6  |  Mike Ho (Sunnyvale, CA) United States of America Qcodo Administrator
Thursday, March 18, 2010, 10:00 PM PDT

I received a question for a tighter example of this... so here it is, which is an update of the default sample.php that comes with Qcodo:

<?php
    
/**
     * This is a standard, sample QForm which you can use as a starting
     * point to build any QForm page that you wish.
     */

    // Include prepend.inc to load Qcodo
    
require(dirname(__FILE__) . '/../includes/prepend.inc.php');

    class 
SampleForm extends QForm {
        protected 
$lblMessage;
        protected 
$btnButton;
        
        protected 
$pxyRefresh;

        protected function 
Form_Create() {
            
$this->lblMessage = new QLabel($this);
            
$this->lblMessage->Text 'Click the button to change my message.';

            
$this->btnButton = new QButton($this);
            
$this->btnButton->Text 'Click Me';
            
$this->btnButton->AddAction(new QClickEvent(), new QAjaxAction('btnButton_Click'));

            
$this->pxyRefresh = new QControlProxy($this);
            
$this->pxyRefresh->AddAction(new QClickEvent(), new QAjaxAction('pxyRefresh_Click'));

            
// Set to "Refresh" in 1000 ms
            
QApplication::ExecuteJavaScript(sprintf('qcodo.setTimeout("%s", "qc.pA(\'%s\', \'%s\', \'QClickEvent\', null, null);", %s);',
                
$this->pxyRefresh->ControlId,
                
$this->pxyRefresh->Form->FormId,
                
$this->pxyRefresh->ControlId,
                
1000));
        }

        protected function 
pxyRefresh_Click($strFormId$strControlId$strParameter) {
            
$this->lblMessage->Text QDateTime::Now()->__toString(QDateTime::FormatDisplayDateTimeFull);

            
// Set to "Refresh" in 1000 ms
            
QApplication::ExecuteJavaScript(sprintf('qcodo.setTimeout("%s", "qc.pA(\'%s\', \'%s\', \'QClickEvent\', null, null);", %s);',
                
$this->pxyRefresh->ControlId,
                
$this->pxyRefresh->Form->FormId,
                
$this->pxyRefresh->ControlId,
                
1000));
        }

        protected function 
btnButton_Click($strFormId$strControlId$strParameter) {
            
$this->lblMessage->Text 'Hello, World!';
        }
    }

    
SampleForm::Run('SampleForm');
?>

I'm still trying to figure out the right place to hook this in -- this example is using QControlProxy, but I wonder if it makes sense to incorporate this into QForm itself.

Also, it'd be nice to get this integrated more tightly with the URL Hashing processor (which also uses timers).

Regardless, for those that can't wait, this method/example using QControlProxy will work and will work regardless of any future solution (which should hopefully come about shortly...)

#7  |  kentpachi (France, EU) France
Friday, March 19, 2010, 2:01 AM PDT

Hello,

i'm using something similar too for a cms based on qcodo.

One thing we can do is to implements observer/observable pattern.

each object wich as periodical routine(observer) should register itself to qform(observable) (by implementing an interface for instance).

Then in QFORM we could have somthing like an array

$periodicalObservers[$timeToNextAjax] = $ObjectInterface

then while the difference is ok $time > $timeToNextAjax
call the interface method

$ObjectInterface->ProcessPeriodicalRequest($timeTonextAjax);

Where ProcessPeriodicalRequest would be something like.

public function ProcessPeriodicalRequest($frequency)
{
  switch($frequency)
  {
      case 10000:
       //do something each 10s 
      break;
   }
}

what do you think ? this is speed idea i think things can be better. Creating a real component in charge of TimeEvents in qcodo etc.

#8  |  Mike Ho (Sunnyvale, CA) United States of America Qcodo Administrator
Wednesday, March 24, 2010, 9:00 PM PDT

Thanks... actually, Romcart (thanks Romcart!) has taken the lead on this and has submitted a commit on his github repository -- we're still working to clean up a few details, but this will likely be in the next release.



Copyright © 2005 - 2012, Quasidea Development, LLC
This open-source framework for PHP is released under the terms of The MIT License.