GoogleGearsでSilverlightをオフラインで動かす

Silverlight Gears JavaScript

最近ちょっとGoogleGearsをいじってるんだけど、これにコンテンツをキャッシュするLocalServerという機能があって、これを使うとコンテンツをキャッシュしてWebアプリをローカル（オフライン）で実行できるようになる。

で、これをいじってて思ったんだけど、この機能でSilverlightコンテンツをキャッシュすればSilverlightもAirみたいに単独のアプリとして使えるようになるんじゃね？

ということでやってみた。

表示するSilverlightコンテンツはどうでもいいので、ボタンを一個貼り付けた適当なやつを用意した。

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" %>

<%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls"
    TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height: 100%;">
<head runat="server">
    <title>SilverGears</title>
    <script type="text/javascript" src="Scripts/gears_init.js"></script>
    <script type="text/javascript" src="Scripts/jquery-1.2.6.pack.js"></script>
    <script type="text/javascript">
        $(function() {
            var STORE_NAME = "silvergears_store";
            var localServer = google.gears.factory.create("beta.localserver");

            if(localServer.openManagedStore(STORE_NAME)) {
                $("#offBtn").attr("disabled", "disabled");
                $("#onBtn").removeAttr("disabled");
            }

            $("#scBtn").click(function() {
                var desktop = google.gears.factory.create("beta.desktop");
                desktop.createShortcut(
                    "SilverGears",
                    "http://www.coma2n.com/demo/SilverGears/Default.aspx",
                    {
                        "32x32": "http://www.coma2n.com/demo/SilverGears/icon/icon_32x32.png",
                        "16x16": "http://www.coma2n.com/demo/SilverGears/icon/icon_16x16.png"
                    }
                );
            });
            
            $("#offBtn").click(function() {
                var store = localServer.createManagedStore(STORE_NAME);
                store.manifestUrl = "manifest.json";
                store.checkForUpdate();

                var timer = setInterval(function() {
                    if(store.currentVersion) {
                        clearInterval(timer);

                        $("#offBtn").attr("disabled", "disabled");
                        $("#onBtn").removeAttr("disabled");

                    } else if(store.updateStatus == 3) {
                        clearInterval(timer);

                        alert("オフライン切り替えに失敗しました。" + store.lastErrorMessage);
                    }
                }, 500);
            });
            
            $("#onBtn").click(function() {
                localServer.removeManagedStore(STORE_NAME);

                $(this).attr("disabled", "disabled");
                $("#offBtn").removeAttr("disabled");
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server">
        </asp:ScriptManager>
        <asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SilverGears.xap" MinimumVersion="2.0.31005.0"
            Width="400px" Height="300px" />

        <div style="margin-top: 10px;">
            <input type="button" id="scBtn" value="create shortcut" />
            <input type="button" id="offBtn" value="offline" />
            <input type="button" id="onBtn" value="online" disabled />
        </div>

    </form>
</body>
</html>

スクリーンショット

「create shortcut」ボタンをクリックするとデスクトップにショートカットを作成できる。
「offline」ボタンをクリックするとオフラインで動作するようになる。「online」ボタンはその逆。

ショートカットを作って、オフラインに切り替えて、ブラウザを落として、ネットワークを切って、ショートカットから起動するとオフラインでも動作する事が確認できるはず。

こういう事ができるようになるとWebアプリの可能性がずっと広がるような気がする。

デモサイト