7 Replies Latest reply on Jun 29, 2010 5:29 AM by ilya_shaikovsky

    How to show loading status in mouse?

    eswaramoorthy1985

      Hi everyone,

       

                        I want to show loading process in mouse(cursor) only for every action.

      That  is, show loading status( busy or wait) in cursor pointer.

       

      help me.

      Thanks in advance.

        • 1. Re: How to show loading status in mouse?
          luiggitama

          Hi Eswara...

           

          If you just want to change the mouse cursor (with custom- or system-defined cursors), you could do this:

           

          Define a JS function that changes the cursor based on boolean param:

          <script type="text/javascript">
          waitCursor=function(wait){
            if (wait) {
              //document.body.style.cursor = "wait"; // just the clock
              //document.body.style.cursor = "url(images/mywaitcursor.cur), progress"; // custom cursor, on non supporting browsers would default to clock
              document.body.style.cursor = "progress"; // arrow and clock (so you can still click anything)
              // anyway, if you have defined cursors with CSS for other regions in your page
              // this wait cursor will be overriden when hovering over those regions
            } else {
              document.body.style.cursor = ""; // so it goes back to previous CSS defined value
            }
          }
          </script>
          
          Define your a4j:status component and set it to call the JS function onstart (sending true as param) and onstop (sending false).
          If you have more than one status component, you must set forceId to true to prevent conflicts (as I had to do in my page). Also, you could use this "myStatus" component for just some specific AJAX enabled components, setting their status attribute to "myStatus".
          <a4j:status id="myStatus" forceId="true" layout="block"
              onstart="waitCursor(true)" onstop="waitCursor(false)" />

           

           

          Tell us how this works!

           

          God bless you.

           

          Best regards,

          Luis Tama

          • 2. Re: How to show loading status in mouse?
            eswaramoorthy1985

            Thanks Luis Tama,

             

                        Its perfectly worked.

             

            But ,

             

            Is there any otherway to show progress status in mouse for every (click button, link etc) action?  (without using a4j:status)

            • 3. Re: How to show loading status in mouse?
              luiggitama

              Oh, you are talking about every pure client-side JS action... I thought you where talking about AJAX related actions only...

               

              Maybe you could call waitCursor(true) at the beginning of all your JS functions, and waitCursor(false) at the end...

               

              Or you could register just once an event listener (with your preferred JS library) for the onclick event for the whole page, attaching a call to waitCursor(true) to it. But, you would still have to call waitCursor(false) to reset the cursor. I think there must be a direct way to define this sort of "oncomplete" event listener so as to call waitCursor(false), but surely it depends on your JS library. You should check your JS library docs for more details... and tell us what you find!

               

               

              Best regards,

              Luis Tama

              • 4. Re: How to show loading status in mouse?
                eswaramoorthy1985

                I want to show the loading  status in mouse every componenet action.

                 

                How i trace, just once an event listener for the onclick event for the whole page, and complete the process.

                 

                If i trace the onclick event for whole page, then that time  call waitCursor('true')

                and,

                If i identify , complete the process in whole page(every action), then that time  call waitCursor('false').

                 

                Is there possible?

                • 5. Re: How to show loading status in mouse?
                  ilya_shaikovsky

                  you could use jquerry to get all links and buttons DOM elements and bind some handler to click event. For ajax components - a4j:status should still be a solution because you need to cancel the 'waiting status' oncomplete. But for common h:command's - there is no need in such canceling because full page refresh occurs and status will be changed to defaut anyway.

                  • 6. Re: How to show loading status in mouse?
                    eswaramoorthy1985

                    Thanks Ilya Shaikovsky,

                     

                    Still i am not aware of jQuery.

                     

                    Give me url to study the jquery and

                    where i find the jquery for this post (jQuery to get all links and buttons DOM elements and bind some handler to click event)

                    • 7. Re: How to show loading status in mouse?
                      ilya_shaikovsky

                      http://api.jquery.com/bind/

                       

                      consider that jquery provided with RF so you should not load external libs in order to avoid conflicts.