Search code examples
apache-flexflashfullscreenscribd

How did scribd implement their 'fullscreen' mode?


The scribd fullscreen mode is pretty neat (example: http://www.scribd.com/doc/13161906/Java-Lab-Manual-With-Java-Installation-Guide?classic_ui=1). The advantage (for RIAs specifically) is that it doesn't (almost) completely disable the keyboard the way the 'default' fullscreen mode in Flash Player does. Seems to also work when embedded.

How did they do it?


Solution

  • That example is not using full screen at all. What they consider "full screen" is simply maximizing the flash window to take up the entire browser area. The browser's toolbars and status bar and chrome are still visible, as well as anything outside the browser.

    It's a nice effect for a Flash/Flex widget embedded in an HTML page, but it's not the same as full screen.

    Implementation is mostly on the JavaScript/DOM side and only minimally within Flash/Flex. When the user clicks "Full Screen", use ExternalInterface to call out to a JavaScript function. This JS function then needs to reposition and resize the Flash element so that it is at (0,0) and takes up the entire screen. If the HTML is longer than a page, then you also need to hide that to make the browser's scrollbar go away, like the scribd example does. Another button inside the Flex/Flash app provides a close or related button to reverse the process.

    As a Flex developer, I object to using the term "Full Screen" for this. Full Screen is a common function of many Flash/Flex apps, particularly video players. It's confusing to users to use the term to mean something different. "Maximize" would be more appropriate than "Full Screen".