Silverlight 3: Out of the Browser

  • Article

Session: MIX 09, T45F, video

Mike Harsh, Silverlight Program Manager

Notes:

  • Before Silverlight was called WPF/E, it was call ShizXaml…
  • I had to figure out a way to make this presentation a little splahshier, so my solution was to basically do what the Adobe guys have been doing for a long time, and do my whole presentation in Silverlight. So this right here is not PowerPoint although it might look like PowerPoint, it’s actually a Silverlight application. (1:20). Here’s the app on Mike’s blog.
  • Keynote Recap (1:41)
    • Simple, consumer friendly
    • Safe, secure, sandboxed environment
    • Built-in, auto update support
    • Build offline aware applications (network API)
    • Integrate with underlying O/S
  • UX Walkthrough (4:25)
    • Shows presentation app
    • Right-click install option for install
    • Installer UI provided by SL3 platform, but is skinnable
    • Desktop icon, and Start menu install options. Shows up in app search as well
  • Out of Browser Philosophy (7:30)
    • Keep it simple
      • Have the right default behavior
      • Only one download is required
    • Keep it like the web
      • Web deployment and update model is great
      • Most apps can live with the sandbox
  • Taking an App Out of Browser (10:45)
    • Gestures (user initiated action required for install)
      • Right Click
      • App provided UX
    • User Models
      • Run before Install
      • Click to Install
    • App Types
      • Always connected (SL2)
      • Always disconnected
      • Occasionally connected
  • Detaching API’s (12:07)
    • Manifest (loose XML file in your XAP)
      • Name, title, and description
      • App icons
    • API’s on Application
      • Detach method
        • Initiates offline
      • ExecutionState property
        • tells the developer if app is offline, online, going offline, etc.
      • ExecutionStateChanged event
        • fires during app change
      • RunningOffline propterty
        • is app running in the browser or out
  • Demo (13:51)
    • Creates SL project in VS
    • Add’s button(300x400) in Grid, adds click handler, changes form to take entire screen (by removing Width and Height from UserControl/form)
    • Adds MessageBox.Show to click handler
    • Shows AppManifest.XML in Solution Explorer
    • Comments that VS team will add functionality in the Application Properties to make AppManifest manipulation easier
    • For now, one can uncomment the commented out markup in the AppManifest
    • Current properties in the ApplicationIdentity element
      • ShortName – what shows up in shortcut
      • Title – what shows up in titlebar of application
      • ApplicationIdentity.Blurb – description
    • Runs the app, detaches via right-click, runs out of browser version
    • Find the app in search, launches, uninstalls via right-click
    • Back in VS, drags a pencil icon to Solution Explorer (128x128), adds Application.Identity.Icons element to AppManifest, changes Build Action of icon to Content so that it’s included in XAP package
    • Runs the app, right-click install, shows the icon in several places, uninstalls app
    • Changes the Button Content property to “Install” , changes the Button_Click event from MessageBox.Show to:
      • if (Application.Current.ExecutionState == ExecutionStates.Running)
        • Application.Current.Detach()
    • Runs the app again, and shows app install
    • (20:22) Back to VS, adds screenshot image of Windows 7 Paint to Solution Explorer, adds code to MainPage constructor
      • if (Application.Current.RunningOffline) then show the Paint bitmap
    • Runs the app, and since it’s already installed, the Paint image is displayed
    • Back to VS, adds a ExecutionStateChanged handler to display a state change MessageBox, which contains value of RunningOffline property + ExecutionState property.
    • Also points out sometimes 2 apps are running
    • (23:30) Runs app, uninstalls, and gets a message box of “In Browser:RunningOnline”. Clicks on browser install button, and gets a “In Browser:Detaching” message from the browser, and then the out of browser instance fires up Paint image. Upon clicking the browser detaching message, another messagebox of “In Browser:Detached” . Goes to installed instance and points out that there are no messages because state has not changed, and that the RunningOffline property is about the only thing that can be checked in the installed instance.
    • Goes back to VS and comments out code in ExecutionStateChanged handler.
  • Detaching State Flow (24:45)
    • In-browser App
      • RunningOnline
      • Detaching
      • Detached, RunningOffline = false
    • Out Of Browser App
      • Detached, RunningOffline = true
  • Updating an Application (25:35)
    • Update model is optimized for instance on
    • Silverlight downloads update in the background
    • Next app launch runs the new version
    • Event when update has been downloaded
    • Mike recommends that app react to update event by communicating to user and graying out form
  • Demo (27:24)
    • Mike says that in SL3 beta that updates from localhost can be flaky, and that from a web server are fine
    • Adds code to ExecutionStateChanged handler
      • if (Application.Current.ExecutionState == ExecutionStates.DetachedUpdatesAvailable)
    • Makes sure that there is a installed version
    • Makes a change to the code
    • Runs the app.
    • Unfortunately, due to the localhost issue, the event does not fire but this will be corrected soon.
  • Network Availabilty (30:10)
    • Mikes points out before slide
      • Exact same XAP no matter what mode
      • Point of Origin stays the same whether in browser or out of browser
    • Network access is key for out of browser apps
    • SL3 adds functionality forthis
      • IP address changed event
      • Network available property
        • Any net interface, connected, not looped back
    • Best practice is when address changes, to ping server, and look for known content to verify that you’re not looking at the local Starbucks login page
    • More information: T78M (Peter Smith) Video
  • Demo (32:36)
    • Adds a rectangle for showing internet connectivity status
    • Subscribes to NetworkChange.NetworkAddressChanged event, and provides a delegate
    • In the handler, looks at the NetworkInterface.GetIsNetworkAvailable method.
      • If available, spins up a network download of a known file to validate true internet connectivity. Otherwise, set the rectangle to read.
      • In the download completed handler, verifies that download matched the known content. If so, turns rectangle to green, otherwise turns to red.
    • Runs the demo. Uses wireless switch on laptop to impact network connectivity. Very fast state changes.
  • Saving Data Locally (35:18)
    • Out of browser IsoStore limit increased (from 1MB) to 25MB
      • Limit increased when app is detached
      • Can prompt for unlimited space
    • OpenFileDialog
      • Can interact with the full system
      • To store files in searchable areas
  • Demo (36:30)
    • Key thing is when you use isolated storage
    • Look to prompt when the app is detached, b/c you can assume good connectivity and user knows that the app state is changing
    • Adds logic to app to look for file in ISO storage, and download if not.
    • Runs, click on downlaod button, shows Silverlight Configuration window, selects Application Storage tab, and shows that the app created a ISO store including a quota of 25MB. Also shows other apps storages (by web application/domain).
    • SaveFileDialog
  • Offline App Anatomy (41:23)
    • Looks a shortcut
      • Links to sllauncher.exe
      • “we simulate the browser, but you’re really not in the browser”
    • Where is app stored
      • Users/<<userName>>/AppData/LocalLow/Microsoft/Silverlight/Offline/<<Web domain>> /<<appname>>
      • LocalLow is the reduced privilege section of user storage
    • Where is isolated storage
      • Users/<<userName>>/AppData/LocalLow/Microsoft/Silverlight/IS/
      • and then more cryptic folder names (to prevent path folder attack)
    • Story on the MAC
      • Place the XAP in a “bundle” (MAC term)
  • Debugging Out of Browser Apps (44:26)
    • HTML DOM bridge is not available. Shows example of app throwing exception but shows no information
    • Setup messagebox for exception
    • VS Attach to SLLauncher.exe in beta
      • Post beta we’ll support debugging SL Launcher in VS
    • In-browser and out of browser are two instances
  • Differences From In Browser (48:23)
    • Additional key commands (F-keys)
    • No HTML DOM bridge access
      • mouse wheel, XmlHttp
    • Currently no HTML interop
    • Hope to address some in post-beta
  • Best Practices (50:17)
    • Download local data in the OoB instance
      • Check RunningOffline to see if you’re out of browser
    • Don’t fire off more than one HttpWebRequest at a time
    • Keep all your code in the XAP
      • Silverlight versions for you
      • Assets can go outside (great for a online app, not good for OoB)
    • If you data model changes require a restart
      • Disable controls if user chooses not to
    • Show UI for major updates
  • Questions (52:56)
    • Check out Mike’s blog at https://blogs.msdn.com/mharsh
    • IsoStorage not deleted on app uninstall for now
    • Consider Add/Remove Program entries, if ISO store is corrupted
    • Not a perfect solution for detecting duplicate OoB instances yet
    • Not sure about plans on Windows Mobile
    • Printing will probably not be addressed in SL3 timeframe
    • Considering a database capability in the future
    • SL3 does not have plans for chrome control, but open to feedback in the future