Smalltalk › Frameworks & Tools › Seaside › Seaside General

show spinner until something is done

‹ Previous Topic Next Topic ›
 
classic Classic list List threaded Threaded
♦
♦
 3 messages Options
Sabine Manaa
Reply | Threaded
Open this post in threaded view
♦
♦
|

show spinner until something is done

Sabine Manaa
I create pdf reports which are converted to pngs for small previews (and print/mail/export).

When the user clicks at "report", there are several pdf reports and their pngs generated in the background.
In this moment (When the user clicks at "report"), the application changes to the reports page.
But in this moment, the repots possibly are not yet finished :-)

So, I want to  show a spinner/counter for each of the reports and update each in the moment when the png is ready.

I succeeded with all but the spinner/counter and the moment when the page renders. Its to late.

My problem is that the page is rendered only in the moment, when the code is run. Not earlier.
I assume the onLoad is to late? I tried several things for several hours :-( and now I want to ask the community.

I reduced the problem to a very simple example: 2 methods with the question:
how to change this code to update the counter 1,2,3,4...
Very curious about a solution


>>renderContentOn: html
        html div
                id: 'image';
                with: [ html text: 'Waiting for the report' ].
        html div
                id: 'counter';
                with: [ html text: 'This should count 1,2,3...' ].
        html document addLoadScript: (html jQuery ajax script: [ :script | self loadScriptIndex: 1 script: script ])
       
>>loadScriptIndex: anIndex script: s  
        | theIndex |
        (Delay forMilliseconds: 100) wait.
        theIndex := anIndex.
        "aPngFilename asFileReference exists" anIndex > 50 "simulate file is there after some time"
                ifTrue: [  
                        s << (s jQuery: #image)
                                replaceWith: [ :h |
                                        h text: theIndex asString.
                                        h image
                                                altText: 'Report';
                                                width: '100%';
                                                url: 'http://localhost/reports/a.png' ] ]
                ifFalse: [ theIndex := theIndex + 1.
                        s << (s jQuery: #counter)
                                replaceWith: [ :h |
                                        h div
                                                id: #counter;
                                                with: [ h text: theIndex asString ] ].
                        self
                                loadScriptIndex: theIndex
                                script: s
                                 
                                 
and possibly
registerTestApplication
        | theApplication |
        theApplication := WAAdmin register: RKATestView asApplicationAt: 'RKT'.
        theApplication
                addLibrary: JQDeploymentLibrary;
                addLibrary: JQUiDeploymentLibrary.
        ^ theApplication

Maarten Mostert-2
Reply | Threaded
Open this post in threaded view
♦
♦
|

Re: show spinner until something is done

Maarten Mostert-2
Hello Sabina,

Don’t know how you do javascript and JQuery in Seaside (I use Appex) but can’t you build something like this:


Maarten,



On 25 Jul 2016, at 11:52, Sabine Manaa <[hidden email]> wrote:

I create pdf reports which are converted to pngs for small previews (and
print/mail/export).

When the user clicks at "report", there are several pdf reports and their
pngs generated in the background.
In this moment (When the user clicks at "report"), the application changes
to the reports page.
But in this moment, the repots possibly are not yet finished :-)

So, I want to  show a spinner/counter for each of the reports and update
each in the moment when the png is ready.

I succeeded with all but the spinner/counter and the moment when the page
renders. Its to late.

My problem is that the page is rendered only in the moment, when the code is
run. Not earlier.
I assume the onLoad is to late? I tried several things for several hours :-(
and now I want to ask the community.

I reduced the problem to a very simple example: 2 methods with the question:
how to change this code to update the counter 1,2,3,4...
Very curious about a solution


renderContentOn: html
html div
id: 'image';
with: [ html text: 'Waiting for the report' ].
html div
id: 'counter';
with: [ html text: 'This should count 1,2,3...' ].
html document addLoadScript: (html jQuery ajax script: [ :script | self
loadScriptIndex: 1 script: script ])

loadScriptIndex: anIndex script: s  
| theIndex |
(Delay forMilliseconds: 100) wait.
theIndex := anIndex.
"aPngFilename asFileReference exists" anIndex > 50 "simulate file is there
after some time"
ifTrue: [  
s << (s jQuery: #image)
replaceWith: [ :h |
h text: theIndex asString.
h image
altText: 'Report';
width: '100%';
url: 'http://localhost/reports/a.png' ] ]
ifFalse: [ theIndex := theIndex + 1.
s << (s jQuery: #counter)
replaceWith: [ :h |
h div
id: #counter;
with: [ h text: theIndex asString ] ].
self
loadScriptIndex: theIndex
script: s


and possibly
registerTestApplication
| theApplication |
theApplication := WAAdmin register: RKATestView asApplicationAt: 'RKT'.
theApplication
addLibrary: JQDeploymentLibrary;
addLibrary: JQUiDeploymentLibrary.
^ theApplication





--
View this message in context: http://forum.world.st/show-spinner-until-something-is-done-tp4907725.html
Sent from the Seaside General mailing list archive at Nabble.com.
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Sabine Manaa
Reply | Threaded
Open this post in threaded view
♦
♦
|

Re: show spinner until something is done

Sabine Manaa
Hi Maarten,

I am just experimenting with it and it seems to work in my small example. You brought my thoughts in a new direction - thanks a lot for it!

I started with adding it as html script: '' and will change it to smalltalk code later.
I replaced the check for a dom element in the example with the check if the file on the server exists. 

Regards
Sabine

2016-07-25 22:12 GMT+02:00 Maarten Mostert-2 [via Smalltalk] <[hidden email]>:
Hello Sabina,

Don’t know how you do javascript and JQuery in Seaside (I use Appex) but can’t you build something like this:


Maarten,



On 25 Jul 2016, at 11:52, Sabine Manaa <[hidden email]> wrote:

I create pdf reports which are converted to pngs for small previews (and
print/mail/export).

When the user clicks at "report", there are several pdf reports and their
pngs generated in the background.
In this moment (When the user clicks at "report"), the application changes
to the reports page.
But in this moment, the repots possibly are not yet finished :-)

So, I want to  show a spinner/counter for each of the reports and update
each in the moment when the png is ready.

I succeeded with all but the spinner/counter and the moment when the page
renders. Its to late.

My problem is that the page is rendered only in the moment, when the code is
run. Not earlier.
I assume the onLoad is to late? I tried several things for several hours :-(
and now I want to ask the community.

I reduced the problem to a very simple example: 2 methods with the question:
how to change this code to update the counter 1,2,3,4...
Very curious about a solution


renderContentOn: html
html div
id: 'image';
with: [ html text: 'Waiting for the report' ].
html div
id: 'counter';
with: [ html text: 'This should count 1,2,3...' ].
html document addLoadScript: (html jQuery ajax script: [ :script | self
loadScriptIndex: 1 script: script ])

loadScriptIndex: anIndex script: s  
| theIndex |
(Delay forMilliseconds: 100) wait.
theIndex := anIndex.
"aPngFilename asFileReference exists" anIndex > 50 "simulate file is there
after some time"
ifTrue: [  
s << (s jQuery: #image)
replaceWith: [ :h |
h text: theIndex asString.
h image
altText: 'Report';
width: '100%';
url: 'http://localhost/reports/a.png' ] ]
ifFalse: [ theIndex := theIndex + 1.
s << (s jQuery: #counter)
replaceWith: [ :h |
h div
id: #counter;
with: [ h text: theIndex asString ] ].
self
loadScriptIndex: theIndex
script: s


and possibly
registerTestApplication
| theApplication |
theApplication := WAAdmin register: RKATestView asApplicationAt: 'RKT'.
theApplication
addLibrary: JQDeploymentLibrary;
addLibrary: JQUiDeploymentLibrary.
^ theApplication





--
View this message in context: http://forum.world.st/show-spinner-until-something-is-done-tp4907725.html
Sent from the Seaside General mailing list archive at Nabble.com.
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


If you reply to this email, your message will be added to the discussion below:
http://forum.world.st/show-spinner-until-something-is-done-tp4907725p4907892.html
To start a new topic under Seaside General, email [hidden email]
To unsubscribe from show spinner until something is done, click here.
NAML

Free forum by Nabble Edit this page