Waiting for submit response

[PietroLiuzzo]

Hi!

I have a submission like the following

<fx-action event="submit">
          <fx-message>Searching...</fx-message>

   <fx-action while="counter &lt; 10" delay="1000">
            <fx-setvalue ref="counter" value=".+1"></fx-setvalue>
            <fx-update></fx-update>
            <fx-refresh></fx-refresh>
            <fx-message>You waited {'{counter}'} second</fx-message>
                   </fx-action>
</fx-action> 
                    <fx-message
                        event="submit-done">Done!</fx-message>
                    <fx-message
                        event="submit-error">ERROR ! </fx-message>
                    <fx-message
                        event="submit-error"
                        value="event('error')"></fx-message>
                </fx-submission>

Because it can take some seconds to return results, I added the counter to show a message while the users wait. I am sure there are better ways to report that the search is still ongoing, it just did not return yet? This works but keeps counting after I get the "Done!" message. I guess I would need to limit that with an if statement to fire only until submit-done event? I tried if="event('submit-done')" on action and message, but I am clearly missing something important. Thanks a lot for any hint!

[DrRataplan]

Hm, this appears to be a bug. In this place: https://github.com/Jinntec/Fore/blob/dev/src/actions/abstract-action.js#L232 we fire the 'done' event when we are done with the first iteration of the while. So in your case, after a second.

In other cases, when we have an infinite while loop, we actually want to release the event loop (to allow new 'done' events to come through). Problem here is that we cannot distinguish those loops...

You could choose to do something like this to make this work though:

• Add an additional instance with just a boolean in there. Something like <search-state running="true"/>
• After the search is done, add a fx-setvalue to set the running to 'false'
• <fx-action while="not(instance('state')/@done" delay="1000">

And then dispatch an event from the search action that tells all is done.

@JoernT what do you think on the while immediately causing the 'done' event? Maybe we should add a 'blockContinuation' attribute on the action?

[JoernT]

adding to what @DrRataplan suggested:

I guess it's easier to use a node here...

add an instance:

<fx-instance id="vars">
    <data>
        <running></running>
    </data>
</fx-instance>

the submission just sets the 'running' node

<fx-submission ...>
    <fx-setvalue event="submit" ref="instance('vars')/running">isRunning</fx-setvalue>
 ...sets it back to empty...
  <fx-setvalue event="submit-done" ref="instance('vars')/running"></fx-setvalue>

...somewhere in the UI use template expression to output a CSS class...
<img class="spinner {instance('vars')/running}" src="myspinner">

And then have CSS rules to do the job of showing a spinner or page overlay.

img.spinner{
display:none;
}
img.spinner.isRunning{
display:block;
....
}

This is how i would approach it. Of course you can render/not render anything this way.

If you need the duration the submission actually took you use custom functions to set a start and end node in the vars instance and calculate the diff.

This would be starter function to get a timestamp

            <fx-function signature="timeStamp() as xs:string" type="text/javascript">
                return new Date().toISOString();
            </fx-function>

[JoernT]

In other cases, when we have an infinite while loop, we actually want to release the event loop (to allow new 'done' events to come through). Problem here is that we cannot distinguish those loops...

@DrRataplan maybe we can distinguish...? Can't we say that an endless loop is always just using true() as an expression? Sure authors could write 1=1 but would anybody really do that and why? Just guessing

[PietroLiuzzo]

Thanks a lot!

Here is how I updated my fx-instance and fx-submission, and it works as you explained, even if I did not actually understand how to "dispatch an event from the search action that tells all is done".

 <fx-instance id="searchcounter">
                    <data>
                        <counter>0</counter>
                        <search-state/>
                    </data>
                </fx-instance>

<fx-submission
                    id="search"
                    replace="target"
                    target="#results"
                    method="post"
                    url="">
                    <fx-action
                        event="submit">
                        <fx-setvalue ref="instance('searchcounter')/search-state">running</fx-setvalue>
                        <fx-message>Searching...</fx-message>
                       <fx-action while="instance('searchcounter')/search-state = 'running'" delay="1000">
                        <fx-update></fx-update>
                        <fx-refresh></fx-refresh>
                         <fx-setvalue ref="instance('searchcounter')/counter" value=".+1"></fx-setvalue>
                        <fx-message>You waited {'{instance("searchcounter")/counter}'} second, I am still working, please, wait</fx-message>
                         </fx-action>
                    </fx-action> 
                   <fx-action event="submit-done">
                   <fx-setvalue ref="instance('searchcounter')/search-state"></fx-setvalue>
                   <fx-setvalue ref="instance('searchcounter')/counter">0</fx-setvalue>
                    <fx-message>Done, thanks for your patience.</fx-message>
                        </fx-action>
                    <fx-message
                        event="submit-error">ERROR ! </fx-message>
                    <fx-message
                        event="submit-error"
                        value="event('error')"></fx-message>
                </fx-submission>