calband / calchart-viewer

An online show viewer and continuity generator for Calchart.
calband.github.io/calchart-viewer/
2 stars 2 forks source link

Make Javascript async #169

Closed brandonchinn178 closed 8 years ago

brandonchinn178 commented 8 years ago

It's highly unrecommended for any AJAX calls to be called synchronously, as it would make the page slow to load. The page, indeed, takes a bit to load. I think in the interest of UI, it would be good to make the AJAX calls synchronous, with like a loading message over the entire screen that would disappear after every AJAX call is completed.

Possible transparent background behind message: screen-shot-2015-12-03-at-8 53 30-pm

Possible animated logo? output_p9h0nt

noahsark769 commented 8 years ago

Is it even possible to make JavaScript calls synchronous like this? If so, that's a bad idea, since the entire browser tab would be blocked for 3-5 seconds max while the request completes (or even longer).

However, I'm totally in favor of adding a loading indicator! Note though that this does not require making the js synchronous. On Thu, Dec 3, 2015 at 9:03 PM Brandon Chinn notifications@github.com wrote:

It's highly unrecommended for any AJAX calls to be called synchronously, as it would make the page slow to load. The page, indeed, takes a bit to load. I think in the interest of UI, it would be good to make the AJAX calls synchronous, with like a loading message over the entire screen that would disappear after every AJAX call is completed.

Possible transparent background behind message: [image: screen-shot-2015-12-03-at-8 53 30-pm] https://cloud.githubusercontent.com/assets/6827922/11582262/4997be24-9a01-11e5-8420-c1df1882a3a7.jpg

Possible animated logo? [image: output_p9h0nt] https://cloud.githubusercontent.com/assets/6827922/11582263/4e0120b8-9a01-11e5-8699-32531a1a7079.gif

— Reply to this email directly or view it on GitHub https://github.com/calband/calchart-viewer/issues/169.

brandonchinn178 commented 8 years ago

Right now, it IS synchronous. This issue is to make it asynchronous. To do the loading message, just have some callback that removes the loading message

noahsark769 commented 8 years ago

Wait it's synchronous right now? I didn't even realize that. We should definitely make them asynchronous On Mon, Dec 7, 2015 at 11:19 AM Brandon Chinn notifications@github.com wrote:

Right now, it IS synchronous. This issue is to make it asynchronous. To do the loading message, just have some callback that removes the loading message

— Reply to this email directly or view it on GitHub https://github.com/calband/calchart-viewer/issues/169#issuecomment-162629945 .

noahsark769 commented 8 years ago

@brandonchinn178 sorry, I think I didn't understand what you were trying to say earlier haha. You're talking about making the calls asynchronous, right?

I think the javascript is currently asynchronous? see our use of $.getJSON which defaults to async as far as I know. I was really confused since it's very uncommon to have js triggered HTTP requests execute synchronously: in fact it's deprecated.

That said, the page does seem to wait on getting the data from the server before it loads, somehow. Might just be a coincidence, but worth looking into. Also, I'm all for a loading indicator.

brandonchinn178 commented 8 years ago

haha yea, it is currently synchronous. Look at ApplicationController.js, the init function has $.ajaxSetup({async: false}). I did this because I had to load dot labels and the show after getting data from the server, or else the code would error. idk why I didnt use callbacks but yea. We should change this

noahsark769 commented 8 years ago

Oh well I'll be damned, I guess you're right! Yeah we should defintely use callbacks hahaha

On Tuesday, December 8, 2015, Brandon Chinn notifications@github.com wrote:

haha yea, it is currently synchronous. Look at ApplicationController.js, the init function has $.ajaxSetup({async: false}). I did this because I had to load dot labels and the show after getting data from the server, or else the code would error. idk why I didnt use callbacks but yea. We should change this

— Reply to this email directly or view it on GitHub https://github.com/calband/calchart-viewer/issues/169#issuecomment-162808922 .


Noah Gilmore B.S. Electrical Engineering and Computer Sciences University of California, Berkeley 2015

brandonchinn178 commented 8 years ago

@noahsark769 if you want to look at the pull request, feel free to check out how I made it async

Chan12345 commented 8 years ago

Hi,thisis Ken from Hong Kong,i am a band conductor,I found that your calchart-viewerare very useful tool for Marching drill training,Now i haveone  suggestion, How about you guys write a cell phone  version ofcalchart-viewer? I think it will made drill training much easier.

Think about that,in the  first few  rehearsal,everyband member bring their own cell phone to the Marching site,by use of cell phone  version calchart-viewer,They will knowwhats going on,where will they go and how the drill looks like immediately,instead of they study the drill at home before rehearsal.

Hope it may help 

brandonchinn178 commented 8 years ago

Wow, thanks for your input! We're so glad this has become a useful tool elsewhere, as it has been for us! We have been thinking of ideas for a mobile interface, but have not come up with a design yet. But we are definitely looking into it. Thanks again, and Go Bears!

Chan12345 commented 8 years ago

I had try  calchart -viewer on my cell phone,everything is working,so i think only need to do is design the layout to make it Convenience to use ,it will be good if it can  control by one hand.   

  寄件人︰ Brandon Chinn <notifications@github.com>

收件人︰ calband/calchart-viewer calchart-viewer@noreply.github.com 副本(CC)︰ Chan12345 hkken1hk@yahoo.com.hk; Comment comment@noreply.github.com 傳送日期︰ 2016年09月7日 (週三) 11:01 PM 主題︰ Re: [calband/calchart-viewer] Make Javascript async (#169)

Wow, thanks for your input! We're so glad this has become a useful tool elsewhere, as it has been for us! We have been thinking of ideas for a mobile interface, but have not come up with a design yet. But we are definitely looking into it. Thanks again, and Go Bears!— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.