SundayHacking

mobile-bookmark-bubbleというのはiPhoneなどのMobile Safariで「ホーム画面に追加」を促すポップアップを出すライブラリです。

依存ライブラリもなく比較的ポータブルに実装されているのですが、 angular.jsで使おうとすると、デフォルトの#ハッシュで抑制する機構がうまくありません。

解決法は色々あると思いますが、おそらく最も手軽な$rootScopeを使う方法を実装してみました。$rootScopeなのでリロードするとリセットされますが、それはそれでいいケースもあるでしょう。

コードはこちら。

angular.module('MyModule', []).run(['$rootScope', '$timeout', function($rootScope, $timeout) {
  $timeout(function() {
    var bubble = new google.bookmarkbubble.Bubble();
    bubble.hasHashParameter = function() {
      return $rootScope.bookmarkbubble_shown;
    };
    bubble.setHashParameter = function() {
      $rootScope.bookmarkbubble_shown = true;
    };
    bubble.showIfAllowed();
  }, 1000);
}]);

（よく考えたら、$rootScopeに入れる必要はなくて、$timeoutの外でフラグ変数を持っていればいいだけか。$rootScopeに入れておくと、HTML側からフラグを操作できることがメリットになるのか、ならないのか。）

あまり参考にならないかもしれませんが、備忘メモでした。