Using PageShow To Detect Cached Pages

Recent upgrades in browsers and features has left the page “load” event not reacting like you’d expect anymore. Normally by setting certain metatags in the page and sending cache breaking http headers, you could get the web page to reload with each page view and use the “load” event to initialize the page. Unfortunately this is not the case anymore. While testing with iPhone Safari, I discovered that no meta tags or headers would stop it from caching my javascript application. So whenever I hit the back button back to my app page, the js app would not initialize properly. After reading about the pageshow event I found that I could detect when the user had come back to a cached version of the page by checking the “persisted” property in the pageshow event in jQuery like so…

   1:  $(window).bind( 'pageshow', function( event ){
   2:      if( event.persisted ) {
   3:          window.location.reload();
   4:      }
   5:  });

This code will force a page refresh when the javascript detects that this page has been loaded from cache. Although future javascript web page apps should be more elegantly coded to work with page caching, this is a quick fix for pages that I don’t have time to rebuild from scratch.

No Comments

Flash ScrollPane Mouse Wheel Event

Getting the ScrollPane in flash to work with a mouse wheel can be tricky. It will not allow the mouse wheel to scroll if there is not actual content right underneath the mouse pointer. This can be cumbersome for dynamic content in the pane. To fix this, you can use the following AS3 code to scroll the ScrollPane without having to mess with background sizes in the pane.

   1:  // Listen for mouse wheel event on the stage to scroll content
   2:  stage.addEventListener( MouseEvent.MOUSE_WHEEL,
   3:      function( event:MouseEvent ):void
   4:      {
   5:          if( scrollPane !== null )
   6:          {
   7:              scrollPane.verticalScrollPosition += - ( event.delta * 8 );
   8:          }
   9:      });

You can adjust the “( event.delta * 8 )” to only “event.delta” if you don’t want to change the amount of scrolling that is performed.

, , ,

No Comments

Flash and the Scroll Wheel in the Browser

I have built many AS3 flash apps before, but on this one project I needed to enable scrolling with the mouse wheel. I added a flash scrollpane but it would not respond to the mouse wheel. So I tried adding an event listener to the entire stage to see if I could capture any mouse wheel event. No luck with that either. Countless searches turned up maybe two possible resolutions to the problem, but they did not work either.

The resolution was out there to find, but I did not find it because I didn’t use the right keywords.

The resolution revealed to me was the parameter called “wmode”. The wmode param has three values; opaque, transparent, window(default). While normally most people do not set this parameter, I have a habit of setting it due to it’s necessity when building flash widgets for various web pages. In this case, if you set wmode to either transparent or opaque, the flash will not detect the mouse scroll wheel at all. So be sure not to set this parameter. If you do set it to “window” otherwise your flash app will not detect the mouse wheel events.

, , , ,

No Comments

Fusion theme by digitalnature | powered by WordPress
Entries (RSS) and Comments (RSS) ^

Google+