Buffering Http State Provider

[jsakalos]

Bug fix:

    

initState:function(state) {
        if(state instanceof Array) {
            Ext.each(state, function(item) {
                this.state[item[this.paramNames.name]] = this.decodeValue(item[this.paramNames.value]);
            }, this);
        }
        else {
            this.state = state ? state : {};
        }

Excellent work, by the way. I was about 25% of the way into my own implementation before I realized that buffering would be the best way to do this. At that point I decided to see if it had already been done and I was in luck. You saved me a days work!
THANKS

Thanks, otherwise it doesn't honor paramNames.value...

[smudgeface]

Saki,

Take a look in onSaveSuccess() and onSaveFailure(). Both contain the same block of code

if(this.started) {
    this.start();
}

What this basically does is queue another request in 'this.delay' milliseconds. The problem here is that, if there is a communication error with the server, httpprovider enters an endless loop of retries. Maybe this is what you intended, but do you not think it makes more sense to only queue submitState when a queueChange occurs?

I tried this by commenting out this.start() in the if(this.started){} blocks and adding this.start() to the end of queueChange. Works as expected - failed submits do not retry until the user performs an action that requires another state save.

[jsakalos]

Sounds good. The original idea was that you can programmatically stop the provider so the code at the end of queueChange should be:

if(this.started) {
     this.start();
} 

Also, then you could comment the start also in onSaveSuccess, right? Could you please test it taking in account these notes?

[smudgeface]

Exactly! I commented out this.start() in both onSaveSuccess and onSaveFailure. Then, to make sure I tested fully, I caused both types of failure events: communication failure by renaming the file pointed to in URL (causing onSaveFailure), and application failure by returning o.success = false.

In both cases, httpProvider attempted to reach the server only once but retried on the next state change. I also noticed that my web app was more responsive as there was less AJAX activity.

here is the updated code (comments and headers removed )

,queueChange:function(name, value) {
        var changed = undefined === this.state[name] || this.state[name] !== value;
        var o = {};
        var i;
        var found = false;
        if(changed) {
            o[this.paramNames.name] = name;
            o[this.paramNames.value] = this.encodeValue(value);
            for(i = 0; i < this.queue.length; i++) {
                if(this.queue[i].name === o.name) {
                    this.queue[i] = o;
                    found = true;
                }
            }
            if(false === found) {
                this.queue.push(o);
            }
            this.dirty = true;
        }
        if(this.started) {
             this.start();
        }
        return changed;
    }

,onSaveSuccess:function(response, options) {
        var o = {};
        try {o = Ext.decode(response.responseText);}
        catch(e) {
            if(true === this.logFailure) {
                this.log(this.saveFailureText, e, response);
            }
            this.dirty = true;
            return;
        }
        if(true !== o.success) {
            if(true === this.logFailure) {
                this.log(this.saveFailureText, o, response);
            }
            this.dirty = true;
        }
        else {
            Ext.each(options.queue, function(item) {
                var name = item[this.paramNames.name];
                var value = this.decodeValue(item[this.paramNames.value]);

                if(undefined === value || null === value) {
                    Ext.ux.HttpProvider.superclass.clear.call(this, name);
                }
                else {
                    // parent sets value and fires event
                    Ext.ux.HttpProvider.superclass.set.call(this, name, value);
                }
            }, this);
            if(false === this.dirty) {
                this.queue = [];
            }
            else {
                var i, j, found;
                for(i = 0; i < options.queue.length; i++) {
                    found = false;
                    for(j = 0; j < this.queue.length; j++) {
                        if(options.queue[i].name === this.queue[j].name) {
                            found = true;
                            break;
                        }
                    }
                    if(true === found && this.encodeValue(options.queue[i].value) === this.encodeValue(this.queue[j].value)) {
                        this.queue.remove(this.queue[j]);
                    }
                }
            }
            if(true === this.logSuccess) {
                this.log(this.saveSuccessText, o, response);
            }
            this.fireEvent('savesuccess', this);
        }
    } 

    ,onSaveFailure:function(response, options) {
        if(true === this.logFailure) {
            this.log(this.saveFailureText, response);
        }
        this.dirty = true;
        this.fireEvent('savefailure', this);
    }

[jsakalos]

Thanks, I'll let my users to test the new version for a couple of days and if nothing happens I'll update the code in the first post.

[smudgeface]

Just one thing, I noticed that I left some modifications that are only relevant to my code. I have edited my previous post to correct the errors. Please make sure that you use the new corrected code in case you missed it.

[jsakalos]

Anway, I haven't copied&pasted your code, I never do that. I have written patches manually. Thanks for caring about that....

[calavera]

Hello. Nice work. I am trying to grab the state from the database like this:

$sql =
   "select name,value from state where "
  ."id={$clientArgs->id} and user='{$clientArgs->user}' and session='{$clientArgs->session}'"
  ;
  
   $ostmt = $odb->query($sql);
   $state = $ostmt->fetchAll(PDO::FETCH_OBJ);
  $state = json_encode($state); 

And then :

Ext.state.Manager.getProvider().initState(<?=$state;?>);

The problem is that $state is empty. Where could be the problem ? If I copy the query and run it in my sqlite manager, it would bring up the data correctly. And if I paste the data directly into the initState line, the columns are updated correctly...So the problem is about getting the data from the database...What am I doing wrong ??

Thanks

[jsakalos]

It's very difficult, if not impossible, to say anything about server side. I would make a PHP test page with echo xxx at various points if the code to see what's PHP doing.

[calavera]

Ok, I have it figured out. I had a wrong path to the .sqlite file. It's working great now!

I wonder if I can add an on.load kind of function so that I can see a loading message when I change the width of a column for example. What do you think ?